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

zenglf

2023-09-18 92ff846fb659c62037a32b1d8c15eae9df9d9b54

 src/views/eam/modules/specialtyInspectionStandard/SpecialtylnspectionStandardModal.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,533 @@
<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="12">
            <a-form-item
              label="点检标准编码"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <a-input
                allow-clear
                :disabled="codeDisable"
                :placeholder="disableSubmit?'':'请输入点检标准编码，不输入将由系统自动生成编码'"
                v-decorator="['num', validatorRules.num ]"
              />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item
              label="设备名称"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <a-input-search
                :disabled="disableSubmit"
                placeholder="请选择设备"
                enter-button
                @search="onEquipmentList()"
                :read-only="true"
                v-decorator="['equipmentName', validatorRules.equipmentName]"
              />
            </a-form-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-item
              label="版本"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <a-input
                allowClear
                :disabled="true"
                :placeholder="disableSubmit?'':'请输入版本号'"
                v-decorator="[ 'version', validatorRules.version]"
              />
            </a-form-item>
          </a-col>
          <a-col
            v-if="this.isRevise == true"
            :span="12"
          >
            <a-form-item
              label="历史版本"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <a-input
                allowClear
                :disabled="true"
                :placeholder="disableSubmit?'':'请输入历史版本号'"
                v-decorator="[ 'historyVersion', validatorRules.historyVersion]"
              />
            </a-form-item>
          </a-col>
        </a-row>
        <a-row
          hidden
          :gutter="24"
        >
          <a-col :span="12">
            <a-form-item
              label="设备Id"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <a-input
                allow-clear
                :disabled="true"
                :placeholder="disableSubmit?'':'请输入设备编码/名称/型号'"
                v-decorator="['equipmentId', validatorRules.equipmentId ]"
              />
            </a-form-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="24">
            <a-form-item
              label="备注"
              :labelCol="{span:3}"
              :wrapperCol="{span:21}"
            >
              <a-textarea
                allowClear
                :disabled="disableSubmit"
                :placeholder="disableSubmit?'':'请输入备注'"
                v-decorator="[ 'remark', validatorRules.remark]"
              />
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>
    </a-spin>
    <a-button
      type="primary"
      :style="{ marginRight: '8px',marginBottom:'8px' }"
      :loading="confirmLoading"
      @click="selectInspectionProjects()"
    >点检项目</a-button>
    <a-table
      ref="table"
      bordered
      size="middle"
      rowKey='id'
      :columns="columns"
      :dataSource="dataSource"
    >
      <template
        v-for="col in columns"
        :slot="col.dataIndex"
        slot-scope='text, record, index'
      >
        <div :key="col.dataIndex">
          <a-select
            v-if="col.dataIndex == 'inspectionCycleId'"
            :value="text"
            :options="record.inspectionCycles"
            @change="(e) => handleChange(e, record.key, col, index)"
            style="width: 100%"
            :disabled="false"
          />
          <j-image-upload
            :value="text"
            v-if="col.dataIndex == 'photo'"
            :isMultiple="false"
            auto-size
            placeholder="请上传图片"
            @change="(e)=>handleChange(e, record.key, col, index)"
          >
          </j-image-upload>
          <a-input
            :value="text"
            v-if="col.dataIndex == 'location'"
            :maxLength="32"
            auto-size
            placeholder="请输入部位"
            @change="(e)=>handleChange(e, record.key, col, index)"
          />
        </div>
      </template>

      <span
        slot="action"
        slot-scope="text, record, index"
      >
        <a-popconfirm
          title="确定删除吗?"
          @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"
        :loading="confirmLoading"
      >确定</a-button>
    </template>
    <j-select-specialtylnspection-standard-modal ref="inspectionStandardModalForm"></j-select-specialtylnspection-standard-modal>

    <equipment-list
      ref="EquipmentList"
      @sendEquipmentRecord='sendEquipmentRecord'
    ></equipment-list>
  </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 JSelectSpecialtylnspectionStandardModal from './JSelectSpecialtylnspectionStandardModal'
import EquipmentList from './EquipmentList'

