From fc2ad48243a04090e0ce8df907d7c0beea738c9c Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期二, 12 九月 2023 17:36:27 +0800
Subject: [PATCH] 1.车间质量看板60%

---
 src/views/kanbanManager/cjzl.vue |  749 ++++++++++++++++++++++++++++----------------------------
 1 files changed, 373 insertions(+), 376 deletions(-)

diff --git a/src/views/kanbanManager/cjzl.vue b/src/views/kanbanManager/cjzl.vue
index 8b5a5ff..999e3f1 100644
--- a/src/views/kanbanManager/cjzl.vue
+++ b/src/views/kanbanManager/cjzl.vue
@@ -1,404 +1,401 @@
-<!--<template>-->
-<!--  <div>-->
-<!--    <div class="kb_dashboard">-->
+<template>
+  <div>
+    <div class="kb_dashboard" style="display:flex;flex-direction: column;justify-content: space-between">
 
-<!--      &lt;!&ndash;    鏄熺┖鑳屾櫙&ndash;&gt;-->
-<!--      <div ref="starsRef" class="stars">-->
-<!--        <div v-for="(item, index) in starsCount" :key="index" class="star" />-->
-<!--      </div>-->
+      <!--    鏄熺┖鑳屾櫙-->
+      <!--      <div ref="starsRef" class="stars">-->
+      <!--        <div v-for="(item, index) in starsCount" :key="index" class="star" />-->
+      <!--      </div>-->
 
-<!--      <div class="kb_header">-->
-<!--        <div class="flex_c_c kb_header_text">-->
-<!--          <div id="topBarLeft" style="width:600px;height:100%" />-->
-<!--          杞﹂棿璐ㄩ噺鏁板瓧鍖栫湅鏉�-->
-<!--          <div id="topBarRight" style="width:600px;height:100%;transform:rotate(180deg);" />-->
-<!--        </div>-->
-<!--        <div class="kb_headTime">-->
-<!--          <span>{{ headTime }}</span>-->
-<!--        </div>-->
-<!--      </div>-->
-<!--      <div style="display: flex;justify-content: space-between;padding:0 20px 20px 20px">-->
-<!--        &lt;!&ndash;        宸﹁竟閮ㄥ垎&ndash;&gt;-->
-<!--        <div style="width: 470px;height: 969px;" class="flex_c_b">-->
-<!--          <div>-->
-<!--            <div class="smallTitle">-->
-<!--              <svg-icon icon-class="top5" class="svg_class" />-->
-<!--              Top5涓嶈壇-->
-<!--            </div>-->
-<!--            <div class="lineContent horn">-->
-<!--              <div id="bar01" class="flex_c_c" style="width: 100%;height:100%" />-->
-<!--            </div>-->
-<!--          </div>-->
-<!--          <div>-->
-<!--            <div class="smallTitle">-->
-<!--              <svg-icon icon-class="bll" class="svg_class" style="font-size: 30px" />-->
-<!--              鍛ㄤ笉鑹秼鍔�-->
-<!--            </div>-->
-<!--            <div class="lineContent horn">-->
-<!--              <div id="line01" class="flex_c_c" style="width: 100%;height:100%" />-->
-<!--            </div>-->
+      <div class="kb_header">
+        <div class="flex_c_c kb_header_text">
+          <div id="topBarLeft" style="width:600px;height:100%" />
+          杞﹂棿璐ㄩ噺鏁板瓧鍖栫湅鏉�
+          <div id="topBarRight" style="width:600px;height:100%;transform:rotate(180deg);" />
+        </div>
 
