From c02a3ebf5b4338710c4f9ae231d72cf591dfb97f Mon Sep 17 00:00:00 2001
From: 小小儁爺 <1694218219@qq.com>
Date: 星期一, 02 十二月 2024 11:28:04 +0800
Subject: [PATCH] 1.修改  批量派发 没绑定工艺路线的单子,显示在最前面

---
 src/views/kanbanManager/cjzl.vue |  850 +++++++++++++++++++++++++++++++------------------------
 1 files changed, 479 insertions(+), 371 deletions(-)

diff --git a/src/views/kanbanManager/cjzl.vue b/src/views/kanbanManager/cjzl.vue
index 8b5a5ff..3e1ad1d 100644
--- a/src/views/kanbanManager/cjzl.vue
+++ b/src/views/kanbanManager/cjzl.vue
@@ -1,404 +1,512 @@
-<!--<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 class="kb_backgroundCustom" />
 
-<!--      <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="kb_headTime" style="top: 35px;left:  20px">
+          <span>娴欐睙姝f竻鍜屾棩鐢ㄥ埗鍝佹湁闄愬叕鍙�</span>
+        </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 kb_header_text" style="top: 35px;left:  800px">
+          <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" style="top: 35px;right:  25px">
+          <span>{{ headTime }}</span>
+        </div>
+      </div>
+      <div
+        style=" padding:5px 20px 20px 20px;z-index:2;height: 950px;flex-direction: column;justify-content: space-between;"
+      >
+        <!--         涓婇潰閮ㄥ垎-->
+        <div style="">
+          <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="cjzl03" 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="cjzl04" 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: 280px;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="275"
+            >
+              <!--              height=""-->
+              <el-table-column
+                type="index"
+                label="搴忓彿"
+                width="60"
+              />
+              <el-table-column
+                prop="wkshp_name"
+                width="220"
+                label="杞﹂棿鍚嶇О"
+              />
+              <el-table-column
+                prop="wo_code"
+                width="280"
+                label="宸ュ崟鍙�"
+              />
+              <el-table-column
+                prop="partname"
+                width="280"
+                label="浜у搧鍚嶇О"
+              />
+              <el-table-column
+                prop="partspec"
+                width="280"
+                label="浜у搧瑙勬牸"
+              >
+                <template slot-scope="{row}">
+                  {{ row.partspec ? row.partspec : '/' }}
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="plan_qty"
+                width="220"
+                label="浠诲姟鏁�"
+              />
+              <el-table-column
+                prop="good_qty"
+                width="220"
+                label="鍚堟牸鏁伴噺"
+              />
+              <el-table-column
+                prop="radio"
+                width="314"
+                label="瀹屾垚鐜�(%)"
+              />
+            </el-table>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
 
