From 89642bba88662d1cc43cb092de5ba37692858f7d Mon Sep 17 00:00:00 2001
From: caill <815519168@qq.com>
Date: Thu, 28 Jul 2022 19:51:46 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A4=A7=E5=B1=8F1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/MonitoringScreen1.vue | 717 ++++++++++++++++++--------------
 src/pages/Setup.vue             |  23 +-
 2 files changed, 418 insertions(+), 322 deletions(-)

diff --git a/src/pages/MonitoringScreen1.vue b/src/pages/MonitoringScreen1.vue
index a40daab..3537169 100644
--- a/src/pages/MonitoringScreen1.vue
+++ b/src/pages/MonitoringScreen1.vue
@@ -20,53 +20,104 @@
           <div class="item_tip">
             <div class="item_tip_left">计划达成</div>
             <div class="item_tip_right">
-              <span>日计划达成</span><span class="span1">/月计划达成</span>
+              <span :class="{'span1': swiper === true}">日计划达成</span><span :class="{'span1': swiper === false}">/月计划达成</span>
             </div>
           </div>
-          <div class="item_content_1">
-            <div class="item_content_1_inner">
-              <div class="item_content_1_inner_1">弯头工段</div>
-              <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
-                <p class="item_content_1_inner_2_p1">220000</p>
-                <p class="item_content_1_inner_2_p2">日计划量</p>
+          <div class="swiper_wrap">
+            <div class="swiper_wrap_con">
+              <div v-if="swiper === false" class="swiper_item">
+                <div class="item_content_1_inner">
+                  <div class="item_content_1_inner_1">弯头工段</div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{jo1.plan_qty === '' ? 0 : jo1.plan_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">日计划量</p>
+                  </div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{jo1.real_qty === '' ? 0 : jo1.real_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">日完成量</p>
+                  </div>
+                  <div class="item_content_1_inner_2">
+                    <p class="item_content_1_inner_2_p1">{{jo1.finish_rate === '' ? 0 : jo1.finish_rate}}</p>
+                    <p class="item_content_1_inner_2_p2">日完成率</p>
+                  </div>
+                </div>
+                <div class="item_content_1_inner">
+                  <div class="item_content_1_inner_1">综合工段</div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{jo2.plan_qty === '' ? 0 : jo2.plan_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">日计划量</p>
+                  </div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{jo2.real_qty === '' ? 0 : jo2.real_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">日完成量</p>
+                  </div>
+                  <div class="item_content_1_inner_2">
+                    <p class="item_content_1_inner_2_p1">{{jo2.finish_rate === '' ? 0 : jo2.finish_rate}}</p>
+                    <p class="item_content_1_inner_2_p2">日完成率</p>
+                  </div>
+                </div>
+                <div class="item_content_1_inner">
+                  <div class="item_content_1_inner_1">成品工段</div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{jo3.plan_qty === '' ? 0 : jo3.plan_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">日计划量</p>
+                  </div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{jo3.real_qty === '' ? 0 : jo3.real_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">日完成量</p>
+                  </div>
+                  <div class="item_content_1_inner_2">
+                    <p class="item_content_1_inner_2_p1">{{jo3.finish_rate === '' ? 0 : jo3.finish_rate}}</p>
+                    <p class="item_content_1_inner_2_p2">日完成率</p>
+                  </div>
+                </div>
               </div>
-              <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
-                <p class="item_content_1_inner_2_p1">220000</p>
-                <p class="item_content_1_inner_2_p2">日计划量</p>
-              </div>
-              <div class="item_content_1_inner_2">
-                <p class="item_content_1_inner_2_p1">220000</p>
-                <p class="item_content_1_inner_2_p2">日计划量</p>
-              </div>
-            </div>
-            <div class="item_content_1_inner">
-              <div class="item_content_1_inner_1">弯头工段</div>
-              <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
-                <p class="item_content_1_inner_2_p1">220000</p>
-                <p class="item_content_1_inner_2_p2">日计划量</p>
-              </div>
-              <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
-                <p class="item_content_1_inner_2_p1">220000</p>
-                <p class="item_content_1_inner_2_p2">日计划量</p>
-              </div>
-              <div class="item_content_1_inner_2">
-                <p class="item_content_1_inner_2_p1">220000</p>
-                <p class="item_content_1_inner_2_p2">日计划量</p>
-              </div>
-            </div>
-            <div class="item_content_1_inner">
-              <div class="item_content_1_inner_1">弯头工段</div>
-              <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
-                <p class="item_content_1_inner_2_p1">220000</p>
-                <p class="item_content_1_inner_2_p2">日计划量</p>
-              </div>
-              <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
-                <p class="item_content_1_inner_2_p1">220000</p>
-                <p class="item_content_1_inner_2_p2">日计划量</p>
-              </div>
-              <div class="item_content_1_inner_2">
-                <p class="item_content_1_inner_2_p1">220000</p>
-                <p class="item_content_1_inner_2_p2">日计划量</p>
+              <div v-else class="swiper_item">
+                <div class="item_content_1_inner">
+                  <div class="item_content_1_inner_1">弯头工段</div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{joo1.plan_qty === '' ? 0 : joo1.plan_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">月计划量</p>
+                  </div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{joo1.real_qty === '' ? 0 : joo1.real_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">月完成量</p>
+                  </div>
+                  <div class="item_content_1_inner_2">
+                    <p class="item_content_1_inner_2_p1">{{joo1.finish_rate === '' ? 0 : joo1.finish_rate}}</p>
+                    <p class="item_content_1_inner_2_p2">月完成率</p>
+                  </div>
+                </div>
+                <div class="item_content_1_inner">
+                  <div class="item_content_1_inner_1">综合工段</div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{joo2.plan_qty === '' ? 0 : joo2.plan_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">月计划量</p>
+                  </div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{joo2.real_qty === '' ? 0 : joo2.real_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">月完成量</p>
+                  </div>
+                  <div class="item_content_1_inner_2">
+                    <p class="item_content_1_inner_2_p1">{{joo2.finish_rate === '' ? 0 : joo2.finish_rate}}</p>
+                    <p class="item_content_1_inner_2_p2">月完成率</p>
+                  </div>
+                </div>
+                <div class="item_content_1_inner">
+                  <div class="item_content_1_inner_1">成品工段</div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{joo3.plan_qty === '' ? 0 : joo3.plan_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">月计划量</p>
+                  </div>
+                  <div class="item_content_1_inner_2 item_content_1_inner_2_bg">
+                    <p class="item_content_1_inner_2_p1">{{joo3.real_qty === '' ? 0 : joo3.real_qty}}</p>
+                    <p class="item_content_1_inner_2_p2">月完成量</p>
+                  </div>
+                  <div class="item_content_1_inner_2">
+                    <p class="item_content_1_inner_2_p1">{{joo3.finish_rate === '' ? 0 : joo3.finish_rate}}</p>
+                    <p class="item_content_1_inner_2_p2">月完成率</p>
+                  </div>
+                </div>
               </div>
             </div>
           </div>
@@ -96,7 +147,6 @@
           <div class="item_content_2">
             <div class="scroll_wrap">
               <ul class="scroll_tab_1">
-                <li>订单号</li>
                 <li>工单号</li>
                 <li>计划完成</li>
                 <li>实际完成</li>
@@ -108,15 +158,16 @@
                 <vue-seamless-scroll :data="array1" :class-option="defaultOption1">
                   <ul class="scroll-ul_1">
                     <li v-for="(e, i) in array1" :key="i">
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
+                      <div class="scroll-ul_1_div">{{e.produceorder_code}}</div>
+                      <div class="scroll-ul_1_div">{{e.plan_qty}}</div>
+                      <div class="scroll-ul_1_div">{{e.real_qty}}</div>
+                      <div class="scroll-ul_1_div">{{e.gap_qty}}</div>
+                      <div class="scroll-ul_1_div">{{e.finish_rate}}</div>
                       <div class="scroll-ul_1_div">
                         <div class="progress_line_wrap">
-                          <div class="progress_dot"></div>
+                          <div class="progress_dot_wrap">
+                            <div class="progress_dot" :style="{'left': Number(e.finish_rate) + '%'}"></div>
+                          </div>
                         </div>
                       </div>
                     </li>
@@ -138,20 +189,18 @@
                 <li>产品规格</li>
                 <li>订单数量</li>
                 <li>实际完成</li>
-                <li>差距</li>
                 <li>计划完成日期</li>
               </ul>
               <div class="scroll_container_1">
-                <vue-seamless-scroll :data="array1" :class-option="defaultOption1">
+                <vue-seamless-scroll :data="array2" :class-option="defaultOption1">
                   <ul class="scroll-ul_1">
-                    <li v-for="(e, i) in array1" :key="i">
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
-                      <div class="scroll-ul_1_div">{{e.material_code}}</div>
+                    <li v-for="(e, i) in array2" :key="i">
+                      <div class="scroll-ul_1_div">{{e.produceorder_code}}</div>
                       <div class="scroll-ul_1_div">{{e.material_code}}</div>
+                      <div class="scroll-ul_1_div">{{e.material_spec}}</div>
+                      <div class="scroll-ul_1_div">{{e.plan_qty}}</div>
+                      <div class="scroll-ul_1_div">{{e.real_qty}}</div>
+                      <div class="scroll-ul_1_div">{{e.date}}</div>
                     </li>
                   </ul>
               </vue-seamless-scroll>
@@ -175,41 +224,41 @@
               <div class="right_1_up_right">
                 <div class="right_1_up_right_item">
                   <p class="right_1_up_p1">计划产量</p>
-                  <p class="right_1_up_p2">200000<span>PCS</span></p>
+                  <p class="right_1_up_p2">{{objL1.plan_qty}}<span>PCS</span></p>
                 </div>
                 <div class="right_1_up_right_item">
-                  <p class="right_1_up_p1">计划产量</p>
-                  <p class="right_1_up_p2">200000<span>PCS</span></p>
+                  <p class="right_1_up_p1">实际产量</p>
+                  <p class="right_1_up_p2">{{objL1.real_qty}}<span>PCS</span></p>
                 </div>
               </div>
             </div>
             <div class="right_1_down">
               <div class="right_1_down_inner_1">
                 <div>工单总数：</div>
-                <div>190个</div>
+                <div>{{objL1.sum_qty}}个</div>
               </div>
               <div class="right_1_down_inner_2">
-                <div></div>
-                <div></div>
+                <div :style="{'width': Number(objL1.normal_qty) * 100 / (Number(objL1.normal_qty) + Number(objL1.delayed_qty)) + '%' }"></div>
+                <div :style="{'width': Number(objL1.delayed_qty) * 100 / (Number(objL1.normal_qty) + Number(objL1.delayed_qty)) + '%'}"></div>
               </div>
               <div class="right_1_down_inner_3">
                 <div class="right_1_down_inner_3_i">
                   <div class="right_1_down_inner_3_l">
-                    <span></span>
+                    <span><i class="color1"></i></span>
                     <span>正常工单</span>
                   </div>
                   <div class="right_1_down_inner_3_r">
-                    <span>163</span>
+                    <span>{{objL1.normal_qty}}</span>
                     <span>个</span>
                   </div>
                 </div>
                 <div class="right_1_down_inner_3_i">
                   <div class="right_1_down_inner_3_l">
-                    <span></span>
+                    <span><i class="color2"></i></span>
                     <span>延期工单</span>
                   </div>
                   <div class="right_1_down_inner_3_r">
-                    <span>16</span>
+                    <span>{{objL1.delayed_qty}}</span>
                     <span>个</span>
                   </div>
                 </div>
@@ -222,13 +271,13 @@
             <div class="item_tip_left">今日TOP10产量</div>
           </div>
           <div class="item_content_4">
-            <vue-seamless-scroll :data="array2" :class-option="defaultOption2">
+            <vue-seamless-scroll :data="array3" :class-option="defaultOption3">
               <ul class="scroll-ul_2">
-                <li v-for="(e, i) in array2" :key="i">
-                  <div class="scroll-ul_2_div_1"><span></span></div>
-                  <div class="scroll-ul_2_div_2"></div>
+                <li v-for="(e, i) in array3" :key="i">
+                  <div class="scroll-ul_2_div_1"><span>{{e.sort}}</span></div>
+                  <div class="scroll-ul_2_div_2">{{e.material_spec}}</div>
                   <div class="scroll-ul_2_div_3">
-                    <span></span><span></span>
+                    <span>{{e.real_qty}}</span><span>产量</span>
                   </div>
                 </li>
               </ul>
@@ -240,114 +289,35 @@
             <div class="item_tip_left">近30天生产订单分布</div>
           </div>
           <div class="item_content_5">
-            <div id="echart_d4" style="width: 100%; height: 100%"></div>
-            <!-- <div class="item_5_l">
-              <div class="item_5_l_1"></div>
+            <div class="item_5_l">
+              <div class="item_5_l_1">
+                <div id="echart_d4" style="width: 100%; height: 100%"></div>
+              </div>
               <div class="item_5_l_2">
-                <div class="right_1_down_inner_3_i">
+                <div class="right_1_down_inner_3_i" v-for="(e, i) in arrR1.slice(0,3)" :key="i">
                   <div class="right_1_down_inner_3_l">
-                    <span></span>
-                    <span>正常工单</span>
+                    <span><i :style="{'background-color': e.color}"></i></span>
+                    <span>{{e.material_spec}}</span>
                   </div>
                   <div class="right_1_down_inner_3_r">
-                    <span>163</span>
-                    <span>个</span>
-                  </div>
-                </div>
-                <div class="right_1_down_inner_3_i">
-                  <div class="right_1_down_inner_3_l">
-                    <span></span>
-                    <span>正常工单</span>
-                  </div>
-                  <div class="right_1_down_inner_3_r">
-                    <span>163</span>
-                    <span>个</span>
-                  </div>
-                </div>
-                <div class="right_1_down_inner_3_i">
-                  <div class="right_1_down_inner_3_l">
-                    <span></span>
-                    <span>正常工单</span>
-                  </div>
-                  <div class="right_1_down_inner_3_r">
-                    <span>163</span>
+                    <span>{{e.real_qty}}</span>
                     <span>个</span>
                   </div>
                 </div>
               </div>
             </div>
             <div class="item_5_r">
-              <div class="right_1_down_inner_3_i">
+              <div class="right_1_down_inner_3_i"  v-for="(e, i) in arrR1.slice(3,10)" :key="i">
                 <div class="right_1_down_inner_3_l">
-                  <span></span>
-                  <span>正常工单</span>
+                  <span><i :style="{'background-color': e.color}"></i></span>
+                  <span>{{e.material_spec}}</span>
                 </div>
                 <div class="right_1_down_inner_3_r">
-                  <span>163</span>
+                  <span>{{e.real_qty}}</span>
                   <span>个</span>
                 </div>
               </div>
-              <div class="right_1_down_inner_3_i">
-                <div class="right_1_down_inner_3_l">
-                  <span></span>
-                  <span>正常工单</span>
-                </div>
-                <div class="right_1_down_inner_3_r">
-                  <span>163</span>
-                  <span>个</span>
-                </div>
-              </div>
-              <div class="right_1_down_inner_3_i">
-                <div class="right_1_down_inner_3_l">
-                  <span></span>
-                  <span>正常工单</span>
-                </div>
-                <div class="right_1_down_inner_3_r">
-                  <span>163</span>
-                  <span>个</span>
-                </div>
-              </div>
-              <div class="right_1_down_inner_3_i">
-                <div class="right_1_down_inner_3_l">
-                  <span></span>
-                  <span>正常工单</span>
-                </div>
-                <div class="right_1_down_inner_3_r">
-                  <span>163</span>
-                  <span>个</span>
-                </div>
-              </div>
-              <div class="right_1_down_inner_3_i">
-                <div class="right_1_down_inner_3_l">
-                  <span></span>
-                  <span>正常工单</span>
-                </div>
-                <div class="right_1_down_inner_3_r">
-                  <span>163</span>
-                  <span>个</span>
-                </div>
-              </div>
-              <div class="right_1_down_inner_3_i">
-                <div class="right_1_down_inner_3_l">
-                  <span></span>
-                  <span>正常工单</span>
-                </div>
-                <div class="right_1_down_inner_3_r">
-                  <span>163</span>
-                  <span>个</span>
-                </div>
-              </div>
-              <div class="right_1_down_inner_3_i">
-                <div class="right_1_down_inner_3_l">
-                  <span></span>
-                  <span>正常工单</span>
-                </div>
-                <div class="right_1_down_inner_3_r">
-                  <span>163</span>
-                  <span>个</span>
-                </div>
-              </div>
-            </div> -->
+            </div>
           </div>
         </div>
       </div>
@@ -357,31 +327,48 @@
 </template>
 
 <script>
+import {planReached, worksectionHarvest, monthHarvest, productSchedule, unfinishOrder, output, topHarvest, monthOrder} from '@js/getData2.js'
 export default {
   name: 'MonitoringScreen1',
   data () {
     return {
-      timer: null,
+      interTime: this.$store.getters.setTime,
+      timer1: null,
+      timer2: null,
+      timer3: null,
+      timeOut1: null,
+      timeOut2: null,
       time: '',
       hours: '',
       minutes: '',
       seconds: '',
       date: '',
       week: '',
+      swiper: false,
       myCharts1: '',
       myCharts2: '',
       myCharts3: '',
       myCharts4: '',
-      array1: [{material_code: '001'}, {material_code: '001'}, {material_code: '001'}, {material_code: '001'}, {material_code: '001'}, {material_code: '001'}],
+      jo1: {},
+      jo2: {},
+      jo3: {},
+      joo1: {},
+      joo2: {},
+      joo3: {},
+      arrL2: [],
+      arrL3: [],
+      array1: [],
       array2: [],
-      num: 7
+      array3: [],
+      objL1: {},
+      arrR1: []
     }
   },
   computed: {
     defaultOption1 () {
       return {
         step: 0.4, // 数值越大速度滚动越快
-        limitMoveNum: this.num, // 开始无缝滚动的数据量 this.dataList.length
+        limitMoveNum: 7, // 开始无缝滚动的数据量 this.dataList.length
         hoverStop: true, // 是否开启鼠标悬停stop
         direction: 1, // 0向下 1向上 2向左 3向右
         openWatch: true, // 开启数据实时监控刷新dom
@@ -391,6 +378,18 @@ export default {
       }
     },
     defaultOption2 () {
+      return {
+        step: 0.4, // 数值越大速度滚动越快
+        limitMoveNum: 7, // 开始无缝滚动的数据量 this.dataList.length
+        hoverStop: true, // 是否开启鼠标悬停stop
+        direction: 1, // 0向下 1向上 2向左 3向右
+        openWatch: true, // 开启数据实时监控刷新dom
+        singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
+        singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
+        waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
+      }
+    },
+    defaultOption3 () {
       return {
         step: 0.4, // 数值越大速度滚动越快
         limitMoveNum: 5, // 开始无缝滚动的数据量 this.dataList.length
@@ -405,20 +404,32 @@ export default {
   },
   created () {
     this.updateTime()
-    this.timer = window.setInterval(this.updateTime, 1000)
+    this.timer1 = window.setInterval(this.updateTime, 1000)
+    this.refresh()
   },
   beforeDestroy () {
     this.$once('hook:beforeDestroy', () => {
-      clearInterval(this.timer)
+      clearInterval(this.timer1)
+      clearInterval(this.timer2)
     })
   },
-  mounted () {
-    this.setEchart1()
-    this.setEchart2()
-    this.setEchart3()
-    this.setEchart4()
-  },
   methods: {
+    initData () {
+      this._planReached()
+      this._worksectionHarvest()
+      this._monthHarvest()
+      this._productSchedule()
+      this._output()
+      this._unfinishOrder()
+      this._topHarvest()
+      this._monthOrder()
+    },
+    refresh () {
+      this.initData()
+      this.timer2 = setInterval(() => {
+        this.initData()
+      }, this.interTime)
+    },
     updateTime () {
       let cd = new Date()
       let year = cd.getFullYear()
@@ -438,6 +449,16 @@ export default {
       this.week = `${week}`
     },
     setEchart1 () {
+      let date = []
+      let data1 = []
+      let data2 = []
+      let data3 = []
+      this.arrL2.map(e => {
+        date.push(e.date)
+        data1.push(e.elbow_qty)
+        data2.push(e.comprehensive_qty)
+        data3.push(e.comprehensive_qty)
+      })
       let option = {
         grid: {
           top: 50,
@@ -458,6 +479,14 @@ export default {
           itemHeight: 7.38,
           data: [{name: '弯头工段', itemStyle: {color: '#0E90FD'}}, {name: '综合工段', itemStyle: {color: '#33CCCC'}}, {name: '成品工段', itemStyle: {color: '#EAAD24'}}]
         },
+        dataZoom: [
+          {
+            show: false, // 为true滚动条出现
+            type: 'slider', // type:'inside'，滚动条在最下面，鼠标点击滚动
+            startValue: 0, // 从头开始。
+            endValue: 4 // end百分比显示范围，endValue具体显示几个数值
+          }
+        ],
         xAxis: {
           type: 'category',
           axisTick: {
@@ -477,7 +506,7 @@ export default {
               fontSize: 16
             }
           },
-          data: ['07-21', '07-21', '07-21', '07-21', '07-21']
+          data: date
         },
         yAxis: {
           type: 'value',
@@ -524,7 +553,7 @@ export default {
                 ])
               }
             },
-            data: ['390', '390', '390', '390', '390']
+            data: data1
           },
           {
             name: '综合工段',
@@ -546,7 +575,7 @@ export default {
                 ])
               }
             },
-            data: ['230', '230', '230', '230', '230']
+            data: data2
           },
           {
             name: '成品工段',
@@ -568,18 +597,25 @@ export default {
                 ])
               }
             },
-            data: ['210', '210', '210', '210', '210']
+            data: data3
           }
         ]
       }
       let echart = document.getElementById('echart_d1')
       this.myCharts1 = this.$echarts.init(echart)
       this.myCharts1.setOption(option)
+      this.autoMove(option, 1)
       window.addEventListener('resize', () => {
         this.myCharts1.resize()
       })
     },
     setEchart2 () {
+      let date = []
+      let qty = []
+      this.arrL3.map(el => {
+        date.push(el.date)
+        qty.push(el.real_qty)
+      })
       let option = {
         grid: {
           top: 50,
@@ -588,6 +624,14 @@ export default {
           bottom: 0,
           containLabel: true
         },
+        dataZoom: [
+          {
+            show: false, // 为true滚动条出现
+            type: 'slider', // type:'inside'，滚动条在最下面，鼠标点击滚动
+            startValue: 0, // 从头开始。
+            endValue: 4 // end百分比显示范围，endValue具体显示几个数值
+          }
+        ],
         xAxis: {
           type: 'category',
           boundaryGap: false,
@@ -602,13 +646,14 @@ export default {
             }
           },
           axisLabel: {
-            // interval: 0,
+            interval: 0,
             textStyle: {
               color: '#8FABBF',
-              fontSize: 16
+              fontSize: 16,
+              align: 'left'
             }
           },
-          data: ['07-21', '07-21', '07-21', '07-21', '07-21', '07-21', '07-21', '07-21', '07-21', '07-21']
+          data: date
         },
         yAxis: {
           type: 'value',
@@ -663,19 +708,45 @@ export default {
                 ], false)
               }
             },
-            data: ['750', '500', '1100', '900', '1200', '750', '500', '1100', '900', '1200']
+            data: qty
           }
         ]
       }
       let echart = document.getElementById('echart_d2')
       this.myCharts2 = this.$echarts.init(echart)
       this.myCharts2.setOption(option)
+      this.autoMove(option, 2)
       window.addEventListener('resize', () => {
         this.myCharts2.resize()
       })
     },
+    autoMove (option, type) {
+      if (type === 1) {
+        this.timeOut1 = setInterval(() => {
+          if (Number(option.dataZoom[0].endValue) === option.series[0].data.length - 1) {
+            option.dataZoom[0].endValue = 4
+            option.dataZoom[0].startValue = 0
+          } else {
+            option.dataZoom[0].endValue = option.dataZoom[0].endValue + 1
+            option.dataZoom[0].startValue = option.dataZoom[0].startValue + 1
+          }
+          this.myCharts1.setOption(option)
+        }, 2000)
+      } else if (type === 2) {
+        this.timeOut2 = setInterval(() => {
+          if (Number(option.dataZoom[0].endValue) === option.series[0].data.length - 1) {
+            option.dataZoom[0].endValue = 4
+            option.dataZoom[0].startValue = 0
+          } else {
+            option.dataZoom[0].endValue = option.dataZoom[0].endValue + 1
+            option.dataZoom[0].startValue = option.dataZoom[0].startValue + 1
+          }
+          this.myCharts2.setOption(option)
+        }, 2000)
+      }
+    },
     setEchart3 () {
-      let value = 85
+      let value = parseFloat(this.objL1.finish_rate)
       let title = '%'
       let text = '完成率'
       let option = {
@@ -687,7 +758,7 @@ export default {
             textStyle: {
               rich: {
                 a: {
-                  fontSize: 36,
+                  fontSize: 32,
                   color: '#00D9FF',
                   fontFamily: 'SourceHanSansCN',
                   foontWeight: '700'
@@ -757,113 +828,23 @@ export default {
       })
     },
     setEchart4 () {
-      let arr = [
-        { value: 163, name: '三通1/21' },
-        { value: 163, name: '三通1/22' },
-        { value: 163, name: '三通1/23' },
-        { value: 24, name: '三通1/24' },
-        { value: 163, name: '三通1/25' },
-        { value: 163, name: '三通1/26' },
-        { value: 163, name: '三通1/27' },
-        { value: 163, name: '三通1/28' },
-        { value: 163, name: '三通1/29' },
-        { value: 163, name: '三通1/30' }
-      ]
+      let arr = []
+      let colors = []
+      this.arrR1.map(el => {
+        arr.push(el.real_qty)
+        colors.push(el.color)
+      })
       var option = {
         tooltip: {
           trigger: 'item'
         },
-        legend: [{
-          data: ['三通1/21', '三通1/22', '三通1/23'],
-          top: 'center',
-          left: '55%',
-          orient: 'vertical',
-          icon: 'circle',
-          itemGap: 75,
-          itemHeight: 20,
-          formatter: (name) => {
-            var arr = option.series[0].data
-            arr.map((e, i) => {
-              if (name === e.name) {
-                return '{a|' + name + '}{b|' + e.value + '}{c|个}'
-              }
-            })
-          },
-          textStyle: {
-            rich: {
-              a: {
-                color: '#ffffff',
-                fontSize: 14,
-                lineHeight: 30,
-                fontFamily: 'SourceHanSansCN',
-                foontWeight: '400'
-              },
-              b: {
-                color: '#00D5FF ',
-                fontSize: 18,
-                lineHeight: 30,
-                fontFamily: 'SourceHanSansCN',
-                foontWeight: '700'
-              },
-              c: {
-                color: '#ffffff ',
-                fontSize: 12,
-                lineHeight: 30,
-                fontFamily: 'SourceHanSansCN',
-                foontWeight: '700'
-              }
-            }
-          }
-        },
-        {
-          data: ['三通1/24', '三通1/25', '三通1/26', '三通1/27', '三通1/28', '三通1/29', '三通1/30'],
-          top: 'center',
-          left: '80%',
-          orient: 'vertical',
-          icon: 'circle',
-          itemGap: 75,
-          itemHeight: 20,
-          formatter: (name) => {
-            var arr = option.series[0].data
-            arr.map((e, i) => {
-              if (name === e.name) {
-                return '{a|' + name + '}{b|' + e.value + '}{c|个}'
-              }
-            })
-          },
-          textStyle: {
-            rich: {
-              a: {
-                color: '#ffffff',
-                fontSize: 14,
-                lineHeight: 30,
-                fontFamily: 'SourceHanSansCN',
-                foontWeight: '400'
-              },
-              b: {
-                color: '#00D5FF ',
-                fontSize: 18,
-                lineHeight: 30,
-                fontFamily: 'SourceHanSansCN',
-                foontWeight: '700'
-              },
-              c: {
-                color: '#ffffff ',
-                fontSize: 12,
-                lineHeight: 30,
-                fontFamily: 'SourceHanSansCN',
-                foontWeight: '700'
-              }
-            }
-          }
-        }
-        ],
+        color: colors,
         series: [
           {
             name: '区域',
             type: 'pie',
-            radius: ['40%', '60%'],
-            center: ['30%', '50%'],
+            radius: ['70%', '95%'],
+            center: ['50%', '50%'],
             left: 0,
             roseType: 'area',
             avoidLabelOverlap: false,
@@ -884,6 +865,109 @@ export default {
       window.addEventListener('resize', () => {
         this.myCharts4.resize()
       })
+    },
+    /** 左一 */
+    async _planReached () {
+      let res = await planReached()
+      if (res.code === '1') {
+        this.jo1 = res.dayResult.jo1
+        this.jo2 = res.dayResult.jo2
+        this.jo3 = res.dayResult.jo3
+        this.joo1 = res.monthResult.joo1
+        this.joo2 = res.monthResult.joo2
+        this.joo3 = res.monthResult.joo3
+        window.clearInterval(this.timer3)
+        this.toSwiper()
+      } else {
+        this.Dialog(res.desc)
+      }
+    },
+    /** 轮播 */
+    toSwiper () {
+      this.timer3 = setInterval(() => {
+        this.swiper = !this.swiper
+      }, 5000)
+    },
+    /** 左二 */
+    async _worksectionHarvest () {
+      let res = await worksectionHarvest()
+      if (res.code === '1') {
+        this.arrL2 = [...res.result]
+        if (this.arrL2.length > 0) {
+          window.clearInterval(this.timeOut1)
+          this.setEchart1()
+        }
+      } else {
+        this.Dialog(res.desc)
+      }
+    },
+    /** 左三 */
+    async _monthHarvest () {
+      let res = await monthHarvest()
+      if (res.code === '1') {
+        this.arrL3 = [...res.result]
+        window.clearInterval(this.timeOut2)
+        this.setEchart2()
+      } else {
+        this.Dialog(res.desc)
+      }
+    },
+    /** 中一 */
+    async _productSchedule () {
+      let res = await productSchedule()
+      if (res.code === '1') {
+        this.array1 = [...res.result]
+      } else {
+        this.Dialog(res.desc)
+      }
+    },
+    /** 中二 */
+    async _unfinishOrder () {
+      let res = await unfinishOrder()
+      if (res.code === '1') {
+        this.array2 = [...res.result]
+      } else {
+        this.Dialog(res.desc)
+      }
+    },
+    /** 右一 */
+    async _output () {
+      let res = await output()
+      if (res.code === '1') {
+        this.objL1 = res.result
+        this.setEchart3()
+      } else {
+        this.Dialog(res.desc)
+      }
+    },
+    /** 右二 */
+    async _topHarvest () {
+      let res = await topHarvest()
+      if (res.code === '1') {
+        res.result.map((e, i) => {
+          let index = parseInt(i) + 1
+          if (index >= 4) {
+            this.$set(e, 'sort', `NO.${index}`)
+          }
+        })
+        this.array3 = [...res.result]
+      } else {
+        this.Dialog(res.desc)
+      }
+    },
+    /** 右三 */
+    async _monthOrder () {
+      let res = await monthOrder()
+      if (res.code === '1') {
+        let colors = ['#E0CA07', '#007744', '#C0C0C0', '#B68845', '#07E083', '#2D7CEB', '#00D5FF ', '#C44545', '#8B31A1', '#E1BF94']
+        res.result.map((e, i) => {
+          this.$set(e, 'color', colors[i])
+        })
+        this.arrR1 = [...res.result]
+        this.setEchart4()
+      } else {
+        this.Dialog(res.desc)
+      }
     }
   }
 }
@@ -1016,7 +1100,7 @@ header
   border-bottom .01rem solid rgba(8,205,248,0.3)
   li
     float left
-    width 13.8%
+    width 15%
     _font(.14rem,.4rem,#78B1DE,,center)
     word-wrap break-word
     word-break break-all
@@ -1024,8 +1108,8 @@ header
     padding 0 .02rem
     overflow hidden
     box-sizing border-box
-    &:nth-child(7)
-      width 17.2%
+    &:nth-child(6)
+      width 25%
 .scroll_container_1
   width 100%
   height calc(100% - .4rem)
@@ -1039,7 +1123,7 @@ header
       box-shadow inset 0px 1px 0px 0px rgba(13,89,115,0.3)
     .scroll-ul_1_div
       float left
-      _wh(13.8%, .44rem)
+      _wh(15%, .44rem)
       _fj(center)
       _font(.14rem, .44rem, #fff,,center)
       word-wrap break-word
@@ -1047,16 +1131,21 @@ header
       white-space nowrap
       padding 0 .02rem
       overflow hidden
-      &:nth-child(7)
-        width 17.2%
+      &:nth-child(6)
+        width 25%
 .progress_line_wrap
   position relative
   _wh(1.35rem, .03rem)
   background-image linear-gradient(270deg, #00EFFF 2%, #00527D 100%)
-.progress_dot
+.progress_dot_wrap
   position absolute
+  _wh(100%, .15rem)
   top -.06rem
   left -.05rem
+.progress_dot
+  position absolute
+  top 0
+  left 0
   _wh(.15rem, .15rem)
   background center center / 100% 100% url(../assets/images/screen1/dot_1.png) no-repeat
 .item_content_3
@@ -1092,6 +1181,7 @@ header
   _font(.18rem, .18rem, #fff, 700, center)
   span
     _font(.12rem, .18rem, #fff, 700, center)
+    padding-left .1rem
 .right_1_down
   _wh(100%, calc(100% - 1.6rem))
   padding .05rem .3rem 0
@@ -1113,11 +1203,10 @@ header
   background-color rgba(0,213,255,0.20)
   _fj()
   div
+    height .0805rem
     &:nth-child(1)
-      _wh(50%, .0805rem)
       background-color #07E083
     &:nth-child(2)
-      _wh(50%, .0805rem)
       background-color #B68845
 .right_1_down_inner_3
   _wh(100%, .3rem)
@@ -1130,17 +1219,22 @@ header
 .right_1_down_inner_3_l
   _wh(50%, 100%)
   overflow hidden
-  _fj()
+  clear both
   span
     display block
+    float left
     &:nth-child(1)
-      _wh(.0725rem, .0725rem)
-      border-radius 100%
-      background-color #07E083
+      _wh(.0725rem, .3rem)
       margin-left .15rem
+      _fj()
+      i
+        display block
+        _wh(.0725rem, .0725rem)
+        border-radius 100%
     &:nth-child(2)
       font-family "SourceHanSansCN"
-      _font(.14rem, .3rem, #fff,400,)
+      _font(.12rem, .3rem, #fff,400,)
+      margin-left .06rem
 .right_1_down_inner_3_r
   _wh(50%, 100%)
   line-height .3rem
@@ -1211,4 +1305,21 @@ header
   _wh(100%, calc(100% - 1.42rem))
   .right_1_down_inner_3_i
     margin-bottom .03rem
+.color1
+  background-color #07E083
+.color2
+  background-color #B68845
+.swiper_wrap
+  clear both
+  _wh(100%, calc(100% - .32rem))
+  padding .17rem 0 .24rem
+  overflow hidden
+.swiper_wrap_con
+  _wh(100%, 100%)
+.swiper_item
+  position relative
+  left 0
+  float left
+  _wh(100%, 100%)
+  _fj(space-around)
 </style>
diff --git a/src/pages/Setup.vue b/src/pages/Setup.vue
index 82148fb..f91d161 100644
--- a/src/pages/Setup.vue
+++ b/src/pages/Setup.vue
@@ -54,7 +54,6 @@
 
 <script>
 import DropdownMenu from '@components/DropdownMenu.vue'
-import {queryDevice} from '@js/getData2.js'
 export default {
   name: 'Login',
   components: {
@@ -69,8 +68,8 @@ export default {
       setTime: this.$store.getters.setTime,
       fullscreen: false,
       heightLimit: false,
-      option: [],
-      active: '',
+      option: [{value: 1, label: '大屏一'}],
+      active: '0',
       open: false
     }
   },
@@ -81,20 +80,6 @@ export default {
     document.body.removeAttribute('class', 'login_bg')
   },
   methods: {
-    async _queryDevice () {
-      let res = await queryDevice(this.baseUrl)
-      if (res.code === '1') {
-        this.toast(res.desc)
-        this.option = [...res.rows]
-        if (this.$store.getters.equipId) {
-          this.option.map((el, i) => {
-            if (this.$store.getters.equipId === el.value) {
-              this.active = i + ''
-            }
-          })
-        }
-      }
-    },
     toggleItem () {
       if (!this.open) {
         this.open = true
@@ -118,9 +103,9 @@ export default {
       }
       this.$store.dispatch('setConfig', obj)
       if (this.equipId === 1) {
-        this.$router.push('/taskscreen')
+        this.$router.push('/MonitoringScreen1')
       } else {
-        this.$router.push('/taskscreen')
+        this.$router.push('/MonitoringScreen1')
       }
       let element = document.documentElement
       if (this.fullscreen) {