diff --git a/hw-ui/src/assets/board/productionBg3.jpg b/hw-ui/src/assets/board/productionBg3.jpg
index 9f0cae49..9892aea5 100644
Binary files a/hw-ui/src/assets/board/productionBg3.jpg and b/hw-ui/src/assets/board/productionBg3.jpg differ
diff --git a/hw-ui/src/assets/board/productionBg3_1.jpg b/hw-ui/src/assets/board/productionBg3_1.jpg
new file mode 100644
index 00000000..9f0cae49
Binary files /dev/null and b/hw-ui/src/assets/board/productionBg3_1.jpg differ
diff --git a/hw-ui/src/assets/board/warehouseBg3.jpg b/hw-ui/src/assets/board/warehouseBg3.jpg
index 4feb38f7..e902792d 100644
Binary files a/hw-ui/src/assets/board/warehouseBg3.jpg and b/hw-ui/src/assets/board/warehouseBg3.jpg differ
diff --git a/hw-ui/src/assets/board/warehouseBg3_1.jpg b/hw-ui/src/assets/board/warehouseBg3_1.jpg
new file mode 100644
index 00000000..4feb38f7
Binary files /dev/null and b/hw-ui/src/assets/board/warehouseBg3_1.jpg differ
diff --git a/hw-ui/src/assets/images/loginBg.jpg b/hw-ui/src/assets/images/loginBg.jpg
new file mode 100644
index 00000000..9b93c89b
Binary files /dev/null and b/hw-ui/src/assets/images/loginBg.jpg differ
diff --git a/hw-ui/src/views/board/production/fifthFloor.vue b/hw-ui/src/views/board/production/fifthFloor.vue
index 9a7737dd..617da282 100644
--- a/hw-ui/src/views/board/production/fifthFloor.vue
+++ b/hw-ui/src/views/board/production/fifthFloor.vue
@@ -67,23 +67,23 @@
       </vue-seamless-scroll>
     </div>
     <div class="table2">
-      <div style="background-color: #1077bc19">
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;width: 10%">
+      <div style="background-color: #1077bc19;height: 50px;line-height: 50px;">
+        <div class="scrollTableItem" style="padding:0;color:#65c2f3;font-weight: bold;width: 10%">
           编号
         </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;width: 23.333%">
+        <div class="scrollTableItem" style="padding:0;color:#65c2f3;font-weight: bold;width: 23.333%">
           生产工单
         </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+        <div class="scrollTableItem" style="padding:0;color:#65c2f3;font-weight: bold;">
           计划数量
         </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+        <div class="scrollTableItem" style="padding:0;color:#65c2f3;font-weight: bold;">
           实际数量
         </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+        <div class="scrollTableItem" style="padding:0;color:#65c2f3;font-weight: bold;">
           差异值
         </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+        <div class="scrollTableItem" style="padding:0;color:#65c2f3;font-weight: bold;">
           完成率
         </div>
       </div>
@@ -91,67 +91,7 @@
         :class-option="scrollTableOption"
         :data="scrollTableData"
         class="case-item"
-        style="height: calc(100% - 30px);overflow: hidden;"
-      >
-        <div
-          v-for="(item, index) in scrollTableData"
-          :key="index"
-        >
-          <div :style='"background-color:" + ((index % 2 === 0)? "#1077bc19":"#1077bc05") '>
-            <div
-              class="scrollTableItem" style="width: 10%">
-              {{ item.value1 }}
-            </div>
-            <div
-              class="scrollTableItem" style="width: 23.333%">
-              {{ item.value2 }}
-            </div>
-            <div
-              class="scrollTableItem">
-              {{ item.value3 }}
-            </div>
-            <div
-              class="scrollTableItem">
-              {{ item.value4 }}
-            </div>
-            <div
-              class="scrollTableItem">
-              {{ item.value5 }}
-            </div>
-            <div
-              class="scrollTableItem">
-              {{ item.value6 }}
-            </div>
-          </div>
-        </div>
-      </vue-seamless-scroll>
-    </div>
-    <div class="table3">
-      <div style="background-color: #1077bc19">
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;width: 10%">
-          编号
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;width: 23.333%">
-          生产工单
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          计划数量
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          实际数量
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          差异值
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          完成率
-        </div>
-      </div>
-      <vue-seamless-scroll
-        :class-option="scrollTableOption"
-        :data="scrollTableData"
-        class="case-item"
-        style="height: calc(100% - 30px);overflow: hidden;"
+        style="height: calc(100% - 50px);overflow: hidden;"
       >
         <div
           v-for="(item, index) in scrollTableData"
