zhangherong
2025-04-27 dbb3445dc720a8f36b3424e73f2e02a6b0f9deb6
src/views/eam/maintenance/modules/EamInspectionOrderModal.vue
@@ -5,80 +5,70 @@
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    centered
    :mask-closable="false"
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <a-form-model ref="form" :model="model" :rules="validatorRules">
    <a-spin :spinning="spinning">
      <a-form-model ref="form" :model="model" :rules="validatorRules" :labelCol="labelCol" :wrapperCol="wrapperCol">
        <a-row :gutter="24">
          <a-col :span="8">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="standardCode" label="工单号">
              <a-input placeholder="工单号自动生成" v-model="model.orderNum" disabled />
            <a-form-model-item prop="standardCode" label="工单号">
              <a-input placeholder="工单号自动生成" v-model="model.orderNum" readOnly/>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="equipmentId" label="设备编号">
            <a-form-model-item prop="equipmentId" label="设备编号">
              <MaintenanceEquipmentSelect placeholder="请输入设备编号或名称搜索" v-model="model.equipmentId"
                                          :maintenanceCategory="maintenanceCategory" :disabled="editable"
                                          @autocompleteForm="autocompleteForm"></MaintenanceEquipmentSelect>
                                          :maintenanceCategory="maintenanceCategory" :disabled="disabled"
                                          @autocompleteForm="autocompleteForm"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="standardName" label="标准名称">
              <a-input placeholder="请输入标准名称" disabled v-model="model.standardName" />
            <a-form-model-item prop="standardName" label="标准名称">
              <a-input placeholder="选择设备后自动带出" readOnly v-model="model.standardName"/>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="8">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="standardCode" label="标准编码">
              <a-input placeholder="请输入标准编码" disabled v-model="model.standardCode" />
            <a-form-model-item prop="standardCode" label="标准编码">
              <a-input placeholder="选择设备后自动带出" readOnly v-model="model.standardCode"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="maintenancePeriod" label="保养周期">
              <a-input-number v-model="model.maintenancePeriod" :min="1" :precision="0" disabled style="width: 100%" />
            <a-form-model-item label="保养周期">
              <a-input placeholder="选择设备后自动带出" v-model="model.maintenancePeriod" readOnly/>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="operator" label="点检人">
              <j-dict-select-tag v-model="model.operator" placeholder="请选择用户" dictCode="sys_user,realname,username,username!='admin' order by create_time"/>
            <a-form-model-item prop="operator" label="点检人">
              <j-search-select-tag v-model="model.operator" placeholder="请选择点检人" :disabled="!model.equipmentId"
                                   :dictOptions="maintenanceOperatorOptions"/>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="8">
            <a-form-model-item label="点检日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="inspectionDate">
              <j-date placeholder="请选择点检日期" v-model="model.inspectionDate" @change="expirationTimeFrom(model.inspectionDate)" style="width: 100%" />
            <a-form-model-item label="点检日期" prop="inspectionDate">
              <j-date :placeholder="!model.maintenancePeriod?'请填写保养周期':'请选择点检日期'" v-model="model.inspectionDate"
                      :disabled="!model.maintenancePeriod"
                      @change="expirationTimeFrom(model.inspectionDate)" style="width: 100%"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="点检过期时间" :labelCol="{span:6}" :wrapperCol="{span:15}" prop="expirationTime">
              <j-date placeholder="请选择点检过期时间" v-model="model.expirationTime" disabled style="width: 100%" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="8">
            <a-form-model-item
              label="照片文件"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="imageFiles">
              <lx-upload :returnUrl="false"
                         :multiple="false"
                         v-model="model.imageFiles"
                         biz="EamMaintenanceStandard">
              </lx-upload>
            <a-form-model-item label="点检过期时间">
              <j-date placeholder="选择点检日期后自动带出" v-model="model.expirationTime" disabled style="width: 100%"/>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="24">
            <a-form-model-item label="备注" :labelCol="{span:1}" :wrapperCol="{span:22}" prop="remark">
              <a-textarea v-model="model.remark" rows="3" placeholder="请输入备注" />
            <a-form-model-item label="备注" :labelCol="{span:2}" :wrapperCol="{span:21}" prop="remark">
              <a-textarea v-model="model.remark" rows="3" placeholder="请输入备注"/>
            </a-form-model-item>
          </a-col>
        </a-row>
