zenglf
2023-09-18 92ff846fb659c62037a32b1d8c15eae9df9d9b54
src/views/spare/modules/sparePartPurchaseStorage/SparePartPurchaseStorageModal.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,631 @@
<template>
  <a-modal
    :title='title'
    :width='1250'
    :visible='visible'
    :maskClosable='false'
    @ok='handleOk'
    cancelText='关闭'
    @cancel='handleCancel'
    :confirmLoading='confirmLoading'
  >
    <a-spin :spinning='confirmLoading'>
      <a-form :form='form'>
        <a-row :gutter='24'>
          <a-col :span='24/2'>
            <a-form-item
              label='入库单编号'
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
            >
              <a-input
                placeholder='请输入库单编号'
                :disabled="true"
                v-decorator="['num', validatorRules.num]"
              />
            </a-form-item>
          </a-col>
          <a-col :span='24/2'>
            <a-form-item
              label='采购部门'
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
            >
              <a-tree-select
                style="width: 100%"
                :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                :tree-data="treeData"
                placeholder="请选择采购部门"
                tree-default-expand-all
                v-decorator="['departId', validatorRules.departId]"
              />
            </a-form-item>
          </a-col>
        </a-row>
        <a-row :gutter='24'>
          <a-col :span='24/2'>
            <a-form-item
              label='仓库'
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
            >
              <j-dict-select-tag
                allow-clear
                :disabled='disableSubmit'
                :placeholder="disableSubmit?'':'请选择仓库'"
                :triggerChange='true'
                dictCode="mom_base_warehouse,name,id , del_flag!='1'"
                v-decorator="['warehouseId', validatorRules.warehouseId]"
                @change='(e)=>handle2Change(e)'
              />
            </a-form-item>
          </a-col>
          <a-col :span='24/2'>
            <a-form-item
              label='库区库位'
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
            >
              <j-dict-select-tag
                allow-clear
                :disabled='true'
                :placeholder="disableSubmit?'':'请选择库区库位'"
                :triggerChange='true'
                dictCode='location_manage'
                v-decorator="['locationManage', validatorRules.locationManage]"
              />
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>
    </a-spin>
    <a-button
      type='primary'
      :style="{ marginRight: '8px',marginBottom:'8px' }"
      :loading='confirmLoading'
      :disabled="disableSubmit"
      @click='selectSparePart()'
    >增加备件信息
    </a-button>
    <a-table
      ref='table'
      bordered
      size='middle'
      rowKey='id'
      :columns='columns'
      :dataSource='dataSource'
      :scroll="{ x: 'calc(1200px + 50%)', y: 900 }"
    >
      <template
        v-for='col in columns'
        :slot='col.dataIndex'
        slot-scope='text, record, index'
      >
        <div :key='col.dataIndex'>
          <a-select
            v-if="col.dataIndex == 'supplierId'"
            :value='text'
            :options='record.suppliers'
            @change='(e) => handleChange(e, record.key, col, index)'
            style='width: 100%'
            :disabled="disableSubmit"
          />
          <a-select
            v-if="col.dataIndex == 'warehouseAreaId'"
            :value='text'
            :disabled="disableSubmit"
            :options='record.warehouseAreas'
            @change='(e) => handleChange(e, record.key, col, index)'
            style='width: 100%'
          />
          <a-select
            v-if="col.dataIndex == 'warehouseLocationId'"
            :value='text'
            :options='record.warehouseLocations'
            @change='(e) => handleChange(e, record.key, col, index)'
            style='width: 100%'
            :disabled="disableSubmit"
          />
          <a-input-number
            :value='text'
            v-if="col.dataIndex == 'mainQuantity'"
            :min='0'
            :disabled="disableSubmit"
            :max='record.wastageRate'
            @change='(e)=>handleChange(e, record.key, col, index)'
          />
          <a-input
            :value='text'
            :disabled="disableSubmit"
            v-if="col.dataIndex == 'batchNum'"
            @change='(e)=>handleChange(e, record.key, col, index)'
          />
          <a-date-picker
            :value='text'
            :disabled="disableSubmit"
            v-if="col.dataIndex == 'manufactureDate'"
            format='YYYY-MM-DD'
            @change='(e)=>handleChange(e, record.key, col, index)'
          />
          <!-- format="YYYY-MM-DD HH:mm:ss" -->
        </div>
      </template>
      <span
        slot='action'
        slot-scope='text, record, index'
      >
        <a-popconfirm
          title='确定删除吗?'
          :disabled="disableSubmit"
          @confirm='() => handleDelete(text,record, index)'
        >
          <a>删除</a>
        </a-popconfirm>
      </span>
    </a-table>
    <template slot='footer'>
      <a-button
        :style="{marginRight: '8px'}"
        @click='handleCancel()'
      >
        å…³é—­
      </a-button>
      <a-button
        @click='handleOk()'
        type='primary'
        :disabled="disableSubmit"
        :loading='confirmLoading'
      >确定
      </a-button>
    </template>
    <j-select-spare-part-modal ref='sparePartModalForm'></j-select-spare-part-modal>
  </a-modal>
