1、优化车间看板四色灯状态展示以及限制拖拽区域 2、部分页面右侧区域元素位置离顶过高，调整布局 3、增加设备日志页面增加点击表格行数据展示当前行工作曲...

zhuzhuanzhuan

2023-10-08 b70dab217e5ebcab6d98196cc2d4b2ffb842c3a1

1、优化车间看板四色灯状态展示以及限制拖拽区域
2、部分页面右侧区域元素位置离顶过高，调整布局
3、增加设备日志页面增加点击表格行数据展示当前行工作曲线功能
4、优化设备日志页面切换时间，工作曲线弹窗中的时间随之切换
5、优化设备日志页面加载后首次点击工作曲线后无法查询到数据问题（同时发送异步请求，先后顺序影响）

 src/config/router.config.js

@@ -12,7 +12,6 @@
    meta: { title: '首页' },
    redirect: '/dashboard/analysis',
    children: [

      // // dashboard
      // {
      //   path: '/dashboard',
@@ -373,8 +372,8 @@
    ]
  },
  {
    path:'/testWorkshop',
    component:()=>import('@/views/TestWorkshop.vue')
    path:'/workshopSignage/:workshopId',
    component:()=>import('@/views/WorkshopSignage.vue')
  },
  {
    path: '/404',

 src/views/TestWorkshop.vue

ÎļþÒÑɾ³ý

 src/views/WorkshopSignage.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,243 @@
<template>
  <dv-full-screen-container class="full-screen-container">
    <header class="page-header">
      {{getWorkshopName}}
      <div class="header-right">
        <a-button type="primary" icon="save" size="large" @click="saveDevicePositionByApi">保存位置</a-button>
      </div>
    </header>

    <dv-border-box-8 class="content-container">
      <div v-for="item in deviceList" :key="item.equipmentId" class="single-device"
           :style="{top:item.top+'px',left:item.left+'px',height:'135px',width:'175px'}" @mousedown="handleMouseDown"
           :id="item.equipmentId">
        <div class="device-status">
          <img v-if="item.status==0" src="@/assets/yellow.png" draggable="false">
          <img v-if="item.status==1" src="@/assets/red.png" draggable="false">
          <img v-if="item.status==2" src="@/assets/gray.png" draggable="false">
          <img v-if="item.status==3" src="@/assets/green.png" draggable="false">
          <img :src="item.equipmentImageUrl" draggable="false">
        </div>
        <div class="device-id">{{item.equipmentId}}</div>
        <!--<div draggable="false" class="device-info">-->
        <!--<div v-if="item.status==0" class="status-square" style="background-color: gray"></div>-->
        <!--<div v-if="item.status==1" class="status-square" style="background-color: red"></div>-->
        <!--<div v-if="item.status==2" class="status-square" style="background-color: green"></div>-->
        <!--<div v-if="item.status==3" class="status-square" style="background-color: yellow"></div>-->
        <!--<div class="device-id">{{item.equipmentId}}</div>-->
        <!--</div>-->
      </div>
      <!--<div style="width: 175px;height: 135px;background-color: red;position: absolute;top: 200px;left: 100px"></div>-->
    </dv-border-box-8>
  </dv-full-screen-container>
</template>

<script>
  export default {
    data() {
      return {
        mouseX: 0, // é¼ æ ‡åœ¨å…ƒç´ å†…çš„X坐标
        mouseY: 0, // é¼ æ ‡åœ¨å…ƒç´ å†…çš„Y坐标,
        dragging: false, //是否在拖拽中
        left: 0, // å…ƒç´ å·¦ä¸Šè§’距离父容器左侧的距离
        top: 0, // å…ƒç´ å·¦ä¸Šè§’距离父容器顶部的距离,
        elementId: '',// è¢«æ‹–拽元素的id属性值
        elementWidth: '',
        elementHeight: '',
        deviceList: [
          {
            equipmentId: '123213213123232',
            equipmentImageUrl: require('@/assets/8.png'),
            top: 200,
            left: 100,
            status: 1
          },
          {
            equipmentId: '512346789561232',
            equipmentImageUrl: require('@/assets/8.png'),
            top: 500,
            left: 753,
            status: 0
          },
          {
            equipmentId: '64746965647653',
            equipmentImageUrl: require('@/assets/8.png'),
            top: 300,
            left: 860,
            status: 2
          },
          {
            equipmentId: '33548976965462',
            equipmentImageUrl: require('@/assets/8.png'),
            top: 100,
            left: 380,
            status: 3
          },
          {
            equipmentId: '85484913549253',
            equipmentImageUrl: require('@/assets/8.png'),
            top: 200,
            left: 1500,
            status: 2
          }
        ]
      }
    },
    computed: {
      getWorkshopName() {
        switch (this.$route.params.workshopId) {
          case '5321':
            return '长沙车间'
          case '6312':
            return '天津车间'
          case '3463':
            return '武汉车间'
          case '8421':
            return '北京车间'
          default:
            return '测试车间'
        }
      }
    },
    methods: {
      /**
       * é€šè¿‡è½¦é—´Id调用接口获取设备列表
       * @param workshopId è½¦é—´Id
       */
      getDeviceListByApi(workshopId) {
        console.log('车间Id', workshopId)
      },
      /**
       * æ‹–拽对象鼠标按键按下事件
       * @param event
       */
      handleMouseDown(event) {
        this.dragging = true
        this.mouseX = event.clientX
        this.mouseY = event.clientY
        this.elementId = event.currentTarget.id
        this.top = event.currentTarget.offsetTop
        this.left = event.currentTarget.offsetLeft
        document.addEventListener('mousemove', this.handleMouseMove)
        document.addEventListener('mouseup', this.handleMouseUp)
        this.elementWidth = +event.currentTarget.style.width.replace('px', '')
        this.elementHeight = +event.currentTarget.style.height.replace('px', '')
      },
      /**
       * æ–‡æ¡£å¯¹è±¡é¼ æ ‡ç§»åŠ¨äº‹ä»¶
       * @param event
       */
      handleMouseMove(event) {
        if (this.dragging) {
          // x方向鼠标偏移量
          const deltaX = event.clientX - this.mouseX
          // y方向鼠标偏移量
          const deltaY = event.clientY - this.mouseY
          this.left += deltaX
          this.top += deltaY
          this.deviceList.forEach(item => {
            if (item.equipmentId === this.elementId) {
              item.top = this.top
              item.left = this.left
              // é™åˆ¶æ‹–拽超出区域(缩放浏览器窗口后距四周距离出现问题)
              if (item.top < 0) {
                item.top = 0
              } else if (item.top + this.elementHeight + 80 > window.innerHeight) {
                item.top = window.innerHeight- this.elementHeight
              }
              if (item.left < 0) {
                item.left = 0
              } else if (item.left + this.elementWidth > window.innerWidth) {
                item.left = window.innerWidth - this.elementWidth
              }
            }
          })
          this.mouseX = event.clientX
          this.mouseY = event.clientY
        }
      },
      /**
       * æ–‡æ¡£å¯¹è±¡é¼ æ ‡æŒ‰é”®å¼¹èµ·äº‹ä»¶
       * @param event
       */
      handleMouseUp(event) {
        this.dragging = false
        document.removeEventListener('mousemove', this.handleMouseMove)
        document.removeEventListener('mouseup', this.handleMouseUp)
      },
      /**
       * ç‚¹å‡»ä¿å­˜æŒ‰é’®è°ƒç”¨æŽ¥å£ä¿å­˜æ‹–拽后的位置
       */
      saveDevicePositionByApi() {
        console.log('保存位置')

      }
    },
    mounted() {
      // ç¦æ­¢ç”¨æˆ·é€‰ä¸­å†…容
      document.onselectstart = () => false
    },
    created() {
      if (this.$route.params.workshopId) {
        this.getDeviceListByApi(this.$route.params.workshopId)
      }
    }
  }
</script>

<style scoped lang="less">
  .full-screen-container {
    background-image: url('../assets/Bj.jpg');
    background-size: 100% 100%;
    color: #fff;

    .page-header {
      height: 80px;
      font-size: 50px;
      text-align: center;
      position: relative;
      .header-right {
        position: absolute;
        right: 200px;
        top: 0;
      }
    }

    .content-container {
      position: relative;
      .single-device {
        position: absolute;
        border: 1px solid transparent;
        padding: 10px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        cursor: default;
        &:active {
          border: 1px solid #00b3ff;
        }
        .device-status {
          width: 145px;
          display: flex;
          justify-content: space-between;
        }
        .device-id {
          font-size: 20px;
        }
        /*.device-info {*/
        /*width: 100%;*/
        /*display: flex;*/
        /*align-items: center;*/
        /*justify-content: space-between;*/
        /*.status-square {*/
        /*width: 14px;*/
        /*height: 14px;*/
        /*border: 1px solid #fff;*/
        /*border-radius: 2px;*/
        /*}*/
        /*}*/
      }
    }
  }
</style>

 src/views/dashboard/Analysis.vue

@@ -4,24 +4,26 @@
    <!--<index-bdc v-if="indexStyle==2"></index-bdc>-->
    <!--<index-task v-if="indexStyle==3"></index-task>-->
    <!--<div style="width: 100%;text-align: right;margin-top: 20px">-->
      <!--请选择首页样式：-->
      <!--&lt;!&ndash;<a-radio-group v-model="indexStyle">&ndash;&gt;-->
        <!--&lt;!&ndash;<a-radio :value="1">统计图表</a-radio>&ndash;&gt;-->
        <!--&lt;!&ndash;<a-radio :value="2">统计图表2</a-radio>&ndash;&gt;-->
        <!--&lt;!&ndash;<a-radio :value="3">任务表格</a-radio>&ndash;&gt;-->
      <!--&lt;!&ndash;</a-radio-group>&ndash;&gt;-->
    <!--请选择首页样式：-->
    <!--&lt;!&ndash;<a-radio-group v-model="indexStyle">&ndash;&gt;-->
    <!--&lt;!&ndash;<a-radio :value="1">统计图表</a-radio>&ndash;&gt;-->
    <!--&lt;!&ndash;<a-radio :value="2">统计图表2</a-radio>&ndash;&gt;-->
    <!--&lt;!&ndash;<a-radio :value="3">任务表格</a-radio>&ndash;&gt;-->
    <!--&lt;!&ndash;</a-radio-group>&ndash;&gt;-->
    <!--</div>-->
    <a-button type="primary" @click="navigateToTestWorkshop">跳转至测试车间</a-button>
    <a-button type="primary" size="large" v-for="item in workshopList" :key="item.workshopId"
              @click="navigateToWorkshopSignage(item.workshopId)">{{item.workshopName}}
    </a-button>
  </div>
</template>

<script>
  import IndexChart from './IndexChart'
  import IndexTask from "./IndexTask"
  import IndexTask from './IndexTask'
  import IndexBdc from './IndexBdc'

  export default {
    name: "Analysis",
    name: 'Analysis',
    components: {
      IndexChart,
      IndexTask,
@@ -29,16 +31,34 @@
    },
    data() {
      return {
        indexStyle:1
        indexStyle: 1,
        workshopList: [
          {
            workshopName: '长沙车间',
            workshopId: '5321'
          },
          {
            workshopName: '天津车间',
            workshopId: '6312'
          },
          {
            workshopName: '武汉车间',
            workshopId: '3463'
          },
          {
            workshopName: '北京车间',
            workshopId: '8421'
          }
        ]
      }
    },
    created() {

    },
    methods: {
      navigateToTestWorkshop(){
        const url=this.$router.resolve('/testWorkshop').href
        window.open(url,'_blank')
      navigateToWorkshopSignage(workshopId) {
        const url = this.$router.resolve(`/workshopSignage/${workshopId}`).href
        window.open(url, '_blank')
      }
    }
  }

 src/views/mdc/base/modules/HolidayManagement/HolidayManagementList.vue

@@ -1,5 +1,5 @@
<template>
  <a-card :bordered="false" class="device_list">
  <div :bordered="false" class="device_list">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -79,7 +79,7 @@
    <holiday-management-modal ref="modalForm" @ok="modalFormOk"></holiday-management-modal>
    <holiday-management-modal-edit  ref="modalFormedit" @ok="modalFormOk"></holiday-management-modal-edit>

  </a-card>
  </div>
</template>

<script>

 src/views/mdc/base/modules/OvertimeManagement/OvertimeManagementList.vue

@@ -1,5 +1,5 @@
<template>
  <a-card :bordered="false" class="device_list">
  <div :bordered="false" class="device_list">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -83,8 +83,7 @@
    <!--<device-repair-model-add  ref="modalFormadd" @ok="modalFormOk"></device-repair-model-add>-->
    <!--<device-repair-model-edit ref="modalFormedit" @ok="modalFormOk"></device-repair-model-edit>-->
    <!--<repair-model ref="repairModelFrom" @ok="modalFormOk"></repair-model>-->

  </a-card>
  </div>
</template>

<script>

 src/views/mdc/base/modules/TorqueconfigurationList/TorqueconfigurationList.vue

@@ -1,5 +1,5 @@
<template>
  <a-card :bordered="false" class="device_list">
  <div :bordered="false" class="device_list">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -83,7 +83,7 @@
    <!--<device-repair-model-edit ref="modalFormedit" @ok="modalFormOk"></device-repair-model-edit>-->
    <!--<repair-model ref="repairModelFrom" @ok="modalFormOk"></repair-model>-->

  </a-card>
  </div>
</template>

<script>

 src/views/mdc/base/modules/UnplannedDowntimemManager/UnplannedDowntimemManagerList.vue

@@ -1,5 +1,5 @@
<template>
  <a-card :bordered="false" class="device_list">
  <div :bordered="false" class="device_list">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -81,7 +81,7 @@
    <plan-downtime-maintenance-modal ref="modalForm" @ok="modalFormOk"></plan-downtime-maintenance-modal>
    <plan-downtime-maintenance-modal-edit  ref="modalFormedit" @ok="modalFormOk"></plan-downtime-maintenance-modal-edit>

  </a-card>
  </div>
</template>

<script>

 src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue

@@ -1,6 +1,6 @@
<template>
  <div class="efficiency_list" style="width: 100%;height: 100%;">
    <a-card :bordered="false">
    <div :bordered="false" style="height: 100%">
      <!-- æŸ¥è¯¢åŒºåŸŸ -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -52,7 +52,7 @@
          <div id="MdcEquipmentWarningLine" style="height: 100%;width: 65%;"></div>
        </div>
      </div>
    </a-card>
    </div>
  </div>
</template>


 src/views/mdc/base/modules/comparativeAnalysis/comparativeAnalysismain.vue

@@ -1,5 +1,5 @@
<template>
  <a-card :bordered="false" class="device_list">
  <div :bordered="false" class="device_list">
    <div class="com_box">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
@@ -53,7 +53,7 @@
    </div>
    <!-- table区域-end -->
    </div>
  </a-card>
  </div>
</template>

<script>

 src/views/mdc/base/modules/deviceCalendar/DeviceCalendarList.vue

@@ -1,6 +1,6 @@
<template>
  <div class="deviceCalendar_list">
    <a-card :bordered="false">
    <div :bordered="false">
      <!-- æŸ¥è¯¢åŒºåŸŸ -->

      <div>
@@ -47,7 +47,7 @@
        </a-table>
      </div>
      <device-calendar-model ref="modalForm" @ok="modalFormOk"></device-calendar-model>
    </a-card>
    </div>
  </div>
</template>


 src/views/mdc/base/modules/deviceLog/LogInfo.vue

@@ -16,7 +16,8 @@
          </a-col>
          <a-col :md="6" :sm="6">
            <a-form-item label="日期">
              <a-date-picker v-model="queryParams.collectTime" :disabledDate="disabledDate" @change="dataChange" format='YYYY-MM-DD'/>
              <a-date-picker v-model="queryParams.collectTime" :disabledDate="disabledDate" @change="dataChange"
                             format='YYYY-MM-DD'/>
            </a-form-item>
          </a-col>
          <a-col :md="3" :sm="3">
@@ -60,9 +61,9 @@
                            <span v-if="item.status == 23"
                                  :style='{display: "inline-block",width:item.dateProportion,  height: "100%", background: "#19FE01",position:"absolute",bottom:"0"}'></span>
                          </div>
                          <div  v-if="item.status == 22" style="z-index: 999;"
                                :style='{display: "inline-block",left:item.left,width:item.dateProportion,  height: "100%",position:"absolute"}'
                                v-for="item in waring">
                          <div v-if="item.status == 22" style="z-index: 999;"
                               :style='{display: "inline-block",left:item.left,width:item.dateProportion,  height: "100%",position:"absolute"}'
                               v-for="item in waring">
                            <span
                              :style='{display: "inline-block",width:"100%", left:0, height: "68%", background: "#FD0008",position:"absolute",bottom:"0"}'></span>
                          </div>
@@ -150,7 +151,8 @@
        </a-tabs>
      </div>
    </div>
    <work-chart-model ref="workChartModel"></work-chart-model>
    <work-chart-model ref="workChartModel" :collectTime="this.queryParams.collectTime"
                      :equipment="this.equipment"></work-chart-model>
    <work-history-model ref="workHistoryModel"></work-history-model>
  </div>
</template>
@@ -176,17 +178,17 @@
    props: { equement: {} },
    data() {
      return {
        readOnly:true,
        readOnly: true,
        defaultId: '',
        defaultName: '',
        middleTime: '',
        queryParam:{},
        queryParam: {},
        queryParams: {
          collectTime:undefined,
          collectTime: undefined
        },
        loadingstayus:false,
        loadingrunStatus:false,
        loadingwarnStatus:false,
        loadingstayus: false,
        loadingrunStatus: false,
        loadingwarnStatus: false,
        normal: [],
        waring: [],
        normalList: [],
@@ -200,7 +202,7 @@
          getEquipmentByPid: '/mdc/mdcEquipment/getEquipmentByPid',
          list: '/mdc/mdcEquipmentRunningSection/logList'
        },
        ProStartId:''
        ProStartId: ''
      }
    },
    methods: {
@@ -223,27 +225,27 @@
      tabChange(val) {
        this.activeKey = val
      },
      disabledDate(current){
      disabledDate(current) {
        //Can not slect days before today and today
        return current && current > moment().subtract('days', 0);
        return current && current > moment().subtract('days', 0)
      },
      queryChart() {
        // this.normal = []
        // this.waring = []
        this.loadingstayus = true;
        this.loadingrunStatus = true;
        this.loadingstayus = true
        this.loadingrunStatus = true
        this.loadingwarnStatus = true
        getAction(this.url.list, this.queryParams).then((res) => {
          this.normalList = []
          this.waringList = []
          this.runList = []
          this.loadingstayus = false;
          this.loadingrunStatus = false;
          this.loadingstayus = false
          this.loadingrunStatus = false
          this.loadingwarnStatus = false
          this.normal = []
          this.waring = []
          if (res.success) {
            if(res.result != null){
            if (res.result != null) {
              for (let i = 0; i < res.result.length; i++) {
                this.normalList.push(res.result[i])
                if ('22' == res.result[i].status) {
@@ -253,11 +255,11 @@
                  res.result[i].left = leftTmp / 86400 * 100 + '%'
                  this.waring.push(res.result[i])

                }else if('3' == res.result[i].status){
                } else if ('3' == res.result[i].status) {
                  this.runList.push(res.result[i])
                  res.result[i].dateProportion = res.result[i].duration / 86400 * 100 + '%'
                  this.normal.push(res.result[i])
                }else{
                } else {
                  res.result[i].dateProportion = res.result[i].duration / 86400 * 100 + '%'
                  this.normal.push(res.result[i])
                  // console.log(this.normal)
@@ -324,23 +326,23 @@
      },
      searchQuery() {
        // console.log(this.queryParams.collectTime)
        if(this.queryParams.collectTime != undefined){
        if (this.queryParams.collectTime != undefined) {
          this.queryParams.collectTimeStr = this.queryParams.collectTime.format('YYYY-MM-DD')
          if(!this.queryParams.equipmentId||!this.queryParams.equipmentName){
          if (!this.queryParams.equipmentId || !this.queryParams.equipmentName) {
            this.$notification.warning({
              message:'消息',
              description:"请选择设备"
            });
              message: '消息',
              description: '请选择设备'
            })
            return false
          }
          this.queryChart()
        }else{
        } else {
          // this.$message.warning("请选择时间")
          console.log('触发提示')
          this.$notification.warning({
            message:'消息',
            description:"请选择时间"
          });
            message: '消息',
            description: '请选择时间'
          })
        }
        // this.queryList()
      },
@@ -354,28 +356,29 @@
        // this.onClearSelected()
      },
      openWorkChart() {
        if(!this.equipment.equipmentId){
        if (!this.equipment.equipmentId) {
          // this.$message.warning("请选择设备进行查询")
          this.$notification.warning({
            message:'消息',
            description:"请选择设备进行查询"
          });
        }else{
            message: '消息',
            description: '请选择设备进行查询'
          })
        } else {
          // åˆ¤æ–­æ˜¯å¦ç‚¹å‡»è®¾å¤‡æ—¥å¿—表格行的数据，此时为点击表格数据为false
          this.$refs.workChartModel.isClicklogListRow = false
          this.$refs.workChartModel.add(this.equipment)
          this.$refs.workChartModel.title = '工作曲线'
        }

      },
      openHistoryChart() {
        // console.log(this.equipment);
        if(!this.equipment.equipmentId){
        if (!this.equipment.equipmentId) {
          // this.$message.warning("请选择设备进行查询")
          this.$notification.warning({
            message:'消息',
            description:"请选择设备进行查询"
          });
            message: '消息',
            description: '请选择设备进行查询'
          })
          // console.log(1111)
        } else{
        } else {
          this.$refs.workHistoryModel.add(this.equipment)
          this.$refs.workHistoryModel.title = '历史日志'
        }
@@ -386,13 +389,13 @@
        this.searchQuery()
      },
      dataAfter() {
        if((this.queryParams.collectTime).format('YYYY-MM-DD') ==  moment().format('YYYY-MM-DD')){
        if ((this.queryParams.collectTime).format('YYYY-MM-DD') == moment().format('YYYY-MM-DD')) {
          // this.$message.warning("请选择今天以及今天之前的日期！！")
          this.$notification.warning({
            message:'消息',
            description:'请选择今天以及今天之前的日期！！'
          });
        }else{
            message: '消息',
            description: '请选择今天以及今天之前的日期！！'
          })
        } else {
          this.queryParams.collectTime = moment(this.queryParams.collectTime.add(1, 'd'), 'YYYY-MM-DD')
          this.searchQuery()
        }
@@ -413,16 +416,16 @@
              this.equipment = {}
              // _this.$message.warning('请联系管理员，开放设备权限！')
              _this.$notification.warning({
                message:'消息',
                description:'请联系管理员，开放设备权限！'
              });
                message: '消息',
                description: '请联系管理员，开放设备权限！'
              })
            }
          }else{
          } else {
            // this.$message.warning(res.message)
            _this.$notification.warning({
              message:'消息',
              description:res.message
            });
              message: '消息',
              description: res.message
            })

          }
        })
@@ -431,13 +434,12 @@
    created() {
      this.queryParams.collectTime = moment()
      this.queryParams.collectTimeStr = this.queryParams.collectTime.format('YYYY-MM-DD')
      this.initEquipment();
      this.initEquipment()
      // this.queryTreeData();
    },
    watch: {
      equement(val) {
        console.log('通过watch触发')

        if (val && val.equipmentId) {
          this.$set(this.queryParams, 'equipmentName', val.equipmentName)
          this.$set(this.queryParams, 'equipmentId', val.equipmentId)
@@ -492,7 +494,8 @@
  #mdcLogShow > div {
    flex: 1;
  }

  /*.mdcLogShowOne{*/
    /*position: absolute;*/
  /*position: absolute;*/
  /*}*/
</style>

 src/views/mdc/base/modules/deviceLog/LogList.vue

@@ -3,7 +3,7 @@
    <!-- table区域-begin -->
    <div class="table_logList">
      <a-table ref="table" bordered size="middle" :rowKey="(record,index)=>{return index}" :columns="columns"
               :dataSource="dataList" :pagination="ipagination" :loading="loadingequip"  @change="handleTableChange">
               :dataSource="dataList" :pagination="ipagination" :loading="loadingequip"  @change="handleTableChange" :customRow="rowClick">
        <template slot="status" slot-scope="status">
          <div v-if="status == '3' || status ==  '23'" style="color: #00ee00;width: 100%; height: 100%;">运行</div>
          <div v-else-if="status == '1' || status == '2'" style="color: #ffea91;width: 100%; height: 100%;">待机</div>
@@ -28,6 +28,7 @@
  import {
    JeecgListMixin
  } from '@/mixins/JeecgListMixin'
  import moment from 'moment'
  export default {
    name: 'LogList',
    mixins: [JeecgListMixin],
@@ -154,6 +155,24 @@
        this.ipagination = pagination;
        // this.loadData();
      },
      /**
       * ç»™è®¾å¤‡æ—¥å¿—表格中的行添加点击事件
       * @param record ç‚¹å‡»çš„当前行数据
       * @returns {{on: {click: on.click}}} æ·»åŠ äº‹ä»¶å¯¹è±¡
       */
      rowClick(record){
        return {
          on:{
            click:()=>{
              const timeObj={
                start:moment(record.startTime),
                end:moment(record.endTime)
              }
              this.$bus.$emit('tableRowRecord',timeObj)
            }
          }
        }
      }
    },
    created() {
    }

 src/views/mdc/base/modules/deviceLog/WorkChartModel.vue

@@ -1,6 +1,7 @@
<template>
  <div ref="workChart">
    <a-modal :title="title" :getContainer="() => this.$refs.workChart"  width="80%" wrap-class-name="full-modal" :footer="null" :visible="visible"
    <a-modal :title="title" :getContainer="() => this.$refs.workChart" width="80%" wrap-class-name="full-modal"
             :footer="null" :visible="visible"
             @cancel="handleCancel" cancelText="关闭">
      <div>
        <div>
@@ -12,7 +13,7 @@
            </a-col>
            <a-col :span="6">
              <a-form-item label="日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-date-picker v-model="queryParams.paramDate"  :disabledDate="disabledDate" format='YYYY-MM-DD'/>
                <a-date-picker v-model="queryParams.paramDate" :disabledDate="disabledDate" format='YYYY-MM-DD'/>
              </a-form-item>
            </a-col>
            <a-col :span="6">
@@ -69,166 +70,206 @@
</template>

<script>
import moment from 'moment'
import * as echarts from 'echarts'
import {
  getAction,
  postAction
} from '@/api/manage'
import {
  duplicateCheck
} from '@/api/api'
  import moment from 'moment'
  import * as echarts from 'echarts'
  import {
    getAction,
    postAction
  } from '@/api/manage'
  import {
    duplicateCheck
  } from '@/api/api'

export default {
  name: 'WorkChartModel',
  components: {},
  props: {},
  data() {
    return {
      spinning:false,
      labelCol: {
        xs: {
          span: 24
        },
        sm: {
          span: 6
        }
  export default {
    name: 'WorkChartModel',
    components: {},
    props: {
      collectTime: {
        type: Object
      },
      wrapperCol: {
        xs: {
          span: 24
      equipment: {
        type: Object
      }
    },
    watch: {
      // ç›‘控父组件点击左右箭头切换的时间值将其赋给点击工作曲线后的时间选择器的值
      collectTime: {
        handler(newVal) {
          this.currentToggledTime = newVal
        }
      }
    },
    data() {
      return {
        spinning: false,
        labelCol: {
          xs: {
            span: 24
          },
          sm: {
            span: 6
          }
        },
        sm: {
          span: 18
        }
        wrapperCol: {
          xs: {
            span: 24
          },
          sm: {
            span: 18
          }
        },
        readOnly: true,
        title: '',
        plainOptions: [],
        option: [],
        workChart: '',
        node: {},
        stratOpen: false,
        endOpen: false,
        visible: false,
        show: false,
        queryParams: {},
        panduanResult: [],
        url: {
          initPlainOptions: '/mdc/mdcDriveTypeParamConfig/findWorkCurveParamList',
          workChart: '/mdc/mdcEquipmentRunningSection/workChart'
        },
        currentToggledTime: '',
        isClicklogListRow: false
      }
    },
    created() {
      this.$bus.$on('tableRowRecord', this.getLogListRowRecord)
    },
    mounted() {

    },
    methods: {
      disabledDate(current) {
        //Can not slect days before today and today
        return current && current > moment().endOf('day')
      },
      readOnly:true,
      title: '',
      plainOptions: [],
      option: [],
      workChart: '',
      node: {},
      stratOpen: false,
      endOpen: false,
      visible: false,
      show: false,
      queryParams: {},
      panduanResult:[],
      url: {
        initPlainOptions: '/mdc/mdcDriveTypeParamConfig/findWorkCurveParamList',
        workChart: '/mdc/mdcEquipmentRunningSection/workChart'
      }
    }
  },
  mounted() {
  },
  methods: {
    disabledDate(current){
      //Can not slect days before today and today
      return current && current > moment().endOf("day");
    },
    initPlainOptions(param) {
      let that = this
      let equipment = param.equipmentId
      getAction(this.url.initPlainOptions,{equipmentId:equipment}).then((res) => {
        if (res.success) {
          let temp = []
          // debugger
          for (var item of res.result) {
            temp.push({ label: item.chineseName, value: item.id, englishName: item.englishName })
      initPlainOptions(param) {
        let that = this
        let equipment = param.equipmentId
        getAction(this.url.initPlainOptions, { equipmentId: equipment }).then((res) => {
          if (res.success) {
            let temp = []
            // debugger
            for (var item of res.result) {
              temp.push({ label: item.chineseName, value: item.id, englishName: item.englishName })
            }
            that.plainOptions = temp

            if (temp.length > 0) {
              that.option = [temp[0].value]
              let param = {
                driveType: that.node.driveType,
                equipmentId: that.node.equipmentId,
                date: that.queryParams.paramDateStr,
                start: that.queryParams.startStr,
                end: that.queryParams.endStr,
                interval: that.queryParams.period,
                codeTypeId: that.option.join(',')
              }
              that.initChart(param)
            }
          }
          that.plainOptions = temp
          if(temp.length>0){
            that.option = [temp[0].value]
          }
        }
      })
    },
    searchQuery() {
      this.queryParams.paramDateStr = this.queryParams.paramDate.format('yyyy-MM-DD')
      this.queryParams.startStr = this.queryParams.start.format('HH:mm')
      this.queryParams.endStr = this.queryParams.end.format('HH:mm')
      let param = {
        driveType: this.node.driveType, equipmentId: this.node.equipmentId,
        date: this.queryParams.paramDateStr, start: this.queryParams.startStr,
        end: this.queryParams.endStr, interval: this.queryParams.period,
        codeTypeId: this.option.join(',')
      }
      this.initChart(param);
      this.spinning = true;
    },
    timeHandleChange(val) {
      if (val == 'start') {
        this.stratOpen = true
      } else {
        this.endOpen = true
      }
    },
    timeHandleClose(val) {
      if (val == 'start') {
        this.stratOpen = false
        this.endOpen = true
      } else {
        this.endOpen = false
      }
    },
    add(node) {
      let _this = this
      this.visible = true
      this.node = node
      let paramDate = moment()
      let start = moment('0:0', 'HH:mm')
      let end = moment(moment().format('HH:mm'), 'HH:mm')
      this.queryParams = {
        equipmentId: node.equipmentId,
        equipmentName: node.equipmentName,
        period: 1000,
        paramDate: paramDate,
        paramDateStr: paramDate.format('yyyy-MM-DD'),
        start: start,
        startStr: start.format('HH:mm'),
        end: end,
        endStr: end.format('HH:mm')
      }
      this.$nextTick(() => {
        _this.initPlainOptions(node)
        })
      },
      searchQuery() {
        this.queryParams.paramDateStr = this.queryParams.paramDate.format('yyyy-MM-DD')
        this.queryParams.startStr = this.queryParams.start.format('HH:mm')
        this.queryParams.endStr = this.queryParams.end.format('HH:mm')
        let param = {
          driveType: node.driveType, equipmentId: node.equipmentId,
          date: _this.queryParams.paramDateStr, start: _this.queryParams.startStr,
          end: _this.queryParams.endStr, interval: _this.queryParams.period,
          codeTypeId: _this.option.join(',')
          driveType: this.node.driveType, equipmentId: this.node.equipmentId,
          date: this.queryParams.paramDateStr, start: this.queryParams.startStr,
          end: this.queryParams.endStr, interval: this.queryParams.period,
          codeTypeId: this.option.join(',')
        }
        _this.initChart(param)
      })
    },
    handleCancel() {
      this.visible = false;
      this.stratOpen = false;
      this.endOpen = false;
    },
    checkboxOnChange(e) {
      if (e.length <= 3) {
        this.option = e
      } else {
        // this.$message.warn('最多只能选择3个')
        this.$notification.warning({
          message:'消息',
          description:'最多只能选择三个'
        });
        return false
      }
    },
    close() {
      this.visible = false
      this.show = false
    },
    getYAxisOffset(index) {
      return index * 50 + 10;
    },
    initChart(param) {
      if (!this.workChart) {
        this.workChart = echarts.init(document.getElementById('workChart'))
      }
        this.initChart(param)
        this.spinning = true
      },
      timeHandleChange(val) {
        if (val == 'start') {
          this.stratOpen = true
        } else {
          this.endOpen = true
        }
      },
      timeHandleClose(val) {
        if (val == 'start') {
          this.stratOpen = false
          this.endOpen = true
        } else {
          this.endOpen = false
        }
      },
      add(node) {
        let _this = this
        this.visible = true
        this.node = node
        this.spinning = true
        let paramDate
        let start
        let end
        // å½“没有切换过时间currentToggledTime的值为空值，如果由于点击左右箭头切换过时间，则currentToggledTime为切换后的时间
        if (!this.currentToggledTime) {
          paramDate = moment()
        } else {
          paramDate = this.currentToggledTime
        }
        // åˆ¤æ–­æ˜¯å¦ç‚¹å‡»è®¾å¤‡æ—¥å¿—表格行的数据，若点击表格数据则显示表格数据中的时间，若点击工作曲线图片则显示0点至当前时间数据
        if (this.isClicklogListRow) {
          start = node.start
          end = node.end
        } else {
          start = moment('0:0', 'HH:mm')
          end = moment(moment().format('HH:mm'), 'HH:mm')
        }
        this.queryParams = {
          equipmentId: node.equipmentId,
          equipmentName: node.equipmentName,
          period: 1000,
          paramDate: paramDate,
          paramDateStr: paramDate.format('yyyy-MM-DD'),
          start: start,
          startStr: start.format('HH:mm'),
          end: end,
          endStr: end.format('HH:mm')
        }
        this.$nextTick(() => {
          _this.initPlainOptions(node)
        })
      },
      handleCancel() {
        this.visible = false
        this.stratOpen = false
        this.endOpen = false
      },
      checkboxOnChange(e) {
        if (e.length <= 3) {
          this.option = e
        } else {
          // this.$message.warn('最多只能选择3个')
          this.$notification.warning({
            message: '消息',
            description: '最多只能选择三个'
          })
          return false
        }
      },
      close() {
        this.visible = false
        this.show = false
      },
      getYAxisOffset(index) {
        return index * 50 + 10
      },
      initChart(param) {
        if (!this.workChart) {
          this.workChart = echarts.init(document.getElementById('workChart'))
        }
        let option = {
          tooltip: {
            trigger: 'axis',
@@ -237,7 +278,7 @@
            }
          },
          legend: {
            data:[],
            data: []
          },
          title: {
            left: 'center',
@@ -252,12 +293,12 @@
              saveAsImage: {}
            }
          },
          grid:{
            left:'8%',
            top:'10%',
            right:'2%',
            bottom:'14%',
            containLabel:true
          grid: {
            left: '8%',
            top: '10%',
            right: '2%',
            bottom: '14%',
            containLabel: true
          },
          xAxis: {
            type: 'time',
@@ -265,44 +306,44 @@
          },
          yAxis: [
            {
              yAxisIndex:0,
            type: 'value',
              offset:0,
            position:'left',
            boundaryGap: [0, '15%'],
              axisLine:{
                show:true,
                // lineStyle:{
                //   color:'#000000'
                // }
              }
          },
            {
              yAxisIndex:1,
              yAxisIndex: 0,
              type: 'value',
              offset:60,
              position:'left',
              offset: 0,
              position: 'left',
              boundaryGap: [0, '15%'],
              axisLine:{
                show:true,
              axisLine: {
                show: true
                // lineStyle:{
                //   color:'#000000'
                // }
              }
            },
            {
              yAxisIndex:2,
              yAxisIndex: 1,
              type: 'value',
              offset:120,
              position:'left',
              offset: 60,
              position: 'left',
              boundaryGap: [0, '15%'],
              axisLine:{
                show:true,
              axisLine: {
                show: true
                // lineStyle:{
                //   color:'#000000'
                // }
              }
            },
            {
              yAxisIndex: 2,
              type: 'value',
              offset: 120,
              position: 'left',
              boundaryGap: [0, '15%'],
              axisLine: {
                show: true
                // lineStyle:{
                //   color:'#000000'
                // }
              }
            }
          ],
          dataZoom: [
            {
@@ -315,211 +356,236 @@
              end: 20
            }
          ],
          series:[
          series: [
            {
              showSymbol:true,
              symbolSize:20,
              label:'show',
              name:'',
              type:'line',
              data:[],
              smooth:true,
              symbol:'none',
              showSymbol: true,
              symbolSize: 20,
              label: 'show',
              name: '',
              type: 'line',
              data: [],
              smooth: true,
              symbol: 'none'
            }
          ]
        }
      let _this = this
      let temp = []
      for (let i = 0; i < this.plainOptions.length; i++) {
        let item = this.plainOptions[i]
        if (this.option.indexOf(item.value) > -1) {
          temp.push(item)
        }
      }
      getAction(this.url.workChart, param).then((res) => {
        if(JSON.stringify(res.result) == '[]' || res.result == null){
          // this.$message.warning('无数据！')
          this.$notification.warning({
            message:'消息',
            description:'无数据!'
          });
          this.spinning = false;
          _this.workChart.setOption(option,true)
        }else{
          this.spinning = false;
          // debugger
          let result = []
          let itemLine = []
          //y轴数组
          var Yarr = []
          var lengenddata = [];
          for (let i = 0; i < temp.length; i++) {
            let item = temp[i]
            itemLine = []
            for (let m = 0; m < res.result.length; m++) {
              let d = []
              d.push(res.result[m].collectTime)
              // debugger
              d.push(res.result[m][item.englishName])
              itemLine.push(d)
            }
            var lll = {
              name:item.label
            }
            lengenddata.push(lll)
            var Yline ={
              name:item.label,
              type:'value',
              yAxisIndex:i,
              boundaryGap: [0,'100%']
            }
            Yarr.push(Yline);
            var line ={
              name:item.label,
              type:'line',
              // areaStyle:{},
              smooth:true,
              symbol:'circle',
              symbolSize:10,
              yAxisIndex:i,

              data:itemLine
            }
            result.push(line);

        let _this = this
        let temp = []
        for (let i = 0; i < this.plainOptions.length; i++) {
          let item = this.plainOptions[i]
          if (this.option.indexOf(item.value) > -1) {
            temp.push(item)
          }
          // option.yAxis = Yarr;
          option.series = result;
          option.legend = lengenddata;
          // console.log(option);
          _this.workChart.setOption(option,true)
          window.addEventListener('resize', function() {
            _this.workChart.resize()
          })
        }
        getAction(this.url.workChart, param).then((res) => {
          if (JSON.stringify(res.result) == '[]' || res.result == null) {
            // this.$message.warning('无数据！')
            this.$notification.warning({
              message: '消息',
              description: '无数据!'
            })
            this.spinning = false
            _this.workChart.setOption(option, true)
          } else {
            this.spinning = false
            // debugger
            let result = []
            let itemLine = []
            //y轴数组
            var Yarr = []
            var lengenddata = []
            for (let i = 0; i < temp.length; i++) {
              let item = temp[i]
              itemLine = []
              for (let m = 0; m < res.result.length; m++) {
                let d = []
                d.push(res.result[m].collectTime)
                // debugger
                d.push(res.result[m][item.englishName])
                itemLine.push(d)
              }
              var lll = {
                name: item.label
              }
              lengenddata.push(lll)
              var Yline = {
                name: item.label,
                type: 'value',
                yAxisIndex: i,
                boundaryGap: [0, '100%']
              }
              Yarr.push(Yline)
              var line = {
                name: item.label,
                type: 'line',
                // areaStyle:{},
                smooth: true,
                symbol: 'circle',
                symbolSize: 10,
                yAxisIndex: i,

      })
                data: itemLine
              }
              result.push(line)

            }
            // option.yAxis = Yarr;
            option.series = result
            option.legend = lengenddata
            // console.log(option);
            _this.workChart.setOption(option, true)
            window.addEventListener('resize', function() {
              _this.workChart.resize()
            })
          }

        })
      },
      /**
       * èŽ·å–点击设备日志表格行后从兄弟组件传来的时间对象
       * @param timeObj å½“前行的开始时间与结束时间组成的对象
       */
      getLogListRowRecord(timeObj) {
        // åˆ¤æ–­æ˜¯å¦ç‚¹å‡»è®¾å¤‡æ—¥å¿—表格行的数据，此时为点击表格数据为true
        this.isClicklogListRow = true
        // åˆå¹¶çˆ¶ç»„件传来的当前设备信息对象与兄弟组件传来的当前行的时间对象
        const newQueryParams = Object.assign(this.equipment, timeObj)
        this.add(newQueryParams)
        this.title = '工作曲线'
      }
    }
  }
}
</script>

<style scoped lang="less">
.full-modal {
  .ant-modal {
    max-width: 100%;
    top: 0;
    padding-bottom: 0;
    margin: 0;
  .full-modal {
    .ant-modal {
      max-width: 100%;
      top: 0;
      padding-bottom: 0;
      margin: 0;
    }
    .ant-modal-content {
      display: flex;
      flex-direction: column;
      height: calc(100vh);
    }
    .ant-modal-body {
      flex: 1;
    }
  }
  .ant-modal-content {

  /deep/ .ant-modal {
    /*background-color: #000;*/
    /*color: #fff;*/
  }

  /deep/ .ant-modal-header {
    /*background-color: #000;*/
  }

  /deep/ .ant-modal-title {
    /*color: #fff;*/
  }

  /deep/ .ant-modal-close {
    color: #1191b0;
    font-size: 24px;
  }

  /deep/ .ant-modal-content {
    /*background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.27) 100%);*/
    /*background: -webkit-gradient(linear, left left, right right, color-stop(0%, rgba(0, 0, 0, 0.66)), color-stop(100%, rgba(0, 0, 0, 0.4)));*/
    /*background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
    /*background: -o-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
    /*background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
    /*background: linear-gradient(to right, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
    /*background-color: #000;*/
    /*color: #fff;*/
    position: relative;
  }

  /deep/ .ant-modal-header {
    /*border-bottom: none!important;*/
  }

  /deep/ .ant-checkbox-wrapper {
    /*color: #fff;*/
  }

  /deep/ .ant-form-item-label label {
    /*color: #fff;*/
  }

  /deep/ .ant-btn {
    /*position: absolute;*/

  }

  .checkboxgroup {
    position: absolute;
    right: 5%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }

  /deep/ .ant-checkbox-group {
    display: flex;
    flex-direction: column;
    height: calc(100vh);
  }
  .ant-modal-body {
    flex: 1;

  /deep/ .ant-checkbox-group .ant-checkbox-wrapper {
    padding: 10px;
  }
}
/deep/ .ant-modal{
  /*background-color: #000;*/
  /*color: #fff;*/
}
/deep/ .ant-modal-header{
  /*background-color: #000;*/
}
/deep/ .ant-modal-title{
  /*color: #fff;*/
}
/deep/ .ant-modal-close{
  color: #1191b0;
  font-size: 24px;
}
/deep/ .ant-modal-content{
  /*background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.27) 100%);*/
  /*background: -webkit-gradient(linear, left left, right right, color-stop(0%, rgba(0, 0, 0, 0.66)), color-stop(100%, rgba(0, 0, 0, 0.4)));*/
  /*background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
  /*background: -o-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
  /*background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
  /*background: linear-gradient(to right, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
  /*background-color: #000;*/
  /*color: #fff;*/
  position: relative;
}
/deep/ .ant-modal-header{
  /*border-bottom: none!important;*/
}
/deep/ .ant-checkbox-wrapper{
  /*color: #fff;*/
}
/deep/ .ant-form-item-label label{
  /*color: #fff;*/
}
/deep/ .ant-btn{
  /*position: absolute;*/

}
.checkboxgroup{
  position: absolute;
  right: 5%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
/deep/ .ant-checkbox-group{
  display: flex;
  flex-direction: column;
}
/deep/ .ant-checkbox-group .ant-checkbox-wrapper{
  padding: 10px;
}
  .con_btn {
    display: flex;
    align-items: center;
  }

.con_btn{
  display: flex;
  align-items: center;
}
.workChart_params{
  display: flex;
  /*align-items: center;*/
  flex-direction: column;
  float: left;
}
.workChart_params .params_one{
  display: flex;
  justify-content: space-between;
}
.workChart_params .params_two{
  display: flex;
  justify-content: space-between;
}
/deep/ .workChart_params .ant-form-item{
  display: flex;
}
/deep/ .workChart_params .ant-form-item .ant-form-item-control-wrapper{
  margin: 0 10px;
}
  .workChart_params {
    display: flex;
    /*align-items: center;*/
    flex-direction: column;
    float: left;
  }

  .workChart_params .params_one {
    display: flex;
    justify-content: space-between;
  }

  .workChart_params .params_two {
    display: flex;
    justify-content: space-between;
  }

  /deep/ .workChart_params .ant-form-item {
    display: flex;
  }

  /deep/ .workChart_params .ant-form-item .ant-form-item-control-wrapper {
    margin: 0 10px;
  }

.ant-btn {
  padding: 0 10px;
  margin-left: 3px;
}
  .ant-btn {
    padding: 0 10px;
    margin-left: 3px;
  }

.ant-form-item-control {
  line-height: 0px;
}
  .ant-form-item-control {
    line-height: 0px;
  }

/** ä¸»è¡¨å•è¡Œé—´è· */
.ant-form .ant-form-item {
  margin-bottom: 10px;
}
  /** ä¸»è¡¨å•è¡Œé—´è· */
  .ant-form .ant-form-item {
    margin-bottom: 10px;
  }

/** Tab页面行间距 */
.ant-tabs-content .ant-form-item {
  margin-bottom: 0px;
}
  /** Tab页面行间距 */
  .ant-tabs-content .ant-form-item {
    margin-bottom: 0px;
  }
</style>

 src/views/mdc/base/modules/deviceRepair/DeviceRepairList.vue

@@ -1,5 +1,5 @@
<template>
  <a-card :bordered="false" class="device_list">
  <div :bordered="false" class="device_list">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -68,7 +68,7 @@
    <!--<device-repair-model-add  ref="modalFormadd" @ok="modalFormOk"></device-repair-model-add>-->
    <device-repair-model-edit ref="modalFormedit" @ok="modalFormOk"></device-repair-model-edit>
    <!--<repair-model ref="repairModelFrom" @ok="modalFormOk">0</repair-model>-->
  </a-card>
  </div>
</template>

<script>

 src/views/mdc/base/modules/efficiencyPOReport/EfficiencyPOList.vue

@@ -1,6 +1,6 @@
<template>
  <div style="width: 100%;">
    <a-card :bordered="false">
    <div :bordered="false">
      <!-- æŸ¥è¯¢åŒºåŸŸ -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -28,7 +28,7 @@
          </a-row>
        </a-form>
      </div>
      <div style="width: 530px;position: absolute;top: 20px; right:1.5%;">
      <div style="width: 530px;position: absolute;top: 0; right:1.5%;">
        <table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;">
          <tr>
            <td v-for="(item, index) in identifying">{{item.title}}</td>
@@ -101,7 +101,7 @@
          </table>
        </div>
      </div>
    </a-card>
    </div>
  </div>
</template>


 src/views/mdc/base/modules/efficiencyReport/EfficiencyList.vue

@@ -1,6 +1,6 @@
<template>
  <div class="efficiency_list" style="width: 100%">
    <a-card :bordered="false">
    <div :bordered="false">
      <!-- æŸ¥è¯¢åŒºåŸŸ -->
      <div>
        <div class="table-page-search-wrapper">
@@ -29,7 +29,7 @@
            </a-row>
          </a-form>
        </div>
        <div style="width: 530px;position: absolute;top: 20px; right: 1.5%;">
        <div style="width: 530px;position: absolute;top: 0; right: 1.5%;">
          <table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;">
            <tr>
              <td v-for="(item, index) in identifying">{{item.title}}</td>
@@ -103,7 +103,7 @@
          </table>
        </div>
      </div>
    </a-card>
    </div>
  </div>
</template>


 src/views/mdc/base/modules/efficiencyShiftReport/EfficiencyShiftList.vue

@@ -1,6 +1,6 @@
<template>
  <div style="width: 100%;">
    <a-card :bordered="false">
    <div :bordered="false">
      <!-- æŸ¥è¯¢åŒºåŸŸ -->
      <div class="seach-content">
        <div class="table-page-search-wrapper">
@@ -49,7 +49,7 @@
          </a-row>
        </a-form>
      </div>
        <div style="width: 530px;top: 20px; right: 0px;">
        <div style="width: 530px;top: 0; right: 0px;">
        <table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;">
          <tr>
            <td v-for="(item, index) in identifying">{{item.title}}</td>
@@ -143,7 +143,7 @@
          </table>
        </div>
      </div>
    </a-card>
    </div>
  </div>
</template>


 src/views/mdc/base/modules/equipmentAvailCompare/equipmentAvailCompareMain.vue

@@ -1,6 +1,6 @@
<template>
  <a-spin :spinning="loading">
    <a-card :bordered="false" class="device_list">
    <div :bordered="false" class="device_list">
      <div class="com_box">
        <!-- æŸ¥è¯¢åŒºåŸŸ -->
        <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
@@ -46,7 +46,7 @@
        </div>
        <!-- table区域-end -->
      </div>
    </a-card>
    </div>
  </a-spin>
</template>


 src/views/mdc/base/modules/equipmentDayAvail/equipmentDayAvailMain.vue

@@ -1,5 +1,5 @@
<template>
  <a-card :bordered="false" class="device_list">
  <div :bordered="false" class="device_list">
    <div class="com_box">
      <!-- æŸ¥è¯¢åŒºåŸŸ -->
      <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
@@ -57,7 +57,7 @@
      </div>
      <!-- table区域-end -->
    </div>
  </a-card>
  </div>
</template>

<script>

 src/views/mdc/base/modules/mdcPassRate/mdcPassRateList.vue

@@ -1,5 +1,5 @@
<template>
  <a-card :bordered="false" class="device_list">
  <div :bordered="false" class="device_list">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -85,7 +85,7 @@
    <!--<device-repair-model></device-repair-model>-->
    <mdc-pass-rate-modal  ref="modalForm" @ok="modalFormOk"></mdc-pass-rate-modal>
    <mdc-pass-rate-edit  ref="modalFormedit" @ok="modalFormOk"></mdc-pass-rate-edit>
  </a-card>
  </div>
</template>

<script>

 src/views/mdc/base/modules/mdcProcessQuantity/mdcProcessQuantityList.vue

@@ -1,5 +1,5 @@
<template>
  <a-card :bordered="false" class="device_list">
  <div :bordered="false" class="device_list">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -81,7 +81,7 @@
    <mdc-process-quantity-modal  ref="modalForm" @ok="modalFormOk"></mdc-process-quantity-modal>
    <mdc-process-quantity-edit ref="modalFormedit" @ok="modalFormOk"></mdc-process-quantity-edit>

  </a-card>
  </div>
</template>

<script>

 src/views/mdc/base/modules/mdcStandardProcessDuration/MdcStandardProcessDurationList.vue

@@ -1,5 +1,5 @@
<template>
  <a-card :bordered="false" class="device_list">
  <div :bordered="false" class="device_list">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -81,7 +81,7 @@
    <mdc-standard-process-duration-modal  ref="modalForm" @ok="modalFormOk"></mdc-standard-process-duration-modal>
    <mdc-standard-process-duration-edit   ref="modalFormedit" @ok="modalFormOk"></mdc-standard-process-duration-edit>

  </a-card>
  </div>
</template>

<script>

 src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue

@@ -1,6 +1,6 @@
<template>
  <div class="efficiency_list" style="width: 100%;height: 100%;">
    <a-card :bordered="false">
    <div :bordered="false" style="height: 100%">
      <!-- æŸ¥è¯¢åŒºåŸŸ -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -64,7 +64,7 @@
        </div>
        <div id="openRateTrendChart" style="width: 100%;height: 60%"></div>
      </div>
    </a-card>
    </div>
  </div>
</template>


 src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue

@@ -1,6 +1,6 @@
<template>
  <div class="efficiency_list" style="width: 100%;height: 100%;">
    <a-card :bordered="false">
    <div :bordered="false" style="height: 100%">
      <!-- æŸ¥è¯¢åŒºåŸŸ -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
@@ -57,7 +57,7 @@
        </div>
        <div id="openRateTrendChart" style="width: 100%;height: 60%"></div>
      </div>
    </a-card>
    </div>
  </div>
</template>