更新

src/icons/svg/运行状态.svg

@@ -8,7 +8,7 @@
         </linearGradient>
     </defs>
     <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="凯胜君恒药玻" transform="translate(-115.000000, -110.000000)" fill-rule="nonzero">
+        <g id="凯盛君恒药玻" transform="translate(-115.000000, -110.000000)" fill-rule="nonzero">
             <g id="编组-19" transform="translate(24.000000, 88.000000)">
                 <g id="运行状态" transform="translate(91.000000, 22.000000)">
                     <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="68" height="68"></rect>

src/views/modules/bottomInfo.vue

@@ -2,28 +2,54 @@
  * @Author: zwq
  * @Date: 2023-01-04 10:29:40
  * @LastEditors: zwq
- * @LastEditTime: 2023-08-08 16:25:02
+ * @LastEditTime: 2024-01-29 15:17:11
  * @Description: 
 -->
 <template>
   <el-card shadow="never" class="aui-card--fill">
     <div class="bottom-info">
       <el-row :gutter="20">
-        <el-col :span="3">
+        <el-col :span="4">
-          <div class="text-div">
+          <el-row :gutter="10">
-            <div class="titleStyle">
+            <el-col :span="12">
-              上一班组下料数:
+              <div class="text-div">
-            </div>
+                <div class="titleStyle">
-            <h1 style="text-align: center;">{{ GroutCount.lastGroutCount }}</h1>
+                  一号窑
-          </div>
+                  <div style="color: #000;font-weight: 400;">上一班组下料数:</div>
-          <div class="text-div">
+                </div>
-            <div class="titleStyle">
+                <h2 style="text-align: center;">{{ GroutCount.lastGroutCount }}</h2>
-              当前班组下料数:
+              </div>
-            </div>
+            </el-col>
-            <h1 style="text-align: center;">{{ GroutCount.nowGroupCount }}</h1>
+            <el-col :span="12">
-          </div>
+              <div class="text-div">
+                <div class="titleStyle">
+                  二号窑
+                  <div style="color: #000;font-weight: 400;">上一班组下料数:</div>
+                </div>
+                <h2 style="text-align: center;">{{ GroutCount.kiln2LastGroutCount }}</h2>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="text-div">
+                <div class="titleStyle">
+                  一号窑
+                  <div style="color: #000;font-weight: 400;">当前班组下料数:</div>
+                </div>
+                <h2 style="text-align: center;">{{ GroutCount.nowGroupCount }}</h2>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="text-div">
+                <div class="titleStyle">
+                  二号窑
+                  <div style="color: #000;font-weight: 400;">当前班组下料数:</div>
+                </div>
+                <h2 style="text-align: center;">{{ GroutCount.kiln2NowGroupCount }}</h2>
+              </div>
+            </el-col>
+          </el-row>
         </el-col>
-        <el-col :span="9">
+        <el-col :span="8">
           <div class="echart-all">
             <el-row :gutter="20">
               <el-col :span="12">
@@ -50,7 +76,7 @@
                   ref="chartRef3"
                   v-if="chartVisible"
                   :id="'echart3'"
-                  :title="'窑头1-3'"
+                  :title="'窑头2-1'"
                 ></echart-1>
               </el-col>
               <el-col :span="12">
@@ -59,7 +85,7 @@
                   ref="chartRef4"
                   v-if="chartVisible"
                   :id="'echart4'"
-                  :title="'窑头1-4'"
+                  :title="'窑头2-2'"
                 ></echart-1>
               </el-col>
             </el-row>