-<!--          </div>-->
-<!--        </div>-->
-<!--        &lt;!&ndash;        涓棿閮ㄥ垎&ndash;&gt;-->
-<!--        <div>-->
-<!--          <div class="smallTitle">-->
-<!--            <svg-icon icon-class="blmx" class="svg_class" />-->
-<!--            涓嶈壇鏄庣粏-->
-<!--          </div>-->
-<!--          <div class="lineContentCenter horn">-->
-<!--            <el-table-->
-<!--              ref="tableDataLeftCenterRef"-->
-<!--              :data="tableDataCenterTop"-->
-<!--              class="tableData tableDataCell"-->
-<!--              style="width: 100%;"-->
-<!--              :header-cell-style="headerCellStyleCenter"-->
-<!--              :cell-style="cellStyleCenter"-->
-<!--              height="927"-->
-<!--            >-->
-<!--              <el-table-column-->
-<!--                prop="lm_date"-->
-<!--                label="鏃ユ湡"-->
-<!--                width="100"-->
-<!--              >-->
-<!--                <template slot-scope="{row}">-->
-<!--                  <div-->
-<!--                    v-if="row.lm_date"-->
-<!--                  >-->
-<!--                    {{ row.lm_date.substring(0,11) }}-->
-<!--                  </div>-->
-<!--                  <div v-else />-->
-<!--                </template>-->
-<!--              </el-table-column>-->
-<!--              <el-table-column-->
-<!--                prop="eqp_name"-->
-<!--                width="80"-->
-<!--                label="浜х嚎鍚嶇О"-->
-<!--              >-->
-<!--                <template slot-scope="{row}">-->
-<!--                  <div>{{ row.eqp_name }}</div>-->
-<!--                </template>-->
-<!--              </el-table-column>-->
-<!--              <el-table-column-->
-<!--                prop="wo_code"-->
-<!--                label="鐢熶骇鍗曞彿"-->
-<!--                width="173"-->
-<!--              >-->
-<!--                <template slot-scope="{row}">-->
-<!--                  <div style="color: #00FFFF">{{ row.wo_code }}</div>-->
-<!--                </template>-->
-<!--              </el-table-column>-->
+        <div class="kb_headTime" style="left: 85px">
+          <span>娴欐睙鏂板嚡杩暟瀛楃鎶�鑲′唤鏈夐檺鍏徃</span>
+        </div>
 
-<!--              <el-table-column-->
-<!--                prop="partname"-->
-<!--                width="190"-->
-<!--                label="浜у搧鍚嶇О"-->
-<!--              >-->
-<!--                <template slot-scope="{row}">-->
-<!--                  <div class="ellipsis">{{ row.partname }}</div>-->
-<!--                </template>-->
-<!--              </el-table-column>-->
-<!--              <el-table-column-->
-<!--                prop="defect_name"-->
-<!--                label="涓嶈壇鍘熷洜"-->
-<!--                width="120"-->
-<!--              >-->
-<!--                <template slot-scope="{row}">-->
-<!--                  <div style="color:#ff0000;" class="ellipsis">{{ row.defect_name }}</div>-->
-<!--                </template>-->
-<!--              </el-table-column>-->
-<!--              <el-table-column-->
-<!--                prop="ng_qty"-->
-<!--                label="涓嶈壇鏁伴噺"-->
-<!--                width="77"-->
-<!--              />-->
-<!--              <el-table-column-->
-<!--                prop="report_qty"-->
-<!--                label="鎶ュ伐鏁伴噺"-->
-<!--                width="77"-->
-<!--              />-->
-<!--              <el-table-column-->
-<!--                label="涓嶈壇鍗犳瘮"-->
-<!--                width="77"-->
-<!--              >-->
-<!--                <template slot-scope="{row}">-->
-<!--                  <div>{{ parseFloat((row.ng_qty*100/(row.ng_qty+row.report_qty)).toFixed(2)) }}%</div>-->
-<!--                </template>-->
-<!--              </el-table-column>-->
+        <div class="kb_headTime">
+          <span>{{ headTime }}</span>
+        </div>
+      </div>
+      <div style=" padding:5px 20px 20px 20px;height: 980px;flex-direction: column;justify-content: space-between">
+        <!--         涓婇潰閮ㄥ垎-->
+        <div>
+          <div class="smallTitle">
+            <svg-icon icon-class="blcs" class="svg_class" />
+            鏃ヤ笉鑹鏁�
+          </div>
+          <div class="lineContent horn" style="height: 250px;display: flex;justify-content: space-between">
+            <div id="cjzl01" class="flex_c_c" style="width: 300px;height:100%" />
+            <div id="cjzl02_1" class="flex_c_c" style="width: 300px;height:100%" />
+            <div id="cjzl02_2" class="flex_c_c" style="width: 300px;height:100%" />
+            <div id="cjzl02_3" class="flex_c_c" style="width: 300px;height:100%" />
+            <div id="cjzl02_4" class="flex_c_c" style="width: 300px;height:100%" />
+            <div id="cjzl02_5" class="flex_c_c" style="width: 300px;height:100%" />
+          </div>
+        </div>
+        <!--        涓棿閮ㄥ垎-->
+        <div style="display: flex;justify-content: space-between;margin-top: 20px">
+          <div>
+            <div class="smallTitle">
+              <svg-icon icon-class="zbls" class="svg_class" />
+              鍛ㄤ笉鑹暟
+            </div>
+            <div class="lineContent horn" style="height: 250px;display: flex;justify-content: space-between">
+              <div id="cjzl04" class="flex_c_c" style="width: 920px;height:100%" />
+            </div>
+          </div>
+          <div>
+            <div class="smallTitle">
+              <svg-icon icon-class="zwcs" class="svg_class" />
+              鍛ㄥ畬鎴愭暟锛堢巼锛�
+            </div>
+            <div class="lineContent horn" style="height: 250px;display: flex;justify-content: space-between">
+              <div id="cjzl03" class="flex_c_c" style="width: 920px;height:100%" />
+            </div>
+          </div>
 
