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

zenglf

2023-09-18 92ff846fb659c62037a32b1d8c15eae9df9d9b54

 src/views/eam/modules/equipmentUnseal/EquipmentUnsealForm.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,519 @@
<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>
          <a-col
            :span="12"
            :hidden=true
          >
            <a-form-model-item
              label="变动方式"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="changeMethod"
            >
              <a-input
                v-model="model.changeMethod"
                placeholder="请输入变动方式"
                defaultValue="unseal"
              ></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-tabs
      v-model="activeKey"
      @change="handleChangeTabs"
    >
      <a-tab-pane
        tab="设备启封明细"
        :key="refKeys[0]"
        :forceRender="true"
      >
        <j-vxe-table
          keep-source
          :ref="refKeys[0]"
          :loading="equipmentUnsealDetailTable.loading"
          :columns="equipmentUnsealDetailTable.columns"
          :dataSource="equipmentUnsealDetailTable.dataSource"
          :maxHeight="300"
          :disabled="formDisabled"
          :rowNumber="true"
          :rowSelection="true"
          :toolbar="true"
          :toolbarConfig="toolbarConfig"
          :alwaysEdit='true'
          :bordered='true'
        >

          <template slot="toolbarPrefix">
            <a-button
              type="primary"
              @click="selectEquipmentList"
              :disabled="formDisabled"
            >选择设备
            </a-button>
          </template>
          <!-- è®¾å¤‡å›¾ç‰‡æ’槽 -->
          <!-- <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>
        </j-vxe-table>
      </a-tab-pane>
    </a-tabs>
    <equipment-select-modal ref="EquipmentSelectModal"></equipment-select-modal>
  </a-spin>
</template>

<script>

import { JEditableTableModelMixin } from '@/mixins/JEditableTableModelMixin'
import { randomUUID, randomNumber } from '@/utils/util'

import { validateDuplicateValue } from '@/utils/util'
import pick from 'lodash.pick'
import { getAction, postAction, requestPut } from '@api/manage'
import EquipmentSelectModal from './EquipmentSelectModal.vue'

import { JVxeTableModelMixin } from '@/mixins/JVxeTableModelMixin.js'
import { JVXETypes } from '@comp/jeecg/JVxeTable'
import { getRefPromise, VALIDATE_FAILED } from '@/components/jeecg/JVxeTable/utils/vxeUtils.js'

import JFormContainer from '@/components/jeecg/JFormContainer'