@@ -153,18 +179,18 @@ export default {
   background: #ffffff;
   border-radius: 8px;
   margin: 8px 0 0 0;
-  padding: 17px;
   line-height: 50px;
-  color: #47E282;
+  padding-top: 5px;
+  color: #47e282;
   font-size: 50px;
   height: 213px;
 }
 .titleStyle {
-  margin: -8px 0 10px -10px;
+  margin: 0px 0 10px 5px;
-  font-size: 16px;
+  font-size: 15px;
   font-family: PingFangSC-Regular, PingFang SC;
-  font-weight: 400;
+  font-weight: 600;
-  color: rgba(0, 0, 0, 0.85);
+  color: #35ab63;
   line-height: 16px;
 }
 .titleStyle::before {

src/views/modules/ceshi1.vue

@@ -2,7 +2,7 @@
  * @Author: zwq
  * @Date: 2023-01-04 10:29:40
  * @LastEditors: zwq
- * @LastEditTime: 2023-08-08 16:58:37
+ * @LastEditTime: 2024-01-29 10:22:22
  * @Description: 
 -->
 <template>
@@ -23,8 +23,12 @@
           :class="[item.name, potArr[potData[item.name.split('-')[1]]]]"
           :key="item.name"
         ></div>
+        <div class="kname kname1">1-1</div>
+        <div class="kname kname2">1-2</div>
+        <div class="kname kname3">2-1</div>
+        <div class="kname kname4">2-2</div>
       </div>
-      <div class="car uncar">
+      <div class="car" id="uncar">
         <div class="carDiv" :class="[potArr[potData.pot13]]"></div>
         <div class="carDiv" :class="[potArr[potData.pot14]]"></div>
       </div>
@@ -83,6 +87,10 @@ export default {
       type: Number,
       default: 0.1,
     },
+    rgv2: {
+      type: Number,
+      default: 0.6,
+    },
     radio: {
       type: Number,
       default: 1,
@@ -96,6 +104,7 @@ export default {
     return {
       dispatchMode: this.radio,
       car: "",
+      uncar: "",
       zhigui: "",
       potArr: ["", "pot1", "pot2", "pot3", "pot4"],
       modelArr: ["hand", "auto"],
@@ -131,8 +140,10 @@ export default {
   methods: {
     init() {
       this.car = document.getElementById("car");
+      this.uncar = document.getElementById("uncar");
       this.zhigui = document.getElementById("zhigui");
       this.car.style.right = this.zhigui.clientWidth * this.rgv + "px";
+      this.uncar.style.right = this.zhigui.clientWidth * this.rgv2 + "px";
       //this.runCar();
     },
     setMode() {
@@ -199,6 +210,32 @@ export default {
   margin: 3px 0 0 3px;
   float: left;
 }
+.kname {
+  width: 40px;
+  color: #8ee1a9;
+  font-weight: bolder;
+  font-size: 25px;
+}
+.kname1{
+  right: 16.2%;
+  bottom: 20%;
+  position: absolute;
+}
+.kname2{
+  right: 19.1%;
+  bottom: 20%;
+  position: absolute;
+}
+.kname3{
+  right: 39.2%;
+  bottom: 20%;
+  position: absolute;
+}
+.kname4{
+  right: 42.2%;
+  bottom: 20%;
+  position: absolute;
+}
 .line-div {
   width: 39px;
   height: 39px;
@@ -426,7 +463,7 @@ export default {
 }
 .bg {
   margin-bottom: -40px;
-  height: 512px;
+  height: 505px;
   width: 1612px;
   position: relative;
   z-index: 1;

src/views/modules/ceshi2.vue

@@ -2,13 +2,13 @@
  * @Author: zwq
  * @Date: 2023-01-04 10:29:40
  * @LastEditors: zwq
- * @LastEditTime: 2023-07-07 09:15:55
+ * @LastEditTime: 2024-01-26 14:49:01
  * @Description: 
 -->
 <template>
   <el-card shadow="never" class="aui-card--fill">
     <base-table
-      height="425"
+      height="420"
       :table-props="tableProps"
       :page="listQuery.page"
       :limit="listQuery.limit"

src/views/modules/ceshi3.vue

@@ -2,13 +2,13 @@
  * @Author: zwq
  * @Date: 2023-01-04 10:29:40
  * @LastEditors: zwq
- * @LastEditTime: 2023-07-07 09:16:52
+ * @LastEditTime: 2024-01-26 14:49:15
  * @Description: 
 -->
 <template>
   <el-card shadow="never" class="aui-card--fill">
     <base-table
-      height="425"
+      height="420"
       :table-props="tableProps"
       :page="listQuery.page"
       :limit="listQuery.limit"

src/views/modules/ceshi4.vue

@@ -0,0 +1,119 @@
+<!--
+ * @Author: zwq
+ * @Date: 2023-06-01 10:47:42
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-01-30 15:52:49
+ * @Description: 
+-->
+<template>
+  <el-card shadow="never" class="aui-card--fill">
+    <div class="echart-all">
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <echart-2
+            class="echart-div"
+            ref="chartRef1"
+            v-if="chartVisible"
+            :id="'zhexian1'"
+            :title="'1-1半小时消耗'"
+          ></echart-2>
+        </el-col>
+        <el-col :span="12">
+          <echart-2
+            class="echart-div"
+            ref="chartRef2"
+            v-if="chartVisible"
+            :id="'zhexian2'"
+            :title="'1-2半小时消耗'"
+          ></echart-2>
+        </el-col>
+        <el-col :span="12">
+          <echart-2
+            class="echart-div"
+            ref="chartRef3"
+            v-if="chartVisible"
+            :id="'zhexian3'"
+            :title="'2-1半小时消耗'"
+          ></echart-2>
+        </el-col>
+        <el-col :span="12">
+          <echart-2
+            class="echart-div"
+            ref="chartRef4"
+            v-if="chartVisible"
+            :id="'zhexian4'"
+            :title="'2-2半小时消耗'"
+          ></echart-2>
+        </el-col>
+      </el-row>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import echart2 from "./echart2";
+export default {
+  data() {
+    return {
+      chartVisible: false,
+    };
+  },
+  components: {
+    echart2,
+  },
+  mounted() {
+    this.startFun();
+  },
+  methods: {
+    init() {
+      this.getData();
+      this.startFun();
+    },
+    startFun() {
+      const timer = setInterval(() => {
+        this.getData();
+      }, 60000);
+      this.$once("hook:beforeDestroy", () => {
+        clearInterval(timer);
+      });
+    },
+    getData() {
+      this.chartVisible = true;
+      for (let i = 1; i <= 4; i++) {
+        const params = {
+          location: i,
+          order:'desc',
+          orderField:'create_time',
+          limit: 24,
+          page:1
+        };
+        this.$http
+          .get("/code/mtBbybWeightSum/page", {
+            params,
+          })
+          .then(({ data: res }) => {
+            if (res.code !== 0) {
+              return this.$message.error(res.msg);
+            }
+            const arr = res.data.list.reverse()
+            this.$nextTick(() => {
+              this.$refs["chartRef" + i].initChart(arr);
+            });
+          })
+          .catch(() => {});
+      }
+    },
+  },
+};
+</script>
+
+<style scoped>
+.echart-all {
+  margin-left: -8px;
+}
+.echart-div {
+  background: #ffffff;
+  border-radius: 8px;
+  padding-top: 10px;
+}
+</style>

src/views/modules/echart1.vue

@@ -6,7 +6,7 @@
  * @Description: 
 -->
 <template>
-  <div style="width: 349px;height: 213px" class="echart-div" :id="id"></div>
+  <div style="width: 320px;height: 213px" class="echart-div" :id="id"></div>
 </template>
 
 <script>

src/views/modules/echart2.vue

@@ -0,0 +1,107 @@
+<!--
+ * @Author: zwq
+ * @Date: 2023-06-01 10:47:42
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-01-29 10:31:36
+ * @Description: 
+-->
+<template>
+  <div style="width: 90%;height: 233px;" class="echart-div" :id="id"></div>
+</template>
+
+<script>
+import * as echarts from "echarts";
+export default {
+  props: {
+    id: {
+      type: String,
+      default: "zhexian",
+    },
+    title: {
+      type: String,
+      default: "",
+    },
+  },
+  name: "echarts",
+  data() {
+    return {
+      echart: "",
+    };
+  },
+  mounted() {},
+  activated() {
+    // 由于给echart添加了resize事件, 在组件激活时需要重新resize绘画一次, 否则出现空白bug
+    if (this.echart) {
+      this.echart.resize();
+    }
+  },
+  methods: {
+    // 折线图
+    initChart(data) {
+      var option = {
+        title: {
+          text: "{space|}{tip|}{space|}{value|" + this.title + "}",
+          left: "0%",
+          top: "2%",
+          textStyle: {
+            rich: {
+              tip: {
+                width: 4,
+                height: 16,
+                backgroundColor: "#1FC495",
+                marginRight: 6,
+              },
+              space: {
+                width: 8,
+              },
+              value: {
+                fontSize: 16,
+                fontWeight: "bold",
+              },
+            },
+          },
+        },
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            type: "shadow",
+          },
+        },
+        grid: {
+          show: false,
+          z: 0,
+          left: "10%",
+          top: 40,
+          right: "10%",
+          bottom: 10,
+          containLabel: true,
+        },
+        xAxis: {
+          type: "category",
+        },
+        yAxis: {
+          type: "value",
+        },
+        series: [
+          {
+            name: '消耗',
+            data: data.map(item=>{return item.weightSum}),
+            type: "line",
+          },
+        ],
+      };
+      if (this.echart !== "") {
+        this.echart.setOption(option);
+      } else {
+        this.echart = echarts.init(document.getElementById(this.id));
+        this.echart.setOption(option);
+      }
+      window.addEventListener("resize", () => {
+        this.echart.resize();
+      });
+    },
+  },
+};
+</script>
+
+<style scoped></style>

src/views/modules/main.vue

@@ -2,7 +2,7 @@
  * @Author: zwq
  * @Date: 2023-01-04 10:29:40
  * @LastEditors: zwq
- * @LastEditTime: 2023-08-14 09:20:13
+ * @LastEditTime: 2024-01-26 15:37:59
  * @Description: 
 -->
 <template>
@@ -17,7 +17,7 @@
       <img style="height: 52px;float:left;margin:12px 24px" src="~@/assets/img/横版logo.png" />
       <img
         style="height: 30px;float:right;margin:22px;margin-right:140px"
-        src="~@/assets/img/RGV/凯胜君恒药玻RGV输送线@2x.png"
+        src="~@/assets/img/RGV/凯盛君恒药玻RGV输送线@2x.png"
       />
       <span class="title-time">
         {{ gettime.split("/")[0] }}<br />
@@ -33,13 +33,14 @@
       >
         <el-tab-pane name="first">
           <span slot="label" class="tab-item">
-            <img style="height: 60px;" src="~@/assets/img/RGV/运行状态@2x.png" />
+            <img style="height: 40px;" src="~@/assets/img/RGV/运行状态@2x.png" />
             <br /><span>运行状态</span>
           </span>
           <ceshi-1
             ref="ceshi1"
             :potData="potData"
             :rgv="rgv"
+            :rgv2="rgv2"
             :radio="radio"
             :arrow="arrow"
             :modelData="modelData"
@@ -48,18 +49,25 @@
         </el-tab-pane>
         <el-tab-pane name="second">
           <span slot="label" class="tab-item">
-            <img style="height: 60px;" src="~@/assets/img/RGV/历史数据@2x.png" />
+            <img style="height: 40px;" src="~@/assets/img/RGV/历史数据@2x.png" />
             <br /><span>历史数据</span>
           </span>
           <ceshi-2 ref="ceshi2" v-if="activeName === 'second'"></ceshi-2>
         </el-tab-pane>
         <el-tab-pane name="third">
           <span slot="label" class="tab-item">
-            <img style="height: 60px;" src="~@/assets/img/RGV/历史报警@2x.png" />
+            <img style="height: 40px;" src="~@/assets/img/RGV/历史报警@2x.png" />
             <br /><span>历史报警</span>
           </span>
           <ceshi-3 ref="ceshi3" v-if="activeName === 'third'"></ceshi-3>
         </el-tab-pane>
+        <el-tab-pane name="four">
+          <span slot="label" class="tab-item">
+            <img style="height: 40px;" src="~@/assets/img/RGV/echart.jpeg" />
+            <br /><span>下料速度</span>
+          </span>
+          <ceshi-4 ref="ceshi4" v-if="activeName === 'four'"></ceshi-4>
+        </el-tab-pane>
       </el-tabs>
       <bottom-info
         :echartData="echartData"
@@ -77,6 +85,7 @@ import ceshi1 from "./ceshi1";
 import bottomInfo from "./bottomInfo";
 import ceshi2 from "./ceshi2";
 import ceshi3 from "./ceshi3";
+import ceshi4 from "./ceshi4";
 export default {
   data() {
     return {
@@ -89,7 +98,8 @@ export default {
       potData: {},
       echartData: {},
       tableData: [],
-      rgv: 0,
+      rgv: 0.1,
+      rgv2: 0.8,
       radio: 1,
       arrow: 1,
       modelData: {},
@@ -100,6 +110,7 @@ export default {
     ceshi1,
     ceshi2,
     ceshi3,
+    ceshi4,
     bottomInfo,
   },
   created() {
@@ -124,10 +135,14 @@ export default {
         this.$nextTick(() => {
           this.$refs.ceshi2.getDataList();
         });
-      } else {
+      } else if (tab.index === "2") {
         this.$nextTick(() => {
           this.$refs.ceshi3.getDataList();
         });
+      } else if (tab.index === "3") {
+        this.$nextTick(() => {
+          this.$refs.ceshi4.init();
+        });
       }
     },
     getCurrentTime() {
@@ -179,6 +194,8 @@ export default {
         const data = {
           lastGroutCount: JSON.parse(JSON.stringify(dataJson)).lastGroutCount,
           nowGroupCount: JSON.parse(JSON.stringify(dataJson)).nowGroupCount,
+          kiln2LastGroutCount: JSON.parse(JSON.stringify(dataJson)).kiln2LastGroutCount,
+          kiln2NowGroupCount: JSON.parse(JSON.stringify(dataJson)).kiln2NowGroupCount,
         };
         this.$nextTick(() => {
           this.$refs.bottomInfo.init(data);
@@ -207,6 +224,7 @@ export default {
         this.radio = JSON.parse(JSON.stringify(dataJson)).dispatchMode;
         this.arrow = JSON.parse(JSON.stringify(dataJson)).direction;
         this.rgv = JSON.parse(JSON.stringify(dataJson)).rgv1;
+        this.rgv2 = JSON.parse(JSON.stringify(dataJson)).rgv2;
         this.$nextTick(() => {
           this.$refs.ceshi1.init();
         });
@@ -254,7 +272,7 @@ export default {
 }
 .tab-div >>> .el-tabs__item {
   width: 220px;
-  height: 160px;
+  height: 124px;
   font-size: 22px;
   font-family: PingFangSC-Regular, PingFang SC;
   font-weight: 400;
@@ -267,12 +285,16 @@ export default {
   display: flex;
   justify-content: center;
   align-items: center;
-  margin-bottom: 16px;
+  margin-bottom: 4px;
+}
+.tab-div >>> .el-tabs__item.is-active {
+  box-shadow: 0 0 10px 10px inset rgba(0, 102, 255, 0.6);
 }
 .tab-div >>> .el-tabs__item:last-child {
   margin-bottom: 0;
 }
 .tab-div >>> .el-tabs__active-bar {
+  display: none;
   border-radius: 2px;
   background: #3fc471;
 }