zenglf
2023-09-18 92ff846fb659c62037a32b1d8c15eae9df9d9b54
src/views/eam/modules/predictiveWorkPlan/PredictiveWorkPlanModal.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,420 @@
<template>
  <a-modal
    :title="title"
    :width="1500"
    :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
                allowClear
                :disabled="disableSubmit"
                :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
                allowClear
                :disabled="disableSubmit"
                :placeholder="disableSubmit?'':'请输入方案名称'"
                v-decorator="[ 'name', validatorRules.name]"
              />
            </a-form-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-item
              label="监控类型"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <j-dict-select-tag
                allow-clear
                :disabled="disableSubmit"
                :placeholder="disableSubmit?'':'请选择监控类型'"
                :triggerChange="true"
                dictCode="monitor_type"
                v-decorator="['monitorType', validatorRules.monitorType]"
              />
            </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"
            >
              <j-dict-select-tag
                allow-clear
                :disabled="disableSubmit"
                :placeholder="disableSubmit?'':'请选择维保方式'"
                :triggerChange="true"
                dictCode="maintenance_method"
                v-decorator="['maintenanceMethod', validatorRules.maintenanceMethod]"
              />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item
              label="派工方式"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <j-dict-select-tag
                allow-clear
                :disabled="disableSubmit"
                :placeholder="disableSubmit?'':'请选择派工方式'"
                :triggerChange="true"
                dictCode="assign_mode"
                v-decorator="['assignMode', validatorRules.assignMode]"
              />
            </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
                allow-clear
                :disabled="true"
                :placeholder="disableSubmit?'':'请输入责任班组'"
                v-decorator="['teamName', {} ]"
              />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item
              label="版本"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <a-input
                allowClear
                :disabled="true"
                :placeholder="disableSubmit?'':'请输入版本号'"
                v-decorator="[ 'planVersion', validatorRules.planVersion]"
              />
            </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-form>
    </a-spin>
    <template slot="footer">
      <a-button
        :style="{marginRight: '8px'}"
        @click="handleCancel()"
      >
        å…³é—­
      </a-button>
      <a-button
        @click="handleOk()"
        type="primary"
        :loading="confirmLoading"
      >确定
      </a-button>
    </template>
    <equipment-list
      ref="EquipmentList"
      @sendEquipmentRecord='sendEquipmentRecord'
    ></equipment-list>
  </a-modal>
</template>
<script>
  import { postAction, requestPut } from '@/api/manage'
  import pick from 'lodash.pick'
  import JMultiSelectTag from '@/components/dict/JMultiSelectTag'
  import Tooltip from 'ant-design-vue/es/tooltip'
  import { preview } from 'vue-photo-preview'
  import PdfView from '@views/common/PdfView'
  import EquipmentList from '@/views/eam/common/EquipmentList'
  export default {
    name: 'MaintenanceStandardModal',
    components: {
      JMultiSelectTag,
      Tooltip,
      PdfView,
      preview,
      EquipmentList
    },
    data() {
      return {
        title: '操作',
        visible: false,
        visible4Confirm: false,
        disableSubmit: false,
        codeDisable: true,
        isRevise: false,
        model: {},
        upload: {},
        treeData: [],
        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: '请输入编码!' }
            ]
          },
          teamName: {
            rules: [
              { required: true, message: '请选择责任班组!' }
            ]
          },
          useDepartName: {
            rules: [
              { required: true, message: '请选择对象部门!' }
            ]
          },
          equipmentName: {
            rules: [
              { required: true, message: '请选择设备!' }
            ]
          },
          assignMode: {
            rules: [
              { required: true, message: '请选择派工方式!' }
            ]
          },
          version: {
            rules: [
              { required: true, message: '请输入版本!' }
            ]
          },
          historyVersion: {
            rules: [
              { required: true, message: '请输入历史版本!' }
            ]
          }
        },
        url: {
          add: '/eam/predictiveworkplan/add',
          edit: '/eam/predictiveworkplan/edit',
          revise: '/eam/predictiveworkplan/revise',
          getReviseVersion: '/eam/predictiveworkplan/getReviseVersion'
        },
        dataSource: [],
        departId: ''
      }
    },
    mounted() {
    },
    created() {
    },
    methods: {
      add() {
        this.edit()
      },
      edit(record) {
        let that = this
        this.dataSource = []
        this.form.resetFields()
        this.model = Object.assign({}, record)
        this.visible = true
        that.$nextTick(() => {
          that.model.equipmentId = record.equipmentId
          that.model.teamId = record.teamId
          that.form.setFieldsValue(pick(that.model, 'num', 'name', 'monitorType', 'maintenanceMethod', 'assignMode', 'teamName', 'planVersion'))
          that.form.setFieldsValue({
            equipmentName: record.deviceNum + '/' + record.deviceName + '/' + record.deviceModel,
            historyVersion: record.planVersion
          })
        })
        if (record.id) {
          this.codeDisable = true
          that.$nextTick(() => {
            if (that.isRevise) {
              requestPut(that.url.getReviseVersion, record).then((res) => {
                if (res.success) {
                  that.form.setFieldsValue({ planVersion: res.result })
                }
              })
            }
          }, 200)
        } else {
          this.codeDisable = false
          that.$nextTick(() => {
            that.form.setFieldsValue({ 'planVersion': '1.0' })
          })
        }
      },
      onEquipmentList() {
        this.$refs.EquipmentList.list()
        this.$refs.EquipmentList.title = '选择设备信息'
      },
      sendEquipmentRecord(data) {
        this.dataSource = []
        let record = data.record
        this.model.equipmentId = record.id
        this.model.teamId = record.teamId
        this.form.setFieldsValue({
          equipmentName: record.num + '/' + record.name + '/' + record.model,
          teamName: record.teamId_dictText
        })
      },
      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)
            let obj
            if (!this.model.id) {
              formData.status = '1'
              obj = postAction(this.url.add, formData)
            } else {
              if (this.isRevise) {
                formData.status = '1'
                obj = postAction(this.url.revise, 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()
            })
          }
        })
      },
      getUuiD(randomLength) {
        return Number(
          Math.random()
            .toString()
            .substr(2, randomLength) + Date.now()
        ).toString(36)
      }
    }
  }
</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>