export default {
  name: "SpecialtylnspectionStandardModal",
  components: {
    JMultiSelectTag,
    Tooltip,
    JSelectSpecialtylnspectionStandardModal,
    EquipmentList
  },
  data() {
    return {
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
          width: 50,
        },
        {
          title: '点检项目',
          align: 'center',
          dataIndex: 'name'
        },
        {
          title: '检测标准',
          align: 'center',
          dataIndex: 'detectionStandard'
        },
        {
          title: '合格范围',
          align: 'center',
          dataIndex: 'acceptabilityLimit'
        },
        {
          title: '方法',
          align: 'center',
          dataIndex: 'inspectionMethodName'
        },
        {
          title: '工具',
          align: 'center',
          dataIndex: 'inspectionTool'
        },
        {
          title: '周期',
          align: 'center',
          dataIndex: 'inspectionCycleId',
          scopedSlots: { customRender: 'inspectionCycleId' },
          width: 170,
        },
        {
          title: '部位',
          align: 'center',
          dataIndex: 'location',
          scopedSlots: { customRender: 'location' },
          width: 170,
        },
        {
          title: '示意图',
          align: "center",
          dataIndex: 'photo',
          scopedSlots: { customRender: 'photo' },
          width: 170,
        },
        {
          title: '操作',
          align: 'center',
          dataIndex: 'action',
          scopedSlots: {
            customRender: 'action'
          },
        }
      ],
      title: "操作",
      visible: false,
      visible4Confirm: false,
      disableSubmit: false,
      codeDisable: true,
      model: {},
      inspectionCycles: {},
      isRevise: false,
      isCopy:false,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 18 },
      },
      confirmLoading: false,
      form: this.$form.createForm(this),
      validatorRules: {
        // num: {
        //   rules: [
        //     { required: true, message: '请输入点检标准编码!' },
        //   ]
        // },
        equipmentName: {
          rules: [
            { required: true, message: '请选择设备!' },
          ]
        },

        version: {
          rules: [
            { required: true, message: '请输入版本!' },
          ]
        },
        // historyVersion: {
        //   rules: [
        //     { required: true, message: '请输入历史版本!' },
        //   ]
        // },
      },
      url: {
        add: "/eam/specialtyStandard/add",
        edit: "/eam/specialtyStandard/edit",
        getInspectionCycle: "/eam/inspectionStandardDetail/getInspectionCycle",
        revise: '/eam/specialtyStandard/revise',
        getReviseVersion: "/eam/specialtyStandard/getReviseVersion",
        getNum: '/eam/sysIdentity/getNumNew',
        getCopy: "/eam/specialtyStandard/getCopy",
      },

      dataSource: [],
    }
  },


  mounted() {
    this.$bus.$on('selectionRows', (data) => {
      for (let i = 0; i < data.length; i++) {
        this.dataSource.push({
          id: data[i].id,
          inspectionProjectId: data[i].id,
          name: data[i].name,
          detectionStandard: data[i].detectionStandard,
          acceptabilityLimit: data[i].acceptabilityLimit,
          inspectionMethodName: data[i].inspectionMethod_dictText,
          inspectionTool: data[i].inspectionTool,
          inspectionCycles: this.inspectionCycles,
        })
      }
    })
  },


  methods: {

    //选择点检项目
    selectInspectionProjects: function () {
      let ids = [];
      for (let i = 0; i < this.dataSource.length; i++) {
        ids.push(this.dataSource[i].inspectionProjectId);
      }
      this.$refs.inspectionStandardModalForm.showModals(ids);
      this.$refs.inspectionStandardModalForm.title = '选择点检项目';
      this.$refs.inspectionStandardModalForm.disableSubmit = false;
    },

    add() {
      this.edit({ specialtyInspectionStandardDetaillist: [] })
    },

    edit(record) {
      let that = this;
      this.getInspectionCycle()
      that.dataSource = [];
      this.form.resetFields();
      this.model = Object.assign({}, record);
      this.visible = true;
      if (record.specialtyInspectionStandardDetaillist != undefined) {
        const temp = [...record.specialtyInspectionStandardDetaillist];
        that.dataSource = temp;
      }
      that.$nextTick(() => {
        that.form.setFieldsValue(pick(that.model, 'num', 'equipmentId', 'equipmentName', 'version', 'remark'));
      });
      if (record.id) {
        that.codeDisable = true;
        that.$nextTick(() => {
          if (that.isRevise) {
            requestPut(that.url.getReviseVersion, record).then((res) => {
              if (res.success) {
                that.form.setFieldsValue({ version: res.result, historyVersion: record.version })
              }
            })
          }
        }, 200);
      } else {
        that.codeDisable = false;
        that.$nextTick(() => {
          that.form.setFieldsValue({ "version": "1.0", })
        });
      }
    },

    onEquipmentList() {
      this.$refs.EquipmentList.list();
      this.$refs.EquipmentList.title = "选择设备信息";
    },
    sendEquipmentRecord(data) {
      this.dataSource = [];
      let record = data.record;
      this.form.setFieldsValue({ equipmentId: record.id, equipmentName: record.num + "/" + record.name + "/" + record.model });
    },

    close() {
      this.$emit('close');
      this.visible = false;
    },

    handleCancel() {
      this.close();
    },

    handleOk() {
      const that = this;
      this.form.validateFields(async (err, values) => {
        if (!err) {
          that.confirmLoading = true;
          let formData = Object.assign(this.model, values);
          formData.specialtyInspectionStandardDetaillist = that.dataSource;
          let obj;
          if (!this.model.id) {
            if(!formData.num){
                await getAction(this.url.getNum, { type: 'SpecialtyInspectionStandard', length: '4' }).then((res) => {
                if (res.success) {
                  formData.num = res.message;
                }
              });
            }
            formData.versionStatus = '1'
            obj = postAction(this.url.add, formData);
          } else {
            if (this.isRevise) {
              formData.versionStatus = '1'
              obj = postAction(this.url.revise, formData);
            } else if(this.isCopy){
              obj = postAction(this.url.getCopy, 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);
    },

    getInspectionCycle() {
      getAction(this.url.getInspectionCycle).then((res) => {
        if (res.success) {
          this.inspectionCycles = 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 == 'inspectionCycleId') {
          target[column.dataIndex] = value;
        }
        if ('photo' == column.dataIndex) {
          target['photo'] = value;
        }
        if ('location' == column.dataIndex) {
          target['location'] = value.target.value;
        }
        //显示带过来的数据
        that.dataSource = temp;
      }
    },

  },
}
</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>