-<!--            </el-table>-->
-<!--          </div>-->
-<!--        </div>-->
-<!--        &lt;!&ndash;        鍙宠竟閮ㄥ垎&ndash;&gt;-->
-<!--        <div style="width: 470px;height: 969px;" class="flex_c_b">-->
-<!--          <div>-->
-<!--            <div class="smallTitle">-->
-<!--              <svg-icon icon-class="rbl" class="svg_class" style="font-size: 28px" />-->
-<!--              鏃ヤ笉鑹垎甯�-->
-<!--            </div>-->
-<!--            <div class="lineContent horn">-->
-<!--              <div id="bar02" class="flex_c_c" style="width: 100%;height:100%" />-->
-<!--            </div>-->
-<!--          </div>-->
-<!--          <div>-->
-<!--            <div class="smallTitle">-->
-<!--              <svg-icon icon-class="zbl" class="svg_class" style="font-size: 28px" />-->
-<!--              鍛ㄤ笉鑹垎甯�-->
-<!--            </div>-->
-<!--            <div class="lineContent horn">-->
-<!--              <div id="pie01" class="flex_c_c" style="width: 100%;height:100%" />-->
-<!--            </div>-->
+        </div>
+        <!--        涓嬮潰閮ㄥ垎-->
+        <div style="margin-top: 20px">
+          <div class="smallTitle">
+            <svg-icon icon-class="cjrw" class="svg_class" />
+            杞﹂棿浠诲姟瀹屾垚鎯呭喌
+          </div>
+          <div class="lineContent horn" style="height: 310px;display: flex;justify-content: space-between">
+            <el-table
+              ref="tableDataRightTopRef"
+              :data="tableDataRightTop"
+              class="tableData"
+              style="width: 100%;"
+              :header-cell-style="headerCellStyle"
+              :cell-style="cellStyle"
+            >
+              <!--              height=""-->
+              <el-table-column
+                type="index"
+                label="搴忓彿"
+                width="60"
+              />
+              <el-table-column
+                prop="cjmc"
+                width="220"
+                label="杞﹂棿鍚嶇О"
+              />
+              <el-table-column
+                prop="gdh"
+                width="280"
+                label="宸ュ崟鍙�"
+              />
+              <el-table-column
+                prop="cpmc"
+                width="280"
+                label="浜у搧鍚嶇О"
+              />
+              <el-table-column
+                prop="cpgg"
+                width="280"
+                label="浜у搧瑙勬牸"
+              />
+              <el-table-column
+                prop="rwsl"
+                width="220"
+                label="浠诲姟鏁�"
+              />
+              <el-table-column
+                prop="hgsl"
+                width="220"
+                label="鍚堟牸鏁伴噺"
+              />
+              <el-table-column
+                prop="blsl"
+                width="314"
+                label="涓嶈壇鏁伴噺"
+              />
+            </el-table>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
 
-<!--          </div>-->
-<!--        </div>-->
-<!--      </div>-->
-<!--    </div>-->
-<!--  </div>-->
-<!--</template>-->
+<script>
+import './kbCommon.css'
+import { cjzl01, cjzl02, cjzl03, cjzl04, kbTop, loadEcharts } from '@/utils/myEcharts'
+import { QCBadCenterLeftWeek, QCBadCenterRightWeek, QCBadTop, ShopSearch } from '@/api/kanbanManager'
 
