wms / wms4 · Commits

Commit 0c38ee528087f61a5749ead97c54ce392a6b1371

Authored by 陈翱
1 parent 0d5cf9f7

保留之前的快速入库页面

Inline Side-by-side
Showing 1 changed file with 227 additions and 0 deletions
ant-design-vue-jeecg/src/views/system/task/modules/MaterialTaskModal2.vue 0 → 100644
  View file @0c38ee5
  1 +<template>
  2 + <a-modal
  3 + :title="title"
  4 + :width="800"
  5 + :visible="visible"
  6 + :maskClosable="false"
  7 + :confirmLoading="confirmLoading"
  8 + @ok="handleOk"
  9 + @cancel="handleCancel">
  10 +
  11 + <a-spin :spinning="confirmLoading">
  12 + <a-form-model ref="form" :label-col="labelCol" :wrapper-col="wrapperCol" :model="model">
  13 + <!-- 主表单区域 -->
  14 + <a-row class="form-row" :gutter="0">
  15 + <a-col :lg="8">
  16 + <a-form-model-item label="托盘号" :rules="[{ required: true, message: '请输入托盘号!' }]">
  17 + <a-input placeholder="请输入托盘号" v-model="model.containerCode"/>
  18 + </a-form-model-item>
  19 + </a-col>
  20 +
  21 + <a-col :lg="8">
  22 + <a-form-model-item label="入库口">
  23 + <a-input placeholder="请输入入库口" v-model="model.toPort"/>
  24 + </a-form-model-item>
  25 + </a-col>
  26 + </a-row>
  27 +
  28 + </a-form-model>
  29 +
  30 + <!-- 子表单区域 -->
  31 + <a-tabs v-model="activeKey">
  32 + <a-tab-pane tab="物料信息" key="1" :forceRender="true">
  33 + <j-editable-table
  34 + ref="editableTable1"
  35 + :loading="table1.loading"
  36 + :columns="table1.columns"
  37 + :dataSource="table1.dataSource"
  38 + :maxHeight="300"
  39 + :rowNumber="true"
  40 + :rowSelection="true"
  41 + :actionButton="true"/>
  42 + </a-tab-pane>
  43 + </a-tabs>
  44 +
  45 + </a-spin>
  46 +
  47 +
  48 + </a-modal>
  49 +</template>
  50 +
  51 +<script>
  52 +
  53 +import JEditableTable from '@/components/jeecg/JEditableTable'
  54 +import {FormTypes, VALIDATE_NO_PASSED, getRefPromise, validateFormModelAndTables} from '@/utils/JEditableTableUtil'
  55 +import {httpAction, getAction} from '@/api/manage'
  56 +import {execute, quickReceipt} from '@/api/api'
  57 +import JDate from '@/components/jeecg/JDate'
  58 +
  59 +export default {
  60 + name: 'MaterialTaskModal',
  61 + components: {
  62 + JDate, JEditableTable
  63 + },
  64 + data() {
  65 + return {
  66 + title: '操作',
  67 + visible: false,
  68 + confirmLoading: false,
  69 + model: {},
  70 + labelCol: {
  71 + xs: {span: 24},
  72 + sm: {span: 6}
  73 + },
  74 + wrapperCol: {
  75 + xs: {span: 24},
  76 + sm: {span: 24 - 6}
  77 + },
  78 + activeKey: '1',
  79 + // 客户信息
  80 + table1: {
  81 + loading: false,
  82 + dataSource: [],
  83 + columns: [
  84 + {
  85 + title: '物料编码',
  86 + key: 'materialCode',
  87 + width: '24%',
  88 + type: FormTypes.sel_search,
  89 + defaultValue: '',
  90 + dictCode:'material,name,code',
  91 + placeholder: '请输入${title}',
  92 + validateRules: [{required: true, message: '${title}不能为空'}]
  93 + },
  94 + {
  95 + title: '数量',
  96 + key: 'qty',
  97 + type: FormTypes.inputNumber,
  98 + width: '80px',
  99 + }
  100 + ]
  101 + },
  102 + url: {
  103 + add: '/test/jeecgOrderMain/add',
  104 + edit: '/test/jeecgOrderMain/edit',
  105 + orderCustomerList: '/test/jeecgOrderMain/queryOrderCustomerListByMainId',
  106 + orderTicketList: '/test/jeecgOrderMain/queryOrderTicketListByMainId'
  107 + }
  108 + }
  109 + },
  110 + created() {
  111 + },
  112 + methods: {
  113 + // 获取所有的editableTable实例
  114 + getAllTable() {
  115 + return Promise.all([
  116 + getRefPromise(this, 'editableTable1')
  117 + ])
  118 + },
  119 +
  120 + add() {
  121 + // 默认新增一条数据
  122 + this.getAllTable().then(editableTables => {
  123 + editableTables[0].add()
  124 + })
  125 + this.edit({})
  126 + },
  127 + edit(record) {
  128 + this.visible = true
  129 + this.activeKey = '1'
  130 + this.model = Object.assign({}, record)
  131 + },
  132 + close() {
  133 + this.visible = false
  134 + this.getAllTable().then(editableTables => {
  135 + editableTables[0].initialize()
  136 + })
  137 + this.$emit('close')
  138 + this.$refs.form.resetFields();
  139 + },
  140 + /** 查询某个tab的数据 */
  141 + requestTableData(url, params, tab) {
  142 + tab.loading = true
  143 + getAction(url, params).then(res => {
  144 + tab.dataSource = res.result || []
  145 + }).finally(() => {
  146 + tab.loading = false
  147 + })
  148 + },
  149 + handleOk() {
  150 + this.validateFields()
  151 + },
  152 + handleCancel() {
  153 + this.close()
  154 + },
  155 +
  156 +
  157 + /** 触发表单验证 */
  158 + validateFields() {
  159 + this.getAllTable().then(tables => {
  160 + /** 一次性验证主表和所有的次表 */
  161 + return validateFormModelAndTables(this.$refs.form, this.model, tables)
  162 + }).then(allValues => {
  163 + let formData = this.classifyIntoFormData(allValues)
  164 + console.log("输出数据:")
  165 + console.log(formData)
  166 + this.receipt(formData);
  167 + // 发起请求
  168 + // return this.requestAddOrEdit(formData)
  169 + }).catch(e => {
  170 + if (e.error === VALIDATE_NO_PASSED) {
  171 + // 如果有未通过表单验证的子表，就自动跳转到它所在的tab
  172 + this.activeKey = e.index == null ? this.activeKey : (e.index + 1).toString()
  173 + } else {
  174 + console.error(e)
  175 + }
  176 + })
  177 + },
  178 + /** 整理成formData */
  179 + classifyIntoFormData(allValues) {
  180 + let orderMain = Object.assign(this.model, allValues.formValue)
  181 + return {
  182 + ...orderMain, // 展开
  183 + receiptEntityList: allValues.tablesValue[0].values,
  184 + }
  185 + },
  186 + /** 发起新增或修改的请求 */
  187 + requestAddOrEdit(formData) {
  188 + alert(JSON.stringify(formData))
  189 + let url = this.url.add, method = 'post'
  190 + if (this.model.id) {
  191 + url = this.url.edit
  192 + method = 'put'
  193 + }
  194 + this.confirmLoading = true
  195 + httpAction(url, formData, method).then((res) => {
  196 + if (res.success) {
  197 + this.$message.success(res.message)
  198 + this.$emit('ok')
  199 + this.close()
  200 + } else {
  201 + this.$message.warning(res.message)
  202 + }
  203 + }).finally(() => {
  204 + this.confirmLoading = false
  205 + })
  206 + },
  207 + receipt(record) {
  208 + this.confirmLoading = true
  209 + this.model = Object.assign({}, record);
  210 + quickReceipt(this.model).then((res) => {
  211 + this.loading = false;
  212 + if (res.success) {
  213 + this.$message.success(res.message);
  214 + this.$emit('ok');
  215 + this.close();
  216 + } else {
  217 + this.$message.error(res.message);
  218 + }
  219 + this.confirmLoading = false
  220 + });
  221 + },
  222 + }
  223 +}
  224 +</script>
  225 +
  226 +<style scoped>
  227 +</style>
0 228 \ No newline at end of file
... ...