</template>
<script>
import { getAction, postAction, requestPut } from '@/api/manage'
import pick from 'lodash.pick'
import JMultiSelectTag from '@/components/dict/JMultiSelectTag'
import { duplicateCheck } from '@/api/api'
import Tooltip from 'ant-design-vue/es/tooltip'
import JSelectSparePartModal from './JSelectSparePartModal'
export default {
  name: 'SparePartPurchaseStorageModal',
  components: {
    JMultiSelectTag,
    Tooltip,
    JSelectSparePartModal
  },
  data() {
    return {
      treeData:[],
      departs: [],
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          align: 'center',
          customRender: function(t, r, index) {
            return parseInt(index) + 1
          },
          width: 50
        },
        {
          title: '备件编码',
          align: 'center',
          dataIndex: 'num'
        },
        {
          title: '备件名称',
          align: 'center',
          dataIndex: 'name'
        },
        {
          title: '型号',
          align: 'center',
          dataIndex: 'model'
        },
        {
          title: '规格',
          align: 'center',
          dataIndex: 'specification'
        },
        {
          title: '批次号',
          align: 'center',
          dataIndex: 'batchNum',
          scopedSlots: { customRender: 'batchNum' }
        },
        {
          title: '制造商',
          align: 'center',
          dataIndex: 'constructorName'
        },
        {
          title: '供应商',
          align: 'center',
          dataIndex: 'supplierId',
          scopedSlots: { customRender: 'supplierId' }
        },
        {
          title: '库区',
          align: 'center',
          dataIndex: 'warehouseAreaId',
          scopedSlots: { customRender: 'warehouseAreaId' }
        },
        {
          title: '库位',
          align: 'center',
          dataIndex: 'warehouseLocationId',
          scopedSlots: { customRender: 'warehouseLocationId' }
        },
        {
          title: '出厂日期',
          align: 'center',
          dataIndex: 'manufactureDate',
          scopedSlots: { customRender: 'manufactureDate' }
        },
        {
          title: '单位',
          align: 'center',
          dataIndex: 'mainUnitName'
        },
        {
          title: '数量',
          align: 'center',
          dataIndex: 'mainQuantity',
          scopedSlots: { customRender: 'mainQuantity' }
        },
        /* {
          title: '辅单位',
          align: 'center',
          dataIndex: 'auxiliaryUnitName'
        },
        {
          title: '辅数量',
          align: 'center',
          dataIndex: 'auxiliaryQuantity'
        }, */
        {
          title: '操作',
          align: 'center',
          dataIndex: 'action',
          fixed: 'right',
          width: 100,
          scopedSlots: {
            customRender: 'action'
          }
        }
      ],
      title: '操作',
      visible: false,
      disableSubmit: false,
      codeDisable: true,
      model: {},
      suppliers: [],
      warehouseAreas: [],
      warehouseLocations: [],
      warehouseId: '',
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      confirmLoading: false,
      form: this.$form.createForm(this),
      validatorRules: {
        num: {
          rules: [
            { required: true, message: '请输入入库单编号!' }
          ]
        },
        departId: {
          rules: [
            { required: true, message: '请选择部门!' }
          ]
        },
        warehouseId: {
          rules: [
            { required: true, message: '请选择仓库!' }
            // { validator: this.validateEquipmentId },
          ]
        }
      },
      url: {
        getSysDeparts: "/eam/equipment/getSysDeparts",
        add: '/spare/sparePartPurchaseStorage/add',
        edit: '/spare/sparePartPurchaseStorage/edit',
        loadOptions: '/sys/sysDepart/loadDepartTreeOptions',
        getSuppliers: '/spare/sparePartPurchaseStorageDeatil/getSuppliers',
        getWarehouseAreas: '/spare/sparePartPurchaseStorageDeatil/getWarehouseAreas',
        getWarehouseLocations: '/spare/sparePartPurchaseStorageDeatil/getWarehouseLocations',
        getWarehouses: '/base/warehouse/queryById',
        getNum: '/eam/sysIdentity/getNumNew',
      },
      dataSource: []
    }
  },
  mounted() {
    this.$bus.$on('selectionRows', (data) => {
      for (let i = 0; i < data.length; i++) {
        this.dataSource.push({
          id: data[i].id,
          sparePartId: data[i].id,
          num: data[i].num,
          name: data[i].name,
          specification: data[i].specification,
          model: data[i].model,
          mainUnitId: data[i].mainUnitId,
          mainUnitName: data[i].mainUnitId_dictText,
       /*    auxiliaryUnitId: data[i].auxiliaryUnitId,
          auxiliaryUnitName: data[i].auxiliaryUnitId_dictText,
          conversionRatio: data[i].conversionRatio, */
          constructorId: data[i].constructorId,
          constructorName: data[i].constructorId_dictText,
          suppliers: this.suppliers,
          warehouseAreas: this.warehouseAreas,
          warehouseLocations: this.warehouseLocations
        })
      }
    })
  },
  created() {},
  methods: {
    getSysDeparts() {
      getAction(this.url.getSysDeparts).then((res) => {
        if (res.success) {
          this.departs = res.result
        }
      })
    },
    //选择备件信息
    selectSparePart: function() {
      let ids = []
      for (let i = 0; i < this.dataSource.length; i++) {
        ids.push(this.dataSource[i].sparePartId)
      }
      this.$refs.sparePartModalForm.showModals(ids)
      this.$refs.sparePartModalForm.title = '选择备件信息'
      this.$refs.sparePartModalForm.disableSubmit = false
    },
    add() {
      this.edit({ sparePartPurchaseStorageDeatilList: [] })
    },
    edit(record) {
      let that = this
      that.getSuppliers()
      that.dataSource = []
      that.form.resetFields()
      that.model = Object.assign({}, record)
      that.visible = true
      that.initOptions();
      if (record.sparePartPurchaseStorageDeatilList != undefined) {
        const temp = [...record.sparePartPurchaseStorageDeatilList]
        that.dataSource = temp
      }
      that.$nextTick(() => {
        that.form.setFieldsValue(pick(that.model, 'num', 'departId', 'warehouseId', 'locationManage'))
      })
      if (record.id) {
        this.codeDisable = true
      } else {
        this.codeDisable = false
        this.$nextTick(() => {
          getAction(this.url.getNum, { type: 'SparePart', length: '4' }).then((res) => {
            if (res.success) {
              this.form.setFieldsValue({ num: res.message });
            }
          })
        });
      }
    },
    initOptions() {
      getAction(this.url.loadOptions).then(res => {
        if (res.success) {
          this.treeData = res.result
        } else {
          this.$message.warning(res.message)
        }
      })
    },
    close() {
      this.$emit('close')
      this.visible = false
    },
    handleCancel() {
      this.close()
    },
    handleOk() {
      const that = this
      //触发表单验证
      this.form.validateFields((err, values) => {
        if (!err) {
          that.confirmLoading = true
          let formData = Object.assign(this.model, values)
          formData.sparePartPurchaseStorageDetails = that.dataSource
          if (that.dataSource.length ===0){
            that.confirmLoading = false
            that.$message.warning("请添加明细")
            return
          }
            let obj
            if (!this.model.id) {
              obj = postAction(this.url.add, formData)
            } else {
              obj = requestPut(this.url.edit, formData, { id: this.model.id })
            }
            obj.then((res) => {
              if (res.success) {
                that.$message.success(res.message)
                that.$emit('ok')
              } else {
                that.$message.warning(res.message)
              }
            }).finally(() => {
              that.confirmLoading = false
              that.close()
            })
        }
      })
    },
    handleDelete(text, record, index) {
      this.dataSource.splice(index, 1)
    },
    getSuppliers() {
      getAction(this.url.getSuppliers).then((res) => {
        if (res.success) {
          this.suppliers = res.result
        }
      })
    },
    handleChange(value, key, column, index) {
      let that = this
      const temp = [...that.dataSource]
      const target = temp.filter(item => key === item.key)[index]
      if (target) {
        if (column.dataIndex == 'batchNum') {
          target[column.dataIndex] = value.target.value
        } else if (column.dataIndex == 'mainQuantity') {
          target[column.dataIndex] = value
          target['auxiliaryQuantity'] = value * target.conversionRatio
        } else if (column.dataIndex == 'manufactureDate') {
          target[column.dataIndex] = value
        } else if (column.dataIndex == 'supplierId') {
          target[column.dataIndex] = value
        } else if (column.dataIndex == 'warehouseAreaId') {
          target[column.dataIndex] = value
          getAction(this.url.getWarehouseLocations, {
            warehouseId: this.warehouseId,
            warehouseAreaId: value
          }).then((res) => {
            if (res.success) {
              this.warehouseLocations = res.result
              target['warehouseLocations'] = []
              target['warehouseLocationId'] = ''
              target['warehouseLocations'] = res.result
            }
          })
        } else if (column.dataIndex == 'warehouseLocationId') {
          target[column.dataIndex] = value
        }
        //显示带过来的数据
        that.dataSource = temp
      }
    },
    handle2Change(val) {
      this.warehouseId = val
      const temp = [...this.dataSource]
      getAction(this.url.getWarehouses, { id: val }).then((res) => {
        if (res.success) {
          this.form.setFieldsValue({ 'locationManage': res.result.locationManage })
          let tt = res.result.locationManage
          if (tt === '2' || tt === '4') {
            getAction(this.url.getWarehouseAreas, { warehouseId: val }).then((res) => {
              if (res.success) {
                this.warehouseAreas = res.result
                for (let i = 0; i < temp.length; i++) {
                  let record = temp[i]
                  record.warehouseAreas = []
                  record.warehouseAreaId = ''
                  record.warehouseAreas = res.result
                  record.warehouseLocations = []
                  record.warehouseLocationId = ''
                }
              }
            })
          }
          if (tt === '3') {
            getAction(this.url.getWarehouseLocations, { warehouseId: val, warehouseAreaId: '' }).then((res) => {
              if (res.success) {
                this.warehouseLocations = res.result
                for (let i = 0; i < temp.length; i++) {
                  let record = temp[i]
                  record.warehouseLocations = []
                  record.warehouseLocationId = ''
                  record.warehouseLocations = res.result
                  record.warehouseAreas = []
                  record.warehouseAreaId = ''
                }
              }
            })
          }
          if (tt === '1') {
            for (let i = 0; i < temp.length; i++) {
              let record = temp[i]
              record.warehouseLocations = []
              record.warehouseLocationId = ''
              record.warehouseAreas = []
              record.warehouseAreaId = ''
            }
          }
        }
      })
    }
  }
}
</script>
<style lang='less' scoped>
/deep/ .frozenRowClass {
  color: #c9c9c9;
}
.fontweight {
  font-weight: bold;
}
.ant-btn {
  padding: 0 10px;
  margin-left: 3px;
}
.ant-form-item-control {
  line-height: 0px;
}
/** ä¸»è¡¨å•行间距 */
.ant-form .ant-form-item {
  margin-bottom: 10px;
}
/** Tab页面行间距 */
.ant-tabs-content .ant-form-item {
  margin-bottom: 0px;
}
</style>