@@ -226,9 +166,9 @@ export default {
   data() {
     return {
       title: [
-        '工位生产进度',
+        '工单生产进度',
         '工位生产效率TOP',
-        '工位生产异常情况',
+        ' ',
         '计划数量:',
         '完成数量:',
         '差异值:',
@@ -292,178 +232,177 @@ export default {
   },
   mounted() {
     this.$refs.chart1.setData({
-      tooltip: {
-        trigger: "item",
-        formatter: "{a} <br/>{b} : {c} ({d}%)",
-      },
-      legend: {
-        type: "scroll",
-        orient: "vertical",
-        left: "70%",
-        align: "left",
-        top: "middle",
+      color: ["#3398DB"],
+      title: {
+        text: "组员生产合格率",
         textStyle: {
-          color: "#8C8C8C",
-        },
-        height: 250,
+           color: '#fff'
+        }
       },
-      series: [
-        {
-          name: "库存情况",
-          type: "pie",
-          radius: ["20%", "70%"],
-          center: ["35%", "50%"],
-          clockwise: false,
-          data: [
-            {
-              value: 45,
-              name: "已过期",
-            },
-            {
-              value: 25,
-              name: "半年内",
-            },
-            {
-              value: 15,
-              name: "三个月内",
-            },
-            {
-              value: 8,
-              name: "一个月内",
-            },
-          ],
-          label: {
-            normal: {
-              position: "inner",
-              textStyle: {
-                color: "#fff",
-                fontSize: 14,
-              },
-              formatter: (e) => {
-                return e.percent.toFixed(2) + '%'
-              }
-            },
-          },
-          labelLine: {
-            normal: {
-              show: false,
-            },
-          },
+      tooltip: {
+        trigger: "axis",
+        axisPointer: {
+          type: "shadow",
         },
-      ],
-    })
-    this.$refs.chart2.setData({
+        formatter: "{b} <br> 合格率: {c}%",
+      },
+      /*legend: {
+            data: [date]
+        },*/
       grid: {
-        top: 30,
-        left: "2%",
-        right: "5%",
+        top:'30',
+        left: "4%",
+        right: "4%",
         bottom: "2%",
         containLabel: true,
       },
       xAxis: {
-        type: "category",
-        boundaryGap: false,
-        data: ["14", "15", "16", "17", "18", "19", "20", "21", "22", "23"],
+        type: "value",
+        boundaryGap: [0, 0.01],
+        min: 0,
+        max: 100,
+        interval: 20,
         axisLabel: {
-          margin: 10,
-          color: "#ffffff63",
+          formatter: "{value}%",
+          textStyle: {
+            color: '#fff',
+            fontWeight: "80",
+          },
         },
-        axisLine: {
-          show: false,
-        },
-        axisTick: {
+      },
+      yAxis: {
+        type: "category",
+        data: [
+          "人员1",
+          "人员2",
+          "人员3",
+          "人员4",
+          "人员5",
+          "人员6",
+          "人员7",
+        ],
+        axisLabel: {
           show: true,
-          lineStyle: {
-            color: "#ffffff1f",
+          interval: 0,
+          rotate: 0,
+          margin: 10,
+          inside: false,
+          textStyle: {
+            color: '#fff',
+            fontWeight: "50",
           },
         },
-        splitLine: {
-          show: false,
-          lineStyle: {
-            type: 'dashed',
-            color: "#ffffff1f",
+      },
+      series: [
+        {
+          type: "bar",
+          label: {
+            normal: {
+              show: true,
+              // formatter: '{c}',
+              formatter: function (v) {
+                var val = v.data;
+                if (val === 0) {
+                  return "";
+                }
+                return val;
+              },
+              color: "#fff",
+            },
           },
+          data: [22, 33, 44, 55, 66, 77, 88],
         },
+      ],
+    })
+    this.$refs.chart2.setData({
+      tooltip: {
+        trigger: "axis",
+        axisPointer: {
+          type: "shadow",
+        },
+      },
+      grid: {
+        top:'5%',
+        left: "3%",
+        right: "4%",
+        bottom: "3%",
+        containLabel: true,
       },
       yAxis: [
         {
           type: "value",
-          axisLabel: {
-            margin: 10,
-            color: "#ffffff63",
-          },
-
-          axisTick: {
-            show: true,
-            lineStyle: {
-              color: "#ffffff1f",
-            },
-          },
-          splitLine: {
-            show: false,
-            lineStyle: {
-              type: 'dashed',
-              color: "#ffffff1f",
-            },
-          },
-          axisLine: {
-            lineStyle: {
-              color: "#fff",
-              width: 2,
-            },
-          },
+          name: "次数",
+          position: "left",
+        },
+        {
+          show: false,
         },
       ],
+      xAxis: {
+        type: "category",
+        data: [
+          "员工1",
+          "员工2",
+          "员工3",
+          "员工4",
+          "员工5",
+          "员工6",
+          "员工7",
+          "员工8",
+          "员工9",
+          "员工10",
+          "员工11",
+          "员工12",
+        ],
+      },
       series: [
         {
-          name: "产量",
-          type: "line",
-          smooth: true, //是否平滑曲线显示
-          showAllSymbol: true,
-          symbol: "circle",
-          symbolSize: 6,
-          lineStyle: {
-            normal: {
-              color: "#fff", // 线条颜色
-            },
-          },
+          name: "流程1",
+          type: "bar",
+          stack: "次数",
           label: {
-            show: true,
-            position: "top",
-            textStyle: {
-              color: "#fff",
+            normal: {
+              show: true,
             },
           },
           itemStyle: {
-            color: "red",
-            borderColor: "#fff",
-            borderWidth: 3,
-          },
-          tooltip: {
-            show: false,
-          },
-          areaStyle: {
             normal: {
-              color: new echarts.graphic.LinearGradient(
-                0,
-                0,
-                0,
-                1,
-                [
-                  {
-                    offset: 0,
-                    color: "#eb64fb",
-                  },
-                  {
-                    offset: 1,
-                    color: "#3fbbff0d",
-                  },
-                ],
-                false
-              ),
+              color: "rgb(249,18,243)",
             },
           },
-          data: [393, 438, 485, 631, 689, 824, 987, 1000, 1100, 1200],
+          data: [197, 134, 138, 167, 160, 174, 164, 0, 0, 0, 0, 0],
+        },
+        {
+          name: "流程2",
+          type: "bar",
+          stack: "次数",
+          label: {
+            normal: {
+              show: true,
+            },
+          },
+          itemStyle: {
+            normal: {
+              color: "rgb(249,205,30)",
+            },
+          },
+          data: [325, 191, 315, 400, 407, 448, 417, 0, 0, 0, 0, 0],
+        },
+        {
+          name: "流程3",
+          type: "bar",
+          stack: "次数",
+          label: {
+            normal: {
+              show: true,
+            },
+          },
+          itemStyle: {
+            normal: {
+              color: "rgb(0, 137, 239)",
+            },
+          },
+          data: [138, 111, 156, 139, 116, 151, 154, 0, 0, 0, 0, 0],
         },
       ],
     })
@@ -527,7 +466,7 @@ export default {
   top: 44.5%;
   left: 67.3%;
   width: 29.5%;
-  height: 19.5%;
+  height: 50.5%;
   color: #fff;
 }
 
@@ -551,16 +490,16 @@ export default {
 .chart1 {
   position: absolute;
   top: 16%;
-  left: 30%;
-  width: 35.5%;
+  left: 3.4%;
+  width: 46%;
   height: 21.5%;
 }
 
 .chart2 {
   position: absolute;
-  top: 16%;
-  left: 67.3%;
-  width: 29%;
+  top: 16.2%;
+  left: 50.7%;
+  width: 45.9%;
   height: 21%;
 }
 
diff --git a/hw-ui/src/views/board/production/fifthFloor1.vue b/hw-ui/src/views/board/production/fifthFloor1.vue
new file mode 100644
index 00000000..d9d1bbaa
--- /dev/null
+++ b/hw-ui/src/views/board/production/fifthFloor1.vue
@@ -0,0 +1,568 @@
+<template>
+  <div class="app-container">
+    <div class="headTitle">京源生产监控平台</div>
+    <div v-for="(i,k) in title"
+         :style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'"
+         class="title">
+      {{ i }}
+    </div>
+    <div class="table1">
+      <div style="background-color: #1077bc19">
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;width: 10%">
+          编号
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;width: 23.333%">
+          生产工单
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          计划数量
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          实际数量
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          差异值
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          完成率
+        </div>
+      </div>
+      <vue-seamless-scroll
+        :class-option="scrollTableOption"
+        :data="scrollTableData"
+        class="case-item"
+        style="height: calc(100% - 30px);overflow: hidden;"
+      >
+        <div
+          v-for="(item, index) in scrollTableData"
+          :key="index"
+        >
+          <div :style='"background-color:" + ((index % 2 === 0)? "#1077bc19":"#1077bc05") '>
+            <div
+              class="scrollTableItem" style="width: 10%">
+              {{ item.value1 }}
+            </div>
+            <div
+              class="scrollTableItem" style="width: 23.333%">
+              {{ item.value2 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value3 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value4 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value5 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value6 }}
+            </div>
+          </div>
+        </div>
+      </vue-seamless-scroll>
+    </div>
+    <div class="table2">
+      <div style="background-color: #1077bc19">
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;width: 10%">
+          编号
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;width: 23.333%">
+          生产工单
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          计划数量
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          实际数量
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          差异值
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          完成率
+        </div>
+      </div>
+      <vue-seamless-scroll
+        :class-option="scrollTableOption"
+        :data="scrollTableData"
+        class="case-item"
+        style="height: calc(100% - 30px);overflow: hidden;"
+      >
+        <div
+          v-for="(item, index) in scrollTableData"
+          :key="index"
+        >
+          <div :style='"background-color:" + ((index % 2 === 0)? "#1077bc19":"#1077bc05") '>
+            <div
+              class="scrollTableItem" style="width: 10%">
+              {{ item.value1 }}
+            </div>
+            <div
+              class="scrollTableItem" style="width: 23.333%">
+              {{ item.value2 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value3 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value4 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value5 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value6 }}
+            </div>
+          </div>
+        </div>
+      </vue-seamless-scroll>
+    </div>
+    <div class="table3">
+      <div style="background-color: #1077bc19">
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;width: 10%">
+          编号
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;width: 23.333%">
+          生产工单
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          计划数量
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          实际数量
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          差异值
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          完成率
+        </div>
+      </div>
+      <vue-seamless-scroll
+        :class-option="scrollTableOption"
+        :data="scrollTableData"
+        class="case-item"
+        style="height: calc(100% - 30px);overflow: hidden;"
+      >
+        <div
+          v-for="(item, index) in scrollTableData"
+          :key="index"
+        >
+          <div :style='"background-color:" + ((index % 2 === 0)? "#1077bc19":"#1077bc05") '>
+            <div
+              class="scrollTableItem" style="width: 10%">
+              {{ item.value1 }}
+            </div>
+            <div
+              class="scrollTableItem" style="width: 23.333%">
+              {{ item.value2 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value3 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value4 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value5 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value6 }}
+            </div>
+          </div>
+        </div>
+      </vue-seamless-scroll>
+    </div>
+    <div class="chart1">
+      <Chart key="chart1" ref="chart1"></Chart>
+    </div>
+    <div class="chart2">
+      <Chart key="chart2" ref="chart2"></Chart>
+    </div>
+    <div class="num1 num1_1" style="top: 11.9%;left: 11.1%;color:#5fc2f2">1</div>
+    <div class="num1 num1_2" style="top: 11.9%;left:14.6%;color:#5fc2f2">0</div>
+    <div class="num1 num1_3" style="top: 11.9%;left:18.1%;color:#5fc2f2">0</div>
+    <div class="num1 num1_4" style="top: 11.9%;left:21.8%;color:#5fc2f2">0</div>
+    <div class="num1 num1_5" style="top: 11.9%;left:35.6%;color:#59ee7b">1</div>
+    <div class="num1 num1_6" style="top: 11.9%;left:39.2%;color:#59ee7b">0</div>
+    <div class="num1 num1_7" style="top: 11.9%;left:42.8%;color:#59ee7b">0</div>
+    <div class="num1 num1_8" style="top: 11.9%;left:46.4%;color:#59ee7b">0</div>
+    <div class="num1 num1_9" style="top: 11.9%;left:60.3%;color:#f60008">1</div>
+    <div class="num1 num1_10" style="top: 11.9%;left:63.9%;color:#f60008">0</div>
+    <div class="num1 num1_11" style="top: 11.9%;left:67.4%;color:#f60008">0</div>
+    <div class="num1 num1_12" style="top: 11.9%;left:71%;color:#f60008">0</div>
+    <div class="num1 num1_13" style="top: 11.9%;left:84.8%;color:#f60008">1</div>
+    <div class="num1 num1_14" style="top: 11.9%;left:88.4%;color:#f60008">0</div>
+    <div class="num1 num1_15" style="top: 11.9%;left:92%;color:#f60008">0</div>
+    <div class="num1 num1_16" style="top: 11.9%;left:95.6%;color:#f60008">0</div>
+  </div>
+</template>
+
+<script>
+import vueSeamlessScroll from "vue-seamless-scroll";
+import Chart from '@/components/board/Chart'
+import * as echarts from 'echarts'
+
+const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
+export default {
+  name: 'Board1',
+  components: {
+    vueSeamlessScroll,
+    Chart
+  },
+  data() {
+    return {
+      title: [
+        '工位生产进度',
+        '工位生产效率TOP',
+        '工位生产异常情况',
+        '计划数量:',
+        '完成数量:',
+        '差异值:',
+        '完成进度:',
+      ],
+      titlePosition: [
+        {
+          top: 41.6,
+          left: 5.5
+        },
+        {
+          top: 41.6,
+          left: 69
+        },
+        {
+          top: 70.5,
+          left:  69
+        },
+        {
+          top: 11.9,
+          left: 4
+        },
+        {
+          top: 11.9,
+          left: 29
+        },
+        {
+          top: 11.9,
+          left: 54
+        },
+        {
+          top: 11.9,
+          left: 78
+        }
+      ],
+      scrollTableOption: {
+        step: 0.5, // 数值越大速度滚动越快
+        limitMoveNum: 22, // 开始无缝滚动的数据量 this.dataList.length
+        hoverStop: true, // 是否开启鼠标悬停stop
+        direction: 1, // 0向下 1向上 2向左 3向右
+        openWatch: true, // 开启数据实时监控刷新dom
+        singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
+        singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
+        waitTime: 0,
+      },
+      scrollTableData: Array(50).fill('').map(function (i, k) {
+        let val1 = Math.ceil(Math.random() * 10000)
+        let val2 = val1 - Math.ceil(Math.random() * val1)
+        let val3 = val1 - val2
+        let val4 = ((val2 / val1) * 100).toFixed(2) + '%'
+        return {
+          value1: k + 1,
+          value2: "20230304" + k,
+          value3: val1,
+          value4: val2,
+          value5: val3,
+          value6: val4,
+        }
+      }),
+    }
+  },
+  mounted() {
+    this.$refs.chart1.setData({
+      tooltip: {
+        trigger: "item",
+        formatter: "{a} <br/>{b} : {c} ({d}%)",
+      },
+      legend: {
+        type: "scroll",
+        orient: "vertical",
+        left: "70%",
+        align: "left",
+        top: "middle",
+        textStyle: {
+          color: "#8C8C8C",
+        },
+        height: 250,
+      },
+      series: [
+        {
+          name: "库存情况",
+          type: "pie",
+          radius: ["20%", "70%"],
+          center: ["35%", "50%"],
+          clockwise: false,
+          data: [
+            {
+              value: 45,
+              name: "已过期",
+            },
+            {
+              value: 25,
+              name: "半年内",
+            },
+            {
+              value: 15,
+              name: "三个月内",
+            },
+            {
+              value: 8,
+              name: "一个月内",
+            },
+          ],
+          label: {
+            normal: {
+              position: "inner",
+              textStyle: {
+                color: "#fff",
+                fontSize: 14,
+              },
+              formatter: (e) => {
+                return e.percent.toFixed(2) + '%'
+              }
+            },
+          },
+          labelLine: {
+            normal: {
+              show: false,
+            },
+          },
+        },
+      ],
+    })
+    this.$refs.chart2.setData({
+      grid: {
+        top: 30,
+        left: "2%",
+        right: "5%",
+        bottom: "2%",
+        containLabel: true,
+      },
+      xAxis: {
+        type: "category",
+        boundaryGap: false,
+        data: ["14", "15", "16", "17", "18", "19", "20", "21", "22", "23"],
+        axisLabel: {
+          margin: 10,
+          color: "#ffffff63",
+        },
+        axisLine: {
+          show: false,
+        },
+        axisTick: {
+          show: true,
+          lineStyle: {
+            color: "#ffffff1f",
+          },
+        },
+        splitLine: {
+          show: false,
+          lineStyle: {
+            type: 'dashed',
+            color: "#ffffff1f",
+          },
+        },
+      },
+      yAxis: [
+        {
+          type: "value",
+          axisLabel: {
+            margin: 10,
+            color: "#ffffff63",
+          },
+
+          axisTick: {
+            show: true,
+            lineStyle: {
+              color: "#ffffff1f",
+            },
+          },
+          splitLine: {
+            show: false,
+            lineStyle: {
+              type: 'dashed',
+              color: "#ffffff1f",
+            },
+          },
+          axisLine: {
+            lineStyle: {
+              color: "#fff",
+              width: 2,
+            },
+          },
+        },
+      ],
+      series: [
+        {
+          name: "产量",
+          type: "line",
+          smooth: true, //是否平滑曲线显示
+          showAllSymbol: true,
+          symbol: "circle",
+          symbolSize: 6,
+          lineStyle: {
+            normal: {
+              color: "#fff", // 线条颜色
+            },
+          },
+          label: {
+            show: true,
+            position: "top",
+            textStyle: {
+              color: "#fff",
+            },
+          },
+          itemStyle: {
+            color: "red",
+            borderColor: "#fff",
+            borderWidth: 3,
+          },
+          tooltip: {
+            show: false,
+          },
+          areaStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(
+                0,
+                0,
+                0,
+                1,
+                [
+                  {
+                    offset: 0,
+                    color: "#eb64fb",
+                  },
+                  {
+                    offset: 1,
+                    color: "#3fbbff0d",
+                  },
+                ],
+                false
+              ),
+            },
+          },
+          data: [393, 438, 485, 631, 689, 824, 987, 1000, 1100, 1200],
+        },
+      ],
+    })
+
+    window.onresize = () => {
+      this.$refs.chart1.chart.resize()
+      this.$refs.chart2.chart.resize()
+    }
+  },
+  methods: {}
+}
+</script>
+<style lang="less" scoped>
+
+.app-container {
+  background-image: url("../../../assets/board/productionBg3_1.jpg");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+.headTitle {
+  position: absolute;
+  top: 5%;
+  left: 50%;
+  transform: translate(-50%, -100%);
+  font-size: 1.5vw;
+  color: #d6eaed;
+  letter-spacing: 10px;
+}
+
+.title {
+  position: absolute;
+  transform: translateY(-50%);
+  color: #dddddd;
+  font-size: 1vw;
+  letter-spacing: 2px;
+}
+
+.num1 {
+  position: absolute;
+  font-size: 1.5vw;
+  transform: translate(-50%, -50%);
+}
+
+.table1 {
+  position: absolute;
+  top: 44.5%;
+  left: 3.3%;
+  width: 62.5%;
+  height: 48.5%;
+  color: #fff;
+}
+
+.table2 {
+  position: absolute;
+  top: 44.5%;
+  left: 67.3%;
+  width: 29.5%;
+  height: 19.5%;
+  color: #fff;
+}
+
+.table3 {
+  position: absolute;
+  top: 73.5%;
+  left: 67.3%;
+  width: 29.5%;
+  height: 19.5%;
+  color: #fff;
+}
+
+.scrollTableItem {
+  display: inline-block;
+  width: calc(100% / 6);
+  text-align: center;
+  padding: 14px 0;
+  color: #4e99c5
+}
+
+.chart1 {
+  position: absolute;
+  top: 16%;
+  left: 30%;
+  width: 35.5%;
+  height: 21.5%;
+}
+
+.chart2 {
+  position: absolute;
+  top: 16%;
+  left: 67.3%;
+  width: 29%;
+  height: 21%;
+}
+
+
+</style>
diff --git a/hw-ui/src/views/board/warehouse/fifthFloor.vue b/hw-ui/src/views/board/warehouse/fifthFloor.vue
index 0a59ba1e..1b8e1b30 100644
--- a/hw-ui/src/views/board/warehouse/fifthFloor.vue
+++ b/hw-ui/src/views/board/warehouse/fifthFloor.vue
@@ -1,65 +1,12 @@
 <template>
   <div class="app-container">
-    <div class="warehouse"></div>
     <div class="headTitle">京源智能仓储监控平台</div>
     <div v-for="(i,k) in title"
          :style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'"
-         class="title">
+         class="title"
+    >
       {{ i }}
     </div>
-    <div class="table1">
-      <div style="background-color: #1077bc19">
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          任务编号
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          任务类型
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          物料名称
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          库位编号
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          时间
-        </div>
-      </div>
-      <vue-seamless-scroll
-        :class-option="scrollTableOption"
-        :data="scrollTableData"
-        class="case-item"
-        style="height: calc(100% - 30px);overflow: hidden;"
-      >
-        <div
-          v-for="(item, index) in scrollTableData"
-          :key="index"
-        >
-          <div :style='"background-color:" + ((index % 2 === 0)? "#1077bc19":"#1077bc05") '>
-            <div
-              class="scrollTableItem">
-              {{ item.value1 }}
-            </div>
-            <div
-              class="scrollTableItem">
-              {{ item.value2 }}
-            </div>
-            <div
-              class="scrollTableItem">
-              {{ item.value3 }}
-            </div>
-            <div
-              class="scrollTableItem">
-              {{ item.value4 }}
-            </div>
-            <div
-              class="scrollTableItem">
-              {{ item.value5 }}
-            </div>
-          </div>
-        </div>
-      </vue-seamless-scroll>
-    </div>
     <div class="chart1">
       <HighChart key="chart1" ref="chart1"></HighChart>
     </div>
@@ -72,30 +19,40 @@
     <div class="chart4">
       <HighChart key="chart4" ref="chart4"></HighChart>
     </div>
-    <div class="chart5">
-      <Chart key="chart5" ref="chart5"></Chart>
-    </div>
-    <div class="chart6">
-      <Chart key="chart6" ref="chart6"></Chart>
-    </div>
 
-    <div class="num1 num1_1" style="top: 11.9%;left: 17.4%;color:#5fc2f2">1</div>
-    <div class="num1 num1_2" style="top: 11.9%;left:20.9%;color:#5fc2f2">0</div>
-    <div class="num1 num1_3" style="top: 11.9%;left:24.4%;color:#5fc2f2">0</div>
-    <div class="num1 num1_4" style="top: 11.9%;left:27.9%;color:#5fc2f2">0</div>
-    <div class="num1 num1_5" style="top: 11.9%;left:50%;color:#59ee7b">1</div>
-    <div class="num1 num1_6" style="top: 11.9%;left:53.5%;color:#59ee7b">0</div>
-    <div class="num1 num1_7" style="top: 11.9%;left:57%;color:#59ee7b">0</div>
-    <div class="num1 num1_8" style="top: 11.9%;left:60.5%;color:#59ee7b">0</div>
+    <div class="num1 num1_1" style="top: 11.9%;left: 13.4%;color:#5fc2f2">1</div>
+    <div class="num1 num1_2" style="top: 11.9%;left:15.7%;color:#5fc2f2">0</div>
+    <div class="num1 num1_3" style="top: 11.9%;left:18%;color:#5fc2f2">0</div>
+    <div class="num1 num1_4" style="top: 11.9%;left:20.4%;color:#5fc2f2">0</div>
+
+    <div class="num1 num1_5" style="top: 11.9%;left:32.2%;color:#59ee7b">1</div>
+    <div class="num1 num1_6" style="top: 11.9%;left:34.6%;color:#59ee7b">0</div>
+    <div class="num1 num1_7" style="top: 11.9%;left:36.9%;color:#59ee7b">0</div>
+    <div class="num1 num1_8" style="top: 11.9%;left:39.2%;color:#59ee7b">0</div>
+
     <div class="num1 num1_9" style="top: 11.9%;left:82.5%;color:#f60008">1</div>
     <div class="num1 num1_10" style="top: 11.9%;left:86.1%;color:#f60008">0</div>
     <div class="num1 num1_11" style="top: 11.9%;left:89.6%;color:#f60008">0</div>
     <div class="num1 num1_12" style="top: 11.9%;left:93.1%;color:#f60008">0</div>
+
+    <div class="num1 num1_13" style="top: 11.9%;left:82.5%;color:#f60008">1</div>
+    <div class="num1 num1_14" style="top: 11.9%;left:86.1%;color:#f60008">0</div>
+    <div class="num1 num1_15" style="top: 11.9%;left:89.6%;color:#f60008">0</div>
+    <div class="num1 num1_16" style="top: 11.9%;left:93.1%;color:#f60008">0</div>
+
+    <div class="num1 num1_17" style="top: 11.9%;left:82.5%;color:#f60008">1</div>
+    <div class="num1 num1_18" style="top: 11.9%;left:86.1%;color:#f60008">0</div>
+    <div class="num1 num1_19" style="top: 11.9%;left:89.6%;color:#f60008">0</div>
+    <div class="num1 num1_20" style="top: 11.9%;left:93.1%;color:#f60008">0</div>
+
   </div>
 </template>
 
+<!--// 柱状图 每个烘房耗电量 x轴 保留 - 后的 y轴 expend-->
+<!--  质量接口 柱状图 +折线图 合格率和数量   -->
+
 <script>
-import vueSeamlessScroll from "vue-seamless-scroll";
+import vueSeamlessScroll from 'vue-seamless-scroll'
 import Chart from '@/components/board/Chart'
 import HighChart from '@/components/board/HighChart'
 import * as echarts from 'echarts'
@@ -114,60 +71,36 @@ export default {
         '原料库出库数量:',
         '辅料库出库数量:',
         '半成品入库数量:',
-        '库存占比',
-        '调度任务',
-        '成品库可用库存占比',
-        '成品库订单库存统计',
+        '辅料库出库数量:',
+        '半成品入库数量:',
+        '库存占比'
       ],
       titlePosition: [
         {
           top: 11.5,
-          left: 7.5
+          left: 3.5
         },
         {
           top: 11.5,
-          left: 40
+          left: 22.5
         },
         {
           top: 11.5,
-          left: 72.5
+          left: 41.3
+        },
+        {
+          top: 11.5,
+          left: 60.3
+        },
+        {
+          top: 11.5,
+          left: 79.1
         },
         {
           top: 19.4,
           left: 5.5
-        },
-        {
-          top: 59.8,
-          left: 5.5
-        },
-        {
-          top: 59.8,
-          left: 37
-        },
-        {
-          top: 59.8,
-          left: 68.5
-        },
-      ],
-      scrollTableOption: {
-        step: 0.5, // 数值越大速度滚动越快
-        limitMoveNum: 22, // 开始无缝滚动的数据量 this.dataList.length
-        hoverStop: true, // 是否开启鼠标悬停stop
-        direction: 1, // 0向下 1向上 2向左 3向右
-        openWatch: true, // 开启数据实时监控刷新dom
-        singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
-        singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
-        waitTime: 0,
-      },
-      scrollTableData: Array(100).fill('').map(function (i, k) {
-        return {
-          value1: k + 1,
-          value2: '出库',
-          value3: '物料1',
-          value4: '000' + k,
-          value5: '2024.03.04',
         }
-      }),
+      ]
     }
   },
   mounted() {
@@ -186,20 +119,20 @@ export default {
         animation: false,
         backgroundColor: null,
         events: {
-          load: function () {
+          load: function() {
             let each = Highcharts.each,
-              points = this.series[0].points;
-            each(points, function (p, i) {
+              points = this.series[0].points
+            each(points, function(p, i) {
               p.graphic.attr({
                 translateY: -p.shapeArgs.ran
-              });
+              })
               p.graphic.side1.attr({
                 translateY: -p.shapeArgs.ran
-              });
+              })
               p.graphic.side2.attr({
                 translateY: -p.shapeArgs.ran
-              });
-            });
+              })
+            })
           }
         },
         options3d: {
@@ -223,15 +156,15 @@ export default {
           size: 200,
           dataLabels: {
             enabled: true,
-            formatter: function () {
-              return this.point.options.name + '<br>' + this.point.options.h + '%';
+            formatter: function() {
+              return this.point.options.name + '<br>' + this.point.options.h + '%'
             }
           },
           showInLegend: false,
           point: {
             events: {
-              legendItemClick: function (e) {
-                return false; // 直接 return false 即可禁用图例点击事件
+              legendItemClick: function(e) {
+                return false // 直接 return false 即可禁用图例点击事件
               }
             }
           }
@@ -296,20 +229,20 @@ export default {
         animation: false,
         backgroundColor: null,
         events: {
-          load: function () {
+          load: function() {
             let each = Highcharts.each,
-              points = this.series[0].points;
-            each(points, function (p, i) {
+              points = this.series[0].points
+            each(points, function(p, i) {
               p.graphic.attr({
                 translateY: -p.shapeArgs.ran
-              });
+              })
               p.graphic.side1.attr({
                 translateY: -p.shapeArgs.ran
-              });
+              })
               p.graphic.side2.attr({
                 translateY: -p.shapeArgs.ran
-              });
-            });
+              })
+            })
           }
         },
         options3d: {
@@ -333,15 +266,15 @@ export default {
           size: 200,
           dataLabels: {
             enabled: true,
-            formatter: function () {
-              return this.point.options.name + '<br>' + this.point.options.h + '%';
+            formatter: function() {
+              return this.point.options.name + '<br>' + this.point.options.h + '%'
             }
           },
           showInLegend: false,
           point: {
             events: {
-              legendItemClick: function (e) {
-                return false; // 直接 return false 即可禁用图例点击事件
+              legendItemClick: function(e) {
+                return false // 直接 return false 即可禁用图例点击事件
               }
             }
           }
@@ -406,20 +339,20 @@ export default {
         animation: false,
         backgroundColor: null,
         events: {
-          load: function () {
+          load: function() {
             let each = Highcharts.each,
-              points = this.series[0].points;
-            each(points, function (p, i) {
+              points = this.series[0].points
+            each(points, function(p, i) {
               p.graphic.attr({
                 translateY: -p.shapeArgs.ran
-              });
+              })
               p.graphic.side1.attr({
                 translateY: -p.shapeArgs.ran
-              });
+              })
               p.graphic.side2.attr({
                 translateY: -p.shapeArgs.ran
-              });
-            });
+              })
+            })
           }
         },
         options3d: {
@@ -443,15 +376,15 @@ export default {
           size: 200,
           dataLabels: {
             enabled: true,
-            formatter: function () {
-              return this.point.options.name + '<br>' + this.point.options.h + '%';
+            formatter: function() {
+              return this.point.options.name + '<br>' + this.point.options.h + '%'
             }
           },
           showInLegend: false,
           point: {
             events: {
-              legendItemClick: function (e) {
-                return false; // 直接 return false 即可禁用图例点击事件
+              legendItemClick: function(e) {
+                return false // 直接 return false 即可禁用图例点击事件
               }
             }
           }
@@ -516,20 +449,20 @@ export default {
         animation: false,
         backgroundColor: null,
         events: {
-          load: function () {
+          load: function() {
             let each = Highcharts.each,
-              points = this.series[0].points;
-            each(points, function (p, i) {
+              points = this.series[0].points
+            each(points, function(p, i) {
               p.graphic.attr({
                 translateY: -p.shapeArgs.ran
-              });
+              })
               p.graphic.side1.attr({
                 translateY: -p.shapeArgs.ran
-              });
+              })
               p.graphic.side2.attr({
                 translateY: -p.shapeArgs.ran
-              });
-            });
+              })
+            })
           }
         },
         options3d: {
@@ -553,15 +486,15 @@ export default {
           size: 200,
           dataLabels: {
             enabled: true,
-            formatter: function () {
-              return this.point.options.name + '<br>' + this.point.options.h + '%';
+            formatter: function() {
+              return this.point.options.name + '<br>' + this.point.options.h + '%'
             }
           },
           showInLegend: false,
           point: {
             events: {
-              legendItemClick: function (e) {
-                return false; // 直接 return false 即可禁用图例点击事件
+              legendItemClick: function(e) {
+                return false // 直接 return false 即可禁用图例点击事件
               }
             }
           }
@@ -610,157 +543,12 @@ export default {
           ].sort((a, b) => a.y - b.y)
         }]
     })
-    this.$refs.chart5.setData({
-      title: {
-        x: 'center',
-        y: 'center',
-        text: "75%",
-        textStyle: {
-          color: '#ccc',
-          fontSize: 2 * vw,
-        },
-      },
-      series: [
-        {
-          type: "pie",
-          radius: ["47.5%", "55%"],
-          center: ["50%", "50%"],
-          startAngle: 225,
-          endAngle: -45,
-          color: ['#fa9800', "transparent"],
-          data: [
-            {
-              value: 75,
-              name: ''
-            },
-            {
-              value: 25,
-              name: ''
-            },
-          ],
-          label: {
-            show: false
-          },
-          labelLine: {
-            normal: {
-              show: false,
-            },
-          },
-        },
-      ],
-    })
-    this.$refs.chart6.setData({
-      tooltip: {
-        trigger: "item",
-      },
-      grid: {
-        borderWidth: 0,
-        top: "10%",
-        left: "10%",
-        right: "10%",
-        bottom: "10%",
-      },
-      yAxis: {
-        type: "category",
-        axisLabel: {
-          margin: 10,
-          color: "#ffffff63",
-        },
-
-        axisTick: {
-          show: true,
-          lineStyle: {
-            color: "#ffffff1f",
-          },
-        },
-        splitLine: {
-          show: true,
-          lineStyle: {
-            type: 'dashed',
-            color: "#ffffff1f",
-          },
-        },
-        axisLine: {
-          lineStyle: {
-            color: "#fff3",
-            width: 2,
-          },
-        },
-        data: ['物料1', '物料2', '物料3'],
-      },
-      xAxis: {
-        type: "value",
-        axisLabel: {
-          margin: 10,
-          color: "#ffffff63",
-        },
-        axisLine: {
-          show: false,
-        },
-        axisTick: {
-          show: true,
-          lineStyle: {
-            color: "#ffffff1f",
-          },
-        },
-        splitLine: {
-          show: true,
-          lineStyle: {
-            type: 'dashed',
-            color: "#ffffff1f",
-          },
-        },
-      },
-      series: [
-        {
-          name: "",
-          type: "bar",
-          barWidth: "40%",
-          itemStyle: {
-
-            color: new echarts.graphic.LinearGradient(
-              0,
-              0,
-              1,
-              0,
-              [
-                {
-                  offset: 0,
-                  color: "#0a2ad7",
-                },
-                {
-                  offset: 1,
-                  color: "#138dd7",
-                },
-              ],
-              false
-            ),
-          },
-          data: [1, 2, 3],
-        },
-        {
-          name: "",
-          type: "pictorialBar",
-          barWidth: "40%",
-          symbolSize: [5, '100%'],
-          symbolPosition: 'end',
-          symbolOffset: [3, 0],
-          barGap: '-100%',
-          itemStyle: {
-            color: '#138dd7'
-          },
-          data: [1, 2, 3],
-        },
-      ]
-    })
 
     window.onresize = () => {
       this.$refs.chart1.resize()
       this.$refs.chart2.resize()
       this.$refs.chart3.resize()
       this.$refs.chart4.resize()
-      this.$refs.chart5.chart.resize()
-      this.$refs.chart6.chart.resize()
     }
   },
   methods: {}
@@ -815,22 +603,6 @@ export default {
   letter-spacing: 2px;
 }
 
-.table1 {
-  position: absolute;
-  top: 62.9%;
-  left: 3.4%;
-  width: 30.2%;
-  height: 30%;
-  color: #fff;
-}
-
-.scrollTableItem {
-  display: inline-block;
-  width: calc(100% / 5);
-  text-align: center;
-  padding: 14px 0;
-  color: #4e99c5
-}
 
 .chart1 {
   position: absolute;
@@ -850,36 +622,20 @@ export default {
 
 .chart3 {
   position: absolute;
-  top: 22.5%;
-  left: 49.6%;
+  top: 62.5%;
+  left: 3.4%;
   width: 23%;
   height: 32%;
 }
 
 .chart4 {
   position: absolute;
-  top: 22.5%;
-  left: 72.7%;
+  top: 62.5%;
+  left: 26.5%;
   width: 23%;
   height: 32%;
 }
 
-.chart5 {
-  position: absolute;
-  top: 60.7%;
-  left: 40%;
-  width: 20vw;
-  height: 20vw;
-}
-
-.chart6 {
-  position: absolute;
-  top: 63%;
-  left: 66.5%;
-  width: 30%;
-  height: 32%;
-}
-
 .span {
   position: absolute;
   transform: translateY(-50%);
diff --git a/hw-ui/src/views/board/warehouse/fifthFloor1.vue b/hw-ui/src/views/board/warehouse/fifthFloor1.vue
new file mode 100644
index 00000000..5fe920f6
--- /dev/null
+++ b/hw-ui/src/views/board/warehouse/fifthFloor1.vue
@@ -0,0 +1,892 @@
+<template>
+  <div class="app-container">
+    <div class="warehouse"></div>
+    <div class="headTitle">京源智能仓储监控平台</div>
+    <div v-for="(i,k) in title"
+         :style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'"
+         class="title">
+      {{ i }}
+    </div>
+    <div class="table1">
+      <div style="background-color: #1077bc19">
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          任务编号
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          任务类型
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          物料名称
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          库位编号
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          时间
+        </div>
+      </div>
+      <vue-seamless-scroll
+        :class-option="scrollTableOption"
+        :data="scrollTableData"
+        class="case-item"
+        style="height: calc(100% - 30px);overflow: hidden;"
+      >
+        <div
+          v-for="(item, index) in scrollTableData"
+          :key="index"
+        >
+          <div :style='"background-color:" + ((index % 2 === 0)? "#1077bc19":"#1077bc05") '>
+            <div
+              class="scrollTableItem">
+              {{ item.value1 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value2 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value3 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value4 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value5 }}
+            </div>
+          </div>
+        </div>
+      </vue-seamless-scroll>
+    </div>
+    <div class="chart1">
+      <HighChart key="chart1" ref="chart1"></HighChart>
+    </div>
+    <div class="chart2">
+      <HighChart key="chart2" ref="chart2"></HighChart>
+    </div>
+    <div class="chart3">
+      <HighChart key="chart3" ref="chart3"></HighChart>
+    </div>
+    <div class="chart4">
+      <HighChart key="chart4" ref="chart4"></HighChart>
+    </div>
+    <div class="chart5">
+      <Chart key="chart5" ref="chart5"></Chart>
+    </div>
+    <div class="chart6">
+      <Chart key="chart6" ref="chart6"></Chart>
+    </div>
+
+    <div class="num1 num1_1" style="top: 11.9%;left: 17.4%;color:#5fc2f2">1</div>
+    <div class="num1 num1_2" style="top: 11.9%;left:20.9%;color:#5fc2f2">0</div>
+    <div class="num1 num1_3" style="top: 11.9%;left:24.4%;color:#5fc2f2">0</div>
+    <div class="num1 num1_4" style="top: 11.9%;left:27.9%;color:#5fc2f2">0</div>
+    <div class="num1 num1_5" style="top: 11.9%;left:50%;color:#59ee7b">1</div>
+    <div class="num1 num1_6" style="top: 11.9%;left:53.5%;color:#59ee7b">0</div>
+    <div class="num1 num1_7" style="top: 11.9%;left:57%;color:#59ee7b">0</div>
+    <div class="num1 num1_8" style="top: 11.9%;left:60.5%;color:#59ee7b">0</div>
+    <div class="num1 num1_9" style="top: 11.9%;left:82.5%;color:#f60008">1</div>
+    <div class="num1 num1_10" style="top: 11.9%;left:86.1%;color:#f60008">0</div>
+    <div class="num1 num1_11" style="top: 11.9%;left:89.6%;color:#f60008">0</div>
+    <div class="num1 num1_12" style="top: 11.9%;left:93.1%;color:#f60008">0</div>
+  </div>
+</template>
+
+<script>
+import vueSeamlessScroll from "vue-seamless-scroll";
+import Chart from '@/components/board/Chart'
+import HighChart from '@/components/board/HighChart'
+import * as echarts from 'echarts'
+
+const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
+export default {
+  name: 'Board1',
+  components: {
+    vueSeamlessScroll,
+    Chart,
+    HighChart
+  },
+  data() {
+    return {
+      title: [
+        '原料库出库数量:',
+        '辅料库出库数量:',
+        '半成品入库数量:',
+        '库存占比',
+        '调度任务',
+        '成品库可用库存占比',
+        '成品库订单库存统计',
+      ],
+      titlePosition: [
+        {
+          top: 11.5,
+          left: 7.5
+        },
+        {
+          top: 11.5,
+          left: 40
+        },
+        {
+          top: 11.5,
+          left: 72.5
+        },
+        {
+          top: 19.4,
+          left: 5.5
+        },
+        {
+          top: 59.8,
+          left: 5.5
+        },
+        {
+          top: 59.8,
+          left: 37
+        },
+        {
+          top: 59.8,
+          left: 68.5
+        },
+      ],
+      scrollTableOption: {
+        step: 0.5, // 数值越大速度滚动越快
+        limitMoveNum: 22, // 开始无缝滚动的数据量 this.dataList.length
+        hoverStop: true, // 是否开启鼠标悬停stop
+        direction: 1, // 0向下 1向上 2向左 3向右
+        openWatch: true, // 开启数据实时监控刷新dom
+        singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
+        singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
+        waitTime: 0,
+      },
+      scrollTableData: Array(100).fill('').map(function (i, k) {
+        return {
+          value1: k + 1,
+          value2: '出库',
+          value3: '物料1',
+          value4: '000' + k,
+          value5: '2024.03.04',
+        }
+      }),
+    }
+  },
+  mounted() {
+    this.$refs.chart1.setData({
+      title: {
+        text: '原料库存占比',
+        style: {
+          color: '#fff'
+        }
+      },
+      credits: {
+        enabled: false
+      },
+      chart: {
+        type: 'pie',
+        animation: false,
+        backgroundColor: null,
+        events: {
+          load: function () {
+            let each = Highcharts.each,
+              points = this.series[0].points;
+            each(points, function (p, i) {
+              p.graphic.attr({
+                translateY: -p.shapeArgs.ran
+              });
+              p.graphic.side1.attr({
+                translateY: -p.shapeArgs.ran
+              });
+              p.graphic.side2.attr({
+                translateY: -p.shapeArgs.ran
+              });
+            });
+          }
+        },
+        options3d: {
+          enabled: true,
+          alpha: 60,
+          beta: 0
+        }
+      },
+      legend: {
+        reversed: true,
+        itemStyle: {
+          color: '#fff'
+        }
+      },
+      plotOptions: {
+        pie: {
+          allowPointSelect: false,
+          cursor: 'pointer',
+          depth: 35,
+          startAngle: 45,
+          size: 200,
+          dataLabels: {
+            enabled: true,
+            formatter: function () {
+              return this.point.options.name + '<br>' + this.point.options.h + '%';
+            }
+          },
+          showInLegend: false,
+          point: {
+            events: {
+              legendItemClick: function (e) {
+                return false; // 直接 return false 即可禁用图例点击事件
+              }
+            }
+          }
+        }
+      },
+      series: [
+        {
+          type: 'pie',
+          name: 'Browser share',
+          data: [
+            {
+              'name': '材料1',
+              y: 30.0,
+              h: 30.0
+            },
+            {
+              name: '材料2',
+              y: 26.8,
+              h: 26.8
+            },
+            {
+              'name': '材料3',
+              y: 15,
+              h: 15
+            },
+            {
+              name: '材料4',
+              y: 12.8,
+              h: 12.8
+            },
+            {
+              'name': '材料5',
+              y: 8.5,
+              h: 8.5
+            },
+            {
+              'name': '材料6',
+              y: 6.2,
+              h: 6.2
+            },
+            {
+              'name': '材料7',
+              y: 0.7,
+              h: 0.7
+            }
+          ].sort((a, b) => a.y - b.y)
+        }]
+    })
+    this.$refs.chart2.setData({
+      title: {
+        text: '原料库存占比',
+        style: {
+          color: '#fff'
+        }
+      },
+      credits: {
+        enabled: false
+      },
+      chart: {
+        type: 'pie',
+        startAngle: Math.PI / 6,
+        animation: false,
+        backgroundColor: null,
+        events: {
+          load: function () {
+            let each = Highcharts.each,
+              points = this.series[0].points;
+            each(points, function (p, i) {
+              p.graphic.attr({
+                translateY: -p.shapeArgs.ran
+              });
+              p.graphic.side1.attr({
+                translateY: -p.shapeArgs.ran
+              });
+              p.graphic.side2.attr({
+                translateY: -p.shapeArgs.ran
+              });
+            });
+          }
+        },
+        options3d: {
+          enabled: true,
+          alpha: 60,
+          beta: 0
+        }
+      },
+      legend: {
+        reversed: true,
+        itemStyle: {
+          color: '#fff'
+        }
+      },
+      plotOptions: {
+        pie: {
+          allowPointSelect: false,
+          cursor: 'pointer',
+          depth: 35,
+          startAngle: 45,
+          size: 200,
+          dataLabels: {
+            enabled: true,
+            formatter: function () {
+              return this.point.options.name + '<br>' + this.point.options.h + '%';
+            }
+          },
+          showInLegend: false,
+          point: {
+            events: {
+              legendItemClick: function (e) {
+                return false; // 直接 return false 即可禁用图例点击事件
+              }
+            }
+          }
+        }
+      },
+      series: [
+        {
+          type: 'pie',
+          name: 'Browser share',
+          data: [
+            {
+              'name': '材料1',
+              y: 30.0,
+              h: 30.0
+            },
+            {
+              name: '材料2',
+              y: 26.8,
+              h: 26.8
+            },
+            {
+              'name': '材料3',
+              y: 15,
+              h: 15
+            },
+            {
+              name: '材料4',
+              y: 12.8,
+              h: 12.8
+            },
+            {
+              'name': '材料5',
+              y: 8.5,
+              h: 8.5
+            },
+            {
+              'name': '材料6',
+              y: 6.2,
+              h: 6.2
+            },
+            {
+              'name': '材料7',
+              y: 0.7,
+              h: 0.7
+            }
+          ].sort((a, b) => a.y - b.y)
+        }]
+    })
+    this.$refs.chart3.setData({
+      title: {
+        text: '原料库存占比',
+        style: {
+          color: '#fff'
+        }
+      },
+      credits: {
+        enabled: false
+      },
+      chart: {
+        type: 'pie',
+        startAngle: Math.PI / 6,
+        animation: false,
+        backgroundColor: null,
+        events: {
+          load: function () {
+            let each = Highcharts.each,
+              points = this.series[0].points;
+            each(points, function (p, i) {
+              p.graphic.attr({
+                translateY: -p.shapeArgs.ran
+              });
+              p.graphic.side1.attr({
+                translateY: -p.shapeArgs.ran
+              });
+              p.graphic.side2.attr({
+                translateY: -p.shapeArgs.ran
+              });
+            });
+          }
+        },
+        options3d: {
+          enabled: true,
+          alpha: 60,
+          beta: 0
+        }
+      },
+      legend: {
+        reversed: true,
+        itemStyle: {
+          color: '#fff'
+        }
+      },
+      plotOptions: {
+        pie: {
+          allowPointSelect: false,
+          cursor: 'pointer',
+          depth: 35,
+          startAngle: 45,
+          size: 200,
+          dataLabels: {
+            enabled: true,
+            formatter: function () {
+              return this.point.options.name + '<br>' + this.point.options.h + '%';
+            }
+          },
+          showInLegend: false,
+          point: {
+            events: {
+              legendItemClick: function (e) {
+                return false; // 直接 return false 即可禁用图例点击事件
+              }
+            }
+          }
+        }
+      },
+      series: [
+        {
+          type: 'pie',
+          name: 'Browser share',
+          data: [
+            {
+              'name': '材料1',
+              y: 30.0,
+              h: 30.0
+            },
+            {
+              name: '材料2',
+              y: 26.8,
+              h: 26.8
+            },
+            {
+              'name': '材料3',
+              y: 15,
+              h: 15
+            },
+            {
+              name: '材料4',
+              y: 12.8,
+              h: 12.8
+            },
+            {
+              'name': '材料5',
+              y: 8.5,
+              h: 8.5
+            },
+            {
+              'name': '材料6',
+              y: 6.2,
+              h: 6.2
+            },
+            {
+              'name': '材料7',
+              y: 0.7,
+              h: 0.7
+            }
+          ].sort((a, b) => a.y - b.y)
+        }]
+    })
+    this.$refs.chart4.setData({
+      title: {
+        text: '原料库存占比',
+        style: {
+          color: '#fff'
+        }
+      },
+      credits: {
+        enabled: false
+      },
+      chart: {
+        type: 'pie',
+        startAngle: Math.PI / 6,
+        animation: false,
+        backgroundColor: null,
+        events: {
+          load: function () {
+            let each = Highcharts.each,
+              points = this.series[0].points;
+            each(points, function (p, i) {
+              p.graphic.attr({
+                translateY: -p.shapeArgs.ran
+              });
+              p.graphic.side1.attr({
+                translateY: -p.shapeArgs.ran
+              });
+              p.graphic.side2.attr({
+                translateY: -p.shapeArgs.ran
+              });
+            });
+          }
+        },
+        options3d: {
+          enabled: true,
+          alpha: 60,
+          beta: 0
+        }
+      },
+      legend: {
+        reversed: true,
+        itemStyle: {
+          color: '#fff'
+        }
+      },
+      plotOptions: {
+        pie: {
+          allowPointSelect: false,
+          cursor: 'pointer',
+          depth: 35,
+          startAngle: 45,
+          size: 200,
+          dataLabels: {
+            enabled: true,
+            formatter: function () {
+              return this.point.options.name + '<br>' + this.point.options.h + '%';
+            }
+          },
+          showInLegend: false,
+          point: {
+            events: {
+              legendItemClick: function (e) {
+                return false; // 直接 return false 即可禁用图例点击事件
+              }
+            }
+          }
+        }
+      },
+      series: [
+        {
+          type: 'pie',
+          name: 'Browser share',
+          data: [
+            {
+              'name': '材料1',
+              y: 30.0,
+              h: 30.0
+            },
+            {
+              name: '材料2',
+              y: 26.8,
+              h: 26.8
+            },
+            {
+              'name': '材料3',
+              y: 15,
+              h: 15
+            },
+            {
+              name: '材料4',
+              y: 12.8,
+              h: 12.8
+            },
+            {
+              'name': '材料5',
+              y: 8.5,
+              h: 8.5
+            },
+            {
+              'name': '材料6',
+              y: 6.2,
+              h: 6.2
+            },
+            {
+              'name': '材料7',
+              y: 0.7,
+              h: 0.7
+            }
+          ].sort((a, b) => a.y - b.y)
+        }]
+    })
+    this.$refs.chart5.setData({
+      title: {
+        x: 'center',
+        y: 'center',
+        text: "75%",
+        textStyle: {
+          color: '#ccc',
+          fontSize: 2 * vw,
+        },
+      },
+      series: [
+        {
+          type: "pie",
+          radius: ["47.5%", "55%"],
+          center: ["50%", "50%"],
+          startAngle: 225,
+          endAngle: -45,
+          color: ['#fa9800', "transparent"],
+          data: [
+            {
+              value: 75,
+              name: ''
+            },
+            {
+              value: 25,
+              name: ''
+            },
+          ],
+          label: {
+            show: false
+          },
+          labelLine: {
+            normal: {
+              show: false,
+            },
+          },
+        },
+      ],
+    })
+    this.$refs.chart6.setData({
+      tooltip: {
+        trigger: "item",
+      },
+      grid: {
+        borderWidth: 0,
+        top: "10%",
+        left: "10%",
+        right: "10%",
+        bottom: "10%",
+      },
+      yAxis: {
+        type: "category",
+        axisLabel: {
+          margin: 10,
+          color: "#ffffff63",
+        },
+
+        axisTick: {
+          show: true,
+          lineStyle: {
+            color: "#ffffff1f",
+          },
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            type: 'dashed',
+            color: "#ffffff1f",
+          },
+        },
+        axisLine: {
+          lineStyle: {
+            color: "#fff3",
+            width: 2,
+          },
+        },
+        data: ['物料1', '物料2', '物料3'],
+      },
+      xAxis: {
+        type: "value",
+        axisLabel: {
+          margin: 10,
+          color: "#ffffff63",
+        },
+        axisLine: {
+          show: false,
+        },
+        axisTick: {
+          show: true,
+          lineStyle: {
+            color: "#ffffff1f",
+          },
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            type: 'dashed',
+            color: "#ffffff1f",
+          },
+        },
+      },
+      series: [
+        {
+          name: "",
+          type: "bar",
+          barWidth: "40%",
+          itemStyle: {
+
+            color: new echarts.graphic.LinearGradient(
+              0,
+              0,
+              1,
+              0,
+              [
+                {
+                  offset: 0,
+                  color: "#0a2ad7",
+                },
+                {
+                  offset: 1,
+                  color: "#138dd7",
+                },
+              ],
+              false
+            ),
+          },
+          data: [1, 2, 3],
+        },
+        {
+          name: "",
+          type: "pictorialBar",
+          barWidth: "40%",
+          symbolSize: [5, '100%'],
+          symbolPosition: 'end',
+          symbolOffset: [3, 0],
+          barGap: '-100%',
+          itemStyle: {
+            color: '#138dd7'
+          },
+          data: [1, 2, 3],
+        },
+      ]
+    })
+
+    window.onresize = () => {
+      this.$refs.chart1.resize()
+      this.$refs.chart2.resize()
+      this.$refs.chart3.resize()
+      this.$refs.chart4.resize()
+      this.$refs.chart5.chart.resize()
+      this.$refs.chart6.chart.resize()
+    }
+  },
+  methods: {}
+}
+</script>
+<style lang="less" scoped>
+
+.app-container {
+  background-image: url("../../../assets/board/warehouseBg3_1.jpg");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+.warehouse {
+  background-image: url("../../../assets/board/warehouse1.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  width: 18%;
+  height: 27.8%;
+  top: 65%;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.headTitle {
+  position: absolute;
+  top: 5%;
+  left: 50%;
+  transform: translate(-50%, -100%);
+  font-size: 1.5vw;
+  color: #d6eaed;
+  letter-spacing: 10px;
+}
+
+.num1 {
+  position: absolute;
+  font-size: 1.5vw;
+  transform: translate(-50%, -50%);
+}
+
+.title {
+  position: absolute;
+  transform: translateY(-50%);
+  color: #dddddd;
+  font-size: 1vw;
+  letter-spacing: 2px;
+}
+
+.table1 {
+  position: absolute;
+  top: 62.9%;
+  left: 3.4%;
+  width: 30.2%;
+  height: 30%;
+  color: #fff;
+}
+
+.scrollTableItem {
+  display: inline-block;
+  width: calc(100% / 5);
+  text-align: center;
+  padding: 14px 0;
+  color: #4e99c5
+}
+
+.chart1 {
+  position: absolute;
+  top: 22.5%;
+  left: 3.4%;
+  width: 23%;
+  height: 32%;
+}
+
+.chart2 {
+  position: absolute;
+  top: 22.5%;
+  left: 26.5%;
+  width: 23%;
+  height: 32%;
+}
+
+.chart3 {
+  position: absolute;
+  top: 22.5%;
+  left: 49.6%;
+  width: 23%;
+  height: 32%;
+}
+
+.chart4 {
+  position: absolute;
+  top: 22.5%;
+  left: 72.7%;
+  width: 23%;
+  height: 32%;
+}
+
+.chart5 {
+  position: absolute;
+  top: 60.7%;
+  left: 40%;
+  width: 20vw;
+  height: 20vw;
+}
+
+.chart6 {
+  position: absolute;
+  top: 63%;
+  left: 66.5%;
+  width: 30%;
+  height: 32%;
+}
+
+.span {
+  position: absolute;
+  transform: translateY(-50%);
+}
+
+.span1 {
+  position: absolute;
+  transform: translate(-50%, -50%);
+}
+</style>
diff --git a/hw-ui/src/views/board/warehouse/firstFloor.vue b/hw-ui/src/views/board/warehouse/firstFloor.vue
new file mode 100644
index 00000000..a5a5afb7
--- /dev/null
+++ b/hw-ui/src/views/board/warehouse/firstFloor.vue
@@ -0,0 +1,672 @@
+<template>
+  <div class="app-container">
+    <div class="headTitle">京源智能仓储监控平台</div>
+    <div v-for="(i,k) in title"
+         :style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'"
+         class="title"
+    >
+      {{ i }}
+    </div>
+    <div class="chart1">
+      <HighChart key="chart1" ref="chart1"></HighChart>
+    </div>
+    <div class="chart2">
+      <HighChart key="chart2" ref="chart2"></HighChart>
+    </div>
+    <div class="chart3">
+      <Chart key="chart3" ref="chart3"></Chart>
+    </div>
+
+    <div class="table1">
+      <div style="background-color: #1077bc19">
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          任务编号
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          任务类型
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          物料名称
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          库位编号
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          时间
+        </div>
+      </div>
+      <vue-seamless-scroll
+        :class-option="scrollTableOption"
+        :data="scrollTableData"
+        class="case-item"
+        style="height: calc(100% - 30px);overflow: hidden;"
+      >
+        <div
+          v-for="(item, index) in scrollTableData"
+          :key="index"
+        >
+          <div :style='"background-color:" + ((index % 2 === 0)? "#1077bc19":"#1077bc05") '>
+            <div
+              class="scrollTableItem">
+              {{ item.value1 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value2 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value3 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value4 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value5 }}
+            </div>
+          </div>
+        </div>
+      </vue-seamless-scroll>
+    </div>
+
+    <div class="table2">
+      <div style="background-color: #1077bc19">
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          订单
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          物料
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          物料需求
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          Bom分解
+        </div>
+        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
+          时间
+        </div>
+      </div>
+      <vue-seamless-scroll
+        :class-option="scrollTableOption"
+        :data="scrollTableData"
+        class="case-item"
+        style="height: calc(100% - 30px);overflow: hidden;"
+      >
+        <div
+          v-for="(item, index) in scrollTableData"
+          :key="index"
+        >
+          <div :style='"background-color:" + ((index % 2 === 0)? "#1077bc19":"#1077bc05") '>
+            <div
+              class="scrollTableItem">
+              {{ item.value1 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value2 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value3 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value4 }}
+            </div>
+            <div
+              class="scrollTableItem">
+              {{ item.value5 }}
+            </div>
+          </div>
+        </div>
+      </vue-seamless-scroll>
+    </div>
+
+    <div class="num1 num1_1" style="top: 11.9%;left: 13.4%;color:#5fc2f2">1</div>
+    <div class="num1 num1_2" style="top: 11.9%;left:15.7%;color:#5fc2f2">0</div>
+    <div class="num1 num1_3" style="top: 11.9%;left:18%;color:#5fc2f2">0</div>
+    <div class="num1 num1_4" style="top: 11.9%;left:20.4%;color:#5fc2f2">0</div>
+
+    <div class="num1 num1_5" style="top: 11.9%;left:32.2%;color:#59ee7b">1</div>
+    <div class="num1 num1_6" style="top: 11.9%;left:34.6%;color:#59ee7b">0</div>
+    <div class="num1 num1_7" style="top: 11.9%;left:36.9%;color:#59ee7b">0</div>
+    <div class="num1 num1_8" style="top: 11.9%;left:39.2%;color:#59ee7b">0</div>
+
+    <div class="num1 num1_9" style="top: 11.9%;left:82.5%;color:#f60008">1</div>
+    <div class="num1 num1_10" style="top: 11.9%;left:86.1%;color:#f60008">0</div>
+    <div class="num1 num1_11" style="top: 11.9%;left:89.6%;color:#f60008">0</div>
+    <div class="num1 num1_12" style="top: 11.9%;left:93.1%;color:#f60008">0</div>
+
+    <div class="num1 num1_13" style="top: 11.9%;left:82.5%;color:#f60008">1</div>
+    <div class="num1 num1_14" style="top: 11.9%;left:86.1%;color:#f60008">0</div>
+    <div class="num1 num1_15" style="top: 11.9%;left:89.6%;color:#f60008">0</div>
+    <div class="num1 num1_16" style="top: 11.9%;left:93.1%;color:#f60008">0</div>
+
+    <div class="num1 num1_17" style="top: 11.9%;left:82.5%;color:#f60008">1</div>
+    <div class="num1 num1_18" style="top: 11.9%;left:86.1%;color:#f60008">0</div>
+    <div class="num1 num1_19" style="top: 11.9%;left:89.6%;color:#f60008">0</div>
+    <div class="num1 num1_20" style="top: 11.9%;left:93.1%;color:#f60008">0</div>
+
+  </div>
+</template>
+
+<!--// 柱状图 每个烘房耗电量 x轴 保留 - 后的 y轴 expend-->
+<!--  质量接口 柱状图 +折线图 合格率和数量   -->
+
+<script>
+import vueSeamlessScroll from 'vue-seamless-scroll'
+import Chart from '@/components/board/Chart'
+import HighChart from '@/components/board/HighChart'
+import * as echarts from 'echarts'
+
+const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
+export default {
+  name: 'Board1',
+  components: {
+    vueSeamlessScroll,
+    Chart,
+    HighChart
+  },
+  data() {
+    return {
+      title: [
+        '原料库出库数量:',
+        '辅料库出库数量:',
+        '半成品入库数量:',
+        '辅料库出库数量:',
+        '半成品入库数量:',
+        '库存占比'
+      ],
+      titlePosition: [
+        {
+          top: 11.5,
+          left: 3.5
+        },
+        {
+          top: 11.5,
+          left: 22.5
+        },
+        {
+          top: 11.5,
+          left: 41.3
+        },
+        {
+          top: 11.5,
+          left: 60.3
+        },
+        {
+          top: 11.5,
+          left: 79.1
+        },
+        {
+          top: 19.4,
+          left: 5.5
+        }
+      ],
+      scrollTableOption: {
+        step: 0.5, // 数值越大速度滚动越快
+        limitMoveNum: 22, // 开始无缝滚动的数据量 this.dataList.length
+        hoverStop: true, // 是否开启鼠标悬停stop
+        direction: 1, // 0向下 1向上 2向左 3向右
+        openWatch: true, // 开启数据实时监控刷新dom
+        singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
+        singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
+        waitTime: 0,
+      },
+      scrollTableData: Array(100).fill('').map(function (i, k) {
+        return {
+          value1: k + 1,
+          value2: '出库',
+          value3: '物料1',
+          value4: '000' + k,
+          value5: '2024.03.04',
+        }
+      }),
+    }
+  },
+  mounted() {
+    this.$refs.chart1.setData({
+      title: {
+        text: '原料库存占比',
+        style: {
+          color: '#fff'
+        }
+      },
+      credits: {
+        enabled: false
+      },
+      chart: {
+        type: 'pie',
+        animation: false,
+        backgroundColor: null,
+        events: {
+          load: function() {
+            let each = Highcharts.each,
+              points = this.series[0].points
+            each(points, function(p, i) {
+              p.graphic.attr({
+                translateY: -p.shapeArgs.ran
+              })
+              p.graphic.side1.attr({
+                translateY: -p.shapeArgs.ran
+              })
+              p.graphic.side2.attr({
+                translateY: -p.shapeArgs.ran
+              })
+            })
+          }
+        },
+        options3d: {
+          enabled: true,
+          alpha: 60,
+          beta: 0
+        }
+      },
+      legend: {
+        reversed: true,
+        itemStyle: {
+          color: '#fff'
+        }
+      },
+      plotOptions: {
+        pie: {
+          allowPointSelect: false,
+          cursor: 'pointer',
+          depth: 35,
+          startAngle: 45,
+          size: 200,
+          dataLabels: {
+            enabled: true,
+            formatter: function() {
+              return this.point.options.name + '<br>' + this.point.options.h + '%'
+            }
+          },
+          showInLegend: false,
+          point: {
+            events: {
+              legendItemClick: function(e) {
+                return false // 直接 return false 即可禁用图例点击事件
+              }
+            }
+          }
+        }
+      },
+      series: [
+        {
+          type: 'pie',
+          name: 'Browser share',
+          data: [
+            {
+              'name': '材料1',
+              y: 30.0,
+              h: 30.0
+            },
+            {
+              name: '材料2',
+              y: 26.8,
+              h: 26.8
+            },
+            {
+              'name': '材料3',
+              y: 15,
+              h: 15
+            },
+            {
+              name: '材料4',
+              y: 12.8,
+              h: 12.8
+            },
+            {
+              'name': '材料5',
+              y: 8.5,
+              h: 8.5
+            },
+            {
+              'name': '材料6',
+              y: 6.2,
+              h: 6.2
+            },
+            {
+              'name': '材料7',
+              y: 0.7,
+              h: 0.7
+            }
+          ].sort((a, b) => a.y - b.y)
+        }]
+    })
+    this.$refs.chart2.setData({
+      title: {
+        text: '原料库存占比',
+        style: {
+          color: '#fff'
+        }
+      },
+      credits: {
+        enabled: false
+      },
+      chart: {
+        type: 'pie',
+        startAngle: Math.PI / 6,
+        animation: false,
+        backgroundColor: null,
+        events: {
+          load: function() {
+            let each = Highcharts.each,
+              points = this.series[0].points
+            each(points, function(p, i) {
+              p.graphic.attr({
+                translateY: -p.shapeArgs.ran
+              })
+              p.graphic.side1.attr({
+                translateY: -p.shapeArgs.ran
+              })
+              p.graphic.side2.attr({
+                translateY: -p.shapeArgs.ran
+              })
+            })
+          }
+        },
+        options3d: {
+          enabled: true,
+          alpha: 60,
+          beta: 0
+        }
+      },
+      legend: {
+        reversed: true,
+        itemStyle: {
+          color: '#fff'
+        }
+      },
+      plotOptions: {
+        pie: {
+          allowPointSelect: false,
+          cursor: 'pointer',
+          depth: 35,
+          startAngle: 45,
+          size: 200,
+          dataLabels: {
+            enabled: true,
+            formatter: function() {
+              return this.point.options.name + '<br>' + this.point.options.h + '%'
+            }
+          },
+          showInLegend: false,
+          point: {
+            events: {
+              legendItemClick: function(e) {
+                return false // 直接 return false 即可禁用图例点击事件
+              }
+            }
+          }
+        }
+      },
+      series: [
+        {
+          type: 'pie',
+          name: 'Browser share',
+          data: [
+            {
+              'name': '材料1',
+              y: 30.0,
+              h: 30.0
+            },
+            {
+              name: '材料2',
+              y: 26.8,
+              h: 26.8
+            },
+            {
+              'name': '材料3',
+              y: 15,
+              h: 15
+            },
+            {
+              name: '材料4',
+              y: 12.8,
+              h: 12.8
+            },
+            {
+              'name': '材料5',
+              y: 8.5,
+              h: 8.5
+            },
+            {
+              'name': '材料6',
+              y: 6.2,
+              h: 6.2
+            },
+            {
+              'name': '材料7',
+              y: 0.7,
+              h: 0.7
+            }
+          ].sort((a, b) => a.y - b.y)
+        }]
+    })
+    this.$refs.chart3.setData({
+      tooltip: {
+        trigger: "axis",
+        axisPointer: {
+          // 坐标轴指示器，坐标轴触发有效
+          type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
+        },
+      },
+      grid: {
+        left: "2%",
+        right: "4%",
+        bottom: "14%",
+        top: "16%",
+        containLabel: true,
+      },
+      legend: {
+        x: 'center',
+        top: 12,
+        textStyle: {
+          color: "#fff",
+        },
+        itemWidth: 12,
+        itemHeight: 10,
+        // itemGap: 35
+      },
+      xAxis: {
+        type: "category",
+        data: ["01-01", "01-02", "01-03", "01-04", "01-05", "01-06", "01-07"],
+        axisLine: {
+          lineStyle: {
+            color: "white",
+          },
+        },
+        axisLabel: {
+          // interval: 0,
+          // rotate: 40,
+          textStyle: {
+            fontFamily: "Microsoft YaHei",
+          },
+        },
+      },
+
+      yAxis: {
+        type: "value",
+        max: "1200",
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: "white",
+          },
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: "rgba(255,255,255,0.3)",
+          },
+        },
+        axisLabel: {},
+      },
+      series: [
+        {
+          name: "入库",
+          type: "bar",
+          barWidth: "15%",
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: "#fccb05",
+                },
+                {
+                  offset: 1,
+                  color: "#f5804d",
+                },
+              ]),
+            },
+          },
+          data: [400, 400, 300, 300, 300, 400, 400, 400, 300],
+        },
+        {
+          name: "出库",
+          type: "bar",
+          barWidth: "15%",
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: "#8bd46e",
+                },
+                {
+                  offset: 1,
+                  color: "#09bcb7",
+                },
+              ]),
+            },
+          },
+          data: [400, 500, 500, 500, 500, 400, 400, 500, 500],
+        },
+      ],
+    })
+
+    window.onresize = () => {
+      this.$refs.chart1.resize()
+      this.$refs.chart2.resize()
+      this.$refs.chart3.resize()
+    }
+  },
+  methods: {}
+}
+</script>
+<style lang="less" scoped>
+
+.app-container {
+  background-image: url("../../../assets/board/warehouseBg3.jpg");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+.warehouse {
+  background-image: url("../../../assets/board/warehouse1.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  width: 18%;
+  height: 27.8%;
+  top: 65%;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.headTitle {
+  position: absolute;
+  top: 5%;
+  left: 50%;
+  transform: translate(-50%, -100%);
+  font-size: 1.5vw;
+  color: #d6eaed;
+  letter-spacing: 10px;
+}
+
+.num1 {
+  position: absolute;
+  font-size: 1.5vw;
+  transform: translate(-50%, -50%);
+}
+
+.title {
+  position: absolute;
+  transform: translateY(-50%);
+  color: #dddddd;
+  font-size: 1vw;
+  letter-spacing: 2px;
+}
+
+
+.chart1 {
+  position: absolute;
+  top: 22.5%;
+  left: 3.4%;
+  width: 23%;
+  height: 32%;
+}
+
+.chart2 {
+  position: absolute;
+  top: 22.5%;
+  left: 26.5%;
+  width: 23%;
+  height: 32%;
+}
+
+.chart3 {
+  position: absolute;
+  top: 22.5%;
+  left: 50.4%;
+  width: 46%;
+  height: 32%;
+}
+
+
+.span {
+  position: absolute;
+  transform: translateY(-50%);
+}
+
+.span1 {
+  position: absolute;
+  transform: translate(-50%, -50%);
+}
+
+.table1 {
+  position: absolute;
+  top: 52.9%;
+  left: 3.4%;
+  width: 45.7%;
+  height: 40%;
+  color: #fff;
+}
+.table2 {
+  position: absolute;
+  top: 52.9%;
+  left: 50.4%;
+  width: 45.7%;
+  height: 40%;
+  color: #fff;
+}
+
+.scrollTableItem {
+  display: inline-block;
+  width: calc(100% / 5);
+  text-align: center;
+  padding: 14px 0;
+  color: #4e99c5
+}
+
+</style>
diff --git a/hw-ui/src/views/login.vue b/hw-ui/src/views/login.vue
index d8792a4a..0fa80e14 100644
--- a/hw-ui/src/views/login.vue
+++ b/hw-ui/src/views/login.vue
@@ -1,7 +1,8 @@
 <template>
   <div class="login">
     <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
-      <h3 class="title">京源环保MES系统</h3>
+      <h3 class="title" v-if="!isStationId">京源环保MES系统</h3>
+      <h3 class="title" v-else>京源环保车间MES系统</h3>
       <el-form-item prop="username">
         <el-input
           v-model="loginForm.username"
@@ -267,7 +268,7 @@ export default {
   justify-content: center;
   align-items: center;
   height: 100%;
-  background-image: url("../assets/images/login-background.jpg");
+  background-image: url("../assets/images/loginBg.jpg");
   background-size: cover;
 }