export default {
  name: 'EquipmentUnsealForm',
  mixins: [JVxeTableModelMixin],
  components: {
    EquipmentSelectModal,
    JFormContainer
  },
  data() {
    return {
      changeMethod: 'unseal',
      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: ['equipmentUnsealDetail'],
      tableKeys: ['equipmentUnsealDetail'],
      activeKey: 'equipmentUnsealDetail',
      // è®¾å¤‡å¯å°æ˜Žç»†
      equipmentUnsealDetailTable: {
        loading: false,
        dataSource: [],
        columns: [
          {
            title: '设备启封明细id',
            key: 'id',
            type: JVXETypes.hidden,
            width: '100px',
            fixed: 'left'
          },
          {
            title: '设备变动单id',
            key: 'equipmentChangeId',
            type: JVXETypes.hidden,

            placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '设备ID',
            key: 'equipmentId',
            type: JVXETypes.hidden,
            defaultValue: ''
          },
          {
            title: '设备编码',
            key: 'equipmentNum',
            type: JVXETypes.normal,
            width: '150px',
            align: "center",
          },
          // fixed: 'left'
          {
            title: '设备名称',
            key: 'equipmentName',
            type: JVXETypes.normal,
            disabled: true,
            width: '150px',
            align: "center",
            defaultValue: ''
          },
          // fixed: 'left',
          {
            title: '设备型号',
            key: 'model',
            type: JVXETypes.normal,
            disabled: true,
            width: '150px',
            align: "center",
            defaultValue: ''
          },
          {
            title: '设备规格',
            key: 'specification',
            type: JVXETypes.normal,
            disabled: true,
            width: '150px',
            align: "center",
            placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '资产编码',
            key: 'assetNumber',
            type: JVXETypes.normal,
            width: '150px',
            align: "center",
            defaultValue: ''
          },
          {
            title: '封存原因',
            key: 'sealReason',
            type: JVXETypes.normal,
            disabled: true,
            width: '200px',
            align: "center",
          },
          {
            title: '封存日期',
            key: 'sealDate',
            type: JVXETypes.normal,
            disabled: true,
            width: '150px',
            align: "center",
          },
          {
            title: '启封日期',
            key: 'unsealDate',
            type: JVXETypes.datetime,
            width: '150px',
            align: "center",
            placeholder: '请输入${title}',
            defaultValue: '',
            validateRules: [{
              required: true, // å¿…å¡«
              message: '${title}不能为空' // æç¤ºçš„文本
            }]
          },
          {
            title: '启封原因',
            key: 'unsealReason',
            type: JVXETypes.textarea,
            width: '200px',
            align: "center",
            placeholder: '请输入${title}',
            defaultValue: '',
            validateRules: [{
              required: true, // å¿…å¡«
              message: '${title}不能为空' // æç¤ºçš„文本
            }]
          },
          {
            title: '特种设备',
            key: 'specificEquipment',
            type: JVXETypes.hidden,
            disabled: true,
            width: '150px',
            align: "center",
            defaultValue: ''
          },
          {
            title: '特种设备',
            key: 'specificEquipment_dictText',
            type: JVXETypes.normal,
            disabled: true,
            width: '150px',
            align: "center",
            defaultValue: ''
          },

          {
            title: '设备状态',
            key: 'equipmentStatus_dictText',
            type: JVXETypes.normal,
            disabled: true,
            width: '150px',
            align: "center",
            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: '150px',
            align: "center",
            defaultValue: ''
          },
          {
            title: '设备位置',
            key: 'location',
            type: JVXETypes.normal,
            disabled: true,
            width: '150px',
            align: "center",
          },
          {
            title: '重要度',
            key: 'equipmentImportanceId_dictText',
            type: JVXETypes.normal,
            disabled: true,
            width: '150px',
            align: "center",
            // placeholder: '请输入${title}',
            defaultValue: ''
          },
          {
            title: '重要度',
            key: 'equipmentImportanceId',
            type: JVXETypes.hidden
          },
          // {
          //   title: '设备图片',
          //   key: 'equipmentPhoto',
          //   type: JVXETypes.slot,
          //   disabled: true,
          //   width: '120px',
          //   slotName: 'equipmentPhoto'
          // },
          // {
          //   title: '操作',
          //   key: 'action',
          //   type: JVXETypes.slot,
          //   disabled: true,
          //   width: '100px',
          //   slotName: 'action',
          // },
        ]
      },
      url: {
        add: '/eam/equipmentUnseal/add',
        edit: '/eam/equipmentUnseal/edit',
        queryById: '/eam/equipmentUnseal/queryById',
        equipmentUnsealDetail: {
          list: '/eam/equipmentUnseal/listEquipmentUnsealDetailByMainId'
        }
      }
    }
  },
  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.equipmentUnsealDetail.getTableData()
      let deleteData = this.$refs.equipmentUnsealDetail.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.equipmentUnsealDetail.getTableData()
      let tableStr = JSON.stringify(tableData)
      let addRows = []
      for (let i = 0; i < data.length; i++) {
        var sealDetail = {}
        if (tableStr.indexOf(data[i].id) == -1) {
          sealDetail = {
            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,
            sealReason: data[i].sealReason,
            sealDate: data[i].sealDate
          }
        }
        addRows.push(sealDetail)
      }
      this.$refs.equipmentUnsealDetail.pushRows(addRows)
    },
    handleDL(props) {
      // è°ƒç”¨åˆ é™¤æ–¹æ³•
      props.target.removeRows(props.row)
    },
    addBefore() {
      this.equipmentUnsealDetailTable.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.equipmentUnsealDetail.list, params, this.equipmentUnsealDetailTable)
      }
    },
    //校验所有一对一子表表单
    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)
      return {
        ...main, // å±•å¼€
        equipmentUnsealDetailList: allValues.tablesValue[0].tableData
      }
    },
    validateError(msg) {
      this.$message.error(msg)
    }

  }
}
</script>

<style scoped>
/** tab panel ä¸­æœ‰ä¸‹æ‹‰æ¡†/日期 è¿™ç±»å¸¦ä¸‹æ‹‰æ•ˆæžœçš„，需要加此样式 */
/deep/ .jeecg-tabs-top {
  overflow: visible;
}
</style>