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

zenglf

2023-09-18 92ff846fb659c62037a32b1d8c15eae9df9d9b54

 src/views/eam/modules/specialtyMaintenanceOrder/MaintenanceOrderModal.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,368 @@
<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"
            >
              <j-date
                :disabled="disableSubmit"
                v-decorator="['planStartTime', validatorRules.planStartTime ]"
                placeholder="请选择保养时间"
                style="width: 100%"
                :showTime="true"
                dateFormat="YYYY-MM-DD HH:mm:ss"
              />
            </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-search
                :disabled="disableSubmit"
                :placeholder="disableSubmit?'':'请选择专业保养方案'"
                enter-button
                @search="onSpecialtyMaintenancePlanList()"
                :read-only="true"
                v-decorator="['specialtyMaintenancePlanNum', validatorRules.specialtyMaintenancePlanNum]"
              />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              label="派工方式"
            >
              <j-dict-select-tag
                allow-clear
                :disabled="true"
                :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
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              label="责任班组"
            >
              <a-input
                allow-clear
                :disabled="true"
                :placeholder="disableSubmit?'':'请输入责任班组'"
                v-decorator="['teamName', validatorRules.teamName ]"
              />
            </a-form-item>
          </a-col>
          <a-col
            hidden
            :span="12"
          >
            <a-form-item
              label="专业点检方案Id"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <a-input
                allow-clear
                :disabled="true"
                :placeholder="disableSubmit?'':'专业点检方案Id'"
                v-decorator="['specialtyMaintenancePlanId', validatorRules.specialtyMaintenancePlanId ]"
              />
            </a-form-item>
          </a-col>
        </a-row>
        <a-row
          v-if="!isHidden"
          :gutter="24"
        >
          <a-col :span="12">
            <a-form-item
              label="责任人"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <a-input-search
                :disabled="disableSubmit"
                placeholder="责任人"
                enter-button
                @search="onDutyUserList()"
                :read-only="true"
                v-decorator="['maintenanceUserName', validatorRules.maintenanceUserName]"
              />
            </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?'':'请输入责任班组Id'"
                v-decorator="['teamId', validatorRules.teamId ]"
              />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item
              label="责任人/点检人Id"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
            >
              <a-input
                allow-clear
                :disabled="true"
                :placeholder="disableSubmit?'':'请输入责任人/点检人'"
                v-decorator="['maintenanceUserId', validatorRules.maintenanceUserId ]"
              />
            </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"
        :disabled="disableSubmit || confirmLoading"
      >确定</a-button>
    </template>
    <specialty-maintenance-plan-list
      ref="SpecialtyMaintenancePlanList"
      @sendSpecialtyMaintenancePlanRecord='sendSpecialtyMaintenancePlanRecord'
    ></specialty-maintenance-plan-list>
  </a-modal>

</template>

<script>
import { getAction, 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 SpecialtyMaintenancePlanList from './SpecialtyMaintenancePlanList'

export default {
  name: "MaintenanceOrderModal",
  components: {
    JMultiSelectTag,
    Tooltip,
    SpecialtyMaintenancePlanList
    // PdfView,
    // preview,
  },
  data() {
    return {
      isHidden: true,
      title: "操作",
      visible: false,
      disableSubmit: false,
      codeDisable: true,
      model: {},
      inspectionCycles: [],
      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: '请输入工单编码!' },
          ]
        },
        specialtyMaintenancePlanNum: {
          rules: [
            { required: true, message: '请选择专业点检方案!' },
          ]
        },
        planStartTime: {
          rules: [
            { required: true, message: '请选择保养日期!' },
          ]
        },
        assignMode: {
          rules: [
            { required: true, message: '请选择派工方式!' },
          ]
        },
        maintenanceUserName: {
          rules: [
            { required: true, message: '请选择责任人!' },
          ]
        },
        teamName: {
          rules: [
            { required: true, message: '请选择责任班组!' },
          ]
        },
      },
      url: {
        add: "/eam/specialtyMaintenanceOrder/add",
        edit: "/eam/specialtyMaintenanceOrder/edit",
      },
    }
  },

  methods: {
    add() {
      this.edit({})
    },

    edit(record) {
      let that = this;
      this.form.resetFields();
      this.model = Object.assign({}, record);
      this.visible = true;
      that.$nextTick(() => {
        that.form.setFieldsValue(pick(that.model, 'num', 'specialtyMaintenancePlanNum', 'assignMode', 'assignModeName', 'teamId', 'teamName', 'specialtyMaintenancePlanId', 'planStartTime'));
      });
      if (record.id) {
        this.codeDisable = true;
      } else {
        this.codeDisable = false;
      }
    },

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

    handleCancel() {
      this.close();
    },
    onSpecialtyMaintenancePlanList() {
      this.$refs.SpecialtyMaintenancePlanList.list();
      this.$refs.SpecialtyMaintenancePlanList.title = "选择专业保养方案";
    },
    sendSpecialtyMaintenancePlanRecord(data) {
      let record = data.record;
      this.form.setFieldsValue({ assignMode: null, teamName: null, teamId: null, maintenanceUserName: null, maintenanceUserId: null });
      this.form.setFieldsValue({ specialtyMaintenancePlanId: record.id, specialtyMaintenancePlanNum: record.num });
      this.form.setFieldsValue({ assignMode: record.assignMode, teamName: record.teamName, teamId: record.teamId });
      if ("3" == record.assignMode) {
        this.isHidden = false
      } else {
        this.isHidden = true
      }
    },

    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) {
            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();
          })
        }
      })
    },


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