From d669e39c55cad0708ccc2bd7f39bf3ec2a84420e Mon Sep 17 00:00:00 2001
From: hzz <hzz>
Date: Fri, 2 Jun 2023 18:06:09 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=9C=BA=E6=A2=B0=E5=88=86?=
 =?UTF-8?q?=E5=8E=82=E4=BA=94=E4=B8=AA=E8=BD=A6=E9=97=B4=E7=8E=AF=E5=A2=83?=
 =?UTF-8?q?=E7=9A=84=E7=94=A8=E7=94=B5=E9=87=8F=E5=92=8C=E7=94=9F=E4=BA=A7?=
 =?UTF-8?q?=E9=A2=9D=E5=9B=BE=E8=A1=A8=E6=98=BE=E7=A4=BA=20=20=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9=E4=BC=A0=E6=84=9F=E5=99=A8=E6=8A=A5=E8=AD=A6=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/borderBox/border6.vue          |  8 +++++-
 src/views/Mechanics/child/index.vue           |  8 ++++--
 src/views/PaintShopView/View1/bottom.vue      | 24 ++++++++--------
 src/views/PaintShopView/finishView/bottom.vue | 24 ++++++++--------
 .../PaintShopView/machiningView/bottom.vue    | 24 ++++++++--------
 src/views/PaintShopView/stuffView/bottom.vue  | 24 ++++++++--------
 src/views/PaintShopView/weldView/bottom.vue   | 24 ++++++++--------
 .../content/chart/verticalNumLoop.vue         | 11 +++++++-
 .../content/chart/verticalNum.vue             | 28 +++++++++++++++----
 9 files changed, 106 insertions(+), 69 deletions(-)

diff --git a/src/components/borderBox/border6.vue b/src/components/borderBox/border6.vue
index a2851bb..3efa7a8 100644
--- a/src/components/borderBox/border6.vue
+++ b/src/components/borderBox/border6.vue
@@ -1,5 +1,5 @@
 <template>
-  <dv-border-box-13 ref="boder">
+  <dv-border-box-13 ref="boder" :color="color">
     <div class="slot">
       <slot></slot>
     </div>
@@ -8,6 +8,12 @@
 
 <script setup lang="ts">
 import { ref, watch } from "vue";
