diff --git a/src/assets/indexImg/FactoryView.png b/src/assets/indexImg/FactoryView.png
index 274b873..54af302 100644
Binary files a/src/assets/indexImg/FactoryView.png and b/src/assets/indexImg/FactoryView.png differ
diff --git a/src/assets/indexImg/MicrofactoryDev.png b/src/assets/indexImg/MicrofactoryDev.png
index 94b8314..756b279 100644
Binary files a/src/assets/indexImg/MicrofactoryDev.png and b/src/assets/indexImg/MicrofactoryDev.png differ
diff --git a/src/assets/indexImg/PaintShopView.png b/src/assets/indexImg/PaintShopView.png
index e0f1cd1..576f3e8 100644
Binary files a/src/assets/indexImg/PaintShopView.png and b/src/assets/indexImg/PaintShopView.png differ
diff --git a/src/assets/indexImg/decorationShop.png b/src/assets/indexImg/decorationShop.png
index 900eaac..0232dd4 100644
Binary files a/src/assets/indexImg/decorationShop.png and b/src/assets/indexImg/decorationShop.png differ
diff --git a/src/assets/indexImg/electronicControl.png b/src/assets/indexImg/electronicControl.png
index 1b5a327..3e7472e 100644
Binary files a/src/assets/indexImg/electronicControl.png and b/src/assets/indexImg/electronicControl.png differ
diff --git a/src/assets/indexImg/mechanical_noise.png b/src/assets/indexImg/mechanical_noise.png
index 00dc790..c6ee6d5 100644
Binary files a/src/assets/indexImg/mechanical_noise.png and b/src/assets/indexImg/mechanical_noise.png differ
diff --git a/src/assets/indexImg/realtimeSecurityJixie.png b/src/assets/indexImg/realtimeSecurityJixie.png
new file mode 100644
index 0000000..0d10916
Binary files /dev/null and b/src/assets/indexImg/realtimeSecurityJixie.png differ
diff --git a/src/views/InPlantProducts/content/bottom.vue b/src/views/InPlantProducts/content/bottom.vue
index 0900dcd..cdf0bc6 100644
--- a/src/views/InPlantProducts/content/bottom.vue
+++ b/src/views/InPlantProducts/content/bottom.vue
@@ -55,7 +55,7 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, reactive, ref, watch } from "vue";
+import { onMounted, reactive, ref, watch,onUnmounted } from "vue";
 import { calcWH } from "@/components/ts/selfAdaption";
 import installtable from "./chart/installtable.vue";
 import devList from "./chart/deviceslist.vue";
@@ -65,6 +65,7 @@ import { useInPlantProductsStore } from "@/store/module/InPlantProducts";
 import { useI18n } from 'vue-i18n'
 let {t} = useI18n();
 const store = useInPlantProductsStore();
+let timer = null;
 let props = defineProps<{
   width: number;
   height: number;
@@ -136,8 +137,18 @@ async function getDeviceInPlantfun() {
       res["index"] = index + 1;
         return res
     });
+    //显示优化 防止刚进页面时候数据过多
+    if (newdata.length > 20) {
+      let newdatatemp = newdata.slice(0, 20);
+      store.setDevList(newdatatemp);
+      timer = setTimeout(() => {
+        store.setDevList(newdata);
+      }, 1000);
+    } else {
+      store.setDevList(newdata);
+    }
 
-    store.setDevList(newdata);
+    
   }
 }
 
@@ -180,6 +191,9 @@ onMounted(() => {
   getprogressOfCorpsfun();
   // setdata();
 });
+onUnmounted(() => {
+  clearTimeout(timer);
+});
 </script>
 
 <style scope>
diff --git a/src/views/PaintShopView/finishView/bottom.vue b/src/views/PaintShopView/finishView/bottom.vue
index babbe4d..dfe0a8e 100644
--- a/src/views/PaintShopView/finishView/bottom.vue
+++ b/src/views/PaintShopView/finishView/bottom.vue
@@ -12,16 +12,8 @@
     <el-row>
       <el-col :span="24">
         <div style="display: flex;justify-content: space-evenly; align-items: center; margin-bottom: 10px;">
-          <chart
-            :title="powerOption.title"
-            :option="powerOption.option"
-            ref="powerref"
-          ></chart>
-          <chart
-            :title="powerOption.title"
-            :option="powerOption.option"
-            ref="Productionref"
-          ></chart>
+          <chart :title="powerOption.title" :option="powerOption.option" ref="powerref"></chart>
+          <chart :title="powerOption.title" :option="powerOption.option" ref="Productionref"></chart>
           <!-- <div>
             <border3 ref="borderref">
                   <template v-slot>
@@ -48,7 +40,7 @@ import chart from "@/components/assembly/chart2.vue";
 import { useRoute, useRouter } from "vue-router";
 import { useEnergyConsumeStore } from "@/store/module/energyConsume";
 import { useI18n } from 'vue-i18n'
-let {t} = useI18n();
+let { t } = useI18n();
 const store = useEnergyConsumeStore();
 const router = useRouter();
 
