diff --git a/public/models/01changfang/Texture/04a7d4d3-c071-4223-9ecb-b3f7463aa257.hdr b/public/models/01changfang/Texture/04a7d4d3-c071-4223-9ecb-b3f7463aa257.hdr
new file mode 100644
index 0000000..fb99836
Binary files /dev/null and b/public/models/01changfang/Texture/04a7d4d3-c071-4223-9ecb-b3f7463aa257.hdr differ
diff --git a/public/models/01changfang/Texture/1d41cc4e-2504-42c8-b6ab-1710d79052f8.jpg b/public/models/01changfang/Texture/1d41cc4e-2504-42c8-b6ab-1710d79052f8.jpg
new file mode 100644
index 0000000..15b04f7
Binary files /dev/null and b/public/models/01changfang/Texture/1d41cc4e-2504-42c8-b6ab-1710d79052f8.jpg differ
diff --git a/public/models/01changfang/fileList.json b/public/models/01changfang/fileList.json
index 72ced5e..ae4c42c 100644
--- a/public/models/01changfang/fileList.json
+++ b/public/models/01changfang/fileList.json
@@ -1 +1 @@
-{"sky":{"a":"sky/a/04a7d4d3-c071-4223-9ecb-b3f7463aa257.hdr","b":"sky/b/1d41cc4e-2504-42c8-b6ab-1710d79052f8.jpg"},"mat":["mat/08b5ea5843d94451a0c4672ad705fb2e.json"],"instance":["instance/9d3f64f01c95465e9e015fb7da48c737.mrmb"],"box":{"max":[1643.9346923828125,36.417999267578125,656.109375],"min":[-1077.169921875,-6.0707221031188965,-843.8449096679688]},"m":["m/617164a797ff4561a3e172adc780e6d6.mrmb"],"addition":["addition/2dbf16100d85430c9bfba3b033161313.mrmb"]}
\ No newline at end of file
+{"sky":{"a":"sky/a/04a7d4d3-c071-4223-9ecb-b3f7463aa257.hdr","b":"sky/b/1d41cc4e-2504-42c8-b6ab-1710d79052f8.jpg"},"mat":["mat/mat.json"],"instance":["instance/9d3f64f01c95465e9e015fb7da48c737.mrmb"],"box":{"max":[1643.9346923828125,36.417999267578125,656.109375],"min":[-1077.169921875,-6.0707221031188965,-843.8449096679688]},"m":["m/617164a797ff4561a3e172adc780e6d6.mrmb"],"scene":"scene/scene.json","sceneData":"sceneData/sceneData.json","addition":["addition/2dbf16100d85430c9bfba3b033161313.mrmb"]}
\ No newline at end of file
diff --git a/public/models/01changfang/mat/08b5ea5843d94451a0c4672ad705fb2e.json b/public/models/01changfang/mat/08b5ea5843d94451a0c4672ad705fb2e.json
deleted file mode 100644
index 127d74c..0000000
--- a/public/models/01changfang/mat/08b5ea5843d94451a0c4672ad705fb2e.json
+++ /dev/null
@@ -1 +0,0 @@
-{"a":[{"ee":"wire_137180228","ii":32,"a":0,"b":[0.5373,0.7059,0.8941],"jr":1,"j":1},{"ee":"wire_075148229","ii":32,"a":1,"b":[0.2941,0.5804,0.898],"jr":1,"j":1},{"ee":"wire_195174000","ii":32,"a":2,"b":[0.7647,0.6824,0],"jr":1,"j":1},{"ee":"wire_145197255","ii":32,"a":3,"b":[0.5686,0.7725,1],"jr":1,"j":1},{"a":4,"re":2}],"b":{},"version":"1","z":{}}
\ No newline at end of file
diff --git a/public/models/01changfang/mat/mat.json b/public/models/01changfang/mat/mat.json
new file mode 100644
index 0000000..5a7cc10
--- /dev/null
+++ b/public/models/01changfang/mat/mat.json
@@ -0,0 +1 @@
+{"a":[{"gg":0,"hh":0,"ii":32,"jj":true,"kk":2000,"ee":"wire_195174000","a":2,"b":[0.7647,0.6824,0],"d":[0,0,0],"os":false,"e":1,"pv":true,"g":0,"h":0,"jr":1,"i":1,"j":1,"lw":false,"transparent":false,"dt":true,"dw":true,"si":0,"rm":false,"qn":0},{"gg":0,"hh":0,"ii":32,"jj":true,"kk":2000,"ee":"wire_145197255","a":3,"b":[0.5686,0.7725,1],"d":[0,0,0],"os":false,"e":1,"pv":true,"g":0,"h":0,"jr":1,"i":1,"j":1,"lw":false,"transparent":false,"dt":true,"dw":true,"si":0,"rm":false,"qn":0},{"gg":0,"hh":0,"ii":1,"jj":true,"kk":2000,"ee":"wire_075148229","a":1,"b":[0.2901960784313726,0.5803921568627451,0.8941176470588236],"d":[0,0,0],"os":false,"e":1,"pv":true,"g":0,"h":0,"jr":1,"i":1,"j":1,"lw":false,"transparent":false,"dt":true,"dw":true,"si":2,"rm":false,"qn":0},{"gg":0,"hh":0,"ii":1,"jj":true,"kk":2000,"ee":"wire_137180228","a":0,"b":[0.8431372549019608,0.9490196078431372,1],"d":[0,0,0],"os":false,"e":1,"pv":true,"g":0,"h":0,"jr":1,"i":1,"j":1,"lw":false,"transparent":false,"dt":true,"dw":true,"si":2,"rm":false,"qn":0},{"a":4,"re":2}],"b":{},"c":{},"z":{},"ed":true}
\ No newline at end of file
diff --git a/public/models/01changfang/scene/scene.json b/public/models/01changfang/scene/scene.json
new file mode 100644
index 0000000..cf045ec
--- /dev/null
+++ b/public/models/01changfang/scene/scene.json
@@ -0,0 +1 @@
+{"a":{"aa":"#ffffff","ab":0.7},"b":{"bb":0.3,"bc":[0,0.7071067811865475,0.7071067811865475],"bv":true,"ba":"#ffffff"},"c":1,"ei":0.7,"e":"04a7d4d3-c071-4223-9ecb-b3f7463aa257.hdr","f":{"a":0,"b":0,"v":false},"g":{"d":0,"o":0,"v":false},"k":{"b":0,"h":0,"s":0,"v":false},"q":{"c":[],"d":0,"o":1,"r":[],"v":false},"s":{"r":0,"s":0,"v":false},"u":{"r":0,"s":0,"v":false},"v":true,"ea":0,"ca":"1d41cc4e-2504-42c8-b6ab-1710d79052f8.jpg","cb":0.5}
\ No newline at end of file
diff --git a/public/models/01changfang/sceneData/sceneData.json b/public/models/01changfang/sceneData/sceneData.json
new file mode 100644
index 0000000..ca6253b
--- /dev/null
+++ b/public/models/01changfang/sceneData/sceneData.json
@@ -0,0 +1 @@
+{"skybox":{"name":"默认","img":"https://laozi-model.obs.cn-east-2.myhuaweicloud.com/sky-box/04a7d4d3-c071-4223-9ecb-b3f7463aa257.hdr","blur":3,"visible":true,"brightness":0.5},"image":{"pc":"","mobile":""},"color":"#000000","shadow":{"visible":false,"strength":10,"decay":1,"offset":0},"animation":{"loop":1,"speed":1,"default":null,"hidden":[]},"hotspotStyle":0,"hotspot":[],"rotation":[0,0,0,"XYZ"],"sizeColor":"#FFF","size":"","enablePlan":false,"cameraSetting":{"autoRotation":false,"autoScaleLimit":false,"scaleLimit":[10,400],"polarAngleLimit":[-90,90],"azimuthAngleLimit":[-360,360]},"view":{"position":[-1.4541451476611817,86.61108151820008,134.07239853766015],"target":[0,0,0]}}
\ No newline at end of file
diff --git a/src/assets/board/logo.png b/src/assets/board/logo.png
index ea4dbc7..108e91b 100644
Binary files a/src/assets/board/logo.png and b/src/assets/board/logo.png differ
diff --git a/src/assets/model/dataCentre/bg.jpg b/src/assets/model/dataCentre/bg.jpg
new file mode 100644
index 0000000..0c357cf
Binary files /dev/null and b/src/assets/model/dataCentre/bg.jpg differ
diff --git a/src/layout/boardIndex.vue b/src/layout/boardIndex.vue
index 4a1417e..ba41037 100644
--- a/src/layout/boardIndex.vue
+++ b/src/layout/boardIndex.vue
@@ -61,9 +61,9 @@ export default {
   background-repeat: no-repeat;
   background-size: 100% 100%;
   width: 8vw;
-  height:4vw;
+  height:3vw;
   position: absolute;
-  top: -1%;
+  top: 1%;
   left: 1%;
 }
 </style>
diff --git a/src/views/board/foaming/index.vue b/src/views/board/foaming/index.vue
index 7216ebc..886b444 100644
--- a/src/views/board/foaming/index.vue
+++ b/src/views/board/foaming/index.vue
@@ -476,6 +476,12 @@ export default {
     Chart
   },
   name: "Liner",
+  props: {
+    id: {
+      type: String,
+      default: ''
+    }
+  },
   data() {
     return {
       show: true,
@@ -1160,8 +1166,8 @@ export default {
           e: 'fp-2-05',
           i: "SCADA_INV_STATS_01('')",
           f: (e) => {
-              this.scrollTableData1 = e.slice(0, 6)
-              this.scrollTableData2 = e.slice(6, 12)
+            this.scrollTableData1 = e.slice(0, 6)
+            this.scrollTableData2 = e.slice(6, 12)
           }
         },
         {
@@ -1580,11 +1586,11 @@ export default {
       this.show = !this.show
     }, 30 * 1000)
     console.log(this.$route.query.id)
-    if (this.$route.query.id === '1') {
+    if (this.$route.query.id === '1' && this.id === '1') {
       this.RequestDataSet.forEach(val => {
         mixData(val)
       })
-    } else if (this.$route.query.id === '2') {
+    } else if (this.$route.query.id === '2' && this.id === '2') {
       this.RequestDataSet1.forEach(val => {
         mixData(val)
       })
diff --git a/src/views/dashboard/LineChart.vue b/src/views/dashboard/LineChart.vue
index 17baa7d..b93e42b 100644
--- a/src/views/dashboard/LineChart.vue
+++ b/src/views/dashboard/LineChart.vue
@@ -8,6 +8,7 @@ import * as echarts from 'echarts';
 require('echarts/theme/macarons') // echarts theme
 import resize from './mixins/resize'
 
+const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
 export default {
   mixins: [resize],
   props: {
@@ -142,6 +143,18 @@ export default {
                 // }
               }
             },
+            label: {
+              normal: {
+                show: true,
+                position: "top",
+                textStyle: {
+                  color: "#a8aab0",
+                  fontStyle: "normal",
+                  fontFamily: "微软雅黑",
+                  fontSize: 0.75 * vw,
+                },
+              },
+            },
             data: expectedData,
             animationDuration: 1000,
             animationEasing: 'quadraticOut'
@@ -151,6 +164,18 @@ export default {
             smooth: false,
             type: 'bar',
             barMaxWidth:60,
+            label: {
+              normal: {
+                show: true,
+                position: "top",
+                textStyle: {
+                  color: "#a8aab0",
+                  fontStyle: "normal",
+                  fontFamily: "微软雅黑",
+                  fontSize: 0.75 * vw,
+                },
+              },
+            },
             itemStyle: {
               normal: {
                 color: '#9fe080',
diff --git a/src/views/login.vue b/src/views/login.vue
index 785ceb3..163bfd7 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -164,9 +164,9 @@ export default {
   background-repeat: no-repeat;
   background-size: 100% 100%;
   width: 8vw;
-  height: 4vw;
+  height: 3vw;
   position: absolute;
-  top: -1%;
+  top: 1%;
   left: 1%;
 }
 
diff --git a/src/views/model/boardIndex.vue b/src/views/model/boardIndex.vue
index 7c992ec..39229c2 100644
--- a/src/views/model/boardIndex.vue
+++ b/src/views/model/boardIndex.vue
@@ -3,7 +3,7 @@
     <div>
       <liner v-if="show === 'liner'"/>
       <caseShell v-if="show === 'caseShell'"/>
-      <foaming v-if="show === 'foaming'"/>
+      <foaming v-if="show === 'foaming'"  id="1"/>
       <foaming2 v-if="show === 'foaming2'"/>
       <pourInto f v-if="show === 'pourInto'"/>
       <finalAssembly v-if="show === 'finalAssembly'"/>
@@ -77,7 +77,7 @@ export default {
   },
   methods: {
     exitFun() {
-      this.exit()
+      this.exit(true)
     }
   }
 }
@@ -120,9 +120,9 @@ export default {
   background-repeat: no-repeat;
   background-size: 100% 100%;
   width: 8vw;
-  height: 4vw;
+  height:3vw;
   position: absolute;
-  top: -1%;
+  top: 1%;
   left: 1%;
 }
 </style>
diff --git a/src/views/model/dataCentre.vue b/src/views/model/dataCentre.vue
index d8634e4..ef5349d 100644
--- a/src/views/model/dataCentre.vue
+++ b/src/views/model/dataCentre.vue
@@ -1,44 +1,16 @@
 <template>
   <div class="app-container">
     <div class="exit" @click="exitFun"></div>
+    <div class="title" v-for="(i,k) in title"
+         :style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'">
+      {{ i }}
+    </div>
+    <div class="time" id="time">{{ time }}</div>
+    <div class="date" id="date">{{ date }}</div>
+    <div class="logo"></div>
 
     <div class="chart1">
-      <div class="title">订单执行分析</div>
-      <div class="border"></div>
-      <div class="chart11">
-        <Chart ref="chart11"></Chart>
-      </div>
-      <div class="chart12">
-        <Chart ref="chart12"></Chart>
-      </div>
-    </div>
-    <div class="chart2">
-      <div class="title">订单履约率</div>
-      <div class="border"></div>
-      <Chart ref="chart2"></Chart>
-    </div>
-    <div class="chart3">
-      <div class="title">准时交付率</div>
-      <div class="border"></div>
-      <Chart ref="chart3"></Chart>
-    </div>
-    <div class="chart4">
-      <div class="title"></div>
-      <div class="border"></div>
-      <div class="chart41">
-        <Chart ref="chart41"></Chart>
-      </div>
-      <div class="chart42">
-        <Chart ref="chart42"></Chart>
-      </div>
-      <div class="chart43">
-        <Chart ref="chart43"></Chart>
-      </div>
-    </div>
-    <div class="chart5">
-      <div class="title">质量分析</div>
-      <div class="border"></div>
-      <Chart ref="chart5"></Chart>
+      <Chart ref="chart1"></Chart>
     </div>
     <div class="chart6">
       <div class="title">当年市场不良率</div>
@@ -50,17 +22,16 @@
       <div class="border"></div>
       <Chart ref="chart7"></Chart>
     </div>
-    <div class="bottom">
-      <div style="left: 20%">单台能耗</div>
-      <div style="left: 50%">设备状态</div>
-      <div style="left: 80%">产线OEE趋势</div>
-    </div>
   </div>
 </template>
 
 <script>
 import Chart from "@/components/board/Chart";
 
+let getDateIntervalFun = null
+let time1 = () => {
+}
+const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
 export default {
   name: "Liner",
   components: {
@@ -73,1118 +44,92 @@ export default {
     }
   },
   data() {
-    return {}
-  },
-  mounted() {
-    const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
-    this.$refs.chart11.setData({
-      tooltip: {
-        trigger: "item",
-      },
-      title: {
-        text: "3日完成订单",
-        left: "20%",
-        top: "10%",
-        textStyle: {
-          color: "#fff",
-          fontSize: 0.7 * vw,
-          align: "center",
-        },
-      },
-      series: [
-        {
-          name: "人员类型",
-          type: "pie",
-          center: ['42%', '60%'],
-          radius: ["23%", "35%"],
-          color: [
-            "#16ff39",
-            "#ffe716",
-          ],
-          labelLine: {
-            normal: {
-              show: true,
-              length: 0.3 * vw,
-              length2: 0.3 * vw,
-              lineStyle: {
-                width: 2,
-              },
-            },
-          },
-          labelLayout: {
-            moveOverlap: 'shiftX'
-          },
-          label: {
-            normal: {
-              formatter: "{b}\n{c}",
-              fontSize: 0.7 * vw,
-              color: '#fff'
-            },
-          },
-          data: [
-            {
-              value: 30,
-              name: "已完成",
-            },
-            {
-              value: 70,
-              name: "未完成",
-            },
-          ],
-        },
-      ],
-    })
-    this.$refs.chart12.setData({
-      tooltip: {
-        trigger: "item",
-      },
-      title: {
-        text: "本月完成订单",
-        right: "20%",
-        top: "10%",
-        textStyle: {
-          color: "#fff",
-          fontSize: 0.7 * vw,
-          align: "center",
-        },
-      },
-      series: [
-        {
-          name: "人员类型",
-          type: "pie",
-          center: ['58%', '60%'],
-          radius: ["23%", "35%"],
-          color: [
-            "#16ff39",
-            "#ffe716",
-          ],
-          labelLine: {
-            normal: {
-              show: true,
-              length: 0.3 * vw,
-              length2: 0.3 * vw,
-              lineStyle: {
-                width: 2,
-              },
-            },
-          },
-          labelLayout: {
-            moveOverlap: 'shiftX'
-          },
-          label: {
-            normal: {
-              formatter: "{b}\n{c}",
-              fontSize: 0.7 * vw,
-              color: '#fff'
-            },
-          },
-          data: [
-            {
-              value: 30,
-              name: "已完成",
-            },
-            {
-              value: 70,
-              name: "未完成",
-            },
-          ],
-        },
-      ],
-    })
-    this.$refs.chart2.setData({
-      tooltip: {
-        trigger: "axis",
-        axisPointer: {
-          type: "shadow",
-          textStyle: {
-            color: "#fff",
-          },
-        },
-      },
-      grid: {
-        borderWidth: 0,
-        top: 1.5 * vw,
-        bottom: 1.5 * vw,
-        left: 2.5 * vw,
-        right: 2.5 * vw,
-        textStyle: {
-          color: "#fff",
-        },
-      },
-      legend: {
-        x: "center",
-        top: "0",
-        textStyle: {
-          fontSize: 0.6 * vw,
-          color: "#90979c",
-        },
-      },
-      xAxis: [
-        {
-          type: "category",
-          axisLine: {
-            lineStyle: {
-              color: "#90979c",
-            },
-          },
-          splitLine: {
-            show: false,
-          },
-          axisTick: {
-            show: false,
-          },
-          splitArea: {
-            show: false,
-          },
-          axisLabel: {
-            interval: 0,
-            fontSize: 0.5 * vw,
-          },
-          data: [1, 2, 3, 4, 5, 6, 7, 8, 9],
-        },
-      ],
-      yAxis: [
-        {
-          type: "value",
-          splitLine: {
-            show: false,
-          },
-          axisLine: {
-            lineStyle: {
-              color: "#90979c",
-            },
-          },
-          axisTick: {
-            show: false,
-          },
-          axisLabel: {
-            interval: 0,
-            fontSize: 0.5 * vw
-          },
-          splitArea: {
-            show: false,
-          },
-        },
-        {
-          type: "value",
-          splitLine: {
-            show: false,
-          },
-          axisLine: {
-            lineStyle: {
-              color: "#90979c",
-            },
-          },
-          axisTick: {
-            show: false,
-          },
-          axisLabel: {
-            interval: 0,
-            fontSize: 0.5 * vw
-          },
-          splitArea: {
-            show: false,
-          },
-        },
-      ],
-      series: [
-        {
-          name: "日计划数",
-          type: "bar",
-          borderWidth: '15%',
-          itemStyle: {
-            normal: {
-              color: "#5ecee0",
-            },
-          },
-          data: [
-            709, 1917, 2455, 2610, 1719, 1433, 1544, 3285, 5208
-          ],
-        },
-
-        {
-          name: "日产量",
-          type: "bar",
-          borderWidth: '15%',
-          barGap: "-100%",
-          itemStyle: {
-            normal: {
-              color: "#78b4fe",
-              barBorderRadius: 0,
-            },
-          },
-          data: [327, 1776, 507, 1200, 800, 482, 204, 1390, 1001],
-        },
-        {
-          name: "总数",
-          type: "line",
-          symbolSize: 10,
-          symbol: "circle",
-          yAxisIndex: 1,
-          itemStyle: {
-            normal: {
-              color: "rgba(252,230,48,1)",
-              barBorderRadius: 0,
-              label: {
-                show: true,
-                position: "top",
-                color: "#fff",
-                fontSize: 0.6 * vw,
-                formatter: function (p) {
-                  return (p.value > 0 ? p.value : "") + '%';
-                },
-              },
-            },
-          },
-          data: [
-            106, 111, 96, 65, 86, 126, 101, 94, 100
-          ],
-        },
-      ],
-    })
-    this.$refs.chart3.setData({
-      tooltip: {
-        trigger: "axis",
-        axisPointer: {
-          type: "shadow",
-          textStyle: {
-            color: "#fff",
-          },
-        },
-      },
-      grid: {
-        borderWidth: 0,
-        top: 1.5 * vw,
-        bottom: 1.5 * vw,
-        left: 2.5 * vw,
-        right: 2.5 * vw,
-        textStyle: {
-          color: "#fff",
-        },
-      },
-      legend: {
-        x: "center",
-        top: "0",
-        textStyle: {
-          fontSize: 0.6 * vw,
-          color: "#90979c",
-        },
-      },
-      xAxis: [
-        {
-          type: "category",
-          axisLine: {
-            lineStyle: {
-              color: "#90979c",
-            },
-          },
-          splitLine: {
-            show: false,
-          },
-          axisTick: {
-            show: false,
-          },
-          splitArea: {
-            show: false,
-          },
-          axisLabel: {
-            interval: 0,
-            fontSize: 0.5 * vw,
-          },
-          data: [1, 2, 3, 4, 5, 6, 7, 8, 9],
-        },
-      ],
-      yAxis: [
-        {
-          type: "value",
-          splitLine: {
-            show: false,
-          },
-          axisLine: {
-            lineStyle: {
-              color: "#90979c",
-            },
-          },
-          axisTick: {
-            show: false,
-          },
-          axisLabel: {
-            interval: 0,
-            fontSize: 0.5 * vw
-          },
-          splitArea: {
-            show: false,
-          },
-        },
-        {
-          type: "value",
-          splitLine: {
-            show: false,
-          },
-          axisLine: {
-            lineStyle: {
-              color: "#90979c",
-            },
-          },
-          axisTick: {
-            show: false,
-          },
-          axisLabel: {
-            interval: 0,
-            fontSize: 0.5 * vw
-          },
-          splitArea: {
-            show: false,
-          },
-        },
+    return {
+      title: [
+        '三日订单执行情况',
+        '产品发布',
+        '场景升级',
+        '重点工序监控',
+        '周产量',
+        '产品分布',
+        '异常统计',
+        '质量分析',
+        '产量统计',
+        '设备分析',
+        '数字化安全',
+        '当年市场不良率',
       ],
-      series: [
+      titlePosition: [
         {
-          name: "应完成订单",
-          type: "bar",
-          barWidth: '30%',
-          itemStyle: {
-            normal: {
-              color: "#5ecee0",
-              barBorderRadius: '50%',
-            },
-          },
-          data: [
-            709, 1917, 2455, 2610, 1719, 1433, 1544, 3285, 5208
-          ],
+          top: 11.6,
+          left: 5.5
         },
-
         {
-          name: "实际完成订单",
-          type: "bar",
-          barWidth: '30%',
-          barGap: "-100%",
-          itemStyle: {
-            normal: {
-              color: "#78b4fe",
-              barBorderRadius: '50%',
-            },
-          },
-          data: [327, 1776, 507, 1200, 800, 482, 204, 1390, 1001],
+          top: 11.6,
+          left: 29
         },
         {
-          name: "准时交付率",
-          type: "line",
-          symbolSize: 10,
-          symbol: "circle",
-          yAxisIndex: 1,
-          itemStyle: {
-            normal: {
-              color: "#ebf2ff",
-              barBorderRadius: 0,
-              label: {
-                show: true,
-                position: "top",
-                color: "#fff",
-                fontSize: 0.6 * vw,
-                formatter: function (p) {
-                  return (p.value > 0 ? p.value : "") + '%';
-                },
-              },
-            },
-          },
-          data: [
-            106, 111, 96, 65, 86, 126, 101, 94, 100
-          ],
-        },
-      ],
-    })
-    this.$refs.chart41.setData({
-      tooltip: {},
-      grid: {
-        top: "25%",
-        left: "5%",
-        right: "1%",
-        bottom: "8%",
-        containLabel: true,
-      },
-      legend: {
-        itemGap: 50,
-        top: "3%",
-        textStyle: {
-          fontSize: 0.6 * vw,
-          color: "#f9f9f9",
-          borderColor: "#fff",
-        },
-      },
-      xAxis: [
-        {
-          type: "category",
-          boundaryGap: true,
-          axisLine: {
-            //坐标轴轴线相关设置。数学上的x轴
-            show: true,
-            lineStyle: {
-              color: "#f9f9f9",
-            },
-          },
-          axisLabel: {
-            //坐标轴刻度标签的相关设置
-            textStyle: {
-              color: "#d1e6eb",
-              margin: 15,
-              fontSize: 0.4 * vw,
-            },
-          },
-          axisTick: {
-            show: false,
-          },
-          data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
-        },
-      ],
-      yAxis: [
-        {
-          name: '能耗/kw·h',
-          type: "value",
-          min: 0,
-          splitLine: {
-            show: true,
-            lineStyle: {
-              color: "#0a3256",
-            },
-          },
-          axisLine: {
-            show: false,
-          },
-          axisLabel: {
-            margin: 5,
-            textStyle: {
-              color: "#d1e6eb",
-            },
-            fontSize: 0.4 * vw,
-            formatter: '{value}%'
-          },
-          axisTick: {
-            show: false,
-          },
-        },
-      ],
-      series: [
-        {
-          name: "能耗",
-          type: "line",
-          // smooth: true, //是否平滑曲线显示
-          // 			symbol:'circle',  // 默认是空心圆（中间是白色的），改成实心圆
-          showAllSymbol: true,
-          symbol: "emptyCircle",
-          symbolSize: 6,
-          lineStyle: {
-            normal: {
-              color: "#4268aa", // 线条颜色
-            },
-            borderColor: "#ecf3ff",
-          },
-          label: {
-            show: true,
-            position: "top",
-            fontSize: 0.4 * vw,
-            textStyle: {
-              color: "#fff",
-            },
-            formatter: '{c}kw·h'
-          },
-          itemStyle: {
-            normal: {
-              color: "#28ffb3",
-            },
-          },
-          tooltip: {
-            show: false,
-          },
-          data: [1.5, 2.7, 2.4, 2.3, 2.4, 1.6, 2.3],
-        },
-      ],
-    })
-    this.$refs.chart42.setData({
-      series: [
-        {
-          name: "第一个圆环",
-          type: "pie",
-          clockWise: false,
-          radius: ['35%', '40%'],
-          itemStyle: {
-            normal: {
-              label: {
-                show: false,
-              },
-              labelLine: {
-                show: false,
-              },
-              shadowBlur: 0,
-              shadowColor: "#203665",
-            },
-          },
-          hoverAnimation: false,
-          center: ["20%", "50%"],
-          data: [
-            {
-              value: 25,
-              label: {
-                normal: {
-                  rich: {
-                    a: {
-                      color: "#3a7ad5",
-                      align: "center",
-                      fontSize: 1.1 * vw,
-                      fontWeight: "bold",
-                    },
-                    b: {
-                      color: "#fff",
-                      align: "center",
-                      fontSize: 0.6 * vw,
-                    },
-                  },
-                  formatter: function (params) {
-                    return (
-                      "{a|" +
-                      params.value +
-                      "}" +
-                      "\n{b|设备总数}"
-                    );
-                  },
-                  position: "center",
-                  show: true,
-                  textStyle: {
-                    fontSize: "14",
-                    fontWeight: "normal",
-                    color: "#fff",
-                  },
-                },
-              },
-              itemStyle: {
-                normal: {
-                  color: "#2c6cc4",
-                  shadowColor: "#2c6cc4",
-                  shadowBlur: 0,
-                },
-              },
-            },
-            {
-              value: 75,
-              name: "invisible",
-              itemStyle: {
-                normal: {
-                  color: "#24375c",
-                },
-                emphasis: {
-                  color: "#24375c",
-                },
-              },
-            },
-          ],
-        },
-        {
-          name: "第二个圆环",
-          type: "pie",
-          clockWise: false,
-          radius: ['35%', '40%'],
-          itemStyle: {
-            normal: {
-              label: {
-                show: false,
-              },
-              labelLine: {
-                show: false,
-              },
-              shadowBlur: 0,
-              shadowColor: "#203665",
-            },
-          },
-          hoverAnimation: false,
-          center: ["50%", "50%"],
-          data: [
-            {
-              value: 50,
-              label: {
-                normal: {
-                  rich: {
-                    a: {
-                      color: "#d03e93",
-                      align: "center",
-                      fontSize: 1.1 * vw,
-                      fontWeight: "bold",
-                    },
-                    b: {
-                      color: "#fff",
-                      align: "center",
-                      fontSize: 0.5 * vw,
-                    },
-                  },
-                  formatter: function (params) {
-                    return (
-                      "{a|" +
-                      params.value +
-                      "}" +
-                      "\n{b|在网设备数}"
-                    );
-                  },
-                  position: "center",
-                  show: true,
-                  textStyle: {
-                    fontSize: "14",
-                    fontWeight: "normal",
-                    color: "#fff",
-                  },
-                },
-              },
-              itemStyle: {
-                normal: {
-                  color: "#ef45ac",
-                  shadowColor: "#ef45ac",
-                  shadowBlur: 0,
-                },
-              },
-            },
-            {
-              value: 50,
-              name: "invisible",
-              itemStyle: {
-                normal: {
-                  color: "#412a4e",
-                },
-                emphasis: {
-                  color: "#412a4e",
-                },
-              },
-            },
-          ],
-        },
-        {
-          name: "第三个圆环",
-          type: "pie",
-          clockWise: false,
-          radius: ['35%', '40%'],
-          itemStyle: {
-            normal: {
-              label: {
-                show: false,
-              },
-              labelLine: {
-                show: false,
-              },
-              shadowBlur: 0,
-              shadowColor: "#203665",
-            },
-          },
-          hoverAnimation: false,
-          center: ["80%", "50%"],
-          data: [
-            {
-              value: 75,
-              label: {
-                normal: {
-                  rich: {
-                    a: {
-                      color: "#603dd0",
-                      align: "center",
-                      fontSize: 1.1 * vw,
-                      fontWeight: "bold",
-                    },
-                    b: {
-                      color: "#fff",
-                      align: "center",
-                      fontSize: 0.5 * vw,
-                    },
-                  },
-                  formatter: function (params) {
-                    return (
-                      "{a|" +
-                      params.value +
-                      "}" +
-                      "\n{b|离线设备数}"
-                    );
-                  },
-                  position: "center",
-                  show: true,
-                  textStyle: {
-                    fontSize: "14",
-                    fontWeight: "normal",
-                    color: "#fff",
-                  },
-                },
-              },
-              itemStyle: {
-                normal: {
-                  color: "#613fd1",
-                  shadowColor: "#613fd1",
-                  shadowBlur: 0,
-                },
-              },
-            },
-            {
-              value: 25,
-              name: "invisible",
-              itemStyle: {
-                normal: {
-                  color: "#453284",
-                },
-                emphasis: {
-                  color: "#453284",
-                },
-              },
-            },
-          ],
-        },
-      ],
-    })
-    this.$refs.chart43.setData({
-      tooltip: {},
-      grid: {
-        top: "25%",
-        left: "5%",
-        right: "1%",
-        bottom: "8%",
-        containLabel: true,
-      },
-      legend: {
-        itemGap: 0,
-        top: "3%",
-        textStyle: {
-          fontSize: 0.6 * vw,
-          color: "#f9f9f9",
-          borderColor: "#fff",
-        },
-      },
-      xAxis: [
-        {
-          type: "category",
-          boundaryGap: true,
-          axisLine: {
-            //坐标轴轴线相关设置。数学上的x轴
-            show: true,
-            lineStyle: {
-              color: "#f9f9f9",
-            },
-          },
-          axisLabel: {
-            //坐标轴刻度标签的相关设置
-            textStyle: {
-              color: "#d1e6eb",
-              margin: 15,
-              fontSize: 0.4 * vw,
-            },
-          },
-          axisTick: {
-            show: false,
-          },
-          data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
-        },
-      ],
-      yAxis: [
-        {
-          name: 'OEE',
-          type: "value",
-          min: 0,
-          splitLine: {
-            show: true,
-            lineStyle: {
-              color: "#0a3256",
-            },
-          },
-          axisLine: {
-            show: false,
-          },
-          axisLabel: {
-            margin: 5,
-            textStyle: {
-              color: "#d1e6eb",
-            },
-            fontSize: 0.4 * vw,
-            formatter: '{value}%'
-          },
-          axisTick: {
-            show: false,
-          },
-        },
-      ],
-      series: [
-        {
-          name: "一期",
-          type: "line",
-          // smooth: true, //是否平滑曲线显示
-          // 			symbol:'circle',  // 默认是空心圆（中间是白色的），改成实心圆
-          showAllSymbol: true,
-          symbol: "emptyCircle",
-          symbolSize: 6,
-          lineStyle: {
-            normal: {
-              color: "#e8f1ff", // 线条颜色
-            },
-            borderColor: "#28ffb3",
-          },
-          itemStyle: {
-            normal: {
-              color: "#28ffb3",
-            },
-          },
-          tooltip: {
-            show: false,
-          },
-          data: [1.4, 2.5, 2.2, 2.2, 2.2, 1.5, 2.2],
-        },
-        {
-          name: "二期",
-          type: "line",
-          // smooth: true, //是否平滑曲线显示
-          // 			symbol:'circle',  // 默认是空心圆（中间是白色的），改成实心圆
-          showAllSymbol: true,
-          symbol: "emptyCircle",
-          symbolSize: 6,
-          lineStyle: {
-            normal: {
-              color: "#4268aa", // 线条颜色
-            },
-            borderColor: "#ecf3ff",
-          },
-          itemStyle: {
-            normal: {
-              color: "#28ffb3",
-            },
-          },
-          tooltip: {
-            show: false,
-          },
-          data: [1.5, 2.7, 2.4, 2.3, 2.4, 1.6, 2.3],
+          top: 11.6,
+          left: 52.7
         },
-      ],
-    })
-    this.$refs.chart5.setData({
-      series: [
         {
-          name: "第一个圆环",
-          type: "pie",
-          clockWise: false,
-          radius: ['40%', '45%'],
-          itemStyle: {
-            normal: {
-              label: {
-                show: false,
-              },
-              labelLine: {
-                show: false,
-              },
-              shadowBlur: 0,
-              shadowColor: "#203665",
-            },
-          },
-          hoverAnimation: false,
-          center: ["20%", "50%"],
-          data: [
-            {
-              value: 25,
-              label: {
-                normal: {
-                  rich: {
-                    a: {
-                      color: "#3a7ad5",
-                      align: "center",
-                      fontSize: 1.1 * vw,
-                      fontWeight: "bold",
-                    },
-                    b: {
-                      color: "#fff",
-                      align: "center",
-                      fontSize: 0.6 * vw,
-                    },
-                  },
-                  formatter: function (params) {
-                    return (
-                      "{a|" +
-                      params.value +
-                      "}" +
-                      "\n{b|合格率}"
-                    );
-                  },
-                  position: "center",
-                  show: true,
-                  textStyle: {
-                    fontSize: "14",
-                    fontWeight: "normal",
-                    color: "#fff",
-                  },
-                },
-              },
-              itemStyle: {
-                normal: {
-                  color: "#2c6cc4",
-                  shadowColor: "#2c6cc4",
-                  shadowBlur: 0,
-                },
-              },
-            },
-            {
-              value: 75,
-              name: "invisible",
-              itemStyle: {
-                normal: {
-                  color: "#24375c",
-                },
-                emphasis: {
-                  color: "#24375c",
-                },
-              },
-            },
-          ],
+          top: 11.6,
+          left: 76.4
         },
         {
-          name: "第二个圆环",
-          type: "pie",
-          clockWise: false,
-          radius: ['40%', '45%'],
-          itemStyle: {
-            normal: {
-              label: {
-                show: false,
-              },
-              labelLine: {
-                show: false,
-              },
-              shadowBlur: 0,
-              shadowColor: "#203665",
-            },
-          },
-          hoverAnimation: false,
-          center: ["50%", "50%"],
-          data: [
-            {
-              value: 50,
-              label: {
-                normal: {
-                  rich: {
-                    a: {
-                      color: "#d03e93",
-                      align: "center",
-                      fontSize: 1.1 * vw,
-                      fontWeight: "bold",
-                    },
-                    b: {
-                      color: "#fff",
-                      align: "center",
-                      fontSize: 0.5 * vw,
-                    },
-                  },
-                  formatter: function (params) {
-                    return (
-                      "{a|" +
-                      params.value +
-                      "}" +
-                      "\n{b|OQC抽检分数}"
-                    );
-                  },
-                  position: "center",
-                  show: true,
-                  textStyle: {
-                    fontSize: "14",
-                    fontWeight: "normal",
-                    color: "#fff",
-                  },
-                },
-              },
-              itemStyle: {
-                normal: {
-                  color: "#ef45ac",
-                  shadowColor: "#ef45ac",
-                  shadowBlur: 0,
-                },
-              },
-            },
-            {
-              value: 50,
-              name: "invisible",
-              itemStyle: {
-                normal: {
-                  color: "#412a4e",
-                },
-                emphasis: {
-                  color: "#412a4e",
-                },
-              },
-            },
-          ],
+          top: 40.9,
+          left: 5.5
         },
         {
-          name: "第三个圆环",
-          type: "pie",
-          clockWise: false,
-          radius: ['40%', '45%'],
-          itemStyle: {
-            normal: {
-              label: {
-                show: false,
-              },
-              labelLine: {
-                show: false,
-              },
-              shadowBlur: 0,
-              shadowColor: "#203665",
-            },
-          },
-          hoverAnimation: false,
-          center: ["80%", "50%"],
-          data: [
-            {
-              value: 75,
-              label: {
-                normal: {
-                  rich: {
-                    a: {
-                      color: "#603dd0",
-                      align: "center",
-                      fontSize: 1.1 * vw,
-                      fontWeight: "bold",
-                    },
-                    b: {
-                      color: "#fff",
-                      align: "center",
-                      fontSize: 0.5 * vw,
-                    },
-                  },
-                  formatter: function (params) {
-                    return (
-                      "{a|" +
-                      params.value +
-                      "}" +
-                      "\n{b|质量控制达标率}"
-                    );
-                  },
-                  position: "center",
-                  show: true,
-                  textStyle: {
-                    fontSize: "14",
-                    fontWeight: "normal",
-                    color: "#fff",
-                  },
-                },
-              },
-              itemStyle: {
-                normal: {
-                  color: "#613fd1",
-                  shadowColor: "#613fd1",
-                  shadowBlur: 0,
-                },
-              },
-            },
-            {
-              value: 25,
-              name: "invisible",
-              itemStyle: {
-                normal: {
-                  color: "#453284",
-                },
-                emphasis: {
-                  color: "#453284",
-                },
-              },
-            },
-          ],
+          top: 40.9,
+          left: 29
+        },
+        {
+          top: 40.9,
+          left: 52.7
+        },
+        {
+          top: 40.9,
+          left: 76.4
+        },
+        {
+          top: 70.4,
+          left: 5.5
+        },
+        {
+          top: 70.4,
+          left: 29
+        },
+        {
+          top: 70.4,
+          left: 52.7
+        },
+        {
+          top: 70.4,
+          left: 76.4
         },
       ],
-    })
+      time: '',
+      date: ''
+    }
+  },
+  created() {
+    const getDate = () => {
+      let date = new Date()
+      let YYYY = date.getFullYear()
+      let MM = (date.getMonth() + 1).toString().length === 1 ? ('0' + (date.getMonth() + 1)) : (date.getMonth() + 1)
+      let dd = date.getDate().toString().length === 1 ? ('0' + date.getDate()) : date.getDate()
+      let HH = date.getHours().toString().length === 1 ? ('0' + date.getHours()) : date.getHours()
+      let mm = date.getMinutes().toString().length === 1 ? ('0' + date.getMinutes()) : date.getMinutes()
+      let ss = date.getSeconds().toString().length === 1 ? ('0' + date.getSeconds()) : date.getSeconds()
+      this.date = `${YYYY} - ${MM} - ${dd}`
+      this.time = `${HH} : ${mm} : ${ss}`
+    }
+    getDate()
+    getDateIntervalFun = setInterval(getDate, 1000)
+  },
+  mounted() {
+    const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
     this.$refs.chart6.setData({
       tooltip: {},
       grid: {
@@ -1477,17 +422,155 @@ export default {
         },
       ],
     })
+    const horizontalRoundedBarChartWithBackgroundTwo = function (data, id) {
+      clearInterval(time1)
+      let charts = echarts.init(id);
+      if (!data) {
+        data = {
+          yNameOne: ["设备000000001", "设备000000001", "设备000000001", "设备000000001", "设备000000001", "设备000000001", "设备000000001", "设备000000001", "设备000000001"],
+          yData: [41, 99, 32, 41, 24, 4, 16, 64, 18],
+          xDataName: "达成率",
+          status: [1, 1, 1, 1, 1, 1, 1, 1, 1]
+        }
+      }
+      let myColor = ["green", "red", "yellow", "blue", "#8B78F6"];
+      let bgBar = []
+      data.yData.forEach(() => {
+        bgBar.push(100)
+      })
+      let option = {
+        grid: {
+          // left: "-10%",
+          left: "0%",
+          right: "8%",
+          bottom: "0%",
+          top: "0%",
+          containLabel: true,
+        },
+        dataZoom: [],
+        xAxis: {
+          show: false,
+        },
+        yAxis: [
+          {
+            show: true,
+            data: data.yNameOne,
+            inverse: true,
+            axisLine: {
+              show: false,
+            },
+            splitLine: {
+              show: false,
+            },
+            axisTick: {
+              show: false,
+            },
+            axisLabel: {
+              color: "#fff",
+              // margin:150,
+              fontSize: 0.75 * vw,
+              textStyle: {
+                textAlign: 'center'
+              },
+            },
+          },
+        ],
+        series: [
+          {
+            name: "条",
+            type: "bar",
+            yAxisIndex: 0,
+            data: data.yData,
+            barWidth: '80%',
+            itemStyle: {
+              normal: {
+                barBorderRadius: 30,
+                color: function (params) {
+                  return myColor[data.status[params.dataIndex]];
+                },
+              },
+            },
+          },
+          {
+            name: "框",
+            type: "bar",
+            yAxisIndex: 0,
+            barGap: "-100%",
+            data: bgBar,
+            barWidth: '80%',
+            label: {
+              show: true,
+              position: "right",
+              textStyle: {
+                color: "#fff",
+                fontSize: 0.75 * vw
+              },
+              formatter: function (val, index, e) {
+                return data.yData[val.dataIndex] + '%'
+              }
+            },
+            itemStyle: {
+              normal: {
+                color: "none",
+                borderColor: "#00c1de",
+                borderWidth: 1,
+                barBorderRadius: 15,
+              },
+            },
+          },
+        ],
+      };
+
+      if (data.yNameOne.length > 8) {
+        option.dataZoom.push({
+          show: false,
+          type: 'slider',
+          bottom: '0%',
+          yAxisIndex: 0,
+          height: 12,
+          start: 0,
+          end: 1 / (data.yNameOne.length / 9) * 100,
+          textStyle: {
+            fontSize: 0,
+            color: 'rgba(0,0,0,0)'
+          }
+        })
+
+        let step = 1 / (data.yNameOne.length / 9) * 100
+        time1 = setInterval(() => {
+          option.dataZoom[0].end += step
+          option.dataZoom[0].start += step
+          if (option.dataZoom[0].start >= 100) {
+            option.dataZoom[0].start = 0
+            option.dataZoom[0].end = step
+          }
+          if (option.dataZoom[0].end >= 100) {
+            option.dataZoom[0].end = 100
+            option.dataZoom[0].start = option.dataZoom[0].end - step
+          }
+          charts.setOption(option);
+        }, 6000)
+        // time()
+      }
+      charts.setOption(option);
+      $(window).resize(charts.resize);
+    }
   },
   methods: {
     exitFun() {
       this.exit()
     }
+  },
+  beforeDestroy() {
+    getDateIntervalFun = null
   }
 }
 </script>
 <style lang="less" scoped>
 .app-container {
-  background-color: #021e31;
+  background-image: url("~@/assets/model/dataCentre/bg.jpg");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
   width: 100%;
   height: 100%;
   position: absolute;
@@ -1495,214 +578,54 @@ export default {
   left: 0;
 }
 
-.exit {
-  background-image: url("~@/assets/model/factoryIntroduction/exit.png");
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
+.time, .date {
   position: absolute;
-  top: 1%;
-  right: 1%;
-  font-weight: bold;
-  width: 2vw;
-  height: 2vw;
-  color: #e7b219;
+  font-size: 0.8vw;
+  color: #fcfcfc;
+  transform: translate(-50%, -50%);
+  white-space: nowrap;
 }
 
-.chart1 {
-  content: "";
-  background-image: url("~@/assets/model/dataCentre/bg.png");
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  position: absolute;
-  top: 10%;
-  left: 5%;
-  width: 18%;
-  height: 11.1vw;
-
-  .border {
-    content: "";
-    background-image: url("~@/assets/model/dataCentre/border.png");
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-  }
-
-  .title {
-    position: absolute;
-    top: -2vw;
-    color: #fff;
-    font-size: 1vw;
-    border-left: 3px solid #0251d1;
-    padding-left: 12px;
-  }
-
-  .chart11 {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 70%;
-    height: 100%;
-  }
-
-  .chart12 {
-    position: absolute;
-    top: 0;
-    left: 30%;
-    width: 70%;
-    height: 100%;
-  }
+.time {
+  top: 3.2%;
+  left: 85.8%;
 }
 
-.chart2 {
-  background-image: url("~@/assets/model/dataCentre/bg.png");
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  position: absolute;
-  top: 40%;
-  left: 5%;
-  width: 18%;
-  height: 11.1vw;
-
-  .border {
-    content: "";
-    background-image: url("~@/assets/model/dataCentre/border.png");
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-  }
-
-  .title {
-    position: absolute;
-    top: -2vw;
-    color: #fff;
-    font-size: 1vw;
-    border-left: 3px solid #0251d1;
-    padding-left: 12px;
-  }
+.date {
+  top: 3.2%;
+  left: 94.1%;
 }
 
-.chart3 {
-  background-image: url("~@/assets/model/dataCentre/bg.png");
+.logo {
+  background-image: url("../../assets/board/logo.png");
   background-repeat: no-repeat;
   background-size: 100% 100%;
+  width: 8vw;
+  height: 3vw;
   position: absolute;
-  top: 70%;
-  left: 5%;
-  width: 18%;
-  height: 11.1vw;
-
-  .border {
-    content: "";
-    background-image: url("~@/assets/model/dataCentre/border.png");
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-  }
-
-  .title {
-    position: absolute;
-    top: -2vw;
-    color: #fff;
-    font-size: 1vw;
-    border-left: 3px solid #0251d1;
-    padding-left: 12px;
-  }
+  top: 1%;
+  left: 1%;
 }
 
-.chart4 {
-  background-image: url("~@/assets/model/dataCentre/bg2.png");
+.exit {
+  background-image: url("~@/assets/model/factoryIntroduction/exit.png");
   background-repeat: no-repeat;
   background-size: 100% 100%;
   position: absolute;
-  transform: translateX(-50%);
-  top: 70%;
-  left: 50%;
-  width: 45%;
-  height: 11.1vw;
-
-  .border {
-    content: "";
-    background-image: url("~@/assets/model/dataCentre/border2.png");
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-  }
-
-  .chart41 {
-    position: absolute;
-    top: 14%;
-    left: 3%;
-    width: 28%;
-    height: 80%;
-    border: 1px solid #fff9;
-  }
-
-  .chart42 {
-    position: absolute;
-    top: 14%;
-    left: 50%;
-    width: 28%;
-    height: 80%;
-    border: 1px solid #fff9;
-    transform: translateX(-50%);
-  }
-
-  .chart43 {
-    position: absolute;
-    top: 14%;
-    right: 3%;
-    width: 28%;
-    height: 80%;
-    border: 1px solid #fff9;
-  }
+  top: 1%;
+  right: 1%;
+  font-weight: bold;
+  width: 2vw;
+  height: 2vw;
+  color: #e7b219;
 }
 
-.chart5 {
-  background-image: url("~@/assets/model/dataCentre/bg.png");
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
+.title {
   position: absolute;
-  top: 10%;
-  right: 5%;
-  width: 18%;
-  height: 11.1vw;
-
-  .border {
-    content: "";
-    background-image: url("~@/assets/model/dataCentre/border.png");
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-  }
-
-  .title {
-    position: absolute;
-    top: -2vw;
-    color: #fff;
-    font-size: 1vw;
-    border-left: 3px solid #0251d1;
-    padding-left: 12px;
-  }
+  transform: translateY(-50%);
+  color: #dddddd;
+  font-size: 1vw;
+  letter-spacing: 2px;
 }
 
 .chart6 {
@@ -1769,23 +692,4 @@ export default {
   }
 }
 
-.bottom {
-  background-image: url("~@/assets/model/dataCentre/bottom.png");
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  position: absolute;
-  top: 67%;
-  left: 50%;
-  width: 27%;
-  height: 1.4vw;
-  transform: translateX(-50%);
-
-  div {
-    position: absolute;
-    font-size: 0.6vw;
-    line-height: 1.4vw;
-    color: #fff;
-    transform: translateX(-50%);
-  }
-}
 </style>
diff --git a/src/views/model/factoryIntroduction.vue b/src/views/model/factoryIntroduction.vue
index 856ba91..4f6c57a 100644
--- a/src/views/model/factoryIntroduction.vue
+++ b/src/views/model/factoryIntroduction.vue
@@ -13,14 +13,14 @@
       <div class="boxTitle">一 园 三 中 心</div>
       <p>1. 澳柯玛中国区智能制造中心，大规模冷柜生产基地</p>
       <p>2. 华中营销中心，辐射晋、陕、甘、皖、鄂、川、渝等</p>
-      <p>3. 华中仓储物流中心，构建统一的物流产业体系智能产业园建成后，形成集生产、销售、仓储物流一体化</p>
+      <p>3. 华中仓储物流中心，构建统一的物流产业体系<br>智能产业园建成后，形成集生产、销售、仓储物流一体化</p>
     </div>
     <div class="box4">
       <img src="../../assets/model/factoryIntroduction/bg2.png" alt="" style="width: 80%;margin-left: 10%">
       <div class="boxTitle">技 术 应 用</div>
-      <p>澳云数智自主可控工业互联网平台、数字孪生、大数据分析、
-        MES、SCADA、质量分析SPC、能源管理EMS
-        混流自动成型钣金线、双进双出高效直线发泡、工业机器人
+      <p>澳云数智自主可控工业互联网平台、数字孪生、大数据分析、<br>
+        MES、SCADA、质量分析SPC、能源管理EMS<br>
+        混流自动成型钣金线、双进双出高效直线发泡、工业机器人<br>
         采用行业领先的R134a混合多元醇发泡体系，产品节能环保
       </p>
     </div>
diff --git a/src/views/model/model.vue b/src/views/model/model.vue
index b182346..d2d642f 100644
--- a/src/views/model/model.vue
+++ b/src/views/model/model.vue
@@ -3,6 +3,7 @@
     <div class="test">
 
       <div id="container" class="container"></div>
+      <div class="headTitle">河南澳柯玛智能制造中心</div>
       <div class="tool">
         <el-row>
           <el-col :span="5">
@@ -20,39 +21,39 @@
           <el-col :span="5">
             <div class="toolItem" @click="click1('dataCentre')">
               <img class="icon" src="@/assets/model/model/dataCentre.png"/>
-              <div class="whiteSpan grid-content bg-purple">数据中心</div>
+              <div class="whiteSpan grid-content bg-purple">大数据中心</div>
             </div>
           </el-col>
           <el-col :span="5">
-            <div class="toolItem" @click="click1('live')">
-              <img class="icon" src="@/assets/model/model/live.png"/>
-              <div class="whiteSpan grid-content bg-purple">现场直播</div>
-            </div>
-          </el-col>
-          <el-col :span="4">
             <div class="toolItem" @click="click2()">
               <img class="icon" src="@/assets/model/model/process.png"/>
               <div class="whiteSpan grid-content bg-purple-light">工艺流程</div>
             </div>
           </el-col>
-<!--          <el-col :span="3">-->
-<!--            <div class="toolItem" @click="click1('production')">-->
-<!--              <img class="icon" src="@/assets/model/model/production.png"/>-->
-<!--              <div class="whiteSpan grid-content bg-purple">生产</div>-->
-<!--            </div>-->
-<!--          </el-col>-->
-<!--          <el-col :span="3">-->
-<!--            <div class="toolItem" @click="click1('quality')">-->
-<!--              <img class="icon" src="@/assets/model/model/quality.png"/>-->
-<!--              <div class="whiteSpan grid-content bg-purple-light">质量</div>-->
-<!--            </div>-->
-<!--          </el-col>-->
-<!--          <el-col :span="3">-->
-<!--            <div class="toolItem" @click="click1('equipment')">-->
-<!--              <img class="icon" src="@/assets/model/model/equipment.png"/>-->
-<!--              <div class="whiteSpan grid-content bg-purple-light">设备</div>-->
-<!--            </div>-->
-<!--          </el-col>-->
+          <el-col :span="4">
+            <div class="toolItem" @click="click1('live')">
+              <img class="icon" src="@/assets/model/model/live.png"/>
+              <div class="whiteSpan grid-content bg-purple">现场直播</div>
+            </div>
+          </el-col>
+          <!--          <el-col :span="3">-->
+          <!--            <div class="toolItem" @click="click1('production')">-->
+          <!--              <img class="icon" src="@/assets/model/model/production.png"/>-->
+          <!--              <div class="whiteSpan grid-content bg-purple">生产</div>-->
+          <!--            </div>-->
+          <!--          </el-col>-->
+          <!--          <el-col :span="3">-->
+          <!--            <div class="toolItem" @click="click1('quality')">-->
+          <!--              <img class="icon" src="@/assets/model/model/quality.png"/>-->
+          <!--              <div class="whiteSpan grid-content bg-purple-light">质量</div>-->
+          <!--            </div>-->
+          <!--          </el-col>-->
+          <!--          <el-col :span="3">-->
+          <!--            <div class="toolItem" @click="click1('equipment')">-->
+          <!--              <img class="icon" src="@/assets/model/model/equipment.png"/>-->
+          <!--              <div class="whiteSpan grid-content bg-purple-light">设备</div>-->
+          <!--            </div>-->
+          <!--          </el-col>-->
         </el-row>
       </div>
 
@@ -145,7 +146,7 @@ export default {
   },
   data() {
     return {
-      params:'',
+      params: '',
       viewer: null,
       show: '',
       show1: false,
@@ -188,7 +189,7 @@ export default {
           height: 4,
           bgColor: '#2f5597',
           text: '箱壳<br>自动成型',
-          link: 'caseShell2',
+          link: 'caseShell',
         },
         {
           top: 35,
@@ -217,7 +218,7 @@ export default {
           height: 4,
           bgColor: '#f4b183',
           text: '壳胆<br>组装',
-          link: 'caseShell2',
+          link: 'caseShell',
         },
         {
           top: 17,
@@ -225,8 +226,8 @@ export default {
           width: 6,
           height: 4,
           bgColor: '#7f7f7f',
-          text: '箱体<br>预装',
-          link: 'caseShell2',
+          text: '预装<br>箱体库',
+          link: 'caseShell',
         },
         {
           top: 17,
@@ -252,7 +253,7 @@ export default {
           width: 6,
           height: 4,
           bgColor: '#7f7f7f',
-          text: '发泡箱体库',
+          text: '发泡<br>箱体库',
         },
         {
           top: 17,
@@ -563,8 +564,8 @@ export default {
     // }
     const viewer = new AMRT.Viewer('container', {offline: true})
     viewer.sceneManager.setBackground('http://10.100.72.10:8900/docs/img/bg.jpg')
-    viewer.controls.setTarget(274.6358405397289, -37.33559004514912, -36.790464998609494)
-    viewer.controls.setPosition(269.40613433119415, 1031.916487517178, 1606.6479803575144)
+    viewer.controls.setTarget(321.2619851034551, -68.14384719285539, -14.54458931238174)
+    viewer.controls.setPosition(324.86156622859767, 1621.3543644968465, 1351.2054516306407)
 
 
     let modelArr = [
@@ -676,26 +677,27 @@ export default {
     ]
 
     let num = 10
-    const setModel = (e,i)=>{
-      modelArr.slice(e,i).forEach(val => {
-         viewer.loadModel(val, {
+    const setModel = (e, i) => {
+      modelArr.slice(e, i).forEach(val => {
+        viewer.loadModel(val, {
           background: false,
           focus: false,
           offline: true,
           onLoad: function (m) {
 
             num += 1
-            if(num < modelArr.length){
-              setModel(num,num+1)
+            if (num < modelArr.length) {
+              setModel(num, num + 1)
             }
             m.on('click', function () {
+              console.log(val)
             })
           }
         })
       })
     }
-    // setModel(0,10)
-    viewer.operator.enabled = true
+    setModel(0, 10)
+    // viewer.operator.enabled = true
 
     // setInterval(() => {
     //   console.log(viewer.controls.getView())
@@ -717,18 +719,23 @@ export default {
         this.show1 = false
       }
     },
-    exit() {
+    exit(val) {
       this.show = ''
+      if (val) {
+        this.show1 = true
+      }
     },
     setNowFlowIndex(k) {
       this.nowFlowIndex = k
     },
     toLink(e) {
-      this.show1 = false
-      console.log(e)
-      // e.link && this.$router.push(e.link)
-      this.show = 'board'
-      this.params = e.link
+      if (e.link) {
+        this.show1 = false
+        console.log(e)
+        // e.link && this.$router.push(e.link)
+        this.show = 'board'
+        this.params = e.link
+      }
     }
   }
 };
@@ -745,6 +752,16 @@ export default {
   margin: 0 auto;
 }
 
+.headTitle {
+  position: absolute;
+  top: 5%;
+  left: 50%;
+  transform: translate(-50%, -100%);
+  font-size: 1.5vw;
+  color: #d6eaed;
+  letter-spacing: 10px;
+}
+
 .container {
   overflow: hidden;
   background-image: url("../../assets/model/model/bg.jpg");
@@ -874,7 +891,8 @@ export default {
     }
   }
 }
-.whiteSpan{
-  color:white;
+
+.whiteSpan {
+  color: white;
 }
 </style>
diff --git a/src/views/register.vue b/src/views/register.vue
index ce896f4..e5e4afb 100644
--- a/src/views/register.vue
+++ b/src/views/register.vue
@@ -154,9 +154,9 @@ export default {
   background-repeat: no-repeat;
   background-size: 100% 100%;
   width: 8vw;
-  height:4vw;
+  height:3vw;
   position: absolute;
-  top: -1%;
+  top: 1%;
   left: 1%;
 }
 .register {