+const prop = defineProps({
+  color: {
+    type: Array,
+    default: () => [],
+  },
+});
 let boder = ref();
 const resetWH = () => {
   boder ? boder.value.initWH() : "";
diff --git a/src/views/Mechanics/child/index.vue b/src/views/Mechanics/child/index.vue
index 328f88d..c3564ad 100644
--- a/src/views/Mechanics/child/index.vue
+++ b/src/views/Mechanics/child/index.vue
@@ -33,11 +33,12 @@ import { onBeforeMount, onMounted, onUnmounted, ref } from "vue";
 // import { Swiper, SwiperSlide } from 'swiper/vue';
 import { register } from "swiper/element/bundle";
 import index from "./main/index.vue";
-import { useRoute } from "vue-router";
+import { useRoute,useRouter } from "vue-router";
 import { gatDeviceStatusOfMF } from "@/http/Mechanics";
 import { connectWebsocket, closeWebsocket } from "@/utils/websocket";
 import { useMechanicsStore } from "@/store/module/Mechanics";
 const route=useRoute()
+const router=useRouter()
 const store = useMechanicsStore();
 register();
 let page = ref();
@@ -49,9 +50,12 @@ const onProgress = (e) => {
 
 const onSlideChange = (e) => {
   // console.log(e.detail[0].activeIndex
-
+  // console.log(e, "e");
+  
   store.changePage(e.detail[0].activeIndex + 1);
+  router.replace(`/Mechanics/${e.detail[0].activeIndex+1}`);
 };
+
 async function gatDeviceStatusOfMFfun() {
   let result: any = await gatDeviceStatusOfMF();
   store.changeloading(true);
diff --git a/src/views/PaintShopView/View1/bottom.vue b/src/views/PaintShopView/View1/bottom.vue
index e001fb5..3c3f404 100644
--- a/src/views/PaintShopView/View1/bottom.vue
+++ b/src/views/PaintShopView/View1/bottom.vue
@@ -110,13 +110,13 @@ let powerOption = reactive({
       containLabel: true,
     },
     xAxis: {
-      type: 'category',
-      data: [
-      ],
+      type: 'value',
 
     },
     yAxis: {
-      type: 'value',
+      type: 'category',
+      data: [
+      ],
     },
     series: [
     ],
@@ -153,13 +153,13 @@ let ProductionOption = reactive({
       containLabel: true,
     },
     xAxis: {
-      type: 'category',
-      data: [
-      ],
+      type: 'value',
 
     },
     yAxis: {
-      type: 'value',
+      type: 'category',
+      data: [
+      ],
     },
     series: [
     ],
@@ -189,9 +189,9 @@ function setcontentData(val) {
     monthData.push(key)
     powerMonth.push(val.power[key])
   }
-  powerOption.option.xAxis.data = []
+  powerOption.option.yAxis.data = []
   powerOption.option.series = []
-  powerOption.option.xAxis.data = monthData.reverse()
+  powerOption.option.yAxis.data = monthData.reverse()
   powerOption.option.series.push({
     data: powerMonth.reverse(),
     type: 'bar',
@@ -233,9 +233,9 @@ function setcontentData(val) {
     monthData2.push(key)
     powerMonth2.push(val.rate[key])
   }
-  ProductionOption.option.xAxis.data = []
+  ProductionOption.option.yAxis.data = []
   ProductionOption.option.series = []
-  ProductionOption.option.xAxis.data = monthData2.reverse()
+  ProductionOption.option.yAxis.data = monthData2.reverse()
   ProductionOption.option.series.push({
     data: powerMonth2.reverse(),
     type: 'bar',
diff --git a/src/views/PaintShopView/finishView/bottom.vue b/src/views/PaintShopView/finishView/bottom.vue
index dfe0a8e..8400d45 100644
--- a/src/views/PaintShopView/finishView/bottom.vue
+++ b/src/views/PaintShopView/finishView/bottom.vue
@@ -110,13 +110,13 @@ let powerOption = reactive({
       containLabel: true,
     },
     xAxis: {
-      type: 'category',
-      data: [
-      ],
+      type: 'value',
 
     },
     yAxis: {
-      type: 'value',
+      type: 'category',
+      data: [
+      ],
     },
     series: [
     ],
@@ -153,13 +153,13 @@ let ProductionOption = reactive({
       containLabel: true,
     },
     xAxis: {
-      type: 'category',
-      data: [
-      ],
+      type: 'value',
 
     },
     yAxis: {
-      type: 'value',
+      type: 'category',
+      data: [
+      ],
     },
     series: [
     ],
@@ -186,9 +186,9 @@ function setcontentData(val) {
     monthData.push(key)
     powerMonth.push(val.power[key])
   }
-  powerOption.option.xAxis.data = []
+  powerOption.option.yAxis.data = []
   powerOption.option.series = []
-  powerOption.option.xAxis.data = monthData.reverse()
+  powerOption.option.yAxis.data = monthData.reverse()
   powerOption.option.series.push({
     data: powerMonth.reverse(),
     type: 'bar',
@@ -229,9 +229,9 @@ function setcontentData(val) {
     monthData2.push(key)
     powerMonth2.push(val.rate[key])
   }
-  ProductionOption.option.xAxis.data = []
+  ProductionOption.option.yAxis.data = []
   ProductionOption.option.series = []
-  ProductionOption.option.xAxis.data = monthData2.reverse()
+  ProductionOption.option.yAxis.data = monthData2.reverse()
   ProductionOption.option.series.push({
     data: powerMonth2.reverse(),
     type: 'bar',
diff --git a/src/views/PaintShopView/machiningView/bottom.vue b/src/views/PaintShopView/machiningView/bottom.vue
index 4fd4244..42631ee 100644
--- a/src/views/PaintShopView/machiningView/bottom.vue
+++ b/src/views/PaintShopView/machiningView/bottom.vue
@@ -110,13 +110,13 @@ let powerOption = reactive({
       containLabel: true,
     },
     xAxis: {
-      type: 'category',
-      data: [
-      ],
+      type: 'value',
 
     },
     yAxis: {
-      type: 'value',
+      type: 'category',
+      data: [
+      ],
     },
     series: [
     ],
@@ -153,13 +153,13 @@ let ProductionOption = reactive({
       containLabel: true,
     },
     xAxis: {
-      type: 'category',
-      data: [
-      ],
+      type: 'value',
 
     },
     yAxis: {
-      type: 'value',
+      type: 'category',
+      data: [
+      ],
     },
     series: [
     ],
@@ -187,9 +187,9 @@ function setcontentData(val) {
     monthData.push(key)
     powerMonth.push(val.power[key])
   }
-  powerOption.option.xAxis.data = []
+  powerOption.option.yAxis.data = []
   powerOption.option.series = []
-  powerOption.option.xAxis.data = monthData.reverse()
+  powerOption.option.yAxis.data = monthData.reverse()
   powerOption.option.series.push({
     data: powerMonth.reverse(),
     type: 'bar',
@@ -230,9 +230,9 @@ function setcontentData(val) {
     monthData2.push(key)
     powerMonth2.push(val.rate[key])
   }
-  ProductionOption.option.xAxis.data = []
+  ProductionOption.option.yAxis.data = []
   ProductionOption.option.series = []
-  ProductionOption.option.xAxis.data = monthData2.reverse()
+  ProductionOption.option.yAxis.data = monthData2.reverse()
   ProductionOption.option.series.push({
     data: powerMonth2.reverse(),
     type: 'bar',
diff --git a/src/views/PaintShopView/stuffView/bottom.vue b/src/views/PaintShopView/stuffView/bottom.vue
index b4e64fa..73ea6fd 100644
--- a/src/views/PaintShopView/stuffView/bottom.vue
+++ b/src/views/PaintShopView/stuffView/bottom.vue
@@ -110,13 +110,13 @@ let powerOption = reactive({
       containLabel: true,
     },
     xAxis: {
-      type: 'category',
-      data: [
-      ],
+      type: 'value',
 
     },
     yAxis: {
-      type: 'value',
+      type: 'category',
+      data: [
+      ],
     },
     series: [
     ],
@@ -153,13 +153,13 @@ let ProductionOption = reactive({
       containLabel: true,
     },
     xAxis: {
-      type: 'category',
-      data: [
-      ],
+      type: 'value',
 
     },
     yAxis: {
-      type: 'value',
+      type: 'category',
+      data: [
+      ],
     },
     series: [
     ],
@@ -187,9 +187,9 @@ function setcontentData(val) {
     monthData.push(key)
     powerMonth.push(val.power[key])
   }
-  powerOption.option.xAxis.data = []
+  powerOption.option.yAxis.data = []
   powerOption.option.series = []
-  powerOption.option.xAxis.data = monthData.reverse()
+  powerOption.option.yAxis.data = monthData.reverse()
   powerOption.option.series.push({
     data: powerMonth.reverse(),
     type: 'bar',
@@ -231,9 +231,9 @@ function setcontentData(val) {
     monthData2.push(key)
     powerMonth2.push(val.rate[key])
   }
-  ProductionOption.option.xAxis.data = []
+  ProductionOption.option.yAxis.data = []
   ProductionOption.option.series = []
-  ProductionOption.option.xAxis.data = monthData2.reverse()
+  ProductionOption.option.yAxis.data = monthData2.reverse()
   ProductionOption.option.series.push({
     data: powerMonth2.reverse(),
     type: 'bar',
diff --git a/src/views/PaintShopView/weldView/bottom.vue b/src/views/PaintShopView/weldView/bottom.vue
index 25571ca..15cf900 100644
--- a/src/views/PaintShopView/weldView/bottom.vue
+++ b/src/views/PaintShopView/weldView/bottom.vue
@@ -110,13 +110,13 @@ let powerOption = reactive({
       containLabel: true,
     },
     xAxis: {
-      type: 'category',
-      data: [
-      ],
+      type: 'value',
 
     },
     yAxis: {
-      type: 'value',
+      type: 'category',
+      data: [
+      ],
     },
     series: [
     ],
@@ -153,13 +153,13 @@ let ProductionOption = reactive({
       containLabel: true,
     },
     xAxis: {
-      type: 'category',
-      data: [
-      ],
+      type: 'value',
 
     },
     yAxis: {
-      type: 'value',
+      type: 'category',
+      data: [
+      ],
     },
     series: [
     ],
@@ -187,9 +187,9 @@ function setcontentData(val) {
     monthData.push(key)
     powerMonth.push(val.power[key])
   }
-  powerOption.option.xAxis.data = []
+  powerOption.option.yAxis.data = []
   powerOption.option.series = []
-  powerOption.option.xAxis.data = monthData.reverse()
+  powerOption.option.yAxis.data = monthData.reverse()
   powerOption.option.series.push({
     data: powerMonth.reverse(),
     type: 'bar',
@@ -231,9 +231,9 @@ function setcontentData(val) {
     monthData2.push(key)
     powerMonth2.push(val.rate[key])
   }
-  ProductionOption.option.xAxis.data = []
+  ProductionOption.option.yAxis.data = []
   ProductionOption.option.series = []
-  ProductionOption.option.xAxis.data = monthData2.reverse()
+  ProductionOption.option.yAxis.data = monthData2.reverse()
   ProductionOption.option.series.push({
     data: powerMonth2.reverse(),
     type: 'bar',
diff --git a/src/views/realtimeSecurity/content/chart/verticalNumLoop.vue b/src/views/realtimeSecurity/content/chart/verticalNumLoop.vue
index d87af79..575da97 100644
--- a/src/views/realtimeSecurity/content/chart/verticalNumLoop.vue
+++ b/src/views/realtimeSecurity/content/chart/verticalNumLoop.vue
@@ -1,6 +1,6 @@
 <template>
   <div ref="numBox1" :key="keynum" :style="{ height: '100%', width: '97%' }">
-    <border6 ref="refborder3" >
+    <border6 ref="refborder3" :color="borderColor">
       <template v-slot>
         <div class="box" ref="classBox1">
           <div class="icontip">
@@ -69,6 +69,15 @@ let item:any = computed(() => {
 let iconcolor = computed(() => {  
   return props.value[i.value].status?props.value[i.value].val > props.limit ? "icon-red" : "icon-blue":"icon-grey";
 });
+let borderColor = computed(() => {
+  let type = props.value.find((items: any) => {
+    if (+items.val > +props.limit&&items.status) {
+      return true;
+    }
+  });
+
+  return type ? ["#E43961","#E43961"] : [];
+});
 let props = defineProps<{
   title: string;
   icon: string;
diff --git a/src/views/realtimeSecurityJixiefenchang/content/chart/verticalNum.vue b/src/views/realtimeSecurityJixiefenchang/content/chart/verticalNum.vue
index e6153fd..a862e1a 100644
--- a/src/views/realtimeSecurityJixiefenchang/content/chart/verticalNum.vue
+++ b/src/views/realtimeSecurityJixiefenchang/content/chart/verticalNum.vue
@@ -9,9 +9,10 @@
 -->
 <template>
   <div ref="numBox1" :style="{height:boxSize.height,width:boxSize.width,marginBottom:'10px'}">
-    <border6 ref="refborder3">
+    <border6 ref="refborder3" :color="borderColor">
       <template v-slot>
-        <div class="box" ref="classBox1">
+        <div class="container">
+          <div class="box" ref="classBox1">
           <div class="icontip">
             <div v-for="items in value.data" style="margin: auto 5px;" v-show="(+items.val > +value.quota)&&items.status">
               <el-popover placement="bottom" :width="250" trigger="hover" effect="dark"
@@ -54,7 +55,7 @@
               <p class="num">{{item.val}}</p>
               <span>{{ value.unit }}</span>
             </p>
-
+        </div>
         </div>
       </template>
     </border6>
@@ -73,10 +74,18 @@ let props = defineProps<{
   title: string;
 }>();
 let i =ref(0)
-let item = computed(() => {
-  
+let item = computed(() => {  
   return value.data[i.value]||{"name":"","val":"0","type":"","field":"","ts":0,"status":false};
 });
+let borderColor = computed(() => {
+  let type = value.data.find((items: any) => {
+    if (+items.val > +value.quota&&items.status) {
+      return true;
+    }
+  });
+
+  return type ? ["#E43961","#E43961"] : [];
+});
 let iconcolor = computed(() => {
   //开始进入渲染是没有获取到该数据则需要判断 如果没有则返回空
   if (value.data[i.value]) {
@@ -145,6 +154,15 @@ defineExpose({
 
 <style scoped>
 @import "@/assets/css/iconfont.css";
+.container {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+  align-items: center;
+  overflow: hidden;
+}
 .box {
   height: 50%;
   width: 100%;