-<!--<script>-->
-<!--import './kbCommon.css'-->
-<!--import { bar02, bar04, kbTop, line02, loadEcharts, pie02 } from '@/utils/myEcharts'-->
-<!--import { BadContManger, BadDayDistriBute, BadTop5, BadWeek, BadWeekDistriBute } from '@/api/dzkb'-->
+export default {
+  name: 'Cjsc',
+  data() {
+    return {
+      headTime: '',
+      tableDataRightTop: [
+        { cjmc: '绮惧伐杞﹂棿', gdh: 'MO2023-09-12', cpmc: '鐢垫睜鍖�1', cpgg: '23娆炬墜鍔ㄧ簿妯�', rwsl: '1000', hgsl: '900', blsl: '100' },
+        { cjmc: '瑁呴厤杞﹂棿', gdh: 'MO2023-09-12', cpmc: '鐢垫睜鍖�1', cpgg: '23娆炬墜鍔ㄧ簿妯�', rwsl: '1000', hgsl: '900', blsl: '100' },
+        { cjmc: '绮惧伐杞﹂棿', gdh: 'MO2023-09-12', cpmc: '鐢垫睜鍖�1', cpgg: '23娆炬墜鍔ㄧ簿妯�', rwsl: '1000', hgsl: '900', blsl: '100' },
+        { cjmc: '瑁呴厤杞﹂棿', gdh: 'MO2023-09-12', cpmc: '鐢垫睜鍖�1', cpgg: '23娆炬墜鍔ㄧ簿妯�', rwsl: '1000', hgsl: '900', blsl: '100' },
+        { cjmc: '鏈哄姞宸ヨ溅闂�', gdh: 'MO2023-09-12', cpmc: '鐢垫睜鍖�1', cpgg: '23娆炬墜鍔ㄧ簿妯�#30', rwsl: '1000', hgsl: '900', blsl: '100' },
+        { cjmc: '鏈哄姞宸ヨ溅闂�', gdh: 'MO2023-09-12', cpmc: '鐢垫睜鍖�1', cpgg: '23娆炬墜鍔ㄧ簿妯�#30', rwsl: '1000', hgsl: '900', blsl: '100' },
+        { cjmc: '鏈哄姞宸ヨ溅闂�', gdh: 'MO2023-09-12', cpmc: '鐢垫睜鍖�1', cpgg: '23娆炬墜鍔ㄧ簿妯�#30', rwsl: '1000', hgsl: '900', blsl: '100' },
+        { cjmc: '鏈哄姞宸ヨ溅闂�', gdh: 'MO2023-09-12', cpmc: '鐢垫睜鍖�1', cpgg: '23娆炬墜鍔ㄧ簿妯�#30', rwsl: '1000', hgsl: '900', blsl: '100' },
+        { cjmc: '鏈哄姞宸ヨ溅闂�', gdh: 'MO2023-09-12', cpmc: '鐢垫睜鍖�1', cpgg: '23娆炬墜鍔ㄧ簿妯�#30', rwsl: '1000', hgsl: '900', blsl: '100' }
+      ],
+      wkshopArr: [],
 
-<!--export default {-->
-<!--  name: 'Cjsc',-->
-<!--  data() {-->
-<!--    return {-->
-<!--      headTime: '',-->
+      cjzl01Data: [],
+      cjzl02_1Title: '',
+      cjzl02_1Data: [],
+      cjzl02_2Title: '',
+      cjzl02_21Data: [],
+      cjzl02_3Title: '',
+      cjzl02_3Data: [],
+      cjzl02_4Title: '',
+      cjzl02_4Data: [],
+      cjzl02_5Title: '',
+      cjzl02_5Data: [],
+      starsCount: 800, // 鏄熸槦鏁伴噺
+      distance: 900 // 闂磋窛
+    }
+  },
+  created() {
+    setInterval(this.getNowTime, 1000)
 
-<!--      tableDataCenterTop: [],-->
-<!--      tableDataCenterTopTemp: [],-->
+    // 涓ゅ皬鏃剁湅鏉垮埛鏂颁竴娆�
+    setInterval(() => {
+      window.location.reload()
+    }, 1000 * 60 * 120)
+  },
+  mounted() {
+    this.getTopBar()
 
-<!--      StepCode: '02',-->
+    this.getAllApi()
 
-<!--      starsCount: 800, // 鏄熸槦鏁伴噺-->
-<!--      distance: 900 // 闂磋窛-->
-<!--    }-->
-<!--  },-->
-<!--  created() {-->
-<!--    setInterval(this.getNowTime, 1000)-->
+    // this.setStarsRef()
+  },
+  methods: {
+    async getAllApi() {
+      const { data: res } = await ShopSearch()
+      this.wkshopArr = res
+      const temp = ['001', 'CJ001', '006', 'ZS001', '002']
+      const { data: res2 } = await QCBadTop({ wkshopcode: temp.join(',') })
+      for (const res2Key in res2) {
+        if (res2Key === 'ALL') {
+          this.cjzl01Data = res2[res2Key].map(i => {
+            return {
+              name: i.name,
+              value: i.cont
+            }
+          })
+        }
+        if (res2Key === temp[0]) {
+          this.cjzl02_1Title = this.wkshopArr.find(i => i.org_code === res2Key).org_name
+          this.cjzl02_1Data = res2[res2Key].map(i => {
+            return {
+              name: i.name,
+              value: i.cont
+            }
+          })
+        }
+        if (res2Key === temp[1]) {
+          this.cjzl02_2Title = this.wkshopArr.find(i => i.org_code === res2Key).org_name
+          this.cjzl02_2Data = res2[res2Key].map(i => {
+            return {
+              name: i.name,
+              value: i.cont
+            }
+          })
+        }
+        if (res2Key === temp[2]) {
+          this.cjzl02_3Title = this.wkshopArr.find(i => i.org_code === res2Key).org_name
+          this.cjzl02_3Data = res2[res2Key].map(i => {
+            return {
+              name: i.name,
+              value: i.cont
+            }
+          })
+        }
+        if (res2Key === temp[3]) {
+          this.cjzl02_4Title = this.wkshopArr.find(i => i.org_code === res2Key).org_name
+          this.cjzl02_4Data = res2[res2Key].map(i => {
+            return {
+              name: i.name,
+              value: i.cont
+            }
+          })
+        }
+        if (res2Key === temp[4]) {
+          this.cjzl02_5Title = this.wkshopArr.find(i => i.org_code === res2Key).org_name
+          this.cjzl02_5Data = res2[res2Key].map(i => {
+            return {
+              name: i.name,
+              value: i.cont
+            }
+          })
+        }
+      }
 
-<!--    // 涓ゅ皬鏃剁湅鏉垮埛鏂颁竴娆�-->
-<!--    setInterval(() => {-->
-<!--      window.location.reload()-->
-<!--    }, 1000 * 60 * 120)-->
-<!--  },-->
-<!--  mounted() {-->
-<!--    this.getTopBar()-->
+      const { data: res3 } = await QCBadCenterLeftWeek({ wkshopcode: temp.join(',') })
+      console.log(res3) // 杩欎釜鏄庡ぉ鍐�
 
-<!--    this.getCenterTableDataSetInterval()-->
+      const { data: res4 } = await QCBadCenterRightWeek({ wkshopcode: temp.join(',') })
+      console.log(res4)
 
-<!--    this.getEcharts()-->
+      this.getEcharts()
+    },
+    setStarsRef() {
+      const starNodes = Array.from(this.$refs.starsRef.children)
+      starNodes.forEach(item => {
+        const speed = 0.2 + Math.random() * 1
+        const thisDistance = this.distance + Math.random() * 300
+        item.style.transformOrigin = `0 0 ${thisDistance}px`
+        item.style.transform = `
+        translate3d(0,0,-${thisDistance}px)
+        rotateY(${Math.random() * 360}deg)
+        rotateX(${Math.random() * -50}deg)
+        scale(${speed},${speed})`
+      })
+    },
+    // 鑾峰彇Echarts
+    getEcharts() {
+      loadEcharts('cjzl01', cjzl01(this.cjzl01Data))
 
-<!--    this.setStarsRef()-->
-<!--  },-->
-<!--  methods: {-->
-<!--    setStarsRef() {-->
-<!--      const starNodes = Array.from(this.$refs.starsRef.children)-->
-<!--      starNodes.forEach(item => {-->
-<!--        const speed = 0.2 + Math.random() * 1-->
-<!--        const thisDistance = this.distance + Math.random() * 300-->
-<!--        item.style.transformOrigin = `0 0 ${thisDistance}px`-->
-<!--        item.style.transform = `-->
-<!--        translate3d(0,0,-${thisDistance}px)-->
-<!--        rotateY(${Math.random() * 360}deg)-->
-<!--        rotateX(${Math.random() * -50}deg)-->
-<!--        scale(${speed},${speed})`-->
-<!--      })-->
-<!--    },-->
-<!--    // 鑾峰彇Echarts-->
-<!--    getEcharts() {-->
-<!--      this.getLeftTopEcharts()-->
-<!--      setInterval(() => {-->
-<!--        this.getLeftTopEcharts()-->
-<!--      }, 1000 * 10)-->
+      loadEcharts('cjzl02_1', cjzl02(this.cjzl02_1Title, this.cjzl02_1Data))
+      loadEcharts('cjzl02_2', cjzl02(this.cjzl02_2Title, this.cjzl02_2Data))
+      loadEcharts('cjzl02_3', cjzl02(this.cjzl02_3Title, this.cjzl02_3Data))
+      loadEcharts('cjzl02_4', cjzl02(this.cjzl02_4Title, this.cjzl02_4Data))
+      loadEcharts('cjzl02_5', cjzl02(this.cjzl02_5Title, this.cjzl02_5Data))
 
-<!--      this.getLeftBottomEcharts()-->
-<!--      setInterval(() => {-->
-<!--        this.getLeftBottomEcharts()-->
-<!--      }, 1000 * 10)-->
+      loadEcharts('cjzl03', cjzl03())
+      loadEcharts('cjzl04', cjzl04())
+    },
 
-<!--      this.getRightTopEcharts()-->
-<!--      setInterval(() => {-->
-<!--        this.getRightTopEcharts()-->
-<!--      }, 1000 * 10)-->
+    // 鑾峰彇topEcharts
+    getTopBar() {
+      loadEcharts('topBarLeft', kbTop())
+      loadEcharts('topBarRight', kbTop())
+    },
+    // 鑾峰彇褰撳墠鏃堕棿
+    getNowTime() {
+      const dt = new Date()
+      const wk = dt.getDay()
+      const y = dt.getFullYear()
+      const m = (dt.getMonth() + 1 + '').padStart(2, '0')
+      const d = (dt.getDate() + '').padStart(2, '0')
 
-<!--      this.getRightBottomEcharts()-->
-<!--      setInterval(() => {-->
-<!--        this.getRightBottomEcharts()-->
-<!--      }, 1000 * 10)-->
-<!--    },-->
-<!--    getLeftTopEcharts() {-->
-<!--      BadTop5({ StepCode: this.StepCode }).then(res => {-->
-<!--        const dataArr = res.data.map(i => i.cont)-->
-<!--        const titlenameArr = res.data.map(i => i.name)-->
-<!--        loadEcharts('bar01', bar02(dataArr, titlenameArr))-->
-<!--      })-->
-<!--    },-->
-<!--    getLeftBottomEcharts() {-->
-<!--      BadWeek({ StepCode: this.StepCode }).then(res => {-->
-<!--        const dataX = res.data.map(i => i.click_date)-->
-<!--        const dataY = res.data.map(i => i.count)-->
-<!--        loadEcharts('line01', line02(dataX, dataY))-->
-<!--      })-->
-<!--    },-->
-<!--    getRightTopEcharts() {-->
-<!--      BadDayDistriBute({ StepCode: this.StepCode }).then(res => {-->
-<!--        loadEcharts('bar02', bar04(res.data))-->
-<!--      })-->
-<!--    },-->
-<!--    getRightBottomEcharts() {-->
-<!--      BadWeekDistriBute({ StepCode: this.StepCode }).then(res => {-->
-<!--        loadEcharts('pie01', pie02(res.data))-->
-<!--      })-->
-<!--    },-->
-<!--    // 涓棿閮ㄥ垎鐨勮〃鏍�-->
-<!--    getCenterTableDataSetInterval() {-->
-<!--      let startValue = 0 // 鍒濆鍊�-->
-<!--      const scale = 23// 鍒诲害-->
-<!--      BadContManger({ StepCode: this.StepCode }).then(res => {-->
-<!--        this.tableDataCenterTopTemp = res.data-->
-<!--        this.tableDataCenterTop = this.tableDataCenterTopTemp.slice(startValue, startValue + scale)-->
+      const hh = (dt.getHours() + '').padStart(2, '0')
+      const mm = (dt.getMinutes() + '').padStart(2, '0')
+      const ss = (dt.getSeconds() + '').padStart(2, '0')
+      const weeks = ['鏄熸湡鏃�', '鏄熸湡涓�', '鏄熸湡浜�', '鏄熸湡涓�', '鏄熸湡鍥�', '鏄熸湡浜�', '鏄熸湡鍏�']
+      const week = weeks[wk]
 
-<!--        const loop = Math.floor(this.tableDataCenterTopTemp.length / scale)// 闇�瑕佸惊鐜殑娆℃暟-->
-<!--        let nowLoop = 0// 褰撳墠寰幆鐨勬鏁�-->
+      this.headTime = `${y}-${m}-${d}  ${hh}:${mm}:${ss}   ${week}`
+    },
+    headerCellStyle() {
+      return {
+        // backgroundColor: 'rgb(30 ,33, 46)',
+        backgroundColor: '#000',
+        padding: '10px 0',
+        textAlign: 'center',
+        color: '#07acc2',
+        border: 'none'
+      }
+    },
+    cellStyle() {
+      return {
+        padding: '7px 0',
+        textAlign: 'center',
+        // backgroundColor: 'rgba(30, 33, 46)',
+        backgroundColor: '#000',
+        // backgroundColor: 'transparent',
+        color: '#fff',
+        border: 'none'
+      }
+    },
+    headerCellStyleCenter() {
+      return {
+        // backgroundColor: 'rgb(30 ,33, 46)',
+        backgroundColor: '#000',
+        padding: '10px 0',
+        textAlign: 'center',
+        color: '#07acc2',
+        border: 'none',
+        fontSize: '20px'
+      }
+    },
+    cellStyleCenter() {
+      return {
+        padding: '7.5px 0',
+        textAlign: 'center',
+        backgroundColor: '#000',
+        color: '#fff',
+        border: 'none',
+        fontSize: '20px'
+      }
+    }
+  }
 
-<!--        const timer = setInterval(() => {-->
-<!--          startValue = startValue + scale-->
-<!--          this.tableDataCenterTop = this.tableDataCenterTopTemp.slice(startValue, startValue + scale)-->
-<!--          if (nowLoop === loop) {-->
-<!--            clearInterval(timer)-->
-<!--            this.getCenterTableDataSetInterval()-->
-<!--          }-->
+}
+</script>
 
-<!--          nowLoop++-->
-<!--        }, 1000 * 10)-->
-<!--      })-->
-<!--    },-->
+<style lang="scss" scoped>
+$main_color: #09d8f2;
+$color01: #00FFFF;
+.tableData {
+  background: #000;
+}
 
-<!--    // 鑾峰彇topEcharts-->
-<!--    getTopBar() {-->
-<!--      loadEcharts('topBarLeft', kbTop())-->
-<!--      loadEcharts('topBarRight', kbTop())-->
-<!--    },-->
-<!--    // 鑾峰彇褰撳墠鏃堕棿-->
-<!--    getNowTime() {-->
-<!--      const dt = new Date()-->
-<!--      const wk = dt.getDay()-->
-<!--      const y = dt.getFullYear()-->
-<!--      const m = (dt.getMonth() + 1 + '').padStart(2, '0')-->
-<!--      const d = (dt.getDate() + '').padStart(2, '0')-->
+.el-table::before {
+  height: 0;
+}
 
-<!--      const hh = (dt.getHours() + '').padStart(2, '0')-->
-<!--      const mm = (dt.getMinutes() + '').padStart(2, '0')-->
-<!--      const ss = (dt.getSeconds() + '').padStart(2, '0')-->
-<!--      const weeks = ['鏄熸湡鏃�', '鏄熸湡涓�', '鏄熸湡浜�', '鏄熸湡涓�', '鏄熸湡鍥�', '鏄熸湡浜�', '鏄熸湡鍏�']-->
-<!--      const week = weeks[wk]-->
+.el-table__empty-text {
+  color: $main_color;
+}
 
-<!--      this.headTime = `${y}-${m}-${d}  ${hh}:${mm}:${ss}   ${week}`-->
-<!--    },-->
-<!--    headerCellStyle() {-->
-<!--      return {-->
-<!--        // backgroundColor: 'rgb(30 ,33, 46)',-->
-<!--        backgroundColor: '#000',-->
-<!--        padding: '10px 0',-->
-<!--        textAlign: 'center',-->
-<!--        color: '#07acc2',-->
-<!--        border: 'none'-->
-<!--      }-->
-<!--    },-->
-<!--    cellStyle() {-->
-<!--      return {-->
-<!--        padding: '7px 0',-->
-<!--        textAlign: 'center',-->
-<!--        // backgroundColor: 'rgba(30, 33, 46)',-->
-<!--        backgroundColor: '#000',-->
-<!--        // backgroundColor: 'transparent',-->
-<!--        color: '#fff',-->
-<!--        border: 'none'-->
-<!--      }-->
-<!--    },-->
-<!--    headerCellStyleCenter() {-->
-<!--      return {-->
-<!--        // backgroundColor: 'rgb(30 ,33, 46)',-->
-<!--        backgroundColor: '#000',-->
-<!--        padding: '10px 0',-->
-<!--        textAlign: 'center',-->
-<!--        color: '#07acc2',-->
-<!--        border: 'none',-->
-<!--        fontSize: '18px'-->
-<!--      }-->
-<!--    },-->
-<!--    cellStyleCenter() {-->
-<!--      return {-->
-<!--        padding: '7.5px 0',-->
-<!--        textAlign: 'center',-->
-<!--        backgroundColor: '#000',-->
-<!--        color: '#fff',-->
-<!--        border: 'none',-->
-<!--        fontSize: '18px'-->
-<!--      }-->
-<!--    }-->
-<!--  }-->
+.tableDataCell {
+  ::v-deep .cell {
+    padding: 0 2px;
+  }
+}
 
-<!--}-->
-<!--</script>-->
+</style>
 