@@ -82,10 +74,10 @@ function reset(val: any) {
 const powerBox = (width: any, height: any) => {
   let a = calcWH(height, width, 1, 2, 0);
   //修改高度
-  powerref.value.setchartWH(a.oWidth-20, a.oHeight-20);
-  Productionref.value.setchartWH(a.oWidth-20, a.oHeight-20);
+  powerref.value.setchartWH(a.oWidth - 20, a.oHeight - 20);
+  Productionref.value.setchartWH(a.oWidth - 20, a.oHeight - 20);
   // pmref.value.setchartWH(a.oWidth-40,a.oHeight-40)
-//   yields.value.setchartWH(a.oWidth, a.oHeight - 30);
+  //   yields.value.setchartWH(a.oWidth, a.oHeight - 30);
 };
 let powerOption = reactive({
   title: "",
@@ -96,7 +88,7 @@ let powerOption = reactive({
         color: "rgb(255,255,255,0.9)",
       },
     },
-   
+
     tooltip: {
       trigger: "item",
       axisPointer: {
@@ -107,8 +99,8 @@ let powerOption = reactive({
     },
     legend: {
       type: "scroll",
-      width:800,
-  right:20,
+      width: 800,
+      right: 20,
     },
     grid: {
       top: "8%",
@@ -121,10 +113,10 @@ let powerOption = reactive({
       type: 'category',
       data: [
       ],
-      
+
     },
     yAxis: {
-      type: 'value', 
+      type: 'value',
     },
     series: [
     ],
@@ -139,7 +131,7 @@ let ProductionOption = reactive({
         color: "rgb(255,255,255,0.9)",
       },
     },
-   
+
     tooltip: {
       trigger: "item",
       axisPointer: {
@@ -150,8 +142,8 @@ let ProductionOption = reactive({
     },
     legend: {
       type: "scroll",
-      width:800,
-  right:20,
+      width: 800,
+      right: 20,
     },
     grid: {
       top: "8%",
@@ -164,10 +156,10 @@ let ProductionOption = reactive({
       type: 'category',
       data: [
       ],
-      
+
     },
     yAxis: {
-      type: 'value', 
+      type: 'value',
     },
     series: [
     ],
@@ -187,95 +179,95 @@ let ProductionOption = reactive({
 //       // yields.value.setData(result.data);
 //     }
 //   }
-function setcontentData(val){
-  let monthData=[]
-    let powerMonth=[]
-    for(let key in val.power){
-        monthData.push(key)
-        powerMonth.push(val.power[key])
-    }
-    powerOption.option.xAxis.data=[]
-    powerOption.option.series=[]
-    powerOption.option.xAxis.data=monthData.reverse()
-    powerOption.option.series.push({
-      data: powerMonth.reverse(),
-      type: 'bar',
-      showBackground: true,
-      backgroundStyle: {
-        color: 'rgba(180, 180, 180, 0.2)'
-      },
-      itemStyle: {
-            color: function(params) {
-                // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
-                // console.log(params)
-                let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
-                // return colors[params.dataIndex];
-                return color[params.dataIndex];
-            }
-        },
-    barWidth:'50%',
+function setcontentData(val) {
+  let monthData = []
+  let powerMonth = []
+  for (let key in val.power) {
+    monthData.push(key)
+    powerMonth.push(val.power[key])
+  }
+  powerOption.option.xAxis.data = []
+  powerOption.option.series = []
+  powerOption.option.xAxis.data = monthData.reverse()
+  powerOption.option.series.push({
+    data: powerMonth.reverse(),
+    type: 'bar',
+    showBackground: true,
+    backgroundStyle: {
+      color: 'rgba(180, 180, 180, 0.2)'
+    },
+    itemStyle: {
+      color: function (params) {
+        // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
+        // console.log(params)
+        let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
+        // return colors[params.dataIndex];
+        return color[params.dataIndex];
+      }
+    },
+    barWidth: '30%',
     label: {
-            show: true,
-            color:'#fff',
-            formatter: function(params){
-              return params.value.toLocaleString()
-            },
-            position: "top",
-            textStyle: {
-              color: "#fff",
-              fontSize: 14,
-            },
-        },
-    })
-    
-    powerref.value.changeData(powerOption.option)
+      show: true,
+      color: '#fff',
+      formatter: function (params) {
+        return params.value.toLocaleString()
+      },
+      position: "top",
+      textStyle: {
+        color: "#fff",
+        fontSize: 14,
+      },
+    },
+  })
+
+  powerref.value.changeData(powerOption.option)
 
 
-    let monthData2=[]
-    let powerMonth2=[]
-    for(let key in val.rate){
-        monthData2.push(key)
-        powerMonth2.push(val.rate[key])
-    }
-    ProductionOption.option.xAxis.data=[]
-    ProductionOption.option.series=[]
-    ProductionOption.option.xAxis.data=monthData2.reverse()
-    ProductionOption.option.series.push({
-      data: powerMonth2.reverse(),
-      type: 'bar',
-      showBackground: true,
-      backgroundStyle: {
-        color: 'rgba(180, 180, 180, 0.2)'
-      },
-      itemStyle: {
-            color: function(params) {
-                // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
-                // console.log(params)
-                let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
-                // return colors[params.dataIndex];
-                return color[params.dataIndex];
-            }
-        },
-    barWidth:'30%',
+  let monthData2 = []
+  let powerMonth2 = []
+  for (let key in val.rate) {
+    monthData2.push(key)
+    powerMonth2.push(val.rate[key])
+  }
+  ProductionOption.option.xAxis.data = []
+  ProductionOption.option.series = []
+  ProductionOption.option.xAxis.data = monthData2.reverse()
+  ProductionOption.option.series.push({
+    data: powerMonth2.reverse(),
+    type: 'bar',
+    showBackground: true,
+    backgroundStyle: {
+      color: 'rgba(180, 180, 180, 0.2)'
+    },
+    itemStyle: {
+      color: function (params) {
+        // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
+        // console.log(params)
+        let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
+        // return colors[params.dataIndex];
+        return color[params.dataIndex];
+      }
+    },
+    barWidth: '25%',
     label: {
-            show: true,
-            color:'#fff',
-            formatter: function(params){
-              return params.value.toLocaleString()
-            },
-            position: "top",
-            textStyle: {
-              color: "#fff",
-              fontSize: 14,
-            },
-        },
-    })
-    
-    Productionref.value.changeData(ProductionOption.option)
-    // pmref.value.setData({two:val.dust.pm25,ten:val.dust.pm10})
+      show: true,
+      color: '#fff',
+      formatter: function (params) {
+        return params.value.toLocaleString()
+      },
+      position: "top",
+      textStyle: {
+        color: "#fff",
+        fontSize: 14,
+      },
+    },
+  })
+
+  Productionref.value.changeData(ProductionOption.option)
+  // pmref.value.setData({two:val.dust.pm25,ten:val.dust.pm10})
 }
 onMounted(() => {
-    
+
 
 
 });
diff --git a/src/views/PaintShopView/machiningView/bottom.vue b/src/views/PaintShopView/machiningView/bottom.vue
index d7bf389..4fd4244 100644
--- a/src/views/PaintShopView/machiningView/bottom.vue
+++ b/src/views/PaintShopView/machiningView/bottom.vue
@@ -12,16 +12,8 @@
     <el-row>
       <el-col :span="24">
         <div style="display: flex;justify-content: space-evenly; align-items: center; margin-bottom: 10px;">
-          <chart
-            :title="powerOption.title"
-            :option="powerOption.option"
-            ref="powerref"
-          ></chart>
-          <chart
-            :title="ProductionOption.title"
-            :option="ProductionOption.option"
-            ref="Productionref"
-          ></chart>
+          <chart :title="powerOption.title" :option="powerOption.option" ref="powerref"></chart>
+          <chart :title="ProductionOption.title" :option="ProductionOption.option" ref="Productionref"></chart>
           <!-- <div>
             <border3 ref="borderref">
                   <template v-slot>
@@ -48,13 +40,13 @@ import chart from "@/components/assembly/chart2.vue";
 import { useRoute, useRouter } from "vue-router";
 import { useEnergyConsumeStore } from "@/store/module/energyConsume";
 import { useI18n } from 'vue-i18n'
-let {t} = useI18n();
+let { t } = useI18n();
 const store = useEnergyConsumeStore();
 const router = useRouter();
 
 let powerref = ref();
 let Productionref = ref();
-let borderref=ref()
+let borderref = ref()
 // let pmref=ref()
 
 let props = defineProps<{
@@ -82,10 +74,10 @@ function reset(val: any) {
 const powerBox = (width: any, height: any) => {
   let a = calcWH(height, width, 1, 2, 0);
   //修改高度
-  powerref.value.setchartWH(a.oWidth-20, a.oHeight-20);
-  Productionref.value.setchartWH(a.oWidth-20, a.oHeight-20);
+  powerref.value.setchartWH(a.oWidth - 20, a.oHeight - 20);
+  Productionref.value.setchartWH(a.oWidth - 20, a.oHeight - 20);
   // pmref.value.setchartWH(a.oWidth-40,a.oHeight-40)
-//   yields.value.setchartWH(a.oWidth, a.oHeight - 30);
+  //   yields.value.setchartWH(a.oWidth, a.oHeight - 30);
 };
 let powerOption = reactive({
   title: "",
@@ -96,7 +88,7 @@ let powerOption = reactive({
         color: "rgb(255,255,255,0.9)",
       },
     },
-   
+
     tooltip: {
       trigger: "item",
       axisPointer: {
@@ -107,8 +99,8 @@ let powerOption = reactive({
     },
     legend: {
       type: "scroll",
-      width:800,
-  right:20,
+      width: 800,
+      right: 20,
     },
     grid: {
       top: "8%",
@@ -121,10 +113,10 @@ let powerOption = reactive({
       type: 'category',
       data: [
       ],
-      
+
     },
     yAxis: {
-      type: 'value', 
+      type: 'value',
     },
     series: [
     ],
@@ -139,7 +131,7 @@ let ProductionOption = reactive({
         color: "rgb(255,255,255,0.9)",
       },
     },
-   
+
     tooltip: {
       trigger: "item",
       axisPointer: {
@@ -150,8 +142,8 @@ let ProductionOption = reactive({
     },
     legend: {
       type: "scroll",
-      width:800,
-  right:20,
+      width: 800,
+      right: 20,
     },
     grid: {
       top: "8%",
@@ -164,16 +156,16 @@ let ProductionOption = reactive({
       type: 'category',
       data: [
       ],
-      
+
     },
     yAxis: {
-      type: 'value', 
+      type: 'value',
     },
     series: [
     ],
   },
 });
-let Data={power:{"1月":11,"2月":22,"3月":11,"4月":22},Production:{"1月":11,"2月":22,"3月":11,"4月":22}}
+let Data = { power: { "1月": 11, "2月": 22, "3月": 11, "4月": 22 }, Production: { "1月": 11, "2月": 22, "3月": 11, "4月": 22 } }
 //   async function getpower() {
 //     let result: any = await getPowerData({ time: 1 });
 
@@ -188,95 +180,95 @@ let Data={power:{"1月":11,"2月":22,"3月":11,"4月":22},Production:{"1月":11,
 //       // yields.value.setData(result.data);
 //     }
 //   }
-function setcontentData(val){
-  let monthData=[]
-    let powerMonth=[]
-    for(let key in val.power){
-        monthData.push(key)
-        powerMonth.push(val.power[key])
-    }
-    powerOption.option.xAxis.data=[]
-    powerOption.option.series=[]
-    powerOption.option.xAxis.data=monthData.reverse()
-    powerOption.option.series.push({
-      data: powerMonth.reverse(),
-      type: 'bar',
-      showBackground: true,
-      backgroundStyle: {
-        color: 'rgba(180, 180, 180, 0.2)'
-      },
-      itemStyle: {
-            color: function(params) {
-                // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
-                // console.log(params)
-                let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
-                // return colors[params.dataIndex];
-                return color[params.dataIndex];
-            }
-        },    
-        barWidth:'50%',
+function setcontentData(val) {
+  let monthData = []
+  let powerMonth = []
+  for (let key in val.power) {
+    monthData.push(key)
+    powerMonth.push(val.power[key])
+  }
+  powerOption.option.xAxis.data = []
+  powerOption.option.series = []
+  powerOption.option.xAxis.data = monthData.reverse()
+  powerOption.option.series.push({
+    data: powerMonth.reverse(),
+    type: 'bar',
+    showBackground: true,
+    backgroundStyle: {
+      color: 'rgba(180, 180, 180, 0.2)'
+    },
+    itemStyle: {
+      color: function (params) {
+        // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
+        // console.log(params)
+        let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
+        // return colors[params.dataIndex];
+        return color[params.dataIndex];
+      }
+    },
+    barWidth: '30%',
     label: {
-            show: true,
-            color:'#fff',
-            formatter: function(params){
-              return params.value.toLocaleString()
-            },
-            position: "top",
-            textStyle: {
-              color: "#fff",
-              fontSize: 14,
-            },
-        },
-    })
-    
-    powerref.value.changeData(powerOption.option)
+      show: true,
+      color: '#fff',
+      formatter: function (params) {
+        return params.value.toLocaleString()
+      },
+      position: "top",
+      textStyle: {
+        color: "#fff",
+        fontSize: 14,
+      },
+    },
+  })
+
+  powerref.value.changeData(powerOption.option)
 
 
-    let monthData2=[]
-    let powerMonth2=[]
-    for(let key in val.rate){
-        monthData2.push(key)
-        powerMonth2.push(val.rate[key])
-    }
-    ProductionOption.option.xAxis.data=[]
-    ProductionOption.option.series=[]
-    ProductionOption.option.xAxis.data=monthData2.reverse()
-    ProductionOption.option.series.push({
-      data: powerMonth2.reverse(),
-      type: 'bar',
-      showBackground: true,
-      backgroundStyle: {
-        color: 'rgba(180, 180, 180, 0.2)'
-      },
-      itemStyle: {
-            color: function(params) {
-                // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
-                // console.log(params)
-                let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
-                // return colors[params.dataIndex];
-                return color[params.dataIndex];
-            }
-        },
-    barWidth:'30%',
+  let monthData2 = []
+  let powerMonth2 = []
+  for (let key in val.rate) {
+    monthData2.push(key)
+    powerMonth2.push(val.rate[key])
+  }
+  ProductionOption.option.xAxis.data = []
+  ProductionOption.option.series = []
+  ProductionOption.option.xAxis.data = monthData2.reverse()
+  ProductionOption.option.series.push({
+    data: powerMonth2.reverse(),
+    type: 'bar',
+    showBackground: true,
+    backgroundStyle: {
+      color: 'rgba(180, 180, 180, 0.2)'
+    },
+    itemStyle: {
+      color: function (params) {
+        // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
+        // console.log(params)
+        let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
+        // return colors[params.dataIndex];
+        return color[params.dataIndex];
+      }
+    },
+    barWidth: '25%',
     label: {
-            show: true,
-            color:'#fff',
-            formatter: function(params){
-              return params.value.toLocaleString()
-            },
-            position: "top",
-            textStyle: {
-              color: "#fff",
-              fontSize: 14,
-            },
-        },
-    })
-    
-    Productionref.value.changeData(ProductionOption.option)
-    // pmref.value.setData({two:val.dust.pm25,ten:val.dust.pm10})
+      show: true,
+      color: '#fff',
+      formatter: function (params) {
+        return params.value.toLocaleString()
+      },
+      position: "top",
+      textStyle: {
+        color: "#fff",
+        fontSize: 14,
+      },
+    },
+  })
+
+  Productionref.value.changeData(ProductionOption.option)
+  // pmref.value.setData({two:val.dust.pm25,ten:val.dust.pm10})
 }
 onMounted(() => {
-    
+
 
 
 });
diff --git a/src/views/PaintShopView/stuffView/bottom.vue b/src/views/PaintShopView/stuffView/bottom.vue
index c073142..b4e64fa 100644
--- a/src/views/PaintShopView/stuffView/bottom.vue
+++ b/src/views/PaintShopView/stuffView/bottom.vue
@@ -12,16 +12,8 @@
     <el-row>
       <el-col :span="24">
         <div style="display: flex;justify-content: space-evenly; align-items: center; margin-bottom: 10px;">
-          <chart
-            :title="powerOption.title"
-            :option="powerOption.option"
-            ref="powerref"
-          ></chart>
-          <chart
-            :title="powerOption.title"
-            :option="powerOption.option"
-            ref="Productionref"
-          ></chart>
+          <chart :title="powerOption.title" :option="powerOption.option" ref="powerref"></chart>
+          <chart :title="powerOption.title" :option="powerOption.option" ref="Productionref"></chart>
           <!-- <div>
             <border3 ref="borderref">
                   <template v-slot>
@@ -48,7 +40,7 @@ import chart from "@/components/assembly/chart2.vue";
 import { useRoute, useRouter } from "vue-router";
 import { useEnergyConsumeStore } from "@/store/module/energyConsume";
 import { useI18n } from 'vue-i18n'
-let {t} = useI18n();
+let { t } = useI18n();
 const store = useEnergyConsumeStore();
 const router = useRouter();
 
@@ -82,10 +74,10 @@ function reset(val: any) {
 const powerBox = (width: any, height: any) => {
   let a = calcWH(height, width, 1, 2, 0);
   //修改高度
-  powerref.value.setchartWH(a.oWidth-20, a.oHeight-20);
-  Productionref.value.setchartWH(a.oWidth-20, a.oHeight-20);
+  powerref.value.setchartWH(a.oWidth - 20, a.oHeight - 20);
+  Productionref.value.setchartWH(a.oWidth - 20, a.oHeight - 20);
   // pmref.value.setchartWH(a.oWidth-40,a.oHeight-40)
-//   yields.value.setchartWH(a.oWidth, a.oHeight - 30);
+  //   yields.value.setchartWH(a.oWidth, a.oHeight - 30);
 };
 let powerOption = reactive({
   title: "",
@@ -96,7 +88,7 @@ let powerOption = reactive({
         color: "rgb(255,255,255,0.9)",
       },
     },
-   
+
     tooltip: {
       trigger: "item",
       axisPointer: {
@@ -107,8 +99,8 @@ let powerOption = reactive({
     },
     legend: {
       type: "scroll",
-      width:800,
-  right:20,
+      width: 800,
+      right: 20,
     },
     grid: {
       top: "8%",
@@ -121,10 +113,10 @@ let powerOption = reactive({
       type: 'category',
       data: [
       ],
-      
+
     },
     yAxis: {
-      type: 'value', 
+      type: 'value',
     },
     series: [
     ],
@@ -139,7 +131,7 @@ let ProductionOption = reactive({
         color: "rgb(255,255,255,0.9)",
       },
     },
-   
+
     tooltip: {
       trigger: "item",
       axisPointer: {
@@ -150,8 +142,8 @@ let ProductionOption = reactive({
     },
     legend: {
       type: "scroll",
-      width:800,
-  right:20,
+      width: 800,
+      right: 20,
     },
     grid: {
       top: "8%",
@@ -164,16 +156,16 @@ let ProductionOption = reactive({
       type: 'category',
       data: [
       ],
-      
+
     },
     yAxis: {
-      type: 'value', 
+      type: 'value',
     },
     series: [
     ],
   },
 });
-let Data={power:{"1月":11,"2月":22,"3月":11,"4月":22},Production:{"1月":11,"2月":22,"3月":11,"4月":22}}
+let Data = { power: { "1月": 11, "2月": 22, "3月": 11, "4月": 22 }, Production: { "1月": 11, "2月": 22, "3月": 11, "4月": 22 } }
 //   async function getpower() {
 //     let result: any = await getPowerData({ time: 1 });
 
@@ -188,97 +180,97 @@ let Data={power:{"1月":11,"2月":22,"3月":11,"4月":22},Production:{"1月":11,
 //       // yields.value.setData(result.data);
 //     }
 //   }
-function setcontentData(val){
-  let monthData=[]
-    let powerMonth=[]
-    for(let key in val.power){
-        monthData.push(key)
-        powerMonth.push(val.power[key])
-    }
-    powerOption.option.xAxis.data=[]
-    powerOption.option.series=[]
-    powerOption.option.xAxis.data=monthData.reverse()
-    powerOption.option.series.push({
-      data: powerMonth.reverse(),
-      type: 'bar',
-      showBackground: true,
-      backgroundStyle: {
-        color: 'rgba(180, 180, 180, 0.2)'
-      },
-      itemStyle: {
-            color: function(params) {
-                // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
-                // console.log(params)
-                let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
-                // return colors[params.dataIndex];
-                return color[params.dataIndex];
-            }
-        },
-    barWidth:'30%',
+function setcontentData(val) {
+  let monthData = []
+  let powerMonth = []
+  for (let key in val.power) {
+    monthData.push(key)
+    powerMonth.push(val.power[key])
+  }
+  powerOption.option.xAxis.data = []
+  powerOption.option.series = []
+  powerOption.option.xAxis.data = monthData.reverse()
+  powerOption.option.series.push({
+    data: powerMonth.reverse(),
+    type: 'bar',
+    showBackground: true,
+    backgroundStyle: {
+      color: 'rgba(180, 180, 180, 0.2)'
+    },
+    itemStyle: {
+      color: function (params) {
+        // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
+        // console.log(params)
+        let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
+        // return colors[params.dataIndex];
+        return color[params.dataIndex];
+      }
+    },
+    barWidth: '30%',
     label: {
-            show: true,
-            color:'#fff',
-            formatter: function(params){
-              // console.log(params);
-              return params.value.toLocaleString()
-            },
-            position: "top",
-            textStyle: {
-              color: "#fff",
-              fontSize: 14,
-            },
-        },
-    })
-    
-    powerref.value.changeData(powerOption.option)
+      show: true,
+      color: '#fff',
+      formatter: function (params) {
+        // console.log(params);
+        return params.value.toLocaleString()
+      },
+      position: "top",
+      textStyle: {
+        color: "#fff",
+        fontSize: 14,
+      },
+    },
+  })
+
+  powerref.value.changeData(powerOption.option)
 
 
-    let monthData2=[]
-    let powerMonth2=[]
-    for(let key in val.rate){
-        monthData2.push(key)
-        powerMonth2.push(val.rate[key])
-    }
-    ProductionOption.option.xAxis.data=[]
-    ProductionOption.option.series=[]
-    ProductionOption.option.xAxis.data=monthData2.reverse()
-    ProductionOption.option.series.push({
-      data: powerMonth2.reverse(),
-      type: 'bar',
-      showBackground: true,
-      backgroundStyle: {
-        color: 'rgba(180, 180, 180, 0.2)'
-      },
-      itemStyle: {
-            color: function(params) {
-                // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
-                // console.log(params)
-                let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
-                // return colors[params.dataIndex];
-                return color[params.dataIndex];
-            }
-        },
-    barWidth:'20%',
+  let monthData2 = []
+  let powerMonth2 = []
+  for (let key in val.rate) {
+    monthData2.push(key)
+    powerMonth2.push(val.rate[key])
+  }
+  ProductionOption.option.xAxis.data = []
+  ProductionOption.option.series = []
+  ProductionOption.option.xAxis.data = monthData2.reverse()
+  ProductionOption.option.series.push({
+    data: powerMonth2.reverse(),
+    type: 'bar',
+    showBackground: true,
+    backgroundStyle: {
+      color: 'rgba(180, 180, 180, 0.2)'
+    },
+    itemStyle: {
+      color: function (params) {
+        // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
+        // console.log(params)
+        let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
+        // return colors[params.dataIndex];
+        return color[params.dataIndex];
+      }
+    },
+    barWidth: '25%',
     label: {
-            show: true,
-            color:'#fff',
-            formatter: function(params){
-              // console.log(params);
-              return params.value.toLocaleString()
-            },
-            position: "top",
-            textStyle: {
-              color: "#fff",
-              fontSize: 14,
-            },
-        },
-    })
-    
-    Productionref.value.changeData(ProductionOption.option)
-    // pmref.value.setData({two:val.dust.pm25,ten:val.dust.pm10})
+      show: true,
+      color: '#fff',
+      formatter: function (params) {
+        // console.log(params);
+        return params.value.toLocaleString()
+      },
+      position: "top",
+      textStyle: {
+        color: "#fff",
+        fontSize: 14,
+      },
+    },
+  })
+
+  Productionref.value.changeData(ProductionOption.option)
+  // pmref.value.setData({two:val.dust.pm25,ten:val.dust.pm10})
 }
 onMounted(() => {
-    
+
 
 
 });
diff --git a/src/views/PaintShopView/weldView/bottom.vue b/src/views/PaintShopView/weldView/bottom.vue
index 68f36fc..25571ca 100644
--- a/src/views/PaintShopView/weldView/bottom.vue
+++ b/src/views/PaintShopView/weldView/bottom.vue
@@ -12,16 +12,8 @@
     <el-row>
       <el-col :span="24">
         <div style="display: flex;justify-content: space-evenly; align-items: center; margin-bottom: 10px;">
-          <chart
-            :title="powerOption.title"
-            :option="powerOption.option"
-            ref="powerref"
-          ></chart>
-          <chart
-            :title="powerOption.title"
-            :option="powerOption.option"
-            ref="Productionref"
-          ></chart>
+          <chart :title="powerOption.title" :option="powerOption.option" ref="powerref"></chart>
+          <chart :title="powerOption.title" :option="powerOption.option" ref="Productionref"></chart>
           <!-- <div>
             <border3 ref="borderref">
                   <template v-slot>
@@ -48,7 +40,7 @@ import chart from "@/components/assembly/chart2.vue";
 import { useRoute, useRouter } from "vue-router";
 import { useEnergyConsumeStore } from "@/store/module/energyConsume";
 import { useI18n } from 'vue-i18n'
-let {t} = useI18n();
+let { t } = useI18n();
 const store = useEnergyConsumeStore();
 const router = useRouter();
 
@@ -82,10 +74,10 @@ function reset(val: any) {
 const powerBox = (width: any, height: any) => {
   let a = calcWH(height, width, 1, 2, 0);
   //修改高度
-  powerref.value.setchartWH(a.oWidth-20, a.oHeight-20);
-  Productionref.value.setchartWH(a.oWidth-20, a.oHeight-20);
+  powerref.value.setchartWH(a.oWidth - 20, a.oHeight - 20);
+  Productionref.value.setchartWH(a.oWidth - 20, a.oHeight - 20);
   // pmref.value.setchartWH(a.oWidth-40,a.oHeight-40)
-//   yields.value.setchartWH(a.oWidth, a.oHeight - 30);
+  //   yields.value.setchartWH(a.oWidth, a.oHeight - 30);
 };
 let powerOption = reactive({
   title: "",
@@ -96,7 +88,7 @@ let powerOption = reactive({
         color: "rgb(255,255,255,0.9)",
       },
     },
-   
+
     tooltip: {
       trigger: "item",
       axisPointer: {
@@ -107,8 +99,8 @@ let powerOption = reactive({
     },
     legend: {
       type: "scroll",
-      width:800,
-  right:20,
+      width: 800,
+      right: 20,
     },
     grid: {
       top: "8%",
@@ -121,10 +113,10 @@ let powerOption = reactive({
       type: 'category',
       data: [
       ],
-      
+
     },
     yAxis: {
-      type: 'value', 
+      type: 'value',
     },
     series: [
     ],
@@ -139,7 +131,7 @@ let ProductionOption = reactive({
         color: "rgb(255,255,255,0.9)",
       },
     },
-   
+
     tooltip: {
       trigger: "item",
       axisPointer: {
@@ -150,8 +142,8 @@ let ProductionOption = reactive({
     },
     legend: {
       type: "scroll",
-      width:800,
-  right:20,
+      width: 800,
+      right: 20,
     },
     grid: {
       top: "8%",
@@ -164,16 +156,16 @@ let ProductionOption = reactive({
       type: 'category',
       data: [
       ],
-      
+
     },
     yAxis: {
-      type: 'value', 
+      type: 'value',
     },
     series: [
     ],
   },
 });
-let Data={power:{"1月":11,"2月":22,"3月":11,"4月":22},Production:{"1月":11,"2月":22,"3月":11,"4月":22}}
+let Data = { power: { "1月": 11, "2月": 22, "3月": 11, "4月": 22 }, Production: { "1月": 11, "2月": 22, "3月": 11, "4月": 22 } }
 //   async function getpower() {
 //     let result: any = await getPowerData({ time: 1 });
 
@@ -188,97 +180,97 @@ let Data={power:{"1月":11,"2月":22,"3月":11,"4月":22},Production:{"1月":11,
 //       // yields.value.setData(result.data);
 //     }
 //   }
-function setcontentData(val){
-  let monthData=[]
-    let powerMonth=[]
-    for(let key in val.power){
-        monthData.push(key)
-        powerMonth.push(val.power[key])
-    }
-    powerOption.option.xAxis.data=[]
-    powerOption.option.series=[]
-    powerOption.option.xAxis.data=monthData.reverse()
-    powerOption.option.series.push({
-      data: powerMonth.reverse(),
-      type: 'bar',
-      showBackground: true,
-      backgroundStyle: {
-        color: 'rgba(180, 180, 180, 0.2)'
-      },
-      itemStyle: {
-            color: function(params) {
-                // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
-                // console.log(params)
-                let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
-                // return colors[params.dataIndex];
-                return color[params.dataIndex];
-            }
-        },
-    barWidth:'30%',
+function setcontentData(val) {
+  let monthData = []
+  let powerMonth = []
+  for (let key in val.power) {
+    monthData.push(key)
+    powerMonth.push(val.power[key])
+  }
+  powerOption.option.xAxis.data = []
+  powerOption.option.series = []
+  powerOption.option.xAxis.data = monthData.reverse()
+  powerOption.option.series.push({
+    data: powerMonth.reverse(),
+    type: 'bar',
+    showBackground: true,
+    backgroundStyle: {
+      color: 'rgba(180, 180, 180, 0.2)'
+    },
+    itemStyle: {
+      color: function (params) {
+        // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
+        // console.log(params)
+        let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
+        // return colors[params.dataIndex];
+        return color[params.dataIndex];
+      }
+    },
+    barWidth: '30%',
     label: {
-            show: true,
-            color:'#fff',
-            formatter:function(params){
-              // console.log(params);
-              return params.value.toLocaleString()
-            },
-            position: "top",
-            textStyle: {
-              color: "#fff",
-              fontSize: 14,
-            },
-        },
-    })
-    
-    powerref.value.changeData(powerOption.option)
+      show: true,
+      color: '#fff',
+      formatter: function (params) {
+        // console.log(params);
+        return params.value.toLocaleString()
+      },
+      position: "top",
+      textStyle: {
+        color: "#fff",
+        fontSize: 14,
+      },
+    },
+  })
+
+  powerref.value.changeData(powerOption.option)
 
 
-    let monthData2=[]
-    let powerMonth2=[]
-    for(let key in val.rate){
-        monthData2.push(key)
-        powerMonth2.push(val.rate[key])
-    }
-    ProductionOption.option.xAxis.data=[]
-    ProductionOption.option.series=[]
-    ProductionOption.option.xAxis.data=monthData2.reverse()
-    ProductionOption.option.series.push({
-      data: powerMonth2.reverse(),
-      type: 'bar',
-      showBackground: true,
-      backgroundStyle: {
-        color: 'rgba(180, 180, 180, 0.2)'
-      },
-      itemStyle: {
-            color: function(params) {
-                // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
-                // console.log(params)
-                let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
-                // return colors[params.dataIndex];
-                return color[params.dataIndex];
-            }
-        },
-    barWidth:'20%',
+  let monthData2 = []
+  let powerMonth2 = []
+  for (let key in val.rate) {
+    monthData2.push(key)
+    powerMonth2.push(val.rate[key])
+  }
+  ProductionOption.option.xAxis.data = []
+  ProductionOption.option.series = []
+  ProductionOption.option.xAxis.data = monthData2.reverse()
+  ProductionOption.option.series.push({
+    data: powerMonth2.reverse(),
+    type: 'bar',
+    showBackground: true,
+    backgroundStyle: {
+      color: 'rgba(180, 180, 180, 0.2)'
+    },
+    itemStyle: {
+      color: function (params) {
+        // 通过返回值的下标一一对应将颜色赋给柱子上，return出去什么颜色就是什么颜色，这里可以写判断
+        // console.log(params)
+        let color = ['#1089e7', '#f57474', '#56d0e3', '#f8b448', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
+        // return colors[params.dataIndex];
+        return color[params.dataIndex];
+      }
+    },
+    barWidth: '25%',
     label: {
-            show: true,
-            color:'#fff',
-            formatter:function(params){
-              // console.log(params);
-              return params.value.toLocaleString()
-            },
-            position: "top",
-            textStyle: {
-              color: "#fff",
-              fontSize: 14,
-            },
-        },
-    })
-    
-    Productionref.value.changeData(ProductionOption.option)
-    // pmref.value.setData({two:val.dust.pm25,ten:val.dust.pm10})
+      show: true,
+      color: '#fff',
+      formatter: function (params) {
+        // console.log(params);
+        return params.value.toLocaleString()
+      },
+      position: "top",
+      textStyle: {
+        color: "#fff",
+        fontSize: 14,
+      },
+    },
+  })
+
+  Productionref.value.changeData(ProductionOption.option)
+  // pmref.value.setData({two:val.dust.pm25,ten:val.dust.pm10})
 }
 onMounted(() => {
-    
+
 
 
 });
diff --git a/src/views/index.vue b/src/views/index.vue
index 058cb21..4979976 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -202,7 +202,7 @@ let routerList = [
     isLink: false,
     path: "/realtimeSecurityJixie",
     title: t("messages.realtimeSecurityJixie"),
-    url: require("../assets/indexImg/realtimeSecurity.png"),
+    url: require("../assets/indexImg/realtimeSecurityJixie.png"),
   },
   {
     id: 22,