@@ -95,7 +85,7 @@
            :loading="detail.loading"
            :dataSource="detail.dataSource"
            :columns="detail.columns"
            style="margin-top: 8px;" />
            style="margin-top: 8px;"/>
        </a-row>
      </a-form-model>
    </a-spin>
@@ -103,215 +93,271 @@
</template>
<script>
import { getAction, httpAction } from '@/api/manage'
import { JVxeTableModelMixin } from '@/mixins/JVxeTableModelMixin.js'
import { JVXETypes } from '@/components/jeecg/JVxeTable'
import MaintenanceEquipmentSelect from '@views/eam/equipment/modules/MaintenanceEquipmentSelect'
import moment from 'dayjs'
  import { getAction, httpAction } from '@/api/manage'
  import { JVxeTableModelMixin } from '@/mixins/JVxeTableModelMixin.js'
  import { JVXETypes } from '@/components/jeecg/JVxeTable'
  import MaintenanceEquipmentSelect from '@views/eam/equipment/modules/MaintenanceEquipmentSelect'
  import moment from 'dayjs'
export default {
  name: 'EamMaintenanceStandardModal',
  mixins: [JVxeTableModelMixin],
  components: {
    MaintenanceEquipmentSelect
  },
  data() {
    return {
      title: '操作',
      visible: false,
      model: {},
      editable: false,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      confirmLoading: false,
      validatorRules: {
        standardName: [
          { required: true, message: '请输入标准名称!' }
        ],
        maintenanceCategory: [
          { required: true, message: '请选择保养分类!' }
        ],
        initialDate: [
          { required: true, message: '请选择初始日期!' }
        ],
        maintenancePeriod: [
          { required: true, message: '请输入保养周期,单位:天!' }
        ],
        equipmentId: [
          { required: true, message: '请选择设备!' }
        ],
      },
      url: {
        add: '/eam/eamInspectionOrder/add',
        edit: '/eam/eamInspectionOrder/edit',
        detail: '/eam/eamMaintenanceStandardDetail/queryList',
        detailOrder: '/eam/eamInspectionOrderDetail/queryList'
      },
      maintenanceCategory: 'POINT_INSPECTION',
      standardId:"",
      standardType:false,
      detail: {
        loading: false,
        dataSource: [],
        columns: [
          {
            title: '序号',
            key: 'itemCode',
            type: JVXETypes.inputNumber,
            width: '10%',
            align:"center",
            validateRules: [
              {required : true, unique: true, message: '序号不能重复'}
            ]
          },
          {
            title: '保养项',
            key: 'itemName',
            type: JVXETypes.textarea,
            width: '20%',
            align:"center",
            validateRules: [
              {required : true, message: '保养项不能为空!'}
            ]
          },
          {
            title: '保养要求',
            key: 'itemDemand',
            type: JVXETypes.textarea,
            width: '30%',
            align:"center",
            validateRules: [
              {required : true, message: "保养要求不能为空!"}
            ]
          },
        ]
      }
    }
  },
  created() {
  },
  methods: {
    add() {
      this.model = {}
      this.detail.dataSource = [];
      this.visible = true
      this.editable = false
      this.standardType=false;
  export default {
    name: 'EamMaintenanceStandardModal',
    mixins: [JVxeTableModelMixin],
    components: {
      MaintenanceEquipmentSelect
    },
    edit(record) {
      console.log(record)
      this.model = Object.assign({}, record)
      this.standardId=record.standardId
      this.standardType=true;
      this.visible = true
      this.editable = true
      this.detail.dataSource = []
      if (record && record.referenceFile) {
        let obj = JSON.parse(record.referenceFile)
        this.model.fileList = [obj]
      } else {
        this.model.fieldList = []
      }
      this.loadDetailOrder(record.id)
    },
    close() {
      this.$emit('close')
      this.visible = false
      this.$refs.form.clearValidate()
    },
    async handleOk() {
      const that = this
      let errMap = await that.$refs.editableDetailTable.validateTable()
      if (errMap) {
        this.$message.warning('数据校验失败!')
        return
      }
      // 触发表单验证
      this.$refs.form.validate(valid => {
        if (valid) {
          let tableData = that.$refs.editableDetailTable.getTableData()
          let removeData = that.$refs.editableDetailTable.getDeleteData()
          that.model.tableDetailList = [...tableData]
          that.model.removeDetailList = [...removeData]
          that.confirmLoading = true
          let httpurl = ''
          let method = ''
          if (!this.model.id) {
            httpurl += this.url.add
            method = 'post'
          } else {
            httpurl += this.url.edit
            method = 'put'
          }
          this.model.standardId=this.standardId
          httpAction(httpurl, this.model, method).then((res) => {
            if (res.success) {
              that.$message.success(res.message)
              that.$emit('ok')
              that.close()
            } else {
              that.$message.warning(res.message)
    data() {
      return {
        title: '操作',
        visible: false,
        model: {},
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 }
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 15 }
        },
        confirmLoading: false,
        spinning: false,
        disabled: false,
        validatorRules: {
          // standardName: [
          //   { required: true, message: '请输入标准名称!' }
          // ],
          inspectionDate: [
            { required: true, message: '请选择点检日期!' }
          ],
          // maintenancePeriod: [
          //   { required: true, message: '请输入保养周期,单位:天!' }
          // ],
          equipmentId: [
            { required: true, message: '请选择设备!' }
          ]
        },
        url: {
          add: '/eam/eamInspectionOrder/add',
          edit: '/eam/eamInspectionOrder/edit',
          detail: '/eam/eamMaintenanceStandardDetail/queryList',
          detailOrder: '/eam/eamInspectionOrderDetail/queryList',
          userSelect: '/eam/user_select/list'
        },
        maintenanceCategory: 'POINT_INSPECTION',
        maintenanceOperatorOptions: [],
        standardId: '',
        standardType: false,
        detail: {
          loading: false,
          dataSource: [],
          columns: [
            {
              title: '序号',
              key: 'itemCode',
              type: JVXETypes.inputNumber,
              width: '10%',
              align: 'center',
              validateRules: [
                { required: true, unique: true, message: '序号不能重复' }
              ]
            },
            {
              title: '保养项',
              key: 'itemName',
              type: JVXETypes.textarea,
              width: '20%',
              align: 'center',
              validateRules: [
                { required: true, message: '保养项不能为空!' }
              ]
            },
            {
              title: '保养要求',
              key: 'itemDemand',
              type: JVXETypes.textarea,
              width: '30%',
              align: 'center',
              validateRules: [
                { required: true, message: '保养要求不能为空!' }
              ]
            }
          }).finally(() => {
            that.confirmLoading = false
          })
        } else {
          return false
          ]
        }
      })
    },
    handleCancel() {
      this.close()
    },
    autocompleteForm(selectObj) {
      this.model.standardName = selectObj.standardName
      this.model.maintenancePeriod=selectObj.maintenancePeriod
      this.model.standardCode=selectObj.standardCode
      if (!this.standardType) {
        this.standardId=selectObj.id
        this.loadDetail(selectObj.id)
      }
    },
    expirationTimeFrom(date) {
      //过期时间是初始时间+保养周期
      if (date && this.model.maintenancePeriod) {
        // 转换为时间戳字符串(或指定格式)
        this.model.expirationTime = moment(date)
          .add(this.model.maintenancePeriod, 'days')
          .format('YYYY-MM-DD')
      } else {
        this.model.expirationTime = null; // 清空无效值
      }
    created() {
    },
    //加载详情数据
    loadDetail(standardId) {
      if (standardId) {
        getAction(this.url.detail, { standardId: standardId }).then(res => {
          if (res.success) {
            this.detail.dataSource = [...res.result]
            this.standardType=false;
    methods: {
      add() {
        this.model = {}
        this.detail.dataSource = []
        this.visible = true
        this.disabled = false
        this.standardType = false
      },
      edit(record) {
        this.model = Object.assign({}, record)
        this.standardId = record.standardId
        this.disabled = true
        this.standardType = true
        this.visible = true
        this.detail.dataSource = []
        if (record && record.referenceFile) {
          let obj = JSON.parse(record.referenceFile)
          this.model.fileList = [obj]
        } else {
          this.model.fieldList = []
        }
        this.loadDetailOrder(record.id)
      },
      async handleOk() {
        const that = this
        let errMap = await that.$refs.editableDetailTable.validateTable()
        if (errMap) {
          this.$message.warning('数据校验失败!')
          return
        }
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            let tableData = that.$refs.editableDetailTable.getTableData()
            let removeData = that.$refs.editableDetailTable.getDeleteData()
            that.model.tableDetailList = [...tableData]
            that.model.removeDetailList = [...removeData]
            that.confirmLoading = that.spinning = true
            let httpurl = ''
            let method = ''
            if (!this.model.id) {
              httpurl += this.url.add
              method = 'post'
            } else {
              httpurl += this.url.edit
              method = 'put'
            }
            this.model.standardId = this.standardId
            httpAction(httpurl, this.model, method).then((res) => {
              if (res.success) {
                that.$message.success(res.message)
                that.$emit('ok')
                that.close()
              } else {
                that.$message.warning(res.message)
              }
            }).finally(() => {
              that.confirmLoading = that.spinning = false
            })
          } else {
            return false
          }
        })
      }
    },
    loadDetailOrder(orderId){
      if (orderId) {
        getAction(this.url.detailOrder, { orderId: orderId }).then(res => {
          if (res.success) {
            this.detail.dataSource = [...res.result]
          }
        })
      },
      autocompleteForm(selectObj) {
        this.model.standardName = selectObj.standardName
        this.model.maintenancePeriod = selectObj.maintenancePeriod
        this.model.standardCode = selectObj.standardCode
        // 若取消设备选择后保养周期为空则需清空点检日期和点检过期时间
        if (!this.model.equipmentId) {
          delete this.model.inspectionDate
          delete this.model.expirationTime
        } else {
          // 如果点检日期存在,则在重新选择设备后即保养周期可能发生改变后重新计算过期时间
          if (this.model.inspectionDate) this.expirationTimeFrom(this.model.inspectionDate)
        }
        if (!this.standardType) {
          console.log('this.standardType', this.standardType)
          this.standardId = selectObj.id
          this.loadDetail(selectObj.id)
        }
        this.$nextTick(() => this.loadMaintenanceOperatorList(this.model.equipmentId))
      },
      expirationTimeFrom(date) {
        //过期时间是初始时间+保养周期
        if (date && this.model.maintenancePeriod) {
          // 转换为时间戳字符串(或指定格式)
          this.model.expirationTime = moment(date)
            .add(this.model.maintenancePeriod, 'days')
            .format('YYYY-MM-DD')
        } else {
          this.model.expirationTime = null // 清空无效值
        }
      },
      //加载详情数据
      loadDetail(standardId) {
        this.detail.dataSource = []
        if (standardId) {
          console.log('standardId', standardId)
          this.spinning = true
          getAction(this.url.detail, { standardId: standardId })
            .then(res => {
              if (res.success) {
                this.detail.dataSource = [...res.result]
              }
            })
            .finally(() => {
              this.spinning = false
            })
        }
      },
      loadDetailOrder(orderId) {
        if (orderId) {
          this.spinning = true
          getAction(this.url.detailOrder, { orderId: orderId })
            .then(res => {
              if (res.success) {
                this.detail.dataSource = [...res.result]
              }
            })
            .finally(() => {
              this.spinning = false
            })
        }
      },
      loadMaintenanceOperatorList(equipmentId) {
        this.maintenanceOperatorOptions = []
        let params = { positionCode: 'PCR0001' }
        if (equipmentId) {
          params.equipmentId = equipmentId
        } else {
          delete this.model.operator
          return
        }
        const that = this
        getAction(this.url.userSelect, params)
          .then(res => {
            if (res.success) {
              that.maintenanceOperatorOptions = res.result.map(item => ({
                key: item.id,
                value: item.username,
                text: item.realname
              }))
              if (!that.maintenanceOperatorOptions.find(item => item.value === that.model.operator)) delete that.model.operator
            } else {
              if (that.model.operator) delete that.model.operator
            }
          })
          .catch(err => {
            if (that.model.operator) delete that.model.operator
          })
      },
      handleCancel() {
        this.close()
      },
      close() {
        this.$emit('close')
        this.visible = false
        this.$refs.form.clearValidate()
      }
    }
  }
}
</script>
<style lang="less" scoped>