-<!--<style lang="scss" scoped>-->
-<!--$main_color:#09d8f2;-->
-<!--$color01: #00FFFF;-->
-<!--.tableData{-->
-<!--  background: #000;-->
-<!--}-->
+<!--鏄熺┖-->
+<style lang="css" scoped>
+@keyframes rotate {
+  0% {
+    transform: perspective(400px) rotateZ(20deg) rotateX(-40deg) rotateY(0);
+  }
+  100% {
+    transform: perspective(400px) rotateZ(20deg) rotateX(-40deg) rotateY(-360deg);
+  }
+}
 
-<!--.el-table::before{-->
-<!--  height: 0;-->
-<!--}-->
+.stars {
+  transform: perspective(500px);
+  transform-style: preserve-3d;
+  position: absolute;
+  perspective-origin: 50% 100%;
+  left: 45%;
+  animation: rotate 90s infinite linear;
+  bottom: 0;
+  z-index: 102;
+}
 
-<!--.el-table__empty-text{-->
-<!--  color: $main_color;-->
-<!--}-->
-
-<!--.tableDataCell {-->
-<!--  ::v-deep .cell{-->
-<!--    padding: 0 2px ;-->
-<!--  }-->
-<!--}-->
-
-<!--</style>-->
-
-<!--&lt;!&ndash;鏄熺┖&ndash;&gt;-->
-<!--<style lang="css" scoped>-->
-<!--@keyframes rotate {-->
-<!--  0% {-->
-<!--    transform: perspective(400px) rotateZ(20deg) rotateX(-40deg) rotateY(0);-->
-<!--  }-->
-<!--  100% {-->
-<!--    transform: perspective(400px) rotateZ(20deg) rotateX(-40deg) rotateY(-360deg);-->
-<!--  }-->
-<!--}-->
-
-<!--.stars {-->
-<!--  transform: perspective(500px);-->
-<!--  transform-style: preserve-3d;-->
-<!--  position: absolute;-->
-<!--  perspective-origin: 50% 100%;-->
-<!--  left: 45%;-->
-<!--  animation: rotate 90s infinite linear;-->
-<!--  bottom: 0;-->
-<!--  z-index: 102;-->
-<!--}-->
-
-<!--.star {-->
-<!--  width: 2px;-->
-<!--  height: 2px;-->
-<!--  /*background: #f7f7b6;*/-->
-<!--  background: #8edffc;-->
-<!--  position: absolute;-->
-<!--  left: 0;-->
-<!--  top: 0;-->
-<!--  backface-visibility: hidden;-->
-<!--  z-index: 102;-->
-<!--}-->
-<!--</style>-->
+.star {
+  width: 2px;
+  height: 2px;
+  /*background: #f7f7b6;*/
+  background: #8edffc;
+  position: absolute;
+  left: 0;
+  top: 0;
+  backface-visibility: hidden;
+  z-index: 102;
+}
+</style>

--
Gitblit v1.9.3