From 825295fc08ca988c67af6b895ab0281c96494f55 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Sun, 18 Feb 2024 09:10:18 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=94=9F=E4=BA=A7=E7=95=8C?=
 =?UTF-8?q?=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 hw-ui/src/views/board/fifthFloor/index.vue    | 834 ++++++++++++++++++
 .../src/views/board/fourthFloor/assemble.vue  | 660 ++++++++++++++
 hw-ui/src/views/board/fourthFloor/weld.vue    | 833 +++++++++++++++++
 3 files changed, 2327 insertions(+)
 create mode 100644 hw-ui/src/views/board/fifthFloor/index.vue
 create mode 100644 hw-ui/src/views/board/fourthFloor/assemble.vue
 create mode 100644 hw-ui/src/views/board/fourthFloor/weld.vue

diff --git a/hw-ui/src/views/board/fifthFloor/index.vue b/hw-ui/src/views/board/fifthFloor/index.vue
new file mode 100644
index 0000000..15b72a7
--- /dev/null
+++ b/hw-ui/src/views/board/fifthFloor/index.vue
@@ -0,0 +1,834 @@
+<template>
+  <div class="app-container">
+    <div class="headTitle">京源环保生产管理系统</div>
+
+    <div class="chartBox chartBox1">
+      <div class="title">工单信息</div>
+      <div class="chart">
+        <div class="form1">
+          <el-form label-position="right" label-width="80px" :model="form1">
+            <el-form-item label="工单编号">
+              <el-input v-model="form1.name"></el-input>
+            </el-form-item>
+            <el-form-item label="物料编号">
+              <el-input v-model="form1.region"></el-input>
+            </el-form-item>
+            <el-form-item label="物料名称">
+              <el-input v-model="form1.type"></el-input>
+            </el-form-item>
+            <el-form-item label="扫码时间">
+              <el-input v-model="form1.type"></el-input>
+            </el-form-item>
+            <el-form-item label="产品型号">
+              <el-input v-model="form1.type"></el-input>
+            </el-form-item>
+          </el-form>
+          <div style="text-align: center">
+            <el-button type="primary">图纸下发</el-button>
+          </div>
+        </div>
+
+      </div>
+      <div class="chart1">
+        <Chart ref="chart1_1"></Chart>
+      </div>
+      <div class="chart2">
+        <Chart ref="chart1_2"></Chart>
+      </div>
+      <div class="chart3">
+        <Chart ref="chart1_3"></Chart>
+      </div>
+      <div class="chart4">
+        <Chart ref="chart1_4"></Chart>
+      </div>
+    </div>
+
+    <div class="chartBox chartBox2">
+      <div class="title">库存统计</div>
+      <div class="chart">
+        <Chart ref="chart2"></Chart>
+      </div>
+    </div>
+
+    <div class="chartBox chartBox3">
+      <div class="title">生产派工</div>
+      <div class="chart">
+        <div class="whiteTable">
+          <el-table
+            :data="tableData"
+            style="width: 100%"
+            max-height="19.13vw"
+            :cell-style="{textAlign:'center'}"
+            :header-cell-style="{textAlign:'center'}"
+
+          >
+            <el-table-column
+              label="序号"
+              type="index"
+              width="50"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="workOrderNumber"
+              label="工单编号"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="planNum"
+              label="计划"
+              width="80"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="realNum"
+              label="实际"
+              width="80"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="quantityNum"
+              label="差异"
+              width="80"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="startTime"
+              label="开始时间"
+              width="200"
+            >
+            </el-table-column>
+            <el-table-column
+              label="操作"
+              width="120"
+            >
+              <template slot-scope="scope">
+                <el-button
+                  type="text"
+                  size="small"
+                >
+                  开始
+                </el-button>
+                <el-button
+                  type="text"
+                  size="small"
+                >
+                  退库
+                </el-button>
+                <el-button
+                  type="text"
+                  size="small"
+                  style="color: #f56c6c"
+                >
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </div>
+
+    <div class="chartBox chartBox4">
+      <div class="title">当日产量</div>
+      <div class="chart">
+        <Chart ref="chart4"></Chart>
+      </div>
+    </div>
+
+    <div class="bottom">
+      <el-row>
+        <el-button type="primary">首页</el-button>
+        <el-button type="success">板材领料</el-button>
+        <el-button type="info">SOP预览</el-button>
+        <el-button type="danger">退出</el-button>
+      </el-row>
+    </div>
+
+  </div>
+</template>
+
+<script>
+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: {
+    Chart
+  },
+  data() {
+    return {
+      form: {
+        name: '',
+        region: '',
+        date1: '',
+        date2: '',
+        delivery: false,
+        type: [],
+        resource: '',
+        desc: ''
+      },
+      form1: {
+        name: '',
+        region: '',
+        type: ''
+      },
+      tableData: [
+        {
+          workOrderNumber: '202401221413',
+          planNum: '1000',
+          realNum: '800',
+          quantityNum: '200',
+          startTime: '2024-01-01',
+        },
+        {
+          workOrderNumber: '202401221413',
+          planNum: '1000',
+          realNum: '800',
+          quantityNum: '200',
+          startTime: '2024-01-01',
+        },
+        {
+          workOrderNumber: '202401221413',
+          planNum: '1000',
+          realNum: '800',
+          quantityNum: '200',
+          startTime: '2024-01-01',
+        },
+      ],
+    }
+  },
+  mounted() {
+    this.$refs.chart1_1.setData({
+      series: [
+        {
+          type: "pie",
+          clockWise: false,
+          radius: ['60%', '75%'],
+          itemStyle: {
+            normal: {
+              label: {
+                show: false,
+              },
+              labelLine: {
+                show: false,
+              },
+              shadowBlur: 0,
+              shadowColor: "#aa8e2c",
+            },
+          },
+          hoverAnimation: false,
+          center: ["50%", "50%"],
+          data: [
+            {
+              value: 100,
+              label: {
+                normal: {
+                  rich: {
+                    a: {
+                      color: "#aa8e2c",
+                      align: "center",
+                      fontSize: 1.1 * vw,
+                      fontWeight: "bold",
+                    },
+                    b: {
+                      color: "#fff",
+                      align: "center",
+                      fontSize: 0.9 * vw,
+                    },
+                  },
+                  formatter: function (params) {
+                    return (
+                      "{a|" +
+                      100 +
+                      "}" +
+                      "\n{b|计划}"
+                    );
+                  },
+                  position: "center",
+                  show: true,
+                  textStyle: {
+                    fontSize: "14",
+                    fontWeight: "normal",
+                    color: "#fff",
+                  },
+                },
+              },
+              itemStyle: {
+                normal: {
+                  color: "#aa8e2c",
+                  shadowColor: "#aa8e2c",
+                  shadowBlur: 0,
+                },
+              },
+            },
+            {
+              value: 0,
+              name: "invisible",
+              itemStyle: {
+                normal: {
+                  color: "#412a4e",
+                },
+                emphasis: {
+                  color: "#412a4e",
+                },
+              },
+            },
+          ],
+        },
+      ],
+    })
+    this.$refs.chart1_2.setData({
+      series: [
+        {
+          type: "pie",
+          clockWise: false,
+          radius: ['60%', '75%'],
+          itemStyle: {
+            normal: {
+              label: {
+                show: false,
+              },
+              labelLine: {
+                show: false,
+              },
+              shadowBlur: 0,
+              shadowColor: "#389af4",
+            },
+          },
+          hoverAnimation: false,
+          center: ["50%", "50%"],
+          data: [
+            {
+              value: 100,
+              label: {
+                normal: {
+                  rich: {
+                    a: {
+                      color: "#389af4",
+                      align: "center",
+                      fontSize: 1.1 * vw,
+                      fontWeight: "bold",
+                    },
+                    b: {
+                      color: "#fff",
+                      align: "center",
+                      fontSize: 0.9 * vw,
+                    },
+                  },
+                  formatter: function (params) {
+                    return (
+                      "{a|" +
+                      100 +
+                      "}" +
+                      "\n{b|实际}"
+                    );
+                  },
+                  position: "center",
+                  show: true,
+                  textStyle: {
+                    fontSize: "14",
+                    fontWeight: "normal",
+                    color: "#fff",
+                  },
+                },
+              },
+              itemStyle: {
+                normal: {
+                  color: "#389af4",
+                  shadowColor: "#389af4",
+                  shadowBlur: 0,
+                },
+              },
+            },
+            {
+              value: 0,
+              name: "invisible",
+              itemStyle: {
+                normal: {
+                  color: "#412a4e",
+                },
+                emphasis: {
+                  color: "#412a4e",
+                },
+              },
+            },
+          ],
+        },
+      ],
+    })
+    this.$refs.chart1_3.setData({
+      series: [
+        {
+          type: "pie",
+          clockWise: false,
+          radius: ['60%', '75%'],
+          itemStyle: {
+            normal: {
+              label: {
+                show: false,
+              },
+              labelLine: {
+                show: false,
+              },
+              shadowBlur: 0,
+              shadowColor: "#ff0000",
+            },
+          },
+          hoverAnimation: false,
+          center: ["50%", "50%"],
+          data: [
+            {
+              value: 100,
+              label: {
+                normal: {
+                  rich: {
+                    a: {
+                      color: "#ff0000",
+                      align: "center",
+                      fontSize: 1.1 * vw,
+                      fontWeight: "bold",
+                    },
+                    b: {
+                      color: "#fff",
+                      align: "center",
+                      fontSize: 0.9 * vw,
+                    },
+                  },
+                  formatter: function (params) {
+                    return (
+                      "{a|" +
+                      100 +
+                      "}" +
+                      "\n{b|差异}"
+                    );
+                  },
+                  position: "center",
+                  show: true,
+                  textStyle: {
+                    fontSize: "14",
+                    fontWeight: "normal",
+                    color: "#fff",
+                  },
+                },
+              },
+              itemStyle: {
+                normal: {
+                  color: "#b32b2b",
+                  shadowColor: "#ff0000",
+                  shadowBlur: 0,
+                },
+              },
+            },
+            {
+              value: 0,
+              name: "invisible",
+              itemStyle: {
+                normal: {
+                  color: "#412a4e",
+                },
+                emphasis: {
+                  color: "#412a4e",
+                },
+              },
+            },
+          ],
+        },
+      ],
+    })
+    this.$refs.chart1_4.setData({
+      series: [
+        {
+          type: "pie",
+          clockWise: false,
+          radius: ['60%', '75%'],
+          itemStyle: {
+            normal: {
+              label: {
+                show: false,
+              },
+              labelLine: {
+                show: false,
+              },
+              shadowBlur: 0,
+              shadowColor: "#00ff00",
+            },
+          },
+          hoverAnimation: false,
+          center: ["50%", "50%"],
+          data: [
+            {
+              value: 100,
+              label: {
+                normal: {
+                  rich: {
+                    a: {
+                      color: "#00ff00",
+                      align: "center",
+                      fontSize: 1.1 * vw,
+                      fontWeight: "bold",
+                    },
+                    b: {
+                      color: "#fff",
+                      align: "center",
+                      fontSize: 0.9 * vw,
+                    },
+                  },
+                  formatter: function (params) {
+                    return (
+                      "{a|" +
+                      100 +
+                      "%}" +
+                      "\n{b|完成率}"
+                    );
+                  },
+                  position: "center",
+                  show: true,
+                  textStyle: {
+                    fontSize: "14",
+                    fontWeight: "normal",
+                    color: "#fff",
+                  },
+                },
+              },
+              itemStyle: {
+                normal: {
+                  color: "#3ac13a",
+                  shadowColor: "#00ff00",
+                  shadowBlur: 0,
+                },
+              },
+            },
+            {
+              value: 0,
+              name: "invisible",
+              itemStyle: {
+                normal: {
+                  color: "#412a4e",
+                },
+                emphasis: {
+                  color: "#412a4e",
+                },
+              },
+            },
+          ],
+        },
+      ],
+    })
+    this.$refs.chart2.setData({
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          // 坐标轴指示器，坐标轴触发有效
+          type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+        }
+      },
+      grid: {
+        left: '0',
+        right: '4%',
+        bottom: '0',
+        top: 20,
+        containLabel: true
+      },
+      xAxis: {
+        type: 'category',
+        data: [1, 2, 3, 4, 5, 6],
+        axisLine: {
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        axisLabel: {
+          // interval: 0,
+          // rotate: 40,
+          textStyle: {
+            fontFamily: 'Microsoft YaHei'
+          }
+        }
+      },
+
+      yAxis: {
+        type: 'value',
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        splitLine: {
+          show: false
+        },
+        axisLabel: {}
+      },
+      series: [
+        {
+          name: '数量',
+          label: {
+            normal: {
+              show: true,
+              position: 'top',
+              textStyle: {
+                color: '#a8aab0',
+                fontStyle: 'normal',
+                fontFamily: '微软雅黑',
+                fontSize: 0.75 * vw
+              }
+            }
+          },
+          type: 'bar',
+          barWidth: '30%',
+          barMaxWidth: 50,
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: '#39ffff'
+                },
+                {
+                  offset: 1,
+                  color: '#5affa6'
+                }
+              ])
+            }
+          },
+          data: [1, 2, 3, 4, 5, 6]
+        }
+      ]
+    })
+    this.$refs.chart4.setData({
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          // 坐标轴指示器，坐标轴触发有效
+          type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+        }
+      },
+      grid: {
+        left: '0',
+        right: '4%',
+        bottom: '0',
+        top: 20,
+        containLabel: true
+      },
+      xAxis: {
+        type: 'category',
+        data: [1, 2, 3, 4, 5, 6],
+        axisLine: {
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        axisLabel: {
+          // interval: 0,
+          // rotate: 40,
+          textStyle: {
+            fontFamily: 'Microsoft YaHei'
+          }
+        }
+      },
+
+      yAxis: {
+        type: 'value',
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        splitLine: {
+          show: false
+        },
+        axisLabel: {}
+      },
+      series: [
+        {
+          name: '数量',
+          label: {
+            normal: {
+              show: true,
+              position: 'top',
+              textStyle: {
+                color: '#a8aab0',
+                fontStyle: 'normal',
+                fontFamily: '微软雅黑',
+                fontSize: 0.75 * vw
+              }
+            }
+          },
+          type: 'bar',
+          barWidth: '30%',
+          barMaxWidth: 50,
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: '#39ffff'
+                },
+                {
+                  offset: 1,
+                  color: '#5affa6'
+                }
+              ])
+            }
+          },
+          data: [1, 2, 3, 4, 5, 6]
+        }
+      ]
+    })
+  },
+  methods: {}
+}
+</script>
+<style lang="less" scoped>
+
+.app-container {
+  background-image: url("../../../assets/board/bg.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;
+}
+
+.el-table {
+  background-color: #fff0;
+}
+
+.whiteTable {
+  /deep/ .el-table .el-table__header-wrapper th {
+    background-color: #fff0;
+  }
+
+  /deep/ .el-table tr {
+    background-color: #fff0;
+  }
+
+  /deep/ .el-table .cell {
+    color: #fff
+  }
+
+  /deep/ .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
+    background-color: #fff0;
+  }
+}
+
+.chartBox {
+  background-image: url("../../../assets/board/box.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  width: 46%;
+  height: 23.34vw;
+
+  .title {
+    position: absolute;
+    top: 8%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    font-size: 1.2vw;
+    color: #ccc;
+  }
+
+  .chart {
+    position: absolute;
+    top: 16%;
+    left: 1%;
+    width: 98%;
+    height: 82%;
+  }
+}
+
+.chartBox1 {
+  top: 10%;
+  left: 2%;
+
+  .chart1 {
+    position: absolute;
+    top: 16%;
+    left: 60%;
+    width: 20%;
+    height: 35%;
+  }
+
+  .chart2 {
+    position: absolute;
+    top: 16%;
+    left: 80%;
+    width: 20%;
+    height: 35%;
+  }
+
+  .chart3 {
+    position: absolute;
+    top: 55%;
+    left: 60%;
+    width: 20%;
+    height: 35%;
+  }
+
+  .chart4 {
+    position: absolute;
+    top: 55%;
+    left: 80%;
+    width: 20%;
+    height: 35%;
+  }
+}
+
+.chartBox2 {
+  top: 10%;
+  right: 2%;
+}
+
+.chartBox3 {
+  top: 53%;
+  left: 2%;
+}
+
+.chartBox4 {
+  top: 53%;
+  right: 2%;
+}
+
+.bottom {
+  position: absolute;
+  bottom: 1.5%;
+  left: 2%;
+}
+
+.form1 {
+  position: absolute;
+  width: 50%;
+  height: 100%;
+  top: 2%;
+  left: 2%;
+
+  /deep/ .el-form-item__label {
+    color: #fff;
+    font-weight: 500;
+  }
+
+  /deep/ .el-input__inner {
+    color: #fff;
+    background-color: #0000;
+    border: none;
+    border-bottom: 1px solid #fff9;
+    border-radius: 0;
+  }
+}
+</style>
diff --git a/hw-ui/src/views/board/fourthFloor/assemble.vue b/hw-ui/src/views/board/fourthFloor/assemble.vue
new file mode 100644
index 0000000..a03925d
--- /dev/null
+++ b/hw-ui/src/views/board/fourthFloor/assemble.vue
@@ -0,0 +1,660 @@
+<template>
+  <div class="app-container">
+    <div class="headTitle">京源环保生产管理系统</div>
+
+    <div class="chartBox chartBox1">
+      <div class="title">派工信息</div>
+      <div class="chart">
+        <div class="whiteTable">
+          <el-table
+            :data="tableData"
+            style="width: 100%"
+            max-height="19.13vw"
+            :cell-style="{textAlign:'center'}"
+            :header-cell-style="{textAlign:'center'}"
+          >
+            <el-table-column
+              label="序号"
+              type="index"
+              width="50"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="workOrderNumber"
+              label="工单编号"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="plan"
+              label="计划"
+              width="100"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="practical"
+              label="实际"
+              width="100"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="difference"
+              label="差异"
+              width="100"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="deliveryTime"
+              label="交付时间"
+              width="150"
+            >
+            </el-table-column>
+            <el-table-column
+              label="操作"
+              width="120"
+            >
+              <template slot-scope="scope">
+                <el-button
+                  type="text"
+                  size="small"
+                >
+                  条码打印
+                </el-button>
+                <el-button
+                  type="text"
+                  size="small"
+                >
+                  开始
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </div>
+
+    <div class="chartBox chartBox2">
+      <div class="title">库存统计</div>
+      <div class="chart">
+        <Chart ref="chart2"></Chart>
+      </div>
+    </div>
+
+    <div class="chartBox chartBox3">
+      <div class="title">计划明细</div>
+      <div class="chart">
+        <div class="whiteTable">
+          <el-table
+            :data="tableData1"
+            style="width: 100%"
+            max-height="19.13vw"
+            :cell-style="{textAlign:'center'}"
+            :header-cell-style="{textAlign:'center'}"
+
+          >
+            <el-table-column
+              label="序号"
+              type="index"
+              width="50"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="planNumber"
+              label="计划编号"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="workOrderNumber"
+              label="工单编号"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="startTime"
+              label="开始时间"
+              width="200"
+            >
+            </el-table-column>
+            <el-table-column
+              label="操作"
+              width="120"
+            >
+              <template slot-scope="scope">
+                <el-button
+                  type="text"
+                  size="small"
+                >
+                  装配
+                </el-button>
+                <el-button
+                  type="text"
+                  size="small"
+                  @click="getMaterials(scope) "
+                >
+                  领料
+                </el-button>
+                <el-button
+                  type="text"
+                  size="small"
+                >
+                  扫描
+                </el-button>
+                <el-button
+                  type="text"
+                  size="small"
+                >
+                  退料
+                </el-button>
+                <el-button
+                  type="text"
+                  size="small"
+                  style="color: #f56c6c"
+                >
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </div>
+
+    <div class="chartBox chartBox4">
+      <div class="title">当日产量</div>
+      <div class="chart">
+        <Chart ref="chart4"></Chart>
+      </div>
+    </div>
+
+    <div class="bottom">
+      <el-row>
+        <el-button type="primary">首页</el-button>
+        <el-button type="success">键盘</el-button>
+        <el-button type="info">最小化</el-button>
+        <el-button type="danger">退出</el-button>
+      </el-row>
+    </div>
+
+    <el-dialog
+      title="领料"
+      :visible.sync="dialogVisible"
+      width="40%">
+      <el-form ref="form" :model="form" label-width="80px">
+        <el-form-item label="生产计划">
+          <el-input v-model="form.planCode"></el-input>
+        </el-form-item>
+        <el-form-item label="成品" v-show="false">
+          <el-input v-model="form.productId"></el-input>
+        </el-form-item>
+        <el-form-item label="领料类型" v-show="false">
+          <el-select v-model="form.taskType" placeholder="请选择领料类型">
+            <el-option label="类型一" value="shanghai"></el-option>
+            <el-option label="类型二" value="beijing"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="领料仓库" >
+          <el-select v-model="form.warehouseId" placeholder="请选择领料仓库" @change="form.wmsRawOutstockDetailList =[]">
+            <el-option v-for="item in warehouseList" :label="item.warehouseName" :value="item.warehouseId"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="领料原因">
+          <el-input type="textarea" v-model="form.applyReason"></el-input>
+        </el-form-item>
+      </el-form>
+      <el-table
+        :data="form.wmsRawOutstockDetailList"
+        style="width: 100%"
+        max-height="19.13vw"
+        :cell-style="{textAlign:'center'}"
+        :header-cell-style="{textAlign:'center'}"
+      >
+        <el-table-column
+          label="物料编号"
+          prop="materialId"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="materialName"
+          label="物料名称"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="planAmount"
+          label="领取数量"
+          width="120"
+        >
+          <template slot-scope="scope">
+            <el-input-number
+              style="width: 100%"
+              controls-position="right"
+              v-model="scope.row.quantityAcquired"
+            >
+            </el-input-number>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          width="160"
+        >
+          <template slot="header" slot-scope="scope">
+            <el-input
+              v-model="searchMaterialValue"
+              size="mini"
+              @change="searchMaterial"
+              placeholder="输入物料名称搜索"/>
+          </template>
+          <template slot-scope="scope">
+            <el-button
+              type="text"
+              size="small"
+            >
+              删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div style="text-align: center;margin-top: 12px">
+        <el-button type="primary" @click="receiveMaterial">申请领料</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import Chart from '@/components/board/Chart'
+import * as echarts from 'echarts'
+import {getMaterialBoms,getWarehouses,applyRawOutstock} from'@/api/board/firstFloor'
+
+const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
+export default {
+  name: 'Board1',
+  components: {
+    Chart
+  },
+  data() {
+    return {
+      searchMaterialValue:'',
+      warehouseList:[],
+      form: {
+        warehouseId: '',
+        planCode: '',
+        applyReason: '',
+        productId:''||2,
+        planDetailCode:''||1,
+        taskType: '1',
+        wmsRawOutstockDetailList: []
+      },
+      form2: {
+        materialId: '',
+        materialName: '',
+        planAmount: '',
+        quantityAcquired:0,
+      },
+      dialogVisible: false,
+      addDialogVisible: false,
+      tableData: [
+        {
+          workOrderNumber: '202401221413',
+          plan: '1000',
+          practical: '800',
+          difference: '200',
+          deliveryTime: '2024-01-01',
+        },
+        {
+          workOrderNumber: '202401221413',
+          plan: '1000',
+          practical: '800',
+          difference: '200',
+          deliveryTime: '2024-01-01',
+        },
+        {
+          workOrderNumber: '202401221413',
+          plan: '1000',
+          practical: '800',
+          difference: '200',
+          deliveryTime: '2024-01-01',
+        }
+      ],
+      tableData1: [
+        {
+          workOrderNumber: '202401221413',
+          planNumber: '202401221413-1',
+          startTime: '2024-01-01',
+        },
+        {
+          workOrderNumber: '202401221413',
+          planNumber: '202401221413-2',
+          startTime: '2024-01-01',
+        },
+        {
+          workOrderNumber: '202401221413',
+          planNumber: '202401221413-3',
+          startTime: '2024-01-01',
+        },
+      ],
+    }
+  },
+  mounted() {
+    this.$refs.chart2.setData({
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          // 坐标轴指示器，坐标轴触发有效
+          type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+        }
+      },
+      grid: {
+        left: '0',
+        right: '4%',
+        bottom: '0',
+        top: 20,
+        containLabel: true
+      },
+      xAxis: {
+        type: 'category',
+        data: [1, 2, 3, 4, 5, 6],
+        axisLine: {
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        axisLabel: {
+          // interval: 0,
+          // rotate: 40,
+          textStyle: {
+            fontFamily: 'Microsoft YaHei'
+          }
+        }
+      },
+
+      yAxis: {
+        type: 'value',
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        splitLine: {
+          show: false
+        },
+        axisLabel: {}
+      },
+      series: [
+        {
+          name: '数量',
+          label: {
+            normal: {
+              show: true,
+              position: 'top',
+              textStyle: {
+                color: '#a8aab0',
+                fontStyle: 'normal',
+                fontFamily: '微软雅黑',
+                fontSize: 0.75 * vw
+              }
+            }
+          },
+          type: 'bar',
+          barWidth: '30%',
+          barMaxWidth: 50,
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: '#39ffff'
+                },
+                {
+                  offset: 1,
+                  color: '#5affa6'
+                }
+              ])
+            }
+          },
+          data: [1, 2, 3, 4, 5, 6]
+        }
+      ]
+    })
+    this.$refs.chart4.setData({
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          // 坐标轴指示器，坐标轴触发有效
+          type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+        }
+      },
+      grid: {
+        left: '0',
+        right: '4%',
+        bottom: '0',
+        top: 20,
+        containLabel: true
+      },
+      xAxis: {
+        type: 'category',
+        data: [1, 2, 3, 4, 5, 6],
+        axisLine: {
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        axisLabel: {
+          // interval: 0,
+          // rotate: 40,
+          textStyle: {
+            fontFamily: 'Microsoft YaHei'
+          }
+        }
+      },
+
+      yAxis: {
+        type: 'value',
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        splitLine: {
+          show: false
+        },
+        axisLabel: {}
+      },
+      series: [
+        {
+          name: '数量',
+          label: {
+            normal: {
+              show: true,
+              position: 'top',
+              textStyle: {
+                color: '#a8aab0',
+                fontStyle: 'normal',
+                fontFamily: '微软雅黑',
+                fontSize: 0.75 * vw
+              }
+            }
+          },
+          type: 'bar',
+          barWidth: '30%',
+          barMaxWidth: 50,
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: '#39ffff'
+                },
+                {
+                  offset: 1,
+                  color: '#5affa6'
+                }
+              ])
+            }
+          },
+          data: [1, 2, 3, 4, 5, 6]
+        }
+      ]
+    })
+  },
+  methods: {
+    getMaterials(val) {
+      this.searchMaterialValue = ''
+      this.dialogVisible = true
+      this.form = {
+        warehouseId: '',
+        planCode: val.row.planNumber,
+        productId:''||2,
+        planDetailCode:''||1,
+        applyReason: '',
+        taskType: '1',
+        wmsRawOutstockDetailList: []
+      }
+      getWarehouses({
+        warehouseFloor:1
+      }).then(e=>{
+        this.warehouseList = e.data
+        this.form.warehouseId = e.data[0]?.warehouseId
+      })
+      getMaterialBoms({
+        ancestors:1,
+      }).then(e=>{
+        this.form.wmsRawOutstockDetailList = e.data.map(r=>{
+          return {
+            materialId:r.materialId,
+            materialName:r.materialName,
+            planAmount:0,
+          }
+        })
+      })
+    },
+    addMaterialRequisition() {
+      this.addDialogVisible = false
+      this.form.wmsRawOutstockDetailList.push(this.form2)
+    },
+    receiveMaterial() {
+      applyRawOutstock(this.form).then(e=>{
+        console.log(e)
+        if(e.code === 200){
+          this.dialogVisible = false
+          this.$message({
+            message: '领料完成',
+            type: 'success'
+          });
+        }
+      })
+    },
+    searchMaterial(val){
+      console.log(val)
+      getMaterialBoms({
+        ancestors:1,
+        materialName:val
+      }).then(e=>{
+        this.form.wmsRawOutstockDetailList = e.data.map(r=>{
+          return {
+            materialId:r.materialId,
+            materialName:r.materialName,
+            planAmount:0,
+          }
+        })
+      })
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+
+.app-container {
+  background-image: url("../../../assets/board/bg.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;
+}
+
+.el-table {
+  background-color: #fff0;
+}
+
+.whiteTable {
+  /deep/ .el-table .el-table__header-wrapper th {
+    background-color: #fff0;
+  }
+
+  /deep/ .el-table tr {
+    background-color: #fff0;
+  }
+
+  /deep/ .el-table .cell {
+    color: #fff
+  }
+
+  /deep/ .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
+    background-color: #fff0;
+  }
+}
+
+.chartBox {
+  background-image: url("../../../assets/board/box.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  width: 46%;
+  height: 23.34vw;
+
+  .title {
+    position: absolute;
+    top: 8%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    font-size: 1.2vw;
+    color: #ccc;
+  }
+
+  .chart {
+    position: absolute;
+    top: 16%;
+    left: 1%;
+    width: 98%;
+    height: 82%;
+  }
+}
+
+.chartBox1 {
+  top: 10%;
+  left: 2%;
+}
+
+.chartBox2 {
+  top: 10%;
+  right: 2%;
+}
+
+.chartBox3 {
+  top: 53%;
+  left: 2%;
+}
+
+.chartBox4 {
+  top: 53%;
+  right: 2%;
+}
+
+.bottom {
+  position: absolute;
+  bottom: 1.5%;
+  left: 2%;
+}
+</style>
diff --git a/hw-ui/src/views/board/fourthFloor/weld.vue b/hw-ui/src/views/board/fourthFloor/weld.vue
new file mode 100644
index 0000000..836540c
--- /dev/null
+++ b/hw-ui/src/views/board/fourthFloor/weld.vue
@@ -0,0 +1,833 @@
+<template>
+  <div class="app-container">
+    <div class="headTitle">京源环保生产管理系统</div>
+
+    <div class="chartBox chartBox1">
+      <div class="title">工单信息</div>
+      <div class="chart">
+        <div class="form1">
+          <el-form label-position="right" label-width="80px" :model="form1">
+            <el-form-item label="工单编号">
+              <el-input v-model="form1.name"></el-input>
+            </el-form-item>
+            <el-form-item label="物料编号">
+              <el-input v-model="form1.region"></el-input>
+            </el-form-item>
+            <el-form-item label="物料名称">
+              <el-input v-model="form1.type"></el-input>
+            </el-form-item>
+            <el-form-item label="扫码时间">
+              <el-input v-model="form1.type"></el-input>
+            </el-form-item>
+            <el-form-item label="产品型号">
+              <el-input v-model="form1.type"></el-input>
+            </el-form-item>
+          </el-form>
+          <div style="text-align: center">
+            <el-button type="primary">图纸下发</el-button>
+          </div>
+        </div>
+
+      </div>
+      <div class="chart1">
+        <Chart ref="chart1_1"></Chart>
+      </div>
+      <div class="chart2">
+        <Chart ref="chart1_2"></Chart>
+      </div>
+      <div class="chart3">
+        <Chart ref="chart1_3"></Chart>
+      </div>
+      <div class="chart4">
+        <Chart ref="chart1_4"></Chart>
+      </div>
+    </div>
+
+    <div class="chartBox chartBox2">
+      <div class="title">库存统计</div>
+      <div class="chart">
+        <Chart ref="chart2"></Chart>
+      </div>
+    </div>
+
+    <div class="chartBox chartBox3">
+      <div class="title">生产派工</div>
+      <div class="chart">
+        <div class="whiteTable">
+          <el-table
+            :data="tableData"
+            style="width: 100%"
+            max-height="19.13vw"
+            :cell-style="{textAlign:'center'}"
+            :header-cell-style="{textAlign:'center'}"
+
+          >
+            <el-table-column
+              label="序号"
+              type="index"
+              width="50"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="workOrderNumber"
+              label="工单编号"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="planNum"
+              label="计划"
+              width="80"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="realNum"
+              label="实际"
+              width="80"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="quantityNum"
+              label="差异"
+              width="80"
+            >
+            </el-table-column>
+            <el-table-column
+              prop="startTime"
+              label="开始时间"
+              width="200"
+            >
+            </el-table-column>
+            <el-table-column
+              label="操作"
+              width="120"
+            >
+              <template slot-scope="scope">
+                <el-button
+                  type="text"
+                  size="small"
+                >
+                  开始
+                </el-button>
+                <el-button
+                  type="text"
+                  size="small"
+                >
+                  退库
+                </el-button>
+                <el-button
+                  type="text"
+                  size="small"
+                  style="color: #f56c6c"
+                >
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </div>
+
+    <div class="chartBox chartBox4">
+      <div class="title">当日产量</div>
+      <div class="chart">
+        <Chart ref="chart4"></Chart>
+      </div>
+    </div>
+
+    <div class="bottom">
+      <el-row>
+        <el-button type="primary">首页</el-button>
+        <el-button type="info">SOP预览</el-button>
+        <el-button type="danger">退出</el-button>
+      </el-row>
+    </div>
+
+  </div>
+</template>
+
+<script>
+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: {
+    Chart
+  },
+  data() {
+    return {
+      form: {
+        name: '',
+        region: '',
+        date1: '',
+        date2: '',
+        delivery: false,
+        type: [],
+        resource: '',
+        desc: ''
+      },
+      form1: {
+        name: '',
+        region: '',
+        type: ''
+      },
+      tableData: [
+        {
+          workOrderNumber: '202401221413',
+          planNum: '1000',
+          realNum: '800',
+          quantityNum: '200',
+          startTime: '2024-01-01',
+        },
+        {
+          workOrderNumber: '202401221413',
+          planNum: '1000',
+          realNum: '800',
+          quantityNum: '200',
+          startTime: '2024-01-01',
+        },
+        {
+          workOrderNumber: '202401221413',
+          planNum: '1000',
+          realNum: '800',
+          quantityNum: '200',
+          startTime: '2024-01-01',
+        },
+      ],
+    }
+  },
+  mounted() {
+    this.$refs.chart1_1.setData({
+      series: [
+        {
+          type: "pie",
+          clockWise: false,
+          radius: ['60%', '75%'],
+          itemStyle: {
+            normal: {
+              label: {
+                show: false,
+              },
+              labelLine: {
+                show: false,
+              },
+              shadowBlur: 0,
+              shadowColor: "#aa8e2c",
+            },
+          },
+          hoverAnimation: false,
+          center: ["50%", "50%"],
+          data: [
+            {
+              value: 100,
+              label: {
+                normal: {
+                  rich: {
+                    a: {
+                      color: "#aa8e2c",
+                      align: "center",
+                      fontSize: 1.1 * vw,
+                      fontWeight: "bold",
+                    },
+                    b: {
+                      color: "#fff",
+                      align: "center",
+                      fontSize: 0.9 * vw,
+                    },
+                  },
+                  formatter: function (params) {
+                    return (
+                      "{a|" +
+                      100 +
+                      "}" +
+                      "\n{b|计划}"
+                    );
+                  },
+                  position: "center",
+                  show: true,
+                  textStyle: {
+                    fontSize: "14",
+                    fontWeight: "normal",
+                    color: "#fff",
+                  },
+                },
+              },
+              itemStyle: {
+                normal: {
+                  color: "#aa8e2c",
+                  shadowColor: "#aa8e2c",
+                  shadowBlur: 0,
+                },
+              },
+            },
+            {
+              value: 0,
+              name: "invisible",
+              itemStyle: {
+                normal: {
+                  color: "#412a4e",
+                },
+                emphasis: {
+                  color: "#412a4e",
+                },
+              },
+            },
+          ],
+        },
+      ],
+    })
+    this.$refs.chart1_2.setData({
+      series: [
+        {
+          type: "pie",
+          clockWise: false,
+          radius: ['60%', '75%'],
+          itemStyle: {
+            normal: {
+              label: {
+                show: false,
+              },
+              labelLine: {
+                show: false,
+              },
+              shadowBlur: 0,
+              shadowColor: "#389af4",
+            },
+          },
+          hoverAnimation: false,
+          center: ["50%", "50%"],
+          data: [
+            {
+              value: 100,
+              label: {
+                normal: {
+                  rich: {
+                    a: {
+                      color: "#389af4",
+                      align: "center",
+                      fontSize: 1.1 * vw,
+                      fontWeight: "bold",
+                    },
+                    b: {
+                      color: "#fff",
+                      align: "center",
+                      fontSize: 0.9 * vw,
+                    },
+                  },
+                  formatter: function (params) {
+                    return (
+                      "{a|" +
+                      100 +
+                      "}" +
+                      "\n{b|实际}"
+                    );
+                  },
+                  position: "center",
+                  show: true,
+                  textStyle: {
+                    fontSize: "14",
+                    fontWeight: "normal",
+                    color: "#fff",
+                  },
+                },
+              },
+              itemStyle: {
+                normal: {
+                  color: "#389af4",
+                  shadowColor: "#389af4",
+                  shadowBlur: 0,
+                },
+              },
+            },
+            {
+              value: 0,
+              name: "invisible",
+              itemStyle: {
+                normal: {
+                  color: "#412a4e",
+                },
+                emphasis: {
+                  color: "#412a4e",
+                },
+              },
+            },
+          ],
+        },
+      ],
+    })
+    this.$refs.chart1_3.setData({
+      series: [
+        {
+          type: "pie",
+          clockWise: false,
+          radius: ['60%', '75%'],
+          itemStyle: {
+            normal: {
+              label: {
+                show: false,
+              },
+              labelLine: {
+                show: false,
+              },
+              shadowBlur: 0,
+              shadowColor: "#ff0000",
+            },
+          },
+          hoverAnimation: false,
+          center: ["50%", "50%"],
+          data: [
+            {
+              value: 100,
+              label: {
+                normal: {
+                  rich: {
+                    a: {
+                      color: "#ff0000",
+                      align: "center",
+                      fontSize: 1.1 * vw,
+                      fontWeight: "bold",
+                    },
+                    b: {
+                      color: "#fff",
+                      align: "center",
+                      fontSize: 0.9 * vw,
+                    },
+                  },
+                  formatter: function (params) {
+                    return (
+                      "{a|" +
+                      100 +
+                      "}" +
+                      "\n{b|差异}"
+                    );
+                  },
+                  position: "center",
+                  show: true,
+                  textStyle: {
+                    fontSize: "14",
+                    fontWeight: "normal",
+                    color: "#fff",
+                  },
+                },
+              },
+              itemStyle: {
+                normal: {
+                  color: "#b32b2b",
+                  shadowColor: "#ff0000",
+                  shadowBlur: 0,
+                },
+              },
+            },
+            {
+              value: 0,
+              name: "invisible",
+              itemStyle: {
+                normal: {
+                  color: "#412a4e",
+                },
+                emphasis: {
+                  color: "#412a4e",
+                },
+              },
+            },
+          ],
+        },
+      ],
+    })
+    this.$refs.chart1_4.setData({
+      series: [
+        {
+          type: "pie",
+          clockWise: false,
+          radius: ['60%', '75%'],
+          itemStyle: {
+            normal: {
+              label: {
+                show: false,
+              },
+              labelLine: {
+                show: false,
+              },
+              shadowBlur: 0,
+              shadowColor: "#00ff00",
+            },
+          },
+          hoverAnimation: false,
+          center: ["50%", "50%"],
+          data: [
+            {
+              value: 100,
+              label: {
+                normal: {
+                  rich: {
+                    a: {
+                      color: "#00ff00",
+                      align: "center",
+                      fontSize: 1.1 * vw,
+                      fontWeight: "bold",
+                    },
+                    b: {
+                      color: "#fff",
+                      align: "center",
+                      fontSize: 0.9 * vw,
+                    },
+                  },
+                  formatter: function (params) {
+                    return (
+                      "{a|" +
+                      100 +
+                      "%}" +
+                      "\n{b|完成率}"
+                    );
+                  },
+                  position: "center",
+                  show: true,
+                  textStyle: {
+                    fontSize: "14",
+                    fontWeight: "normal",
+                    color: "#fff",
+                  },
+                },
+              },
+              itemStyle: {
+                normal: {
+                  color: "#3ac13a",
+                  shadowColor: "#00ff00",
+                  shadowBlur: 0,
+                },
+              },
+            },
+            {
+              value: 0,
+              name: "invisible",
+              itemStyle: {
+                normal: {
+                  color: "#412a4e",
+                },
+                emphasis: {
+                  color: "#412a4e",
+                },
+              },
+            },
+          ],
+        },
+      ],
+    })
+    this.$refs.chart2.setData({
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          // 坐标轴指示器，坐标轴触发有效
+          type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+        }
+      },
+      grid: {
+        left: '0',
+        right: '4%',
+        bottom: '0',
+        top: 20,
+        containLabel: true
+      },
+      xAxis: {
+        type: 'category',
+        data: [1, 2, 3, 4, 5, 6],
+        axisLine: {
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        axisLabel: {
+          // interval: 0,
+          // rotate: 40,
+          textStyle: {
+            fontFamily: 'Microsoft YaHei'
+          }
+        }
+      },
+
+      yAxis: {
+        type: 'value',
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        splitLine: {
+          show: false
+        },
+        axisLabel: {}
+      },
+      series: [
+        {
+          name: '数量',
+          label: {
+            normal: {
+              show: true,
+              position: 'top',
+              textStyle: {
+                color: '#a8aab0',
+                fontStyle: 'normal',
+                fontFamily: '微软雅黑',
+                fontSize: 0.75 * vw
+              }
+            }
+          },
+          type: 'bar',
+          barWidth: '30%',
+          barMaxWidth: 50,
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: '#39ffff'
+                },
+                {
+                  offset: 1,
+                  color: '#5affa6'
+                }
+              ])
+            }
+          },
+          data: [1, 2, 3, 4, 5, 6]
+        }
+      ]
+    })
+    this.$refs.chart4.setData({
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          // 坐标轴指示器，坐标轴触发有效
+          type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+        }
+      },
+      grid: {
+        left: '0',
+        right: '4%',
+        bottom: '0',
+        top: 20,
+        containLabel: true
+      },
+      xAxis: {
+        type: 'category',
+        data: [1, 2, 3, 4, 5, 6],
+        axisLine: {
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        axisLabel: {
+          // interval: 0,
+          // rotate: 40,
+          textStyle: {
+            fontFamily: 'Microsoft YaHei'
+          }
+        }
+      },
+
+      yAxis: {
+        type: 'value',
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: 'white'
+          }
+        },
+        splitLine: {
+          show: false
+        },
+        axisLabel: {}
+      },
+      series: [
+        {
+          name: '数量',
+          label: {
+            normal: {
+              show: true,
+              position: 'top',
+              textStyle: {
+                color: '#a8aab0',
+                fontStyle: 'normal',
+                fontFamily: '微软雅黑',
+                fontSize: 0.75 * vw
+              }
+            }
+          },
+          type: 'bar',
+          barWidth: '30%',
+          barMaxWidth: 50,
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: '#39ffff'
+                },
+                {
+                  offset: 1,
+                  color: '#5affa6'
+                }
+              ])
+            }
+          },
+          data: [1, 2, 3, 4, 5, 6]
+        }
+      ]
+    })
+  },
+  methods: {}
+}
+</script>
+<style lang="less" scoped>
+
+.app-container {
+  background-image: url("../../../assets/board/bg.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;
+}
+
+.el-table {
+  background-color: #fff0;
+}
+
+.whiteTable {
+  /deep/ .el-table .el-table__header-wrapper th {
+    background-color: #fff0;
+  }
+
+  /deep/ .el-table tr {
+    background-color: #fff0;
+  }
+
+  /deep/ .el-table .cell {
+    color: #fff
+  }
+
+  /deep/ .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
+    background-color: #fff0;
+  }
+}
+
+.chartBox {
+  background-image: url("../../../assets/board/box.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  width: 46%;
+  height: 23.34vw;
+
+  .title {
+    position: absolute;
+    top: 8%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    font-size: 1.2vw;
+    color: #ccc;
+  }
+
+  .chart {
+    position: absolute;
+    top: 16%;
+    left: 1%;
+    width: 98%;
+    height: 82%;
+  }
+}
+
+.chartBox1 {
+  top: 10%;
+  left: 2%;
+
+  .chart1 {
+    position: absolute;
+    top: 16%;
+    left: 60%;
+    width: 20%;
+    height: 35%;
+  }
+
+  .chart2 {
+    position: absolute;
+    top: 16%;
+    left: 80%;
+    width: 20%;
+    height: 35%;
+  }
+
+  .chart3 {
+    position: absolute;
+    top: 55%;
+    left: 60%;
+    width: 20%;
+    height: 35%;
+  }
+
+  .chart4 {
+    position: absolute;
+    top: 55%;
+    left: 80%;
+    width: 20%;
+    height: 35%;
+  }
+}
+
+.chartBox2 {
+  top: 10%;
+  right: 2%;
+}
+
+.chartBox3 {
+  top: 53%;
+  left: 2%;
+}
+
+.chartBox4 {
+  top: 53%;
+  right: 2%;
+}
+
+.bottom {
+  position: absolute;
+  bottom: 1.5%;
+  left: 2%;
+}
+
+.form1 {
+  position: absolute;
+  width: 50%;
+  height: 100%;
+  top: 2%;
+  left: 2%;
+
+  /deep/ .el-form-item__label {
+    color: #fff;
+    font-weight: 500;
+  }
+
+  /deep/ .el-input__inner {
+    color: #fff;
+    background-color: #0000;
+    border: none;
+    border-bottom: 1px solid #fff9;
+    border-radius: 0;
+  }
+}
+</style>