1、调整设备台账铭牌二维码大小 2、待机停机页面功能开发

zhaowei

2025-04-25 d2547913ef2e150d8bb18bc8f7423515c7ed71d0

 src/views/mdc/base/modules/EquipmentStandbyShutDown/EquipmentStandbyShutdownModal.vue

@@ -1,9 +1,18 @@
<template>
  <a-modal :title="title" :width="500" :visible="visible" :confirmLoading="confirmLoading" @ok="handleOk"
           @cancel="handleCancel" cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <a-form-model ref="form" :form="form" :model="model" :rules="validatorRules" :labelCol="labelColLong"
    <a-spin :spinning="spinning">
      <a-form-model ref="form" :model="model" :rules="validatorRules" :labelCol="labelColLong"
                    :wrapperCol="wrapperColLong">
        <a-row :gutter="24">
          <a-col :span="24">
            <a-form-model-item label="设备组" prop="equipmentIds">
              <a-input-search readOnly v-model="model.equipmentIds" @search="deviceSearch" enter-button
                              placeholder="请选择设备"/>
            </a-form-model-item>
          </a-col>
        </a-row>

        <a-row :gutter="24">
          <a-col :span="24">
            <a-form-model-item label="停机类型" prop="downtimeType">
@@ -14,6 +23,7 @@
              </a-radio-group>
            </a-form-model-item>
          </a-col>

        </a-row>

        <a-row :gutter="24">
@@ -30,6 +40,38 @@

        <a-row :gutter="24">
          <a-col :span="24">
            <a-form-model-item label="停机日期" prop="theDate">
              <a-date-picker v-model="model.theDate" placeholder="请选择停机日期" value-format="YYYY-MM-DD"
                             style="width: 100%"/>
            </a-form-model-item>
          </a-col>

        </a-row>

        <a-row :gutter="24">
          <a-col :span="24">
            <a-form-model-item label="停机时长(min)" prop="downLong">
              <a-input-number v-model="model.downLong" :min="1" :step="1" :precision="0" placeholder="请输入停机时长(min)"
                              style="width: 100%"/>
            </a-form-model-item>
          </a-col>
        </a-row>

        <!--<a-row :gutter="24">-->
        <!--<a-col :span="12">-->
        <!--<a-form-model-item label="开始时间" prop="startTime">-->
        <!--<a-time-picker v-model="model.startTime" value-format="HH:mm:ss" style="width: 100%"/>-->
        <!--</a-form-model-item>-->
        <!--</a-col>-->
        <!--<a-col :span="12">-->
        <!--<a-form-model-item label="结束时间" prop="endTime">-->
        <!--<a-time-picker v-model="model.endTime" value-format="HH:mm:ss" style="width: 100%"/>-->
        <!--</a-form-model-item>-->
        <!--</a-col>-->
        <!--</a-row>-->

        <a-row :gutter="24">
          <a-col :span="24">
            <a-form-model-item label="备注">
              <a-textarea v-model="model.remark" placeholder="请输入备注"/>
            </a-form-model-item>
@@ -37,59 +79,68 @@
        </a-row>
      </a-form-model>
    </a-spin>

    <select-device-drawer ref="selectDeviceDrawer" @selectFinished="selectOK" :title="'选择设备'"/>
  </a-modal>
</template>

<script>
import { getAction, postAction } from '@api/manage'
  import SelectDeviceDrawer from '../../../../system/modules/SelectDeviceDrawer'

export default {
  name: 'EquipmentStandbyShutdownModal',
  components: {},
    components: { SelectDeviceDrawer },
  props: {},
  data() {
    return {
      title: '',
      visible: false,
      model: {},
        equipmentList: [],
      downtimeDescriptionList: [],
      labelColLong: {
        xs: {
          span: 24
        },
        sm: {
          span: 5
        }
          xs: { span: 24 },
          sm: { span: 6 }
      },
      wrapperColLong: {
        xs: {
          span: 24
        },
        sm: {
          span: 17
        }
          xs: { span: 24 },
          sm: { span: 16 }
      },
      confirmLoading: false,
      form: this.$form.createForm(this),
        spinning: false,
        disableSelectDevice: false,
      validatorRules: {
          equipmentIds: [
            { required: true, message: '请选择设备', trigger: 'change' }
          ],
        downtimeType: [
          {
            required: true, message: '请选择停机类型'
          }
            { required: true, message: '请选择停机类型' }
        ],
        reasonId: [
          {
            required: true, message: '请选择停机原因'
          }
            { required: true, message: '请选择停机原因' }
          ],
          theDate: [
            { required: true, message: '请选择停机日期' }
          ],
          downLong: [
            { required: true, message: '请输入停机时长(min)' }
        ]
      },
      url: {
          add: '/mdc/mdcDowntime/add',
        edit: '/mdc/mdcDowntime/edit',
        getDowntimeDescriptionListByDowntimeType: '/mdc/mdcDowntimeReason/downtimeReasonList'
      }
    }
  },
  methods: {
      add() {
        this.edit({
          downtimeType: 0
        })
      },

    edit(record) {
      this.model = Object.assign({}, record)
      this.getDowntimeDescriptionListByApi()
@@ -111,26 +162,37 @@
    getDowntimeDescriptionListByApi() {
      const that = this
      this.downtimeDescriptionList = []
        this.spinning = true
      getAction(this.url.getDowntimeDescriptionListByDowntimeType, { downtimeType: this.model.downtimeType })
        .then(res => {
          if (res.success) that.downtimeDescriptionList = res.result
          })
          .finally(() => {
            that.spinning = false
        })
    },

    handleOk() {
      const that = this
      // 触发表单验证
        console.log('model', this.model)
      this.$refs.form.validate(valid => {
        if (valid) {
          that.confirmLoading = true
          postAction(this.url.edit, that.model)
            that.confirmLoading = that.spinning = true
            let url
            if (!that.model.id) {
              url = that.url.add
            } else {
              url = that.url.edit
            }
            postAction(url, that.model)
            .then((res) => {
              if (res.success) {
                that.$notification.success({
                  message: '消息',
                  description: res.message
                })
                that.$emit('ok', res.result)
                  that.$emit('ok')
                that.handleCancel()
              } else {
                that.$notification.warning({
@@ -140,7 +202,7 @@
              }
            })
            .finally(() => {
              that.confirmLoading = false
                that.confirmLoading = that.spinning = false
            })
        } else {
          return false
@@ -148,6 +210,22 @@
      })
    },

      deviceSearch() {
        this.$refs.selectDeviceDrawer.visible = true
        this.$refs.selectDeviceDrawer.selectedRowKeys = []
        this.$refs.selectDeviceDrawer.selectedRows = []
        this.$refs.selectDeviceDrawer.checkedKeys = this.model.equipmentIds ? this.model.equipmentIds.split(',') : []
      },

      /**
       * 选择已有设备后点击确定时触发
       * @param data 已选择的设备
       */
      selectOK(data) {
        this.$set(this.model, 'equipmentIds', data.join(','))
        if (this.model.equipmentIds) this.$refs.form.clearValidate('equipmentIds')
      },

    handleCancel() {
      this.visible = false
      this.removeValidate()