代码格式化

zhuzhuanzhuan

2023-10-17 9c7c650b39036fda47486101575a010a59dbcca5

代码格式化

 src/views/WorkshopSignage.vue

@@ -6,19 +6,27 @@
        <a-space>
          <span v-if="!isSwitchChecked">开启功能</span>
          <span v-else>关闭功能</span>
          <a-switch checked-children="开" un-checked-children="关" @change="handleSwitchChange"
                    v-model="isSwitchChecked" :disabled="isSwitchChecked"/>
          <a-switch
            checked-children="开"
            un-checked-children="关"
            @change="handleSwitchChange"
            v-model="isSwitchChecked"
            :disabled="isSwitchChecked"
          />
        </a-space>
        <a-button type="primary" icon="save" size="large" @click="saveDevicePositionAndSizeByApi"
        >保存位置
        </a-button>
        <a-button type="primary" icon="save" size="large" @click="saveDevicePositionAndSizeByApi">保存位置 </a-button>
      </div>
    </header>

    <dv-border-box-8>
      <div class="content-container" ref="deviceContainerRef">
        <VueDragResize v-for="(item,index) in deviceList" :key="item.equipmentId" :w="item.vw"
                       :h="item.vh" :x="item.coordinateLeft" :y="item.coordinateTop"
        <VueDragResize
          v-for="(item, index) in deviceList"
          :key="item.equipmentId"
          :w="item.vw"
          :h="item.vh"
          :x="item.coordinateLeft"
          :y="item.coordinateTop"
                       v-on:resizing="resize($event,index)"
                       v-on:dragging="resize($event,index)"
                       :parentLimitation="true"
@@ -28,20 +36,32 @@
                       :isResizable="isResizable"
                       :stickSize="6"
        >
          <div class="single-device"
               :style="{width:  item.vw+ 'px',height:item.vh+'px'}">
          <div class="single-device" :style="{ width: item.vw + 'px', height: item.vh + 'px' }">
            <div class="device-status">
              <div v-if="item.equipmentStatus==2||item.equipmentStatus==1"
                   :style="{backgroundImage:`url(${require('@/assets/yellow.png')})`}" class="status-image"></div>
              <div v-if="item.equipmentStatus==22" :style="{backgroundImage:`url(${require('@/assets/red.png')})`}"
                   class="status-image"></div>
              <div v-if="item.equipmentStatus==0" :style="{backgroundImage:`url(${require('@/assets/gray.png')})`}"
                   class="status-image"></div>
              <div v-if="item.equipmentStatus==3" :style="{backgroundImage:`url(${require('@/assets/green.png')})`}"
                   class="status-image"></div>
              <div
                v-if="item.equipmentStatus == 2 || item.equipmentStatus == 1"
                :style="{ backgroundImage: `url(${require('@/assets/yellow.png')})` }"
                class="status-image"
              ></div>
              <div
                v-if="item.equipmentStatus == 22"
                :style="{ backgroundImage: `url(${require('@/assets/red.png')})` }"
                class="status-image"
              ></div>
              <div
                v-if="item.equipmentStatus == 0"
                :style="{ backgroundImage: `url(${require('@/assets/gray.png')})` }"
                class="status-image"
              ></div>
              <div
                v-if="item.equipmentStatus == 3"
                :style="{ backgroundImage: `url(${require('@/assets/green.png')})` }"
                class="status-image"
              ></div>
              <div
                :style="{backgroundImage:`url(${getImgView(item.equipmentImage)||require('@/assets/8.png')})`}"
                class="device-image"></div>
                class="device-image"
              ></div>
            </div>
            <div class="device-id" :style="{fontSize: item.fontSize+'px'}">
              {{item.equipmentId}}
@@ -67,7 +87,7 @@

  export default {
    components: {
      VueDragResize
    VueDragResize,
    },
    data() {
      return {
@@ -92,24 +112,24 @@
          {
            label: '关机',
            value: 0,
            color: '#A8A8A8'
          color: '#A8A8A8',
          },
          {
            label: '待机',
            value: 2,
            color: '#FFFF00'
          color: '#FFFF00',
          },
          {
            label: '运行',
            value: 3,
            color: '#00EE00'
          color: '#00EE00',
          },
          {
            label: '报警',
            value: 22,
            color: '#FF0000'
          }
        ] // 设备状态指示灯列表
          color: '#FF0000',
        },
      ], // 设备状态指示灯列表
      }
    },
    watch: {
@@ -126,8 +146,8 @@
            this.timingAcquisition = null
          }
        },
        immediate: true
      }
      immediate: true,
    },
    },
    methods: {
      /**
@@ -136,7 +156,7 @@
       */
      getDeviceListByApi(id) {
        console.log('重新刷新')
        api.getDeviceListInWorkshopSignagePageApi(id).then(res => {
      api.getDeviceListInWorkshopSignagePageApi(id).then((res) => {
          if (res.result && res.result.length > 0) {
            this.deviceList = res.result
          }
@@ -148,9 +168,11 @@
       * @param id 车间Id
       */
      getWorkshopDetailsByApi(id) {
        api.getWorkshopDetailByWorkshopIdApi(id).then(res => {
      api.getWorkshopDetailByWorkshopIdApi(id).then((res) => {
          this.workshopDetails = res.result
          this.$refs.deviceContainerRef.style.backgroundImage = `url(${this.getImgView(this.workshopDetails.backgroundImage)})`
        this.$refs.deviceContainerRef.style.backgroundImage = `url(${this.getImgView(
          this.workshopDetails.backgroundImage
        )})`
        })
      },

@@ -171,11 +193,11 @@
      saveDevicePositionAndSizeByApi() {
        console.log('触发保存')
        if (this.isOperatingDevice) {
          api.saveDevicePositionAndSizeApi(this.deviceList).then(res => {
        api.saveDevicePositionAndSizeApi(this.deviceList).then((res) => {
            if (res.code === 200) {
              this.$notification.success({
                message: '消息',
                description: res.message
              description: res.message,
              })
              this.isOperatingDevice = false
              if (this.isSwitchChecked) {
@@ -189,10 +211,9 @@
        } else {
          this.$notification.warning({
            message: '消息',
            description: '请开启功能后再进行保存'
          description: '请开启功能后再进行保存',
          })
        }

      },

      /**
@@ -222,7 +243,7 @@
       * @returns {number} 设备数量
       */
      getDeviceNumberByStatus(value) {
        return this.deviceList.filter(item => item.equipmentStatus === value).length
      return this.deviceList.filter((item) => item.equipmentStatus === value).length
      },

      /**
@@ -233,7 +254,7 @@
        this.isOperatingDevice = true
        this.isResizable = !this.isResizable
        this.isDraggable = !this.isDraggable
      }
    },
    },
    created() {
      if (this.$route.params.id) {
@@ -249,7 +270,7 @@
      // 确保销毁定时器及回收资源
      clearInterval(this.timingAcquisition)
      this.timingAcquisition = null
    }
  },
  }
</script>

@@ -343,7 +364,6 @@
          }
        }
      }

    }
  }
</style>

 src/views/system/WorkshopSignageManagement.vue

@@ -12,7 +12,7 @@
                  <a-input placeholder="" v-model="queryParam.workshopName"></a-input>
                </a-form-item>
              </a-col>
              <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
            <a-col :md="12" :sm="24">
               <a-button type="primary" @click="searchQuery" icon="search" style="margin-left: 21px">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
@@ -26,9 +26,11 @@
          <a-button @click="handleAdd" type="primary" icon="plus">新建车间</a-button>
        </div>

        <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
          <i class="anticon anticon-info-circle ant-alert-icon">
          </i> 已选择 <a><b>{{ selectedRowKeys1.length }}</b></a>项
        <div class="ant-alert ant-alert-info" style="margin-bottom: 16px">
          <i class="anticon anticon-info-circle ant-alert-icon"> </i> 已选择
          <a
            ><b>{{ selectedRowKeys1.length }}</b></a
          >项
          <a style="margin-left: 24px" @click="onClearSelected1">清空</a>
        </div>

@@ -44,17 +46,16 @@
            :pagination="ipagination"
            :loading="loading"
            :rowSelection="{selectedRowKeys: selectedRowKeys1, onChange: onSelectChange1, type:'radio'}"
            @change="handleTableChange">
            @change="handleTableChange"
          >
            <template slot="backgroundImage" slot-scope="text,record">
              <img :src="getImgView(record.backgroundImage)" width="50" height="50">
              <img :src="getImgView(record.backgroundImage)" width="50" height="50" />
            </template>
            <span slot="action" slot-scope="text, record">
            <a @click="handleOpen(record)">车间</a>
              <a @click="handleOpen(record)">设备</a>
            <a-divider type="vertical"/>
            <a-dropdown>
              <a class="ant-dropdown-link">
                更多 <a-icon type="down"/>
              </a>
                <a class="ant-dropdown-link"> 更多 <a-icon type="down" /> </a>
              <a-menu slot="overlay">
                <a-menu-item>
                  <a @click="handleEdit(record)">编辑</a>
@@ -73,24 +74,22 @@
    </a-col>
    <a-col :md="rightColMd" :sm="24" v-if="this.rightcolval == 1">
      <a-card :bordered="false">
        <div style="text-align: right;">
        <div style="text-align: right">
          <a-icon type="close-circle" @click="hideUserList"/>
        </div>
        <!-- 查询区域 -->
        <div class="table-page-search-wrapper">
          <a-form layout="inline">
            <a-row :gutter="24">

              <a-col :md="12" :sm="12">
                <a-form-item label="设备编码">
                  <a-input placeholder="" v-model="queryParam2.equipmentId"></a-input>
                </a-form-item>
              </a-col>
              <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
            <a-col :md="9" :sm="24">
             <a-button type="primary" @click="searchQuery2" icon="search" style="margin-left: 21px">查询</a-button>
              <a-button type="primary" @click="searchReset2" icon="reload" style="margin-left: 8px">重置</a-button>

            </a-col>
          </span>
            </a-row>
@@ -98,7 +97,8 @@
        </div>
        <!-- 操作按钮区域 -->
        <div class="table-operator" :md="24" :sm="24">
          <a-button @click="handleAddDeviceInWorkshop" type="primary" icon="plus" style="margin-top: 16px">已有设备
          <a-button @click="handleAddDeviceInWorkshop" type="primary" icon="plus" style="margin-top: 16px"
            >已有设备
          </a-button>

          <a-dropdown v-if="selectedRowKeys2.length > 0">
@@ -108,16 +108,18 @@
                删除
              </a-menu-item>
            </a-menu>
            <a-button style="margin-left: 8px"> 批量操作
            <a-button style="margin-left: 8px">
              批量操作
              <a-icon type="down"/>
            </a-button>
          </a-dropdown>
        </div>
        <!-- table区域-begin -->
        <div>
          <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
            <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{
            selectedRowKeys2.length }}</a>项
          <div class="ant-alert ant-alert-info" style="margin-bottom: 16px">
            <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择
            <a style="font-weight: 600">{{ selectedRowKeys2.length }}</a
            >项
            <a style="margin-left: 24px" @click="onClearSelected2">清空</a>
          </div>
          <a-table
@@ -131,7 +133,8 @@
            :pagination="ipagination2"
            :loading="loading2"
            :rowSelection="{selectedRowKeys: selectedRowKeys2, onChange: onSelectChange2}"
            @change="handleTableChange2">
            @change="handleTableChange2"
          >
            <span slot="action" slot-scope="text, record">
          <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete2(record.equipmentId)">
                  <a>删除</a>
@@ -142,8 +145,10 @@
      </a-card>
    </a-col>
    <!-- 表单区域 -->
    <workshop-modal ref="modalForm" @ok="modalFormOk"></workshop-modal> <!--新增车间-->
    <select-device-modal ref="selectUserModal" @selectFinished="selectOK"></select-device-modal> <!--已有设备-->
    <workshop-modal ref="modalForm" @ok="modalFormOk"></workshop-modal>
    <!--新增车间-->
    <select-device-modal ref="selectUserModal" @selectFinished="selectOK"></select-device-modal>
    <!--已有设备-->
  </a-row>
</template>
<script>
@@ -160,7 +165,7 @@
    components: {
      SelectDeviceModal,
      WorkshopModal,
      moment
    moment,
    },
    data() {
      return {
@@ -181,7 +186,7 @@
          },
          showQuickJumper: true,
          showSizeChanger: true,
          total: 0
        total: 0,
        },
        ipagination2: {
          current: 1,
@@ -192,15 +197,15 @@
          },
          showQuickJumper: true,
          showSizeChanger: true,
          total: 0
        total: 0,
        },
        isorter1: {
          column: 'createTime',
          order: 'desc'
        order: 'desc',
        },
        isorter2: {
          column: 'createTime',
          order: 'desc'
        order: 'desc',
        },
        filters1: {},
        filters2: {},
@@ -216,39 +221,39 @@
          {
            title: '车间名称',
            align: 'center',
            dataIndex: 'workshopName'
          dataIndex: 'workshopName',
          },
          {
            title: '车间背景图',
            dataIndex: 'backgroundImage',
            align: 'center',
            scopedSlots: { customRender: 'backgroundImage' }
          scopedSlots: { customRender: 'backgroundImage' },
          },
          {
            title: '操作',
            dataIndex: 'action',
            align: 'center',
            scopedSlots: { customRender: 'action' }
          }
          scopedSlots: { customRender: 'action' },
        },
        ],
        columns2: [
          {
            title: '设备编码',
            align: 'center',
            dataIndex: 'equipmentId',
            width: 120
          width: 120,
          },
          {
            title: '设备名称',
            align: 'center',
            width: 100,
            dataIndex: 'equipmentName'
          dataIndex: 'equipmentName',
          },
          {
            title: '设备类型',
            align: 'center',
            width: 80,
            dataIndex: 'equipmentType'
          dataIndex: 'equipmentType',
          },

          {
@@ -256,8 +261,9 @@
            dataIndex: 'action',
            scopedSlots: { customRender: 'action' },
            align: 'center',
            width: 120
          }],
          width: 120,
        },
      ],
        // 高级查询参数
        superQueryParams2: '',
        // 高级查询拼接条件
@@ -268,8 +274,8 @@
          list2: '/mdc/mdcWorkshopInfo/workshopEquipmentList',
          addDeviceInWorkshop: '/mdc/mdcWorkshopInfo/addWorkshopEquipment',
          delete2: '/mdc/mdcWorkshopInfo/deleteWorkshopEquipment',
          deleteBatch2: '/mdc/mdcWorkshopInfo/deleteWorkshopEquipmentBatch'
        }
        deleteBatch2: '/mdc/mdcWorkshopInfo/deleteWorkshopEquipmentBatch',
      },
      }
    },
    computed: {
@@ -278,7 +284,7 @@
      },
      rightColMd() {
        return this.selectedRowKeys1.length === 0 ? 0 : 12
      }
    },
    },
    methods: {
      onSelectChange2(selectedRowKeys, selectionRows) {
@@ -385,7 +391,7 @@
          // this.$message.warning('请选择一条记录！')
          this.$notification.warning({
            message: '消息',
            description: '请选择一条记录'
          description: '请选择一条记录',
          })
          return
        } else {
@@ -400,7 +406,7 @@
            onOk: function() {
              deleteAction(that.url.deleteBatch2, {
                workshopId: that.currentWorkshopId,
                equipmentIds: ids
              equipmentIds: ids,
              }).then((res) => {
                if (res.success) {
                  that.$message.success(res.message)
@@ -410,7 +416,7 @@
                  that.$message.warning(res.message)
                }
              })
            }
          },
          })
        }
      },
@@ -483,13 +489,13 @@
      hideUserList() {
        //this.rightcolval = 0
        this.selectedRowKeys1 = []
      }
    }
    },
  },
  }
</script>
<style scoped>
  /** Button按钮间距 */
  .ant-btn {
    margin-left: 8px
  margin-left: 8px;
  }
</style>