-<!--          </div>-->
-<!--        </div>-->
-<!--      </div>-->
-<!--    </div>-->
-<!--  </div>-->
-<!--</template>-->
+<script>
+import './kbCommon.css'
+import { cjzl01, cjzl02, cjzl04, cjzl03, loadEcharts } from '@/utils/myEcharts'
+import {
+  QCBadBottomWeek,
+  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: [],
+      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: [],
+      cjzl03_xData: [],
+      cjzl03_yData: [],
+      legendData: [],
+      cjzl04Data: []
+    }
+  },
+  created() {
+    setInterval(this.getNowTime, 1000)
 
-<!--      tableDataCenterTop: [],-->
-<!--      tableDataCenterTopTemp: [],-->
+    // // 涓ゅ皬鏃剁湅鏉垮埛鏂颁竴娆�
+    setInterval(() => {
+      window.location.reload()
+    }, 1000 * 60 * 120)
+  },
+  mounted() {
+    this.getAllApi()
+  },
+  methods: {
+    async getAllApi() {
+      const { data: res } = await ShopSearch()
+      this.wkshopArr = res
+      // const temp = ['001', 'CJ001', '006', 'ZS001', '002']
+      const temp = this.wkshopArr.map(i => i.org_code)
 
-<!--      StepCode: '02',-->
+      temp.forEach(i => {
+        const aa = this.wkshopArr.find(j => j.org_code === i).org_name
+        this.legendData.push(aa)
+      })
 
-<!--      starsCount: 800, // 鏄熸槦鏁伴噺-->
-<!--      distance: 900 // 闂磋窛-->
-<!--    }-->
-<!--  },-->
-<!--  created() {-->
-<!--    setInterval(this.getNowTime, 1000)-->
+      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
+            }
+          })
+        }
+      }
+      loadEcharts('cjzl01', cjzl01(this.cjzl01Data))
+      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))
+      setInterval(() => {
+        QCBadTop({ wkshopcode: temp.join(',') }).then(res2 => {
+          for (const res2Key in res2.data) {
+            if (res2Key === 'ALL') {
+              this.cjzl01Data = res2.data[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.data[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.data[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.data[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.data[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.data[res2Key].map(i => {
+                return {
+                  name: i.name,
+                  value: i.cont
+                }
+              })
+            }
+          }
+        })
+        loadEcharts('cjzl01', cjzl01(this.cjzl01Data))
+        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))
+      }, 1000 * 30)
 
-<!--    // 涓ゅ皬鏃剁湅鏉垮埛鏂颁竴娆�-->
-<!--    setInterval(() => {-->
-<!--      window.location.reload()-->
-<!--    }, 1000 * 60 * 120)-->
-<!--  },-->
-<!--  mounted() {-->
-<!--    this.getTopBar()-->
+      const { data: res3 } = await QCBadCenterLeftWeek({ wkshopcode: temp.join(',') })// 宸︿晶
+      for (const res3Key in res3) {
+        if (res3Key === temp[0]) {
+          this.cjzl03_xData = res3[res3Key].map(i => i.click_date)
 
-<!--    this.getCenterTableDataSetInterval()-->
+          this.cjzl03_yData.push(res3[res3Key].map(i => i.count))
+        }
+        if (res3Key === temp[1]) {
+          this.cjzl03_yData.push(res3[res3Key].map(i => i.count))
+        }
+        if (res3Key === temp[2]) {
+          this.cjzl03_yData.push(res3[res3Key].map(i => i.count))
+        }
+        if (res3Key === temp[3]) {
+          this.cjzl03_yData.push(res3[res3Key].map(i => i.count))
+        }
+        if (res3Key === temp[4]) {
+          this.cjzl03_yData.push(res3[res3Key].map(i => i.count))
+        }
+      }
+      loadEcharts('cjzl03', cjzl03(this.cjzl03_xData, this.legendData, this.cjzl03_yData, false))// 宸︿晶
+      setInterval(() => {
+        QCBadCenterLeftWeek({ wkshopcode: temp.join(',') }).then(res3 => {
+          this.cjzl03_xData = []
+          this.cjzl03_yData = []
+          for (const res3Key in res3.data) {
+            if (res3Key === temp[0]) {
+              this.cjzl03_xData = res3.data[res3Key].map(i => i.click_date)
 
-<!--    this.getEcharts()-->
+              this.cjzl03_yData.push(res3.data[res3Key].map(i => i.count))
+            }
+            if (res3Key === temp[1]) {
+              this.cjzl03_yData.push(res3.data[res3Key].map(i => i.count))
+            }
+            if (res3Key === temp[2]) {
+              this.cjzl03_yData.push(res3.data[res3Key].map(i => i.count))
+            }
+            if (res3Key === temp[3]) {
+              this.cjzl03_yData.push(res3.data[res3Key].map(i => i.count))
+            }
+            if (res3Key === temp[4]) {
+              this.cjzl03_yData.push(res3.data[res3Key].map(i => i.count))
+            }
+          }
+          loadEcharts('cjzl03', cjzl03(this.cjzl03_xData, this.legendData, this.cjzl03_yData, false))// 宸︿晶
+        })
+      }, 1000 * 40)
 
-<!--    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)-->
+      const { data: res4 } = await QCBadCenterRightWeek({ wkshopcode: temp.join(',') }) // 鍙充晶
+      let a = []
+      let b = []
+      let c = []
+      for (const res4Key in res4) {
+        a.push(res4[res4Key].length > 0 ? res4[res4Key][0].good_qty : 0)
+        b.push(res4[res4Key].length > 0 ? res4[res4Key][0].plan_qty : 0)
+        c.push(res4[res4Key].length > 0 ? res4[res4Key][0].radio : 0)
+      }
+      this.cjzl04Data.push(a, b, c)
+      loadEcharts('cjzl04', cjzl04(this.legendData, this.cjzl04Data[0], this.cjzl04Data[1], this.cjzl04Data[2]))// 鍙充晶
 
-<!--      this.getLeftBottomEcharts()-->
-<!--      setInterval(() => {-->
-<!--        this.getLeftBottomEcharts()-->
-<!--      }, 1000 * 10)-->
+      setInterval(() => {
+        QCBadCenterRightWeek({ wkshopcode: temp.join(',') }).then(res4 => {
+          a = []
+          b = []
+          c = []
+          this.cjzl04Data = []
+          for (const res4Key in res4.data) {
+            a.push(res4.data[res4Key].length > 0 ? res4.data[res4Key][0].good_qty : 0)
+            b.push(res4.data[res4Key].length > 0 ? res4.data[res4Key][0].plan_qty : 0)
+            c.push(res4.data[res4Key].length > 0 ? res4.data[res4Key][0].radio : 0)
+          }
+          this.cjzl04Data.push(a, b, c)
+          loadEcharts('cjzl04', cjzl04(this.legendData, this.cjzl04Data[0], this.cjzl04Data[1], this.cjzl04Data[2]))// 鍙充晶
+        })
+      }, 1000 * 50)
 
-<!--      this.getRightTopEcharts()-->
-<!--      setInterval(() => {-->
-<!--        this.getRightTopEcharts()-->
-<!--      }, 1000 * 10)-->
+      this.$nextTick(() => {
+        this.getQCBadBottomWeek()
+      })
 
-<!--      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)-->
+      // await this.getEcharts()
+    },
 
-<!--        const loop = Math.floor(this.tableDataCenterTopTemp.length / scale)// 闇�瑕佸惊鐜殑娆℃暟-->
-<!--        let nowLoop = 0// 褰撳墠寰幆鐨勬鏁�-->
+    // 鑾峰彇Echarts
+    getEcharts() {
+      // loadEcharts('cjzl01', cjzl01(this.cjzl01Data))
 
-<!--        const timer = setInterval(() => {-->
-<!--          startValue = startValue + scale-->
-<!--          this.tableDataCenterTop = this.tableDataCenterTopTemp.slice(startValue, startValue + scale)-->
-<!--          if (nowLoop === loop) {-->
-<!--            clearInterval(timer)-->
-<!--            this.getCenterTableDataSetInterval()-->
-<!--          }-->
+      // 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))
 
-<!--          nowLoop++-->
-<!--        }, 1000 * 10)-->
-<!--      })-->
-<!--    },-->
+      // loadEcharts('cjzl04', cjzl04(this.legendData, this.cjzl04Data[0], this.cjzl04Data[1], this.cjzl04Data[2]))// 鍙充晶
+      // loadEcharts('cjzl03', cjzl03(this.cjzl03_xData, this.legendData, this.cjzl03_yData))// 宸︿晶
+    },
 
-<!--    // 鑾峰彇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')-->
+    getQCBadBottomWeek() {
+      const data = {
+        wkshopcode: this.wkshopArr.map(i => i.org_code).join(',')
+      }
+      QCBadBottomWeek(data).then(res => {
+        this.tableDataRightTop = res.data
 
-<!--      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 divData = this.$refs.tableDataRightTopRef.bodyWrapper
+        const temp = setInterval(() => {
+          // 鍏冪礌鑷璺濈椤堕儴1鍍忕礌
+          divData.scrollTop += 1
+          if (divData.clientHeight + divData.scrollTop === divData.scrollHeight) {
+            // 閲嶇疆table璺濈椤堕儴璺濈
+            divData.scrollTop = 0
+            QCBadBottomWeek(data).then(res => {
+              this.tableDataRightTop = res.data
+              if (this.tableDataRightTop.length > 7) {
+                clearInterval(temp)
+                this.getQCBadBottomWeek()
+              }
+            })
+          }
+        }, this.tableDataRightTop.length <= 7 ? 1000 * 10 : 300)
+      })
+    },
+    // 鑾峰彇褰撳墠鏃堕棿
+    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.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'-->
-<!--      }-->
-<!--    }-->
-<!--  }-->
+      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]
 
-<!--}-->
-<!--</script>-->
+      this.headTime = `${y}-${m}-${d}  ${hh}:${mm}:${ss}   ${week}`
+    },
+    headerCellStyle() {
+      return {
+        backgroundColor: 'transparent ',
+        padding: '10px 0',
+        textAlign: 'center',
+        color: '#07acc2',
+        border: 'none',
+        fontSize: '20px'
+      }
+    },
+    cellStyle() {
+      return {
+        padding: '7px 0',
+        textAlign: 'center',
+        backgroundColor: 'transparent ',
+        color: '#c7e7ff',
+        border: 'none',
+        fontSize: '20px'
+      }
+    }
 
-<!--<style lang="scss" scoped>-->
-<!--$main_color:#09d8f2;-->
-<!--$color01: #00FFFF;-->
-<!--.tableData{-->
-<!--  background: #000;-->
-<!--}-->
+  }
 
-<!--.el-table::before{-->
-<!--  height: 0;-->
-<!--}-->
+}
+</script>
 
-<!--.el-table__empty-text{-->
-<!--  color: $main_color;-->
-<!--}-->
+<style lang="scss" scoped>
+$main_color: #09d8f2;
+$color01: #00FFFF;
+.tableData {
+  background: transparent;
+}
 
-<!--.tableDataCell {-->
-<!--  ::v-deep .cell{-->
-<!--    padding: 0 2px ;-->
-<!--  }-->
-<!--}-->
+.el-table::before {
+  height: 0;
+}
 
-<!--</style>-->
+.el-table__empty-text {
+  color: $main_color;
+}
 
-<!--&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);-->
-<!--  }-->
-<!--}-->
+.tableDataCell {
+  ::v-deep .cell {
+    padding: 0 2px;
+  }
+}
 
-<!--.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;-->
-<!--}-->
+::v-deep .el-table__body-wrapper::-webkit-scrollbar {
+  /* width: 0;瀹藉害涓�0鏆楄棌 */
+  width: 0;
+  background: transparent;
+}
 
-<!--.star {-->
-<!--  width: 2px;-->
-<!--  height: 2px;-->
-<!--  /*background: #f7f7b6;*/-->
-<!--  background: #8edffc;-->
-<!--  position: absolute;-->
-<!--  left: 0;-->
-<!--  top: 0;-->
-<!--  backface-visibility: hidden;-->
-<!--  z-index: 102;-->
-<!--}-->
-<!--</style>-->
+::v-deep .el-table th,
+::v-deep .el-table tr,
+::v-deep .el-table td {
+  background-color: transparent;
+}
+</style>

--
Gitblit v1.9.3