420项目： 1、大屏车间管理页面新增及编辑时随意输入车间名称调整为选择已有车间 2、增加车间看板拖拽及缩放功能权限功能 3、实现车间看板设备状态数量...

zhaowei

2025-03-04 be590d48f66806716c990bdce18d0ed90bf18797

 src/views/system/modules/WorkshopModal.vue

@@ -12,14 +12,19 @@

    <a-spin :spinning="confirmLoading">
      <a-form-model ref="form" v-bind="layout" :model="model" :rules="validatorRules">
        <a-form-model-item label="车间名称" required prop="workshopName">
          <a-input v-model="model.workshopName" placeholder="请输入车间名称"/>
        <a-form-model-item label="车间名称" required prop="productionId">
          <!--<a-input v-model="model.workshopName" placeholder="请输入车间名称"/>-->
          <a-select v-model="model.productionId" placeholder="请选择车间" @change="handleSelectChange">
            <a-select-option v-for="item in workshopList" :key="item.id">
              {{item.productionName}}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="车间背景图" required prop="backgroundImage">
          <j-image-upload class="avatar-uploader" text="上传" v-model="model.backgroundImage"></j-image-upload>
        </a-form-model-item>
        <!--<a-form-model-item label="设备编号颜色">-->
          <!--<a-input type="color" v-model="model.equipmentIdColor"></a-input>-->
        <!--<a-input type="color" v-model="model.equipmentIdColor"></a-input>-->
        <!--</a-form-model-item>-->
        <a-form-model-item label="授权标识">
          <a-input placeholder="请输入授权标识" v-model="model.perms"/>
@@ -30,11 +35,16 @@
</template>

<script>
  import api from '@/api/mdc'
  import signageApi from '@/api/signage'

  export default {
    name: 'WorkshopModal',
    components: {},
    props: {
      workshopList: {
        type: Array
      }
    },
    data() {
      return {
        title: '操作',
@@ -47,15 +57,7 @@
        },
        confirmLoading: false,
        validatorRules: {
          workshopName: [
            { required: true, message: '请输入车间名称!' },
            { min: 2, max: 30, message: '长度在 2 到 30 个字符', trigger: 'blur' }
          ],
          id: [
            { required: true, message: '请输入车间编号!' },
            { min: 0, max: 64, message: '长度不超过 64 个字符', trigger: 'blur' },
            { validator: this.validateRoleCode }
          ],
          workshopName: [{ required: true, message: '请选择车间!' }],
          backgroundImage: [
            { required: true, message: '请上传车间背景图!' }
          ]
@@ -80,10 +82,9 @@
          this.isEdit = false
        }
      },
      close() {
        this.$refs.form.clearValidate()
        this.$emit('close')
        this.visible = false
      handleSelectChange(value) {
        const workshopItem = this.workshopList.find(item => item.id === value)
        this.model.workshopName = workshopItem.productionName
      },
      handleOk() {
        const that = this
@@ -95,23 +96,23 @@
            let obj
            if (!this.isEdit) {
              console.log('触发新增')
              obj = api.addWorkshopApi(this.model)
              obj = signageApi.addWorkshopApi(this.model)
            } else {
              console.log('触发修改')
              obj = api.editWorkshopApi(this.model)
              obj = signageApi.editWorkshopApi(this.model)
            }
            obj.then((res) => {
              if (res.success) {
                that.$notification.success({
                  message:'消息',
                  description:res.message
                });
                  message: '消息',
                  description: res.message
                })
                that.$emit('ok')
              } else {
                that.$notification.warning({
                  message:'消息',
                  description:res.message
                });
                  message: '消息',
                  description: res.message
                })
              }
            }).finally(() => {
              that.confirmLoading = false
@@ -125,12 +126,10 @@
      handleCancel() {
        this.close()
      },
      validateRoleCode(rule, value, callback) {
        if (/[\u4E00-\u9FA5]/g.test(value)) {
          callback('车间编号不可输入汉字!')
        } else {
          callback()
        }
      close() {
        this.$refs.form.clearValidate()
        this.$emit('close')
        this.visible = false
      }
    }
  }