diff --git a/src/views/MicroExhibition/child/Img.vue b/src/views/MicroExhibition/child/Img.vue
new file mode 100644
index 0000000..8cb2c67
--- /dev/null
+++ b/src/views/MicroExhibition/child/Img.vue
@@ -0,0 +1,24 @@
+<!--
+ * @FilePath: Img.vue
+ * @Author: zz
+ * @Date: 2023-10-26 15:55:38
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2023-11-02 11:43:12
+ * @Descripttion: 
+-->
+<template>
+    <div>
+        <el-image style="width: 100%; height: 100%" :src="src" alt="image"  fit="fill" />
+    </div>
+</template>
+<script lang="ts" setup>
+// const url ='https://www.richpeace.cn/uploadfile/thumb/20885c72ca35d75619d6a378edea9f76/880x580_auto.jpg'
+defineProps({  
+  src: {  
+    type: String,  
+    required: true,  
+  },  
+});  
+</script>
+<style>
+</style>
diff --git a/src/views/MicroExhibition/child/Left1.vue b/src/views/MicroExhibition/child/Left1.vue
index 41a9629..afedf25 100644
--- a/src/views/MicroExhibition/child/Left1.vue
+++ b/src/views/MicroExhibition/child/Left1.vue
@@ -4,21 +4,21 @@
     <div class="s1"></div>
     <div class="h1"></div>
     <div class="s2"></div>
-    <div class="title">{{title}}</div>
-    <div class="val">{{ val }}</div>
+    <div class="title">{{num}}</div>
+    <div class="val">{{ numdata }}</div>
   </div>
 </template>
 
 <script setup lang='ts'>
 import Pan from './Pan.vue';
 const prop = defineProps({
-    title:  {
+    num:  {
         type: String,
-        default: '机架号'
+        required: true,
     },
-    val: {
+    numdata: {
         type: String,
-        default: 'RP2011001#'
+        required: true,
     }
 })
 </script>
@@ -70,7 +70,7 @@ const prop = defineProps({
     font-size: 20px;
     color: #B2EDED;
     top: 410px;
-    left: 56px;
+    left: 40px;
 }
 .val {
     width: 100%;
diff --git a/src/views/MicroExhibition/child/Left2.vue b/src/views/MicroExhibition/child/Left2.vue
index e87aa2a..d402bbe 100644
--- a/src/views/MicroExhibition/child/Left2.vue
+++ b/src/views/MicroExhibition/child/Left2.vue
@@ -4,21 +4,21 @@
     <div class="s1"></div>
     <div class="h1"></div>
     <div class="s2"></div>
-    <div class="title">{{ title }}</div>
-    <div class="val">{{ val }}</div>
+    <div class="title">{{ state }}</div>
+    <div class="val">{{ statedata }}</div>
   </div>
 </template>
 
 <script setup lang='ts'>
 import Pan from './Pan.vue';
 const prop = defineProps({
-    title:  {
+    state:  {
         type: String,
-        default: '设备状态'
+        required: true,
     },
-    val: {
+    statedata: {
         type: String,
-        default: '工作中'
+        required: true,
     }
 })
 </script>
diff --git a/src/views/MicroExhibition/child/LineChart.vue b/src/views/MicroExhibition/child/LineChart.vue
index 7752e65..908f59e 100644
--- a/src/views/MicroExhibition/child/LineChart.vue
+++ b/src/views/MicroExhibition/child/LineChart.vue
@@ -1,93 +1,102 @@
 <template>
-        <div ref="LChartRef"></div>
-        
+  <div ref="LChartRef" class="chart-container"></div>
 </template>
 
-<script setup lang='ts'>
-import { ref, getCurrentInstance, onMounted } from 'vue'
+<script setup lang="ts">
+import { ref, getCurrentInstance, onMounted } from "vue";
 
+const prop = defineProps<{
+  config: {
+    name: string;
+    data: any;
+    xAxis: string[];
+  };
+}>();
 
-const prop = defineProps({
-    config: {
-        type: Object,
-        default: {
-            title:''
-        }
-    }
-})
 let LChartRef = ref(null);
 const { proxy } = getCurrentInstance() as any;
 let charts = null;
-const setCharts = ()=>{
-    charts = proxy.$echarts.init(LChartRef.value, 'dark')
-    let option = {
-        title: {
-            text: prop.config.title,
-            textStyle:{
-                fontSize: 30,
-                color: '#20aec5'
-            },
-            left: '20px'
+const setCharts = () => {
+  charts = proxy.$echarts.init(LChartRef.value, "dark");
+  let option = {
+    backgroundColor: "#0E0E0E",
+    title: {
+      text: prop.config.title,
+      textStyle: {
+        fontSize: 18,
+        color: "#33CCFF",
+      },
+      left: "80%",
+      top: "-2px",
+    },
+    tooltip: {
+      trigger: "axis",
+    },
+    grid: {
+      left: "2%",
+      right: "6%",
+      bottom: "3%",
+      containLabel: true,
+    },
+    xAxis: {
+      type: "category",
+      boundaryGap: false,
+      axisLine: {
+        show: true, // 显示横坐标轴线段
+        lineStyle: {
+          color: "#5DB6F5", // 设置线段颜色
+          width: 1, // 设置线段宽度
         },
-        tooltip: {
-            trigger: 'axis'
+      },
+        data:prop.config.xAxis
+    },
+    yAxis: {
+      type: "value",
+      name: "分钟(min）",
+      axisLine: {
+        show: true, // 设置纵坐标线是否显示
+        lineStyle: {
+          color: "#5DB6F5", // 设置纵坐标线的颜色
+          width: 1, // 设置纵坐标线的宽度
         },
-        legend: {
-            data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
-        },
-        grid: {
-            left: '3%',
-            right: '4%',
-            bottom: '3%',
-            containLabel: true
-        },
-        xAxis: {
-            type: 'category',
-            boundaryGap: false,
-            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
-        },
-        yAxis: {
-            type: 'value'
-        },
-        series: [
-            {
-                name: 'Email',
-                type: 'line',
-                data: [120, 132, 101, 134, 90, 230, 210]
-            },
-            {
-                name: 'Union Ads',
-                type: 'line',
-                data: [220, 182, 191, 234, 290, 330, 310]
-            },
-            {
-                name: 'Video Ads',
-                type: 'line',
-                data: [150, 232, 201, 154, 190, 330, 410]
-            },
-            {
-                name: 'Direct',
-                type: 'line',
-                data: [320, 332, 301, 334, 390, 330, 320]
-            },
-            {
-                name: 'Search Engine',
-                type: 'line',
-                data: [820, 932, 901, 934, 1290, 1330, 1320]
-            }
-        ]
-    };
+      },
+    },
+    series: [
+      {
+        name: "Email",
+        type: "line",
+        data:prop.config.data,
+      },
+    ],
+  };
+
+  charts.setOption(option);
+};
+
+// watch(() => prop.config.data,(newVal) => {
+//     data = newVal
+//     charts.setOption({
+//         xAxis: {
+//             type: "category",
+//             boundaryGap:false,
+//             data:prop.config.xAxis
+//         },
+//         series:data
+//     })
+// })
 
-    charts.setOption(option);
-}
 onMounted(() => {
-        setCharts()
-})
+  setCharts();
+});
 </script>
 
 <style scoped>
+.chart-container {
+  width: 820px;
+  height: 470px;
+}
 .cc {
-    width: 400px;
-    height: 400px;
+  width: 500px;
+  height: 400px;
 }
 </style>
diff --git a/src/views/MicroExhibition/child/Name.vue b/src/views/MicroExhibition/child/Name.vue
new file mode 100644
index 0000000..880a2cd
--- /dev/null
+++ b/src/views/MicroExhibition/child/Name.vue
@@ -0,0 +1,42 @@
+<!--
+ * @FilePath: Name.vue
+ * @Author: zz
+ * @Date: 2023-10-26 14:54:46
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2023-11-14 14:21:52
+ * @Descripttion: 
+-->
+<template>
+    <div class="rect"></div>
+    <div class="name">{{ name }}</div>
+</template>
+
+<script setup lang='ts'>
+const prop = defineProps({
+    name:  {
+        type: String,
+        required: true,
+    },
+})
+</script>
+
+<style>
+.rect {
+    position: absolute;
+    width: 223px;
+    height: 75px;
+    background-image: url('./img/u506.svg');
+    left: 40%;
+    top: 343px;
+}
+.name{
+    position: absolute;
+    width: 260px;
+    top: 335px;
+    left: 38%;
+    font-weight: 700;
+    font-style: normal;
+    font-size: 36px;
+    color: #CFEBEB;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/MicroExhibition/child/Pan2.vue b/src/views/MicroExhibition/child/Pan2.vue
new file mode 100644
index 0000000..09b4ea2
--- /dev/null
+++ b/src/views/MicroExhibition/child/Pan2.vue
@@ -0,0 +1,35 @@
+<!--
+ * @FilePath: Pan2.vue
+ * @Author: zz
+ * @Date: 2023-10-26 10:12:10
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2023-10-26 10:28:39
+ * @Descripttion: 
+-->
+<template>
+  <div class="pan">
+    <div class="light"></div>
+  </div>
+</template>
+
+<script setup lang='ts'>
+</script>
+
+<style scoped>
+.pan {
+    position: relative;
+    width: 150px;
+    height: 120px;
+    background-image: url('./img/u356.png');
+    background-size: 100% 100%;
+}
+.light {
+    position: absolute;
+    width: 79px;
+    height: 40px;
+    left: 35px;
+    top: 38px;
+    background-image: url('./img/u25.png');
+    background-size: 100% 100%;
+}
+</style>
diff --git a/src/views/MicroExhibition/child/Right1.vue b/src/views/MicroExhibition/child/Right1.vue
index fdfef8f..aa3413a 100644
--- a/src/views/MicroExhibition/child/Right1.vue
+++ b/src/views/MicroExhibition/child/Right1.vue
@@ -1,24 +1,41 @@
 <template>
   <div class="left1">
+  <!-- 实际产量 -->
+    <Pan2 class="pan2"></Pan2>
+    <div class="s12"></div>
+    <div class="h12"></div>
+    <div class="s21"></div>
+    <div class="title2">{{ actoutput }}</div>
+    <div class="val2">{{ actdata }}</div>
+<!-- 计划产量 -->
     <Pan class="pan1"></Pan>
     <div class="s1"></div>
     <div class="h1"></div>
     <div class="s2"></div>
-    <div class="title">{{ title }}</div>
-    <div class="val">{{ val }}</div>
+    <div class="title">{{ planoutput }}</div>
+    <div class="val">{{ plandata }}</div>
   </div>
 </template>
 
 <script setup lang='ts'>
 import Pan from './Pan.vue';
+import Pan2 from './Pan2.vue'
 const prop = defineProps({
-    title:  {
+    planoutput:  {
         type: String,
-        default: '压脚次数'
+        required: true,
     },
-    val: {
+    plandata: {
         type: String,
-        default: '10次'
+        required: true,
+    },
+    actoutput:  {
+        type: String,
+        required: true,
+    },
+    plandata: {
+        type: String,
+        required: true,
     }
 })
 </script>
@@ -36,6 +53,13 @@ const prop = defineProps({
     left: 0px;
     top: 0px;
 }
+.pan2 {
+    position: absolute;
+    width: 150px;
+    height: 120px;
+    left: 265px;
+    top: -40px;
+}
 .s1 {
     position: absolute;
     width: 258px;
@@ -45,6 +69,16 @@ const prop = defineProps({
     top: 343px;
     transform: rotate(90deg);
 }
+.s12 {
+    position: absolute;
+    width: 258px;
+    height: 6px;
+    background-image: url('./img/u829p000.svg');
+    left: 216px;
+    top: 192px;
+    transform: rotate(90deg);
+    background-repeat:no-repeat
+}
 .h1 {
     position: absolute;
     width: 100px;
@@ -53,6 +87,14 @@ const prop = defineProps({
     left: 35px;
     top: 467px;
 }
+.h12 {
+    position: absolute;
+    width: 135px;
+    height: 6px;
+    background-image: url('./img/u829p001.svg');
+    left: 210px;
+    top: 99px;
+}
 .s2 {
     position: absolute;
     width: 124px;
@@ -62,6 +104,16 @@ const prop = defineProps({
     top: 528px;
     transform: rotate(90deg);
 }
+.s21 {
+    position: absolute;
+    width: 124px;
+    height: 6px;
+    background-image: url('./img/u829p002.svg');
+    left: 150px;
+    top: 160px;
+    transform: rotate(90deg);
+    background-repeat:no-repeat
+}
 .title {
     position: absolute;
     font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
@@ -70,7 +122,7 @@ const prop = defineProps({
     font-size: 20px;
     color: #B2EDED;
     top: 240px;
-    left: 42px;
+    left: 25px;
 }
 .val {
     width: 100%;
@@ -83,4 +135,26 @@ const prop = defineProps({
     top: 55px;
     left: 0;
 }
+.title2 {
+    position: absolute;
+    font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
+    font-weight: 700;
+    font-style: normal;
+    font-size: 20px;
+    color: #B2EDED;
+    top: 110px;
+    left: 235px;
+    width:100px;
+}
+.val2 {
+    width: 100%;
+    position: absolute;
+    font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
+    font-weight: 700;
+    font-style: normal;
+    font-size: 26px;
+    color: #B2EDED;
+    top: -40px;
+    left: 220px;
+}
 </style>
diff --git a/src/views/MicroExhibition/child/Right2.vue b/src/views/MicroExhibition/child/Right2.vue
index 519f208..d9e419e 100644
--- a/src/views/MicroExhibition/child/Right2.vue
+++ b/src/views/MicroExhibition/child/Right2.vue
@@ -4,21 +4,21 @@
     <div class="s1"></div>
     <div class="h1"></div>
     <div class="s2"></div>
-    <div class="title">{{ title }}</div>
-    <div class="val">{{ val }}</div>
+    <div class="title">{{ cut }}</div>
+    <div class="val">{{ cutdata }}</div>
   </div>
 </template>
 
 <script setup lang='ts'>
 import Pan from './Pan.vue';
 const prop = defineProps({
-    title:  {
+    cut:  {
         type: String,
-        default: '剪线次数'
+        required: true,
     },
-    val: {
+    cutdata: {
         type: String,
-        default: '20次'
+        required: true,
     }
 })
 </script>
@@ -70,7 +70,7 @@ const prop = defineProps({
     font-size: 20px;
     color: #B2EDED;
     top: 410px;
-    left: 34px;
+    left: 40px;
 }
 .val {
     width: 100%;
diff --git a/src/views/MicroExhibition/child/img/u455.svg b/src/views/MicroExhibition/child/img/u455.svg
new file mode 100644
index 0000000..e7af62f
--- /dev/null
+++ b/src/views/MicroExhibition/child/img/u455.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="15px" height="13px" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(1 0 0 1 -37 -614 )">
+    <path d="M 1.6964285784040172 0.16666666015625076  L 8.303571428571429 6.416666660156251  L 1.6964285784040178 12.666666660156253  L 0.3571428641183032 11.5  L 5.803571421805245 6.416666660156251  L 0.35714286411830276 1.3333333396484388  L 1.6964285784040172 0.16666666015625076  Z M 7.946428564453126 0.16666666015625076  L 14.642857135881698 6.416666660156251  L 7.946428564453126 12.666666660156253  L 6.696428571428572 11.5  L 12.14285714983259 6.4166666599609385  L 6.696428571428572 1.333333339843751  L 7.946428564453126 0.16666666015625076  Z " fill-rule="nonzero" fill="#0066ff" stroke="none" transform="matrix(1 0 0 1 37 614 )" />
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/views/MicroExhibition/child/img/u457.svg b/src/views/MicroExhibition/child/img/u457.svg
new file mode 100644
index 0000000..5c5b100
--- /dev/null
+++ b/src/views/MicroExhibition/child/img/u457.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="15px" height="13px" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(1 0 0 1 -205 -614 )">
+    <path d="M 13.303571421595983 12.83333333984375  L 6.696428571428572 6.583333339843751  L 13.303571421595983 0.3333333398437497  L 14.642857135881698 1.5  L 9.196428578404019 6.58333333984375  L 14.642857135881698 11.666666660156249  L 13.303571421595983 12.83333333984375  Z M 7.053571435546875 12.83333333984375  L 0.3571428641183037 6.583333339843751  L 7.053571435546877 0.3333333398437497  L 8.303571428571429 1.5  L 2.8571428501674103 6.58333333984375  L 8.303571428571429 11.666666660156249  L 7.053571435546875 12.83333333984375  Z " fill-rule="nonzero" fill="#0066ff" stroke="none" transform="matrix(1 0 0 1 205 614 )" />
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/views/MicroExhibition/child/img/u506.svg b/src/views/MicroExhibition/child/img/u506.svg
new file mode 100644
index 0000000..548100e
--- /dev/null
+++ b/src/views/MicroExhibition/child/img/u506.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="223px" height="75px" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(1 0 0 1 -1158 -406 )">
+    <path d="M 1159 416  A 9 9 0 0 1 1168 407 L 1371 407  A 9 9 0 0 1 1380 416 L 1380 471  A 9 9 0 0 1 1371 480 L 1168 480  A 9 9 0 0 1 1159 471 L 1159 416  Z " fill-rule="nonzero" fill="#3f81f0" stroke="none" fill-opacity="0.3686274509803922" />
+    <path d="M 1158.5 416  A 9.5 9.5 0 0 1 1168 406.5 L 1371 406.5  A 9.5 9.5 0 0 1 1380.5 416 L 1380.5 471  A 9.5 9.5 0 0 1 1371 480.5 L 1168 480.5  A 9.5 9.5 0 0 1 1158.5 471 L 1158.5 416  Z " stroke-width="1" stroke="#3f81f0" fill="none" stroke-opacity="0.3686274509803922" />
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/views/MicroExhibition/child/img/u585.svg b/src/views/MicroExhibition/child/img/u585.svg
new file mode 100644
index 0000000..1f8431d
--- /dev/null
+++ b/src/views/MicroExhibition/child/img/u585.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="5px" height="27px" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(1 0 0 1 -38 -177 )">
+    <path d="M 40 178  L 40 202  " stroke-width="2" stroke="#0a3e7b" fill="none" />
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/views/MicroExhibition/child/img/u829p000.svg b/src/views/MicroExhibition/child/img/u829p000.svg
new file mode 100644
index 0000000..a45060f
--- /dev/null
+++ b/src/views/MicroExhibition/child/img/u829p000.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="38px" height="6px" preserveAspectRatio="xMinYMid meet" viewBox="1706 175  38 4" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(0 -1 1 0 1548 1902 )">
+    <path d="M 133 5.9999996514168865  L 133 32  L 1 32  L 1 48  " stroke-width="2" stroke="#445382" fill="none" transform="matrix(1 0 0 1 1592 161 )" />
+    <path d="M 133 0  C 131.06700337559224 0  129.5 1.5670033757405226  129.5 3.5000000001483  C 129.5 5.432996624556077  131.06700337559224 7.0000000001483  133 7.0000000001483  C 134.93299662440776 7.0000000001483  136.5 5.432996624556077  136.5 3.5000000001483  C 136.5 1.5670033757405226  134.93299662440776 0  133 0  Z M 133 2.0000000001483  C 133.82842712474618 2.0000000001483  134.5 2.67157287540211  134.5 3.5000000001483  C 134.5 4.32842712489449  133.82842712474618 5.0000000001483  133 5.0000000001483  C 132.17157287525382 5.0000000001483  131.5 4.32842712489449  131.5 3.5000000001483  C 131.5 2.67157287540211  132.17157287525382 2.0000000001483  133 2.0000000001483  Z " fill-rule="nonzero" fill="#445382" stroke="none" transform="matrix(1 0 0 1 1592 161 )" />
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/views/MicroExhibition/child/img/u829p001.svg b/src/views/MicroExhibition/child/img/u829p001.svg
new file mode 100644
index 0000000..86b339d
--- /dev/null
+++ b/src/views/MicroExhibition/child/img/u829p001.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="138px" height="6px" preserveAspectRatio="xMinYMid meet" viewBox="1590 191  138 4" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(-1 -0 -0 -1 3318 386 )">
+    <path d="M 133 5.9999996514168865  L 133 32  L 1 32  L 1 48  " stroke-width="2" stroke="#445382" fill="none" transform="matrix(1 0 0 1 1592 161 )" />
+    <path d="M 133 0  C 131.06700337559224 0  129.5 1.5670033757405226  129.5 3.5000000001483  C 129.5 5.432996624556077  131.06700337559224 7.0000000001483  133 7.0000000001483  C 134.93299662440776 7.0000000001483  136.5 5.432996624556077  136.5 3.5000000001483  C 136.5 1.5670033757405226  134.93299662440776 0  133 0  Z M 133 2.0000000001483  C 133.82842712474618 2.0000000001483  134.5 2.67157287540211  134.5 3.5000000001483  C 134.5 4.32842712489449  133.82842712474618 5.0000000001483  133 5.0000000001483  C 132.17157287525382 5.0000000001483  131.5 4.32842712489449  131.5 3.5000000001483  C 131.5 2.67157287540211  132.17157287525382 2.0000000001483  133 2.0000000001483  Z " fill-rule="nonzero" fill="#445382" stroke="none" transform="matrix(1 0 0 1 1592 161 )" />
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/views/MicroExhibition/child/img/u829p002.svg b/src/views/MicroExhibition/child/img/u829p002.svg
new file mode 100644
index 0000000..1cde7f8
--- /dev/null
+++ b/src/views/MicroExhibition/child/img/u829p002.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="22px" height="6px" preserveAspectRatio="xMinYMid meet" viewBox="1582 199  22 4" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(0 -1 1 0 1392 1794 )">
+    <path d="M 133 5.9999996514168865  L 133 32  L 1 32  L 1 48  " stroke-width="2" stroke="#445382" fill="none" transform="matrix(1 0 0 1 1592 161 )" />
+    <path d="M 133 0  C 131.06700337559224 0  129.5 1.5670033757405226  129.5 3.5000000001483  C 129.5 5.432996624556077  131.06700337559224 7.0000000001483  133 7.0000000001483  C 134.93299662440776 7.0000000001483  136.5 5.432996624556077  136.5 3.5000000001483  C 136.5 1.5670033757405226  134.93299662440776 0  133 0  Z M 133 2.0000000001483  C 133.82842712474618 2.0000000001483  134.5 2.67157287540211  134.5 3.5000000001483  C 134.5 4.32842712489449  133.82842712474618 5.0000000001483  133 5.0000000001483  C 132.17157287525382 5.0000000001483  131.5 4.32842712489449  131.5 3.5000000001483  C 131.5 2.67157287540211  132.17157287525382 2.0000000001483  133 2.0000000001483  Z " fill-rule="nonzero" fill="#445382" stroke="none" transform="matrix(1 0 0 1 1592 161 )" />
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/views/MicroExhibition/child/img/u854.png b/src/views/MicroExhibition/child/img/u854.png
new file mode 100644
index 0000000..80ced0f
Binary files /dev/null and b/src/views/MicroExhibition/child/img/u854.png differ
diff --git a/src/views/MicroExhibition/child/index.vue b/src/views/MicroExhibition/child/index.vue
index 8f8f652..314de69 100644
--- a/src/views/MicroExhibition/child/index.vue
+++ b/src/views/MicroExhibition/child/index.vue
@@ -1,209 +1,283 @@
 <template>
-    <div class="container">
-        <div class="header">
-            <div class="title">
-                <header2 ref="headerref" :width="'100%'" :height="'100px'" :title="'设备大屏展示系统'" :titleTip="''"
-                    :typeFun="['time']" :alarmType="[]"></header2>
-            </div>
-        </div>
-        <div class="content">
-            <div class="left">
-                <div class="lt">
-                    <div class="lt-title">工作效率</div>
-                    <div class="lt-value">95</div>
-                    <div class="elli_tray">
-                        <img src="../../../assets/img/elli_tray.svg" alt="">
-                    </div>
-                    <div class="tray">
-                        <img src="../../../assets/img/tray.svg" alt="">
-                    </div>
-                    <ul class="scale">
-                        <li style="top:44%;left:26%;">10</li>
-                        <li style="top: 47%;left: 30%;">20</li>
-                        <li style="top: 49%;left: 34%;">30</li>
-                        <li style="top: 52%;left: 39%;">40</li>
-                        <li style="top: 53.5%;left: 45%;">50</li>
-                        <li style="top: 55%;left: 51%;">60</li>
-                        <li style="top: 56%;left: 56%;">70</li>
-                        <li style="top: 56%;left: 62%;">80</li>
-                        <li style="top: 55.5%;left: 67%;">90</li>
-                        <li style="top: 54%;left: 71%;">100</li>
-                    </ul>
-                </div>
-                <div class="lb">
-                    <LineChart class="line" :config="lineConfig"></LineChart>
-                </div>
-            </div>
-            <div class="right">
-                <Left1 class="left1"></Left1>
-                <Left2 class="left2"></Left2>
-                <Right1 class="left3"></Right1>
-                <Right2 class="left4"></Right2>
-            </div>
-        </div>
+  <div class="container">
+    <div class="header">
+      <div class="title">
+        <header2
+          ref="headerref"
+          :width="'100%'"
+          :height="'100px'"
+          :title="'微工厂设备物联大屏'"
+          :titleTip="''"
+          :typeFun="['time']"
+          :alarmType="[]"
+        ></header2>
+      </div>
     </div>
+    <div class="content">
+      <div class="left">
+        <div class="lt">
+          <div class="ico" style="top: 30px; left: 20px; width: 20px; height: 50px"></div>
+          <div class="lt-title" style="top: 20px; left: 50px">稼 动 率</div>
+          <div class="lt-value">{{ allData.activ }}%</div>
+          <div class="elli_tray">
+            <img src="../../../assets/img/elli_tray.svg" alt="" />
+          </div>
+          <div class="tray">
+            <img src="../../../assets/img/tray.svg" alt="" />
+          </div>
+          <ul class="scale">
+            <li style="top: 44%; left: 26%">10</li>
+            <li style="top: 47%; left: 30%">20</li>
+            <li style="top: 49%; left: 34%">30</li>
+            <li style="top: 52%; left: 39%">40</li>
+            <li style="top: 53.5%; left: 45%">50</li>
+            <li style="top: 55%; left: 51%">60</li>
+            <li style="top: 56%; left: 56%">70</li>
+            <li style="top: 56%; left: 62%">80</li>
+            <li style="top: 55.5%; left: 67%">90</li>
+            <li style="top: 54%; left: 71%">100</li>
+          </ul>
+        </div>
+        <div class="lb">
+          <div
+            class="ico"
+            style="top: 580px; left: 20px; width: 20px; height: 50px"
+          ></div>
+          <div class="lt-title" style="top: 570px; left: 50px">缝纫时间</div>
+          <LineChart class="line" :config="lineConfig"></LineChart>
+        </div>
+      </div>
+      <div class="right">
+        <Name class="name" :name="allData.name"></Name>
+        <Left1 class="num" :num="allData.num" :numdata="allData.numdata"></Left1>
+        <Left2
+          class="state"
+          :state="allData.state"
+          :statedata="allData.statedata"
+        ></Left2>
+        <Right1
+          class="output"
+          :planoutput="allData.planoutput"
+          :plandata="allData.plandata"
+          :actoutput="allData.actoutput"
+          :actdata="allData.actdata"
+        ></Right1>
+        <Right2 class="cut" :cut="allData.cut" :cutdata="allData.cutdata"></Right2>
+      </div>
+      <div class="imgbox">
+        <Img class="imgbig" :src="imgUrl" ref="imgRef"></Img>
+      </div>
+    </div>
+  </div>
 </template>
 
-<script setup lang='ts'>
-import { ref, getCurrentInstance, onMounted } from 'vue'
-import header2 from '@/components/headerBox/header2.vue'
-import LineChart from './LineChart.vue'
-import Left1 from './Left1.vue'
-import Left2 from './Left2.vue'
-import Right1 from './Right1.vue'
-import Right2 from './Right2.vue'
+<script setup lang="ts">
+import { ref, getCurrentInstance, reactive, onMounted } from "vue";
+import header2 from "@/components/headerBox/header2.vue";
+import LineChart from "./LineChart.vue";
+import Left1 from "./Left1.vue";
+import Left2 from "./Left2.vue";
+import Right1 from "./Right1.vue";
+import Right2 from "./Right2.vue";
+import Name from "./Name.vue";
+import Img from "./Img.vue";
+
+let allData = reactive({
+  activ: 95,
+  name: "一体型四自动高速平缝机",
+  num: "设备编号",
+  numdata: "123456",
+  state: "设备状态",
+  statedata: "待机",
+  planoutput: "计划日产量",
+  plandata: "",
+  actoutput: "实际日产量",
+  actdata: "",
+  cut: "剪线次数",
+  cutdata: "",
+  imgUrl: "",
+});
+let imgRef = ref(null);
+
+onMounted(() =>{
+
+});
 
 let lineConfig = {
-    title: '工作时间'
-}
-
-
-
-
-
+  title: "时间趋势",
+  data: [120, 0, 101, 134, 0, 230, 210],
+  xAxis: [
+    "10-26 10:41:26",
+    "10-26 10:41:26",
+    "10-26 10:41:26",
+    "10-26 10:41:26",
+    "10-26 10:41:26",
+    "10-26 10:41:26",
+    "10-26 10:41:26",
+  ],
+};
+// 折线图接口
 </script>
 
 <style scoped>
 .container {
-    height: 1080px;
-    width: 1920px;
-    color: #20aec5;
-    background-color: #100c2a;
+  height: 1080px;
+  width: 1920px;
+  color: #cfebeb;
+  background-color: #0e0e0e;
 }
 
 .header {
-    height: 100px;
-    width: 1920px;
+  height: 100px;
+  width: 1920px;
 }
 
 .content {
-    width: 1920px;
-    height: 980px;
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
+  width: 1920px;
+  height: 980px;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
 }
-
 .left {
-    width: 780px;
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    align-items: center;
+  width: 780px;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  align-items: center;
 }
 
 .right {
-    position: relative;
-    width: 1130px;
-    height: 100%;
+  position: relative;
+  width: 1130px;
+  height: 100%;
+  right: 30px;
 }
 
 .lt,
 .lb {
-    width: 100%;
-    height: 48%;
+  width: 100%;
+  height: 48%;
 }
 
 .lt {
-    position: relative;
+  position: relative;
 }
 
 .elli_tray {
-    border-width: 0px;
-    position: absolute;
-    top: 51%;
-    left: 50%;
-    width: 351px;
-    height: 46px;
-    transform: rotate(6deg) translate(-50%, -50%);
-    z-index: 2;
+  border-width: 0px;
+  position: absolute;
+  top: 58%;
+  left: 45%;
+  width: 380px;
+  height: 60px;
+  transform: rotate(7deg) translate(-50%, -50%);
+  z-index: 2;
 }
 
 img {
-    width: 100%;
-    height: 100%;
+  width: 100%;
+  height: 100%;
 }
 
 .tray {
-    border-width: 0px;
-    position: absolute;
-    top: 60%;
-    left: 50%;
-    width: 426px;
-    height: 95px;
-    transform: rotate(8deg) translate(-50%, -50%);
+  border-width: 0px;
+  position: absolute;
+  top: 68%;
+  left: 45%;
+  width: 500px;
+  height: 120px;
+  transform: rotate(8deg) translate(-50%, -50%);
+}
+.ico {
+  position: absolute;
+  background-image: url("./img/u455.svg");
+  background-repeat: no-repeat;
 }
 .lt-title {
-    position: absolute;
-    top: 10px;
-    left: 20px;
-    font-size: 30px;
-    font-weight: bold;
-    color: #20aec5;
-    z-index: 3;
+  position: absolute;
+  font-size: 28px;
+  font-weight: bold;
+  color: #33ccff;
+  z-index: 3;
 }
 .lt-value {
-    position: absolute;
-    top: 40%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    font-size: 110px;
-    font-weight: bold;
-    color: #20aec5;
-    z-index: 3;
+  position: absolute;
+  top: 40%;
+  left: 48%;
+  transform: translate(-50%, -50%);
+  font-size: 110px;
+  font-weight: bold;
+  color: rgb(9, 238, 216);
+  z-index: 3;
 }
 
 .scale {
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    display: flex;
-    font-size: 18px;
-    color: #3366ff;
-    transform: translate(-50%, -50%);
-    top: 50%;
-    left: 50%;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  display: flex;
+  font-size: 18px;
+  color: #3366ff;
+  transform: translate(-50%, -50%);
+  top: 58%;
+  left: 45%;
 }
 
 .scale li {
-    text-align: center;
-    line-height: 30px;
-    position: absolute;
-    z-index: 3;
+  text-align: center;
+  top: -20px;
+  line-height: 30px;
+  position: absolute;
+  z-index: 3;
 }
 .line {
-    width: 100%;
-    height: 100%;
+  width: 100%;
+  height: 100%;
 }
-
-.left1 {
-    position: absolute;
-    width: 247px;
-    height: 100%;
-    left: 0px;
-    top: 0px;
+.num {
+  position: absolute;
+  width: 247px;
+  height: 100%;
+  left: 0px;
+  top: 0px;
 }
-.left2 {
-    position: absolute;
-    width: 247px;
-    height: 100%;
-    left: 247px;
-    top: 0px;
+.state {
+  position: absolute;
+  width: 247px;
+  height: 100%;
+  left: 247px;
+  top: 0px;
 }
-.left3 {
-    position: absolute;
-    width: 247px;
-    height: 100%;
-    left: 636px;
-    top: 0px;
+.output {
+  position: absolute;
+  width: 247px;
+  height: 100%;
+  left: 636px;
+  top: 0px;
 }
-.left4 {
-    position: absolute;
-    width: 247px;
-    height: 100%;
-    left: 883px;
-    top: 0px;
+.cut {
+  position: absolute;
+  width: 247px;
+  height: 100%;
+  left: 883px;
+  top: 0px;
+}
+.imgbox {
+  position: absolute;
+  display: flex; /* 创建一个Flex容器 */
+  justify-content: center; /* 水平居中 */
+  align-items: center; /* 垂直居中 */
+  width: 33%;
+  height: 37%;
+  right: 14.5%;
+  top: 62%;
+  border: 1px solid #fff;
+}
+.imgbig {
+  max-width: 100%; /* 图片最大宽度为div的宽度 */
+  height: auto; /* 高度自适应 */
 }
 </style>