Merge branch 'develop' of http://117.34.109.166:18448/r/vue_mdc_430

zenglf

2023-09-18 92ff846fb659c62037a32b1d8c15eae9df9d9b54

 src/views/eam/modules/equipmentDisposal/EquipmentDisposalForm.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,532 @@
<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="24">
            <a-form-model-item label="单据号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="num">
              <a-input v-model="model.num" placeholder="请输入单据号"></a-input>
            </a-form-model-item>
          </a-col>
          <!--          (封存-seal，启封-unseal,报废-scrap，处置-disposal)-->
          <!--          type ="hidden"-->
          <a-col :span="24" hidden>
            <a-form-model-item label="变动方式" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="changeMethod">
              <a-input v-model="model.changeMethod" defaultValue="disposal"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="remark">
              <a-textarea v-model="model.remark" rows="4" placeholder="请输入备注" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
    <!--    <a-button-->
    <!--      type="primary"-->
    <!--      :style="{ marginRight: '8px',marginBottom:'8px' }"-->
    <!--      :loading="confirmLoading"-->
    <!--      @click="selectEquipmentList()"-->
    <!--    >选择设备-->
    <!--    </a-button>-->
    <!-- å­è¡¨å•åŒºåŸŸ -->
    <a-tabs v-model="activeKey" @change="handleChangeTabs">
      <a-tab-pane tab="设备处置明细" :key="refKeys[0]" :forceRender="true">
        <j-vxe-table
          keep-source
          :ref="refKeys[0]"
          :loading="equipmentDisposalDetailTable.loading"
          :columns="equipmentDisposalDetailTable.columns"
          :dataSource="equipmentDisposalDetailTable.dataSource"
          :maxHeight="800"
          :disabled="formDisabled"
          :rowNumber="true"
          :rowSelection="true"
          :bordered="true"
          :alwaysEdit="true"
          :toolbar="true"
          :toolbarConfig="toolbarConfig"
        >

        <!-- è®¾å¤‡å›¾ç‰‡æ’槽 -->
        <template v-slot:equipmentPhoto='props'>
            <Tooltip
          placement="top"
          title="预览图片"
          >
            <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
            <img v-else :src="getImgView(text)" :preview="props.rowId" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/>
          </Tooltip>
          </template>
          <template v-slot:action="props">
            <a-popconfirm title="确定删除吗？" @confirm="handleDL(props)">
              <a>删除</a>
            </a-popconfirm>
          </template>
          <template slot="toolbarPrefix">
            <a-button type="primary" @click="selectEquipmentList" :disabled="formDisabled">选择设备
            </a-button>
          </template>
        </j-vxe-table>
      </a-tab-pane>
    </a-tabs>

    <equipment-select-modal ref="EquipmentSelectModal"></equipment-select-modal>
  </a-spin>
</template>

<script>

import { getAction } from '@/api/manage'
import { JVxeTableModelMixin } from '@/mixins/JVxeTableModelMixin.js'
import { JVXETypes } from '@/components/jeecg/JVxeTable'
import { getRefPromise, VALIDATE_FAILED } from '@/components/jeecg/JVxeTable/utils/vxeUtils.js'
import { validateDuplicateValue } from '@/utils/util'
import JFormContainer from '@/components/jeecg/JFormContainer'
import EquipmentSelectModal from '../equipmentScrap/EquipmentSelectModal.vue'

export default {
  name: 'EquipmentDisposalForm',
  mixins: [JVxeTableModelMixin],
  components: {
    JFormContainer,
    EquipmentSelectModal
  },
  data() {
    return {
      changeMethod: 'disposal',
      toolbarConfig: {
        // prefix å‰ç¼€ï¼›suffix åŽç¼€
        slot: ['prefix', 'suffix'],
        // add æ–°å¢žæŒ‰é’®ï¼›remove åˆ é™¤æŒ‰é’®ï¼›clearSelection æ¸…空选择按钮
        btn: ['remove', 'clearSelection']
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      model: {},
      // æ–°å¢žæ—¶å­è¡¨é»˜è®¤æ·»åŠ å‡ è¡Œç©ºæ•°æ®
      addDefaultRowNum: 0,
      validatorRules: {
        num: [
          { required: true, message: '请输入单据号!' },
          { validator: (rule, value, callback) => validateDuplicateValue('mom_eam_equipment_change', 'num', value, this.model.id, callback) }
        ],
        remark: [
          { required: false, message: '请输入备注!' }
        ]
      },
      refKeys: ['equipmentDisposalDetail'],
      tableKeys: ['equipmentDisposalDetail'],
      activeKey: 'equipmentDisposalDetail',
      // è®¾å¤‡å¤„置明细
      equipmentDisposalDetailTable: {
        loading: false,
        dataSource: [],
        columns: [
          {
            title: '设备处置明细id',
            key: 'id',
            type: JVXETypes.hidden,
            width: '100px',
            align:"center",
          },
          {
            title: '设备变动单id',
            key: 'equipmentChangeId',
            type: JVXETypes.hidden,
            width: '200px',
            placeholder: '请输入${title}',
            align:"center",
            defaultValue: ''
          },
          {
            title: '设备ID',
            key: 'equipmentId',
            type: JVXETypes.hidden,
            disabled: true,
            width: '60px',
            placeholder: '请输入${title}',
            align:"center",
            defaultValue: ''
          },
          {
            title: '设备编码',
            key: 'equipmentNum',
            type: JVXETypes.normal,
            disabled: true,
            width: '200px',
            align:"center",
            defaultValue: '',
          },
          {
            title: '设备名称',
            key: 'equipmentName',
            type: JVXETypes.normal,
            disabled: true,
            width: '200px',
            align:"center",
            defaultValue: '',
            // fixed: 'left'
          },
          {
            title: '设备型号',
            key: 'model',
            type: JVXETypes.normal,
            disabled: true,
            width: '200px',
            align:"center",
            defaultValue: ''
          },
          {
            title: '设备规格',
            key: 'specification',
            type: JVXETypes.normal,
            disabled: true,
            width: '200px',
            align:"center",
            defaultValue: ''
          },
          {
            title: '设备状态',
            key: 'equipmentStatus_dictText',
            type: JVXETypes.normal,
            disabled: true,
            width: '195px',
            align:"center",
            defaultValue: ''
          },
          {
            title: '设备位置',
            key: 'location',
            type: JVXETypes.normal,
            disabled: true,
            width: '195px',
            align:"center",
            defaultValue: ''
          },
          {
            title: '特种设备',
            key: 'specificEquipment',
            type: JVXETypes.hidden,
            align:"center",
            disabled: true,
            width: '200px',
            // placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '特种设备',
            key: 'specificEquipment_dictText',
            type: JVXETypes.normal,
            disabled: true,
            width: '200px',
            align:"center",
            defaultValue: ''
          },
          {
            title: '资产编码',
            key: 'assetNumber',
            type: JVXETypes.normal,
            disabled: true,
            width: '195px',
            align:"center",
            defaultValue: '',
          },
          {
            title: '处置原因',
            key: 'disposalReason',
            type: JVXETypes.input,
            align:"center",
            width: '195px',
            placeholder: '请输入${title}',
            defaultValue: '',
            validateRules: [
              {
                required: true, // å¿…å¡«
                message: '请输入${title}' // æ˜¾ç¤ºçš„文本
              }]
          },
          {
            title: '处置日期',
            key: 'disposalDate',
            type: JVXETypes.datetime,
            align:"center",
            width: '200px',
            placeholder: '请输入${title}',
            defaultValue: '',
            validateRules: [
              {
                required: true // å¿…å¡«
                // message: '请输入${title}' // æ˜¾ç¤ºçš„文本
              }
              // {
              //   // è‡ªå®šä¹‰å‡½æ•°æ ¡éªŒ handler
              //   handler(type, value, row, column, callback, target) {
              //     // type è§¦å‘校验的类型（input、change、blur、getValues）
              //     // value å½“前校验的值
              //     // callback(flag, message) æ–¹æ³•å¿…须执行且只能执行一次
              //     //          flag = æ˜¯å¦é€šè¿‡äº†æ ¡éªŒï¼Œä¸å¡«å†™æˆ–者填写 null ä»£è¡¨ä¸è¿›è¡Œä»»ä½•æ“ä½œ
              //     //          message = æç¤ºçš„消息，默认使用配置的 message
              //     // target è¡Œç¼–辑的实例对象
              //
              //     if (type === 'blur' || type === 'getValues') {
              //       let { values } = target.getValuesSync({ validate: false })
              //       // let count = 0
              //       // for (let val of values) {
              //       //   if (val['dbFieldName'] === value) {
              //       //     if (++count >= 2) {
              //       //       callback(false, '${title}不能重复')
              //       //       return
              //       //     }
              //       //   }
              //       // }
              //       callback(true) // true = é€šè¿‡éªŒè¯
              //     } else {
              //       callback() // ä¸å¡«å†™æˆ–者填写 null ä»£è¡¨ä¸è¿›è¡Œä»»ä½•æ“ä½œ
              //     }
              //   },
              //   message: '${title}默认提示'
              // }
            ]
          },
          {
            title: '减少方式',
            key: 'reduceMethod',
            type: JVXETypes.selectDictSearch,
            disabled: true,
            width: '200px',
            align:"center",
            defaultValue: '',
            dict:'mom_eam_transfer_method,name,id'
          },
          // {
          //   title: '特种设备',
          //   key: 'specificEquipment',
          //   type: JVXETypes.select,
          //   options: [],
          //   dictCode: 'specific_equipment',
          //   disabled: true,
          //   width: '200px',
          //   // placeholder: '请输入${title}',
          //   defaultValue: ''
          // },
          // {
          //   title: '设备状态',
          //   key: 'equipmentStatus',
          //   type: JVXETypes.select,
          //   options: [],
          //   dictCode: 'equipment_status',
          //   disabled: true,
          //   width: '200px',
          //   // placeholder: '请输入${title}',
          //   defaultValue: ''
          // },
          {
            title: '技术状态',
            key: 'technologyStatus_dictText',
            type: JVXETypes.normal,
            disabled: true,
            width: '200px',
            align:"center",
            defaultValue: ''
          },
          // {
          //   title: '技术状态',
          //   key: 'technologyStatus',
          //   type: JVXETypes.select,
          //   options: [],
          //   dictCode: 'technology_status',
          //   disabled: true,
          //   width: '200px',
          //   // placeholder: '请输入${title}',
          //   defaultValue: ''
          // },
          {
            title: '重要度',
            key: 'equipmentImportanceId_dictText',
            type: JVXETypes.normal,
            disabled: true,
            width: '195px',
            align:"center",
            defaultValue: ''
          },
         
          // {
          //   title: '重要度',
          //   key: 'equipmentImportanceId',
          //   type: JVXETypes.input,
          //   disabled: true,
          //   width: '200px',
          //   // placeholder: '请输入${title}',
          //   defaultValue: ''
          // },
          // {
          //   title: '设备图片',
          //   key: 'equipmentPhoto',
          //   type: JVXETypes.normal,
          //   width: '200px',
          //   // placeholder: '请输入${title}',
          //   defaultValue: ''
          // }
          // {
          //   title: '设备图片',
          //   key: 'equipmentPhoto',
          //   type: JVXETypes.slot,
          //   disabled: true,
          //   width: '120px',
          //   slotName:'equipmentPhoto'

          // },
          // {
          //   title: '操作',
          //   key: 'action',
          //   type: JVXETypes.slot,
          //   disabled: true,
          //   width: '100px',
          //   align:"center",
          //   slotName: 'action',
          // },

        ]
      },
      url: {
        add: '/eam/equipmentDisposal/add',
        edit: '/eam/equipmentDisposal/edit',
        queryById: '/eam/equipmentDisposal/queryById',
        equipmentDisposalDetail: {
          list: '/eam/equipmentDisposal/listEquipmentDisposalDetailByMainId'
        }
      }
    }
  },
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    }
  },
  mounted() {
    this.$bus.$on('selectionRows', (data) => {
      // å¢žåŠ é€‰ä¸­çš„设备到列表中
      this.addSelectedEquipments(data)

    })
  },
  created() {
  },
  methods: {

    //选择设备
    selectEquipmentList() {
      let ids = []
      let tableData = this.$refs.equipmentDisposalDetail.getTableData()
      let deleteData = this.$refs.equipmentDisposalDetail.getDeleteData()
      for (let i = 0; i < tableData.length; i++) {
        ids.push(tableData[i].equipmentId)
      }
      this.$refs.EquipmentSelectModal.showModals(ids)
      this.$refs.EquipmentSelectModal.title = '选择设备'
      this.$refs.EquipmentSelectModal.disableSubmit = false
    },
    addSelectedEquipments(data) {
      let tableData = this.$refs.equipmentDisposalDetail.getTableData()
      // const seletedEquipmentIds = tableData.
      var tableStr = JSON.stringify(tableData)
      const addRows = []
      for (let i = 0; i < data.length; i++) {
        var scrapDetail = {}
        if (tableStr.indexOf(data[i].id)==-1) {
          scrapDetail = {
            equipmentId: data[i].id,
            equipmentNum: data[i].num,
            equipmentName: data[i].name,
            assetNumber: data[i].assetNumber,
            specificEquipment_dictText: data[i].specificEquipment_dictText,
            specificEquipment: data[i].specificEquipment,
            model: data[i].model,
            specification: data[i].specification,
            equipmentStatus_dictText: data[i].equipmentStatus_dictText,
            equipmentStatus: data[i].equipmentStatus,
            technologyStatus_dictText: data[i].technologyStatus_dictText,
            technologyStatus: data[i].technologyStatus,
            equipmentPhoto: data[i].equipmentPhoto,
            location: data[i].location,
            equipmentImportanceId_dictText: data[i].equipmentImportanceId_dictText,
            equipmentImportanceId: data[i].equipmentImportanceId
          }
        }
        addRows.push(scrapDetail)
      }

      this.$refs.equipmentDisposalDetail.pushRows(addRows)
    },
    handleDL(props) {
        // è°ƒç”¨åˆ é™¤æ–¹æ³•
        props.target.removeRows(props.row)
      },
    addBefore() {
      this.equipmentDisposalDetailTable.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 = { equipmentChangeId: this.model.id }
        this.requestSubTableData(this.url.equipmentDisposalDetail.list, params, this.equipmentDisposalDetailTable)
      }
    },
    //校验所有一对一子表表单
    validateSubForm(allValues) {
      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)
      // this.main.changeMethod = this.changeMethod
      return {
        ...main, // å±•å¼€
        equipmentDisposalDetailList: allValues.tablesValue[0].tableData
      }
    },
    validateError(msg) {
      this.$message.error(msg)
    }

  }
}
</script>

<style scoped>
</style>