cd-work-flow-web/src/views/oa/modules/SyCarryModal.vue

<template>
  <a-modal
    :title="title"
    width="85%"
    :visible="visible"
    :maskClosable="false"
    :confirmLoading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel">
    <a-spin :spinning="confirmLoading">
      <!-- 主表单区域 -->
      <a-form :form="form">
        <a-row>
          <a-col :span="12">
            <a-form-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              label="编号">
              <a-input placeholder="请输入编号" v-decorator="['code', {}]"/>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              label="名称">
              <a-input placeholder="请输入名称" v-decorator="['name', {}]"/>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="24">
            <a-form-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              label="备注">
              <a-input type="textarea" placeholder="请输入备注" v-decorator="['demo', {}]"/>
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>

      <!-- 子表单区域 -->
      <a-tabs v-model="activeKey" @change="handleChangeTabs">
        <a-tab-pane tab="搬运工对账单" :key="refKeys[0]" :forceRender="true">
          <j-editable-table
            :ref="refKeys[0]"
            :loading="syCarryBTable.loading"
            :columns="syCarryBTable.columns"
            :dataSource="syCarryBTable.dataSource"
            :maxHeight="300"
            :rowNumber="true"
            :rowSelection="true"
            :actionButton="true"/>
        </a-tab-pane>
      </a-tabs>

    </a-spin>
  </a-modal>
</template>

<script>

  import moment from 'moment'
  import pick from 'lodash.pick'
  import { FormTypes } from '@/utils/JEditableTableUtil'
  import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'

  export default {
    name: 'SyCarryModal',
    mixins: [JEditableTableMixin],
    data() {
      return {
        // 新增时子表默认添加几行空数据
        addDefaultRowNum: 1,
        validatorRules: {
        },
        refKeys: ['syCarryB', ],
        activeKey: 'syCarryB',
        // 搬运装卸费用-搬运工对账单-子表
        syCarryBTable: {
          loading: false,
          dataSource: [],
          columns: [
            
            {
              title: '日期',
              key: 'orderDate',
              type: FormTypes.datetime,
              defaultValue: '',
              placeholder: '请输入${title}',
            },
            {
              title: '总件数',
              key: 'allNum',
              type: FormTypes.inputNumber,
              defaultValue: '',
              placeholder: '请输入${title}',
            },
            {
              title: '明细',
              key: 'detailedNum',
              type: FormTypes.inputNumber,
              defaultValue: '',
              placeholder: '请输入${title}',
            },
            {
              title: '衣架',
              key: 'coatHanger',
              type: FormTypes.inputNumber,
              defaultValue: '',
              placeholder: '请输入${title}',
            },
            {
              title: '集装箱号',
              key: 'containerNo',
              type: FormTypes.input,
              defaultValue: '',
              placeholder: '请输入${title}',
            },
            {
              title: '发票号',
              key: 'invoiceNo',
              type: FormTypes.input,
              defaultValue: '',
              placeholder: '请输入${title}',
            },
            {
              title: '价格',
              key: 'price',
              type: FormTypes.inputNumber,
              defaultValue: '',
              placeholder: '请输入${title}',
            },
            {
              title: '计划员',
              key: 'jhyName',
              type: FormTypes.input,
              defaultValue: '',
              placeholder: '请输入${title}',
            },
            {
              title: '签名',
              key: 'jhyNameData',
              type: FormTypes.input,
              defaultValue: '',
              placeholder: '请输入${title}',
            },
            {
              title: '备注',
              key: 'demo',
              type: FormTypes.input,
              defaultValue: '',
              placeholder: '请输入${title}',
            },
          ]
        },
        url: {
          add: "/oa/syCarry/add",
          edit: "/oa/syCarry/edit",
          syCarryB: {
            list: '/oa/syCarry/querySyCarryBByMainId'
          },
        }
      }
    },
    methods: {
 
      /** 调用完edit()方法之后会自动调用此方法 */
      editAfter() {
        this.$nextTick(() => {
          this.form.setFieldsValue(pick(this.model, 'name', 'code', 'demo', ))
          // 时间格式化
          // this.form.setFieldsValue({ ckTime: this.model.ckTime ? moment(this.model.ckTime) : null })
          // this.form.setFieldsValue({ rsxzTime: this.model.rsxzTime ? moment(this.model.rsxzTime) : null })
          // this.form.setFieldsValue({ cwjlTime: this.model.cwjlTime ? moment(this.model.cwjlTime) : null })
        })
        // 加载子表数据
        if (this.model.id) {
          let params = { id: this.model.id }
          this.requestSubTableData(this.url.syCarryB.list, params, this.syCarryBTable)
        }
      },
 
      /** 整理成formData */
      classifyIntoFormData(allValues) {
        let main = Object.assign(this.model, allValues.formValue)
        //时间格式化
        // main.ckTime = main.ckTime ? main.ckTime.format('YYYY-MM-DD HH:mm:ss') : null;
        // main.rsxzTime = main.rsxzTime ? main.rsxzTime.format('YYYY-MM-DD HH:mm:ss') : null;
        // main.cwjlTime = main.cwjlTime ? main.cwjlTime.format('YYYY-MM-DD HH:mm:ss') : null;
        return {
          ...main, // 展开
          syCarryBList: allValues.tablesValue[0].values,
        }
      }
    }
  }
</script>

<style scoped>
</style>