zenglf
2023-09-18 92ff846fb659c62037a32b1d8c15eae9df9d9b54
src/views/spare/modules/sparePartReceive/SparePartReceiveForm.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,514 @@
<template>
  <a-spin :spinning='confirmLoading'>
    <j-form-container :disabled='formDisabled'>
      <!-- ä¸»è¡¨å•区域 -->
      <a-form-model ref='form' :model='model' :rules='validatorRules' slot='detail'>
        <a-row>
          <a-col :span='12'>
            <a-form-model-item label='单据号' :labelCol='labelCol' :wrapperCol='wrapperCol' prop='num'>
              <a-input v-model='model.num' placeholder='请输入单据号' :disabled="true"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col  :span='12'>
            <a-form-model-item label='仓库' :labelCol='labelCol' :wrapperCol='wrapperCol' prop='warehouseId'>
              <j-dict-select-tag
                allow-clear
                :placeholder="'请选择仓库'"
                :triggerChange='true'
                dictCode="mom_base_warehouse,name,id,del_flag!='1'"
                v-model='model.warehouseId'
              />
            </a-form-model-item>
          </a-col>
          <a-col :span='12'>
            <a-form-model-item label='领用部门' :labelCol='labelCol' :wrapperCol='wrapperCol' prop='departId'>
<!--              <a-select
                :placeholder="'请选择领用部门'"
                :options="this.departs"
                style="width: 100%"
                v-model='model.departId'
              />-->
              <a-tree-select
                style="width: 100%"
                :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                :tree-data="treeData"
                placeholder="请选择领用部门"
                tree-default-expand-all
                v-model='model.departId'
              />
            </a-form-model-item>
          </a-col>
          <a-col :span='12'>
            <a-form-model-item label='领用人员' :labelCol='labelCol' :wrapperCol='wrapperCol' prop='userId'>
              <j-dict-select-tag
                allow-clear
                :placeholder="'请选择领用人员'"
                v-model='model.userId'
                dictCode="sys_user,realname,id,del_flag!='1'"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span='12'>
            <a-form-model-item label='备注' :labelCol='labelCol' :wrapperCol='wrapperCol' prop='remark'>
              <a-textarea
                allow-clear
                :placeholder="'请输入备注'"
                v-model='model.remark'
              />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
    <!-- å­è¡¨å•区域 -->
    <a-tabs v-model='activeKey' @change='handleChangeTabs'>
      <a-tab-pane tab='备件明细表' :key='refKeys[0]' :forceRender='true'>
        <j-vxe-table
          keep-source
          :ref='refKeys[0]'
          :alwaysEdit='true'
          :bordered='bordered'
          :loading='sparesReceiveDetailTable.loading'
          :columns='sparesReceiveDetailTable.columns'
          :dataSource='sparesReceiveDetailTable.dataSource'
          :maxHeight='300'
          :disabled='formDisabled'
          :rowNumber='true'
          :rowSelection='true'
          :toolbar='true'
          :toolbarConfig='toolbarConfig'
        >
          <template slot='toolbarPrefix'>
            <a-button type='primary' @click='selectEquipmentList' :disabled='formDisabled'>选择备件
            </a-button>
          </template>
        </j-vxe-table>
      </a-tab-pane>
    </a-tabs>
    <spare-select-list ref='SparesSelectModal'></spare-select-list>
  </a-spin>
</template>
<script>
import { JVxeTableModelMixin } from '@/mixins/JVxeTableModelMixin.js'
import { JVXETypes } from '@comp/jeecg/JVxeTable'
import { getRefPromise, VALIDATE_FAILED } from '@comp/jeecg/JVxeTable/utils/vxeUtils.js'
import JFormContainer from '@comp/jeecg/JFormContainer'
import SpareSelectList from './SpareSelectList'
import { getAction } from '@api/manage'
export default {
  name: 'SparePartReceiveForm',
  mixins: [JVxeTableModelMixin],
  components: {
    JFormContainer,
    SpareSelectList
  },
  data() {
    return {
      bordered:true,
      departs: [],
      treeData:[],
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      toolbarConfig: {
        // prefix å‰ç¼€ï¼›suffix åŽç¼€
        slot: ['prefix', 'suffix'],
        // add æ–°å¢žæŒ‰é’®ï¼›remove åˆ é™¤æŒ‰é’®ï¼›clearSelection æ¸…空选择按钮
        btn: ['remove', 'clearSelection']
      },
      model: {},
      // æ–°å¢žæ—¶å­è¡¨é»˜è®¤æ·»åŠ å‡ è¡Œç©ºæ•°æ®
      addDefaultRowNum: 0,
      validatorRules: {
        num: [
          { required: true, message: '请输入单据号!' }
        ],
        warehouseId: [
          { required: true, message: '请输入仓库id!' }
        ],
        departId: [
          { required: true, message: '请输入领用部门ID!' }
        ],
        userId: [
          { required: true, message: '请输入领用人员ID!' }
        ]
      },
      refKeys: ['sparesReceiveDetail'],
      tableKeys: ['sparesReceiveDetail'],
      activeKey: 'sparesReceiveDetail',
      // å¤‡ä»¶é¢†ç”¨æ˜Žç»†è¡¨
      sparesReceiveDetailTable: {
        loading: false,
        dataSource: [],
        columns: [
          {
            title: '备件编码',
            key: 'spareNum',
            fixed: 'left',
            align:'center',
            type: JVXETypes.normal,
            width: '150px',
            placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '备件名称',
            key: 'spareName',
            type: JVXETypes.normal,
            fixed: 'left',
            width: '150px',
            align:'center',
            placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '型号',
            key: 'model',
            align:'center',
            type: JVXETypes.normal,
            width: '150px',
            placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '规格',
            key: 'specification',
            align:'center',
            type: JVXETypes.normal,
            width: '150px',
            placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '单位',
            key: 'mainUnitIdName',
            type: JVXETypes.normal,
            align:'center',
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '单位',
            key: 'mainUnitId',
            type: JVXETypes.hidden,
            align:'center',
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: ''
          },
        /*   {
            title: '辅单位',
            key: 'auxiliaryUnitIdName',
            type: JVXETypes.normal,
            align:'center',
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '辅单位',
            key: 'auxiliaryUnitId',
            type: JVXETypes.hidden,
            align:'center',
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: ''
          }, */
          {
            title: '数量',
            key: 'mainQuantity',
            type: JVXETypes.normal,
            align:'center',
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: 0,
/*             formatter({ cellValue, row, column }) {
              if (cellValue != null) {
                let conversionRatio = row.conversionRatio
                row.auxiliaryQuantity = Math.abs(cellValue * conversionRatio)
              }
              return cellValue
            }, */
            validateRules: [
              {
                required: true,
                // è‡ªå®šä¹‰å‡½æ•°æ ¡éªŒ handler
                handler({ cellValue, row, column }, callback, target) {
                  if (cellValue < 0) {
                    callback(false, '${title}不小于0')
                    // false = æœªé€šè¿‡ï¼Œå¯ä»¥è·Ÿè‡ªå®šä¹‰æç¤º
                  } else {
                    callback(true) // true = é€šè¿‡éªŒè¯
                  }
                },
                message: '${title}默认提示'
              }
            ]
          },
        /*   {
            title: '辅数量',
            key: 'auxiliaryQuantity',
            align:'center',
            type: JVXETypes.normal,
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: 0
          }, */
          {
            title: '领用数量',
            key: 'receiveMainQuantity',
            align:'center',
            type: JVXETypes.inputNumber,
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: 0,
/*             formatter({ cellValue, row, column }) {
              if (cellValue != null) {
                let conversionRatio = row.conversionRatio
                console.log(conversionRatio)
                row.scrapAuxiliaryQuantity = Math.abs(cellValue * conversionRatio)
              }
              return cellValue
            }, */
            validateRules: [
              {
                required: true,
                // è‡ªå®šä¹‰å‡½æ•°æ ¡éªŒ handler
                handler({ cellValue, row, column }, callback, target) {
                  if (cellValue > row.mainQuantity) {
                    callback(false, '${title}不能大于主数量')
                    // false = æœªé€šè¿‡ï¼Œå¯ä»¥è·Ÿè‡ªå®šä¹‰æç¤º
                  } else if (cellValue < 0) {
                    callback(false, '${title}不能小于0')
                  } else {
                    callback(true) //
                  }
                },
                message: '${title}默认提示'
              }
            ]
          },
        /*   {
            title: '领用辅数量',
            align:'center',
            key: 'receiveMainQuantity',
            type: JVXETypes.hidden,
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: ''
          }, */
          {
            title: '备件id',
            key: 'sparePartId',
            type: JVXETypes.hidden,
            align:'center',
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '备件库存id',
            align:'center',
            key: 'sparePartInventoryId',
            type: JVXETypes.hidden,
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: ''
          },
        ]
      },
      url: {
        add: '/spare/sparePartReceive/add',
        edit: '/spare/sparePartReceive/edit',
        getSysDeparts: "/eam/equipment/getSysDeparts",
        loadOptions: '/sys/sysDepart/loadDepartTreeOptions',
        getNum: '/eam/sysIdentity/getNumNew',
        sparesReceiveDetail: {
          list: '/spare/sparePartReceive/querySparePartReceiveDeatilByMainId'
        }
      }
    }
  },
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    }
  },
  mounted() {
    this.$bus.$on('selectionRows', (data) => {
      // å¢žåŠ é€‰ä¸­çš„è®¾å¤‡åˆ°åˆ—è¡¨ä¸­
      this.addSelectedEquipments(data)
    })
  },
  created() {
    this.initOptions();
    this.initNum()
  },
  methods: {
    initNum() {
      getAction(this.url.getNum, { type: 'SparePart', length: '4' }).then((res) => {
        if (res.success) {
          this.model.num = res.message
          /* this.model.setFieldsValue({ num: res.message }); */
        }
      })
    },
    getSysDeparts() {
      getAction(this.url.getSysDeparts).then((res) => {
        if (res.success) {
          this.departs = res.result
        }
      })
    },
    initOptions() {
      getAction(this.url.loadOptions).then(res => {
        if (res.success) {
          this.treeData = res.result
        } else {
          this.$message.warning(res.message)
        }
      })
    },
    selectEquipmentList() {
      let ids = []
      debugger
      let tableData = this.$refs.sparesReceiveDetail.getTableData()
      let deleteData = this.$refs.sparesReceiveDetail.getDeleteData()
      console.log(tableData)
      for (let i = 0; i < tableData.length; i++) {
        ids.push(tableData[i].sparePartInventoryId)
      }
      this.$refs.SparesSelectModal.showModals(ids)
      this.$refs.SparesSelectModal.title = '选择备件'
      this.$refs.SparesSelectModal.disableSubmit = false
    },
    addSelectedEquipments(data) {
      let tableData = this.$refs.sparesReceiveDetail.getTableData()
      var tableStr = JSON.stringify(tableData)
      const addRows = []
      for (let i = 0; i < data.length; i++) {
        var sparesReceiveDetail = {}
        if (tableStr.indexOf(data[i].id) == -1) {
          sparesReceiveDetail = {
            sparePartInventoryId: data[i].id,
            sparePartId: data[i].sparePartId,
            spareNum: data[i].spareNum,
            spareName: data[i].spareName,
            model: data[i].model,
            specification: data[i].specification,
            mainUnitId: data[i].mainUnitId,
          /*   auxiliaryUnitId: data[i].auxiliaryUnitId, */
            mainUnitIdName: data[i].mainUnitId_dictText,
          /*   auxiliaryUnitIdName: data[i].auxiliaryUnitId_dictText, */
            mainQuantity: data[i].mainQuantity,
         /*    auxiliaryQuantity: data[i].auxiliaryQuantity, */
            manufactureDate: data[i].manufactureDate,
            constructorId: data[i].constructorId,
            constructorName: data[i].constructorName,
            batchNum: data[i].batchNum,
            ReceiveReason: data[i].ReceiveReason,
            validityPeriod:data[i].validityPeriod,
           /*  conversionRatio:data[i].conversionRatio */
          }
        }
        addRows.push(sparesReceiveDetail)
      }
      this.$refs.sparesReceiveDetail.pushRows(addRows)
    },
    addBefore() {
      this.sparesReceiveDetailTable.dataSource = []
    },
    getAllTable() {
      let values = this.tableKeys.map(key => getRefPromise(this, key))
      return Promise.all(values)
    },
    /** è°ƒç”¨å®Œedit()方法之后会自动调用此方法 */
    editAfter() {
      this.$nextTick(() => {
      })
      // åŠ è½½å­è¡¨æ•°æ®
      if (this.model.id) {
        let params = { id: this.model.id }
        this.requestSubTableData(this.url.sparesReceiveDetail.list, params, this.sparesReceiveDetailTable)
      }
    },
    //校验所有一对一子表表单
    validateSubForm(allValues) {
      let tableData = this.$refs.sparesReceiveDetail.getTableData()
      if(tableData.length == 0){
        this.$message.warning("请添加备件领用明细!");
        return
      }
      return new Promise((resolve, reject) => {
        Promise.all([]).then(() => {
          resolve(allValues)
        }).catch(e => {
          if (e.error === VALIDATE_FAILED) {
            // å¦‚果有未通过表单验证的子表,就自动跳转到它所在的tab
            this.activeKey = e.index == null ? this.activeKey : this.refKeys[e.index]
          } else {
            console.error(e)
          }
        })
      })
    },
    /** æ•´ç†æˆformData */
    classifyIntoFormData(allValues) {
      let main = Object.assign(this.model, allValues.formValue)
      return {
        ...main, // å±•å¼€
        sparePartReceiveDeatilList: allValues.tablesValue[0].tableData
      }
    },
    validateError(msg) {
      this.$message.error(msg)
    },
    close() {
      this.visible = false
      this.$emit('close')
      this.$refs.form.clearValidate()
    }
  }
}
</script>
<style scoped>
</style>