1

Reviewed-on: #19

src/filters/index.js

@@ -127,6 +127,14 @@ export function rateFormatter(rateObj) {
   }
 }
 
+export function rateFormatter2(rateObj) {
+  if (rateObj) {
+    return rateObj + '%'
+  } else {
+    return '0.00%'
+  }
+}
+
 export function amountFormatter(param) {
   if (param) {
     return parseFloat(param).toFixed(2)

src/views/3DOverview/components/RightContentFaultAnalysis.vue

@@ -239,7 +239,7 @@ export default {
                 const colorGradient = colors[dataIndex]
                 if (totalRate + percent < 25) {
                   /** 也许这里需要完善，但目前工作良好 */
-                  ;(() => {})()
+                  (() => {})()
                 } else if (totalRate + percent < 50) {
                   colorGradient.x = 0
                   colorGradient.y = 0
@@ -252,7 +252,7 @@ export default {
                   colorGradient.y2 = 0
                 } else if (totalRate + percent < 100) {
                   /** 也许这里需要完善，但目前工作良好 */
-                  ;(() => {})()
+                  (() => {})()
                 }
 
                 totalRate += percent
@@ -290,8 +290,8 @@ export default {
       return beilv * baseSize
     },
     applyChartOption() {
-      const fs1 = this.calcFontsize(1 /** px*/)
+      // const fs1 = this.calcFontsize(1 /** px*/)
-      const fs3 = this.calcFontsize(3 /** px*/)
+      // const fs3 = this.calcFontsize(3 /** px*/)
       const fs5 = this.calcFontsize(5 /** px*/)
       const fs8 = this.calcFontsize(8 /** px*/)
       const fs10 = this.calcFontsize(10 /** px*/)

src/views/3DOverview/components/TechyFakeTable.vue

@@ -1,63 +0,0 @@
-<template>
-  <div class="techy-fake-table">
-    <div class="table-inner">
-      <section class="table-header" />
-      <section class="table-body" />
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: '',
-  props: {
-    tableProps: {
-      type: Array,
-      default: () => []
-    },
-    tableData: {
-      type: Array,
-      default: () => []
-    }
-  },
-  data() {
-    return {
-      headMap: {}
-    }
-  },
-  created() {},
-  mounted() {
-    this.renderHeadRow().then(() => {
-      this.renderCommonRow()
-    })
-  },
-  methods: {
-    renderHeadRow() {
-      return new Promise((resolve, reject) => {
-        // do something...
-      })
-    },
-    renderCommonRow() {
-      return new Promise((resolve, reject) => {
-        // do something...
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-.techy-fake-table {
-  position: relative;
-  width: 100%;
-  height: 100px;
-  background: #3333;
-  overflow: hidden;
-  overflow-x: scroll;
-}
-.table-inner {
-  max-width: 10000px;
-  color: white;
-  white-space: nowrap;
-}
-</style>

src/views/3DOverview/index.vue

@@ -1,9 +1,9 @@
 <template>
   <div id="v3d-outter" ref="v3d-outter">
-    <!-- <div id="V3DData" style="position: fixed; top: 0; left: 0; display: hidden;" rel=""></div>
+    <div id="V3DData" style="position: fixed; top: 0; left: 0; display: hidden;" rel="" />
     <V3DApp @3d-loaded="handle3DLoaded" @click.native="handle3DClick" />
-    <div v-if="showPage" id="v3d-main-content"> -->
+    <div v-if="showPage" id="v3d-main-content">
-      <div v-if="true" id="v3d-main-content">
+      <!-- <div v-if="true" id="v3d-main-content"> -->
       <techy-header :head-title="'合肥新能源数字工厂总览'" @toggle-full-screen="toggleFullScreen" />
 
       <section id="techy-body-part">
@@ -20,7 +20,7 @@
               </techy-container>
             </div>
 
-            <div class="techy-body-part__middle" v-if="currentEquipment">
+            <div v-if="currentEquipment" class="techy-body-part__middle">
               <TechyBox>
                 <div class="techy-body-part__middle__inner">
                   <p>
@@ -45,7 +45,7 @@
                           'red-dot': currentEquipment.status === '故障',
                           'yellow-dot': currentEquipment.status === '调试中'
                         }"
-                      ></span>
+                      />
                       {{ currentEquipment.status }}
                     </span>
                   </p>
@@ -286,19 +286,11 @@ export default {
   width: calc(472px * var(--beilv));
 }
 
-/* 现场实时监控 */
-.ft-monitor {
-}
-
 /* 缺陷分类分析  */
 .fault-analysis {
   width: calc(290px * var(--beilv));
 }
 
-/* 设备报警提示 */
-.eq-alert {
-}
-
 .techy-body-part__left,
 .techy-body-part__right {
   /* height: 100%; */

src/views/EquipmentManager/HomePage.vue

@@ -226,23 +226,22 @@ export default {
 </script>
 
 <style scoped>
-::-webkit-scrollbar {
+.visual-container >>> ::-webkit-scrollbar {
   width: calc(8px * var(--beilv));
 }
 
-::-webkit-scrollbar-track {
+.visual-container >>> ::-webkit-scrollbar-track {
   background-color: #14243f;
   border-radius: 0;
 }
 
-::-webkit-scrollbar-button {
+.visual-container >>> ::-webkit-scrollbar-button {
-  width: calc(8px * var(--beilv));
+  display: none;
-  height: calc(8px * var(--beilv));
   background: #5bc4bf9f;
   position: relative;
 }
 
-::-webkit-scrollbar-thumb {
+.visual-container >>> ::-webkit-scrollbar-thumb {
   border-radius: calc(8px * var(--beilv));
   background: #5bc4bf9f;
 }
@@ -394,10 +393,6 @@ export default {
   left: calc(140px * var(--beilv));
 }
 
-.pl-select {
-  /* height: calc(18px * var(--beilv)); */
-}
-
 .pl-select >>> input {
   /* height: 100%; */
   outline: none;

src/views/EquipmentManager/components/TechyTable.vue

@@ -126,8 +126,9 @@ export default {
 }
 
 .visual-base-table-container >>> ::-webkit-scrollbar-button {
-  width: calc(8px * var(--beilv));
+  display: none;
-  height: calc(8px * var(--beilv));
+  /* width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv)); */
   background: #5bc4bf9f;
   position: relative;
 }

src/views/EquipmentManager/components/TechyVerticalTable.vue

@@ -45,6 +45,28 @@ export default {
   color: white;
 }
 
+.techy-vertical-table >>> ::-webkit-scrollbar {
+  width: calc(8px * var(--beilv));
+}
+
+.techy-vertical-table >>> ::-webkit-scrollbar-track {
+  background-color: #14243f;
+  border-radius: 0;
+}
+
+.techy-vertical-table >>> ::-webkit-scrollbar-button {
+  display: none;
+  /* width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv)); */
+  background: #5bc4bf9f;
+  position: relative;
+}
+
+.techy-vertical-table >>> ::-webkit-scrollbar-thumb {
+  border-radius: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+}
+
 .trow {
   width: 100%;
   white-space: nowrap;

src/views/QualityManager/HomePage.vue

@@ -207,7 +207,7 @@
                             :class="{ 'pl-select__active': dateMode2 === 'day' }"
                             @click="
                               dateMode2 = 'day'
-                              dataUpdateToken = Math.random()+''
+                              dataUpdateToken = Math.random() + ''
                             "
                           >
                             日
@@ -216,7 +216,7 @@
                             :class="{ 'pl-select__active': dateMode2 === 'month' }"
                             @click="
                               dateMode2 = 'month'
-                              dataUpdateToken = Math.random()+''
+                              dataUpdateToken = Math.random() + ''
                             "
                           >
                             月
@@ -307,7 +307,7 @@ import TechyBox from './components/TechyBox.vue'
 import TechyTable from './components/TechyTable.vue'
 import TechyAnalysisBar from './components/TechyAnalysisBar.vue'
 import TechyAnalysisHeader from './components/TechyAnalysisHeader.vue'
-import productionRateHeader from './components/productionRateHeader.vue'
+// import productionRateHeader from './components/productionRateHeader.vue'
 // import FaultCategoryChart from './components/charts/FaultCategoryChart.vue'
 import PlFaultAnalysisPieChart from './components/charts/PlFaultAnalysisPieChart.vue'
 import { mapGetters } from 'vuex'
@@ -330,8 +330,8 @@ export default {
     // FaultCategoryChart,
     PlFaultAnalysisPieChart,
     TechyBar,
-    NewLineStack,
+    NewLineStack
-    productionRateHeader
+    // productionRateHeader
   },
   data() {
     const quexianDatalist = [
@@ -668,47 +668,13 @@ export default {
   width: calc(375px * var(--beilv));
 }
 
-.fake-legend{
+.fake-legend {
   cursor: unset;
 }
 
 .fake-legend span {
   background: none;
   cursor: none;
-  color: #DFF1FE;
+  color: #dff1fe;
 }
-/* @media all and (max-width: 1680px) {
-  .production-rate {
-    text-align: center;
-  }
-
-  .production-rate >>> .top-icon,
-  .production-rate >>> .date-select {
-    display: none;
-  }
-}
-
-@media all and (min-width: 1680px) {
-  .production-rate {
-    text-align: left;
-  }
-
-  .production-rate >>> .top-icon {
-    display: none;
-  }
-}
-
-@media all and (min-width: 2048px) {
-  .production-rate {
-    text-align: center;
-  }
-
-  .production-rate >>> .date-select > span {
-    background-color: #568588;
-  }
-
-  .production-rate >>> .date-select > span.date-select__active {
-    background-color: #42bbb7;
-  }
-} */
 </style>

src/views/QualityManager/components/TechyTable.vue

@@ -126,8 +126,9 @@ export default {
 }
 
 .visual-base-table-container >>> ::-webkit-scrollbar-button {
-  width: calc(8px * var(--beilv));
+  /* width: calc(8px * var(--beilv));
-  height: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv)); */
+  display: none;
   background: #5bc4bf9f;
   position: relative;
 }
@@ -137,15 +138,10 @@ export default {
   background: #5bc4bf9f;
 }
 
-/* .visual-base-table-container {
-  min-width: 30vw;
-} */
 .visual-base-table-container {
   height: 100%;
 }
-/* .visual-base-table-container >>> .el-table {
+
-  min-width: 120%;
-} */
 /* 清除默认样式 */
 .visual-base-table-container >>> th.gutter {
   display: none;

src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue

@@ -243,20 +243,20 @@ export default {
                 const colorGradient = colors[dataIndex]
                 if (totalRate + percent < 25) {
                   /** 也许这里需要完善，但目前工作良好 */
-                  ;(() => {})()
+                  (() => {})()
                 } else if (totalRate + percent < 50) {
                   colorGradient.x = 0
                   colorGradient.y = 0
                   colorGradient.x2 = 1
                   colorGradient.y2 = 1
-                } else if (totalRate + percent >= 50 && dataIndex == 1) {
+                } else if (totalRate + percent >= 50 && dataIndex === 1) {
                   colorGradient.x = 1
                   colorGradient.y = 1
                   colorGradient.x2 = 0
                   colorGradient.y2 = 0
                 } else if (totalRate + percent < 100) {
                   /** 也许这里需要完善，但目前工作良好 */
-                  ;(() => {})()
+                  (() => {})()
                 }
 
                 totalRate += percent
@@ -306,21 +306,19 @@ export default {
     applyChartOption(datalist) {
       const fs5 = this.calcFontsize(5 /** px*/)
       const fs8 = this.calcFontsize(8 /** px*/)
-      const fs10 = this.calcFontsize(10 /** px*/)
+      // const fs10 = this.calcFontsize(10 /** px*/)
       const fs12 = this.calcFontsize(12 /** px*/)
       const fs13 = this.calcFontsize(13 /** px*/)
-      const fs18 = this.calcFontsize(18 /** px*/)
+      // const fs18 = this.calcFontsize(18 /** px*/)
       const fs20 = this.calcFontsize(20 /** px*/)
       const legendTextFixWidth = this.calcFontsize(48 /** px*/)
       const legnedTop = this.calcFontsize(72 /** px*/)
-      const legendTopRate = this.calcFontsize(30 /** % */)
+      // const legendTopRate = this.calcFontsize(30 /** % */)
 
       this.configs.title.text =
         this.dataPeriod === 'month'
-          ? // 如果是月数据，单位为 千片
+          ? this.dataList.reduce((prev, curr) => prev + curr.value * 1000, 0) // 如果是月数据，单位为 千片
-            this.dataList.reduce((prev, curr) => prev + curr.value * 1000, 0)
+          : this.dataList.reduce((prev, curr) => prev + curr.value, 0) // 如果是日数据，单位为 片
-          : // 如果是日数据，单位为 片
-            this.dataList.reduce((prev, curr) => prev + curr.value, 0)
       this.configs.title.textStyle.fontSize = fs20
       this.configs.title.subtextStyle.fontSize = fs13
 

src/views/material-manage/cockpit/index.vue

@@ -176,16 +176,21 @@ export default {
       const arr = []
       const temp = []
       const productList = ['2.0-1128*1716', '2.0-1128*2251', '2.0-1128*2272', '3.2-1128*1716', '3.2-1128*1718','3.2-1032*1747', '3.2-1033*2089']
+      let cnum = 1
       for (let i = 0; i < 20; i++) {
         const obj = {}
-        const sj = parseInt(Math.random() * 15)
+        const sj = parseInt(Math.random() * 3 + 1)
-        obj.time = moment().subtract(sj, 'days').subtract(sj, 'hours').subtract(sj, 'minute').subtract(sj, 'second').format('YYYY-MM-DD HH:mm:ss')
+        cnum += sj
+        obj.time = moment('20221101 081002').add(cnum, 'days').add(cnum, 'hours').add(cnum, 'minute').add(cnum, 'second').format('YYYY-MM-DD HH:mm:ss')
         obj.productLine = sj % 2 ? 'A' : 'B'
         obj.spec = productList[parseInt(Math.random() * (productList.length))]
-        obj.batch = moment().subtract(sj, 'days').format('YYYYMMDD')
+        obj.batch = moment('20221101 081002').add(cnum, 'days').add(cnum, 'hours').add(cnum, 'minute').add(cnum, 'second').format('YYYYMMDDHH')
         obj.num = parseInt(Math.random() * 800 + 100) + ' (片)'
         arr.push(obj)
       }
+      arr.sort(function (a, b) {
+        return new Date(a.time) - new Date(b.time)
+      })
       this.originalFilmList = arr
       const eqList = [
         {name: '磨边机', fc: ''},
@@ -193,18 +198,23 @@ export default {
         {name: '镀膜机', fc: ['镀膜液', '异丙醇']},
         {name: '包装机', fc: ['隔离纸', '包装辅材']}
       ]
+      let cnum2 = 1
       for (let i = 0; i < 20; i++) {
         const obj = {}
-        const sj = parseInt(Math.random() * 15)
+        const sj = parseInt(Math.random() * 3 + 1)
         const sj2 = parseInt(Math.random() * eqList.length)
         const sj3 = sj % 2 ? 1 : 0
-        obj.time = moment().subtract(sj, 'days').subtract(sj, 'hours').subtract(sj, 'minute').subtract(sj, 'second').format('YYYY-MM-DD HH:mm:ss')
+        cnum2 += sj
+        obj.time = moment('20221015 110314').add(cnum2, 'days').add(cnum2, 'hours').add(cnum2, 'minute').add(cnum2, 'second').format('YYYY-MM-DD HH:mm:ss')
         obj.eqName = eqList[sj2].name
         obj.spec = eqList[sj2].fc ? (eqList[sj2].fc[sj3]) : ''
-        obj.batch = moment().subtract(sj, 'days').format('YYYYMMDD')
+        obj.batch = moment('20221015 110314').add(cnum2, 'days').add(cnum2, 'hours').add(cnum2, 'minute').add(cnum2, 'second').format('YYYYMMDD')
         obj.num = parseInt(Math.random() * 800 + 100)
         temp.push(obj)
       }
+      temp.sort(function (a, b) {
+        return new Date(a.time) - new Date(b.time)
+      })
       this.materialList = temp
       this.bomMsg = [
         { name: '2.0-1128*1716' },

src/views/orderManage/orderManagerCockpit/cockpit.vue

@@ -72,6 +72,7 @@ import screenfull from 'screenfull'
 import BaseTable from './components/baseTable.vue'
 import moment from 'moment'
 import orderStatus from './components/orderStatus.vue'
+import { rateFormatter2 } from '@/filters/index'
 const orderPool = [
   {
     prop: 'customerName',
@@ -125,6 +126,7 @@ const orderMonitiring = [
   {
     prop: 'completion',
     label: '完成率',
+    filter: rateFormatter2,
     minWidth: 24.8
   },
   {
@@ -224,6 +226,7 @@ export default {
         arr1.push(obj)
       }
       this.orderList = arr1
+      const timeArr = ["2022-10-01", "2022-10-03", "2022-10-04", "2022-10-07","2022-10-11", "2022-10-12", "2022-10-15", "2022-10-18", "2022-10-19", "2022-10-21", "2022-10-23", "2022-10-26", "2022-10-27"]
       for (let i = 0; i < 20; i++) {
         const obj = {}
         const sj = parseInt(Math.random() * 200)
@@ -231,8 +234,7 @@ export default {
         obj.orderCode = 'ODFG' + moment().subtract(sj, 'days').subtract(sj, 'hours').subtract(sj, 'minute').subtract(sj, 'second').format('YYYYMMDDHHmmss')
         obj.productName = productList[parseInt(Math.random() * (productList.length))]
         obj.planNum = parseInt(Math.random() * 800 + 100) + '(m²)'
-        obj.planDelivery = moment().add(sj, 'days').format('YYYY-MM-DD')
+        obj.planDelivery = timeArr[i]
-        // obj.status = parseInt(Math.random() * 3 + 1)
         obj.status = 4
         arr2.push(obj)
       }
@@ -243,8 +245,8 @@ export default {
         obj.customerName = compList[parseInt(Math.random() * (compList.length))]
         obj.orderCode = 'ODFG' + moment().subtract(sj, 'days').subtract(sj, 'hours').subtract(sj, 'minute').subtract(sj, 'second').format('YYYYMMDDHHmmss')
         obj.status = parseInt(Math.random() * 3 + 1)
-        obj.completion = obj.status === 1 ? '0.00%' : (obj.status === 3 ? '100%' : parseInt(Math.random() * 100) + '%')
+        obj.completion = obj.status === 1 ? 0.00 : (obj.status === 3 ? 100 : parseInt(Math.random() * 100))
-        obj.yield = parseInt(Math.random() * 50 + 50) + '%'
+        obj.yield = parseInt(Math.random() * 10 + 90) + '%'
         // obj.shiftCosts = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
         // obj.energyCosts = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
         // obj.equipmentCost = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
@@ -257,6 +259,9 @@ export default {
         obj.totalCost = '0'
         temp.push(obj)
       }
+      temp.sort(function (a, b) {
+        return new Date(a.completion) - new Date(b.completion)
+      })
       this.orderMonitiringList = temp
     },
     change() {

src/views/orderManage/orderManagerCockpit/components/orderStatus.vue

@@ -1,19 +1,19 @@
 <template>
   <div class="state-box">
     <span v-if="this.injectData.status === 1">
-      <svg-icon icon-class="yellow_dot" style="font-size: 14px; position: relative; top: .08em" />
+      <svg-icon icon-class="yellow_dot" class="tip"/>
       在途
     </span>
     <span v-if="this.injectData.status === 2">
-      <svg-icon icon-class="blue_dot" style="font-size: 14px; position: relative; top: .08em" />
+      <svg-icon icon-class="blue_dot" class="tip"/>
       已下发
     </span>
     <span v-if="this.injectData.status === 3">
-      <svg-icon icon-class="green_dot" style="font-size: 14px; position: relative; top: .08em" />
+      <svg-icon icon-class="green_dot" class="tip" />
       已完成
     </span>
     <span v-if="this.injectData.status === 4">
-      <svg-icon icon-class="orange_dot" style="font-size: 14px; position: relative; top: .08em" />
+      <svg-icon icon-class="orange_dot" class="tip" />
       待下发
     </span>
   </div>
@@ -44,8 +44,11 @@ export default {
   }
 }
 </script>
-<style scoped>
+<style lang="scss" scoped>
 .state-box {
-  height: calc(15px * var(--beilv))
+  .tip {
+    font-size: calc(14px * var(--beilv));
+    vertical-align: middle;
+  }
 }
 </style>

src/views/orderManage/orderManagerCockpit/components/workOrder.vue

@@ -63,6 +63,7 @@ export default {
   justify-content: space-between;
   .box {
     width: 49.5%;
+    height: 49.5%;
     margin-bottom: 8px;
     background-image: url('../../../../assets/img/cockpit/module-back.png');
     background-repeat: no-repeat;
@@ -92,6 +93,26 @@ export default {
       background: #366F5D;
     }
   }
+  ::-webkit-scrollbar {
+    width: calc(8px * var(--beilv));
+  }
+
+  ::-webkit-scrollbar-track {
+    background-color: #14243f;
+    border-radius: 0;
+  }
+
+  ::-webkit-scrollbar-button {
+    width: calc(8px * var(--beilv));
+    height: calc(8px * var(--beilv));
+    background: #5bc4bf9f;
+    position: relative;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    border-radius: calc(8px * var(--beilv));
+    background: #5bc4bf9f;
+  }
 }
 .progress-box {
   border-radius: 5px;