合并

huangxiaoqiang

2025-06-03 975ea3c28b1661b3b6eabee5277cc98d853736d3

 CodeManagement/BigScreenVue/src/views/indexs/left-bottom.vue

@@ -13,11 +13,12 @@

<script>
import { currentGET } from "api/modules";
import { ProLocationStatistics } from "@/api/http.js";
import { Getproductionvolume } from "@/api/http.js";
import * as echarts from 'echarts';
let style = {
  fontSize: 24,
};

export default {
  data() {
    return {
@@ -201,7 +202,7 @@
         itemStyle: {
             color: '#feb01e'
         },
         data: [43, 50, 41, 18, 28, 25, 26, 40],
         data: [99, 50, 41, 18, 28, 25, 26, 0],
     }, {
         name: 'CO2',
         type: 'line',
@@ -300,40 +301,37 @@
    clearData() {
      if (this.timer) {
        clearInterval(this.timer);
        this.timer = null;
        this.timer = 3000;
      }
    },
    async getData() {
      this.pageflag = true;
      // currentGET("big2").then((res) => {
      //     if (!this.timer) {
      //         console.log("设备总览2", res);
      //     }
      //     if (res.success) {
      //         this.userOverview = res.data;
      //            this.onlineconfig = {
      //             ...this.onlineconfig,
      //             number: [1]
      //         }
      //         this.config = {
      //             ...this.config,
      //             number: [7]
      //         }
      //         this.offlineconfig = {
      //             ...this.offlineconfig,
      //             number: [4]
      //         }
      //         this.laramnumconfig = {
      //             ...this.laramnumconfig,
      //             number: [10]
      //         }
      //         this.switper();
      //     } else {
      //         this.pageflag = false;
      //         this.$Message.warning(res.msg);
      //     }
      // });
      var rep = await ProLocationStatistics();
        var rep1=await Getproductionvolume()
        console.log(rep1)
        var rep=rep1.filter(it=>it.roadway.includes("CW"))
  
       
        // (1) 按日期分组核心算法
 const groupedData = rep.reduce((acc, item) => {
  // 提取日期部分（格式：YYYY-MM-DD）
  const dateKey = item.createDate.split(' ')[0]; // 或 item.createDate.substring(0,10)
  
  // 创建日期分组容器（如果不存在）
  if (!acc[dateKey]) {
    acc[dateKey] = {
      date: dateKey,
      tasks: []
    };
  }
  
  // 将当前项加入对应分组
  acc[dateKey].tasks.push(item);
  return acc;
}, {});

// (2) 转换为排序后的数组
const sortedGroups = Object.values(groupedData)
  .sort((a, b) => new Date(b.date) - new Date(a.date)); // 降序排列// 降序排列

      this.options = {
     backgroundColor: '#0a1256',
     //浮动框
@@ -350,7 +348,7 @@
         itemWidth: 10,
         itemHeight: 10,
         icon: 'circle',
         data: ['成品入库', '成品出库', '成品回框']
         data: ['实框入库', '实框出库', '空框入库']
     },
     grid: {
         left: '8%',
@@ -369,7 +367,7 @@
             gte: 60,
             color: '#e5421b'
         }],
         seriesName: '成品入库',
         seriesName: '实框入库',
         seriesIndex: 2
     }, {
         type: 'piecewise',
@@ -382,7 +380,7 @@
             gte: 60,
             color: '#e5421b'
         }],
         seriesName: '成品出库',
         seriesName: '实框出库',
         seriesIndex: 1
     }, {
         type: 'piecewise',
@@ -395,7 +393,7 @@
             gte: 60,
             color: '#e5421b'
         }],
         seriesName: '成品回框',
         seriesName: '空框入库',
         seriesIndex: 0
     }],
     //x轴
@@ -416,7 +414,7 @@
             show: false
         },
         //坐标轴显示值
         data: ["04/19", "04/20", "04/21", "04/22", "04/23", "04/24", "04/25"]
         data: [sortedGroups[6].date, sortedGroups[5].date, sortedGroups[4].date, sortedGroups[3].date,sortedGroups[2].date,sortedGroups[1].date,sortedGroups[0].date ]
     },
     //y轴
     yAxis: {
@@ -446,31 +444,31 @@

     //
     series: [{
         name: '成品入库',
         name: '实框入库',
         type: 'line',
         symbolSize: [0, 0],
         itemStyle: {
             color: '#feb01e'
         },
         data: [160, 156, 150, 180, 170, 200, 20],
         data: [sortedGroups[6].tasks.filter(it=>it.taskType==200).length, sortedGroups[5].tasks.filter(it=>it.taskType==200).length, sortedGroups[4].tasks.filter(it=>it.taskType==200).length, sortedGroups[3].tasks.filter(it=>it.taskType==200).length, sortedGroups[2].tasks.filter(it=>it.taskType==200).length, sortedGroups[1].tasks.filter(it=>it.taskType==200).length, sortedGroups[0].tasks.filter(it=>it.taskType==200).length],
     }, {
         name: '成品出库',
         name: '实框出库',
         type: 'line',
         symbolSize: [0, 0],
         itemStyle: {
             color: '#1be57a'
         },
         data: [80, 115, 120, 130, 91, 99,  20]
         data: [sortedGroups[6].tasks.filter(it=>it.taskType==100).length, sortedGroups[5].tasks.filter(it=>it.taskType==100).length, sortedGroups[4].tasks.filter(it=>it.taskType==100).length, sortedGroups[3].tasks.filter(it=>it.taskType==100).length, sortedGroups[2].tasks.filter(it=>it.taskType==100).length, sortedGroups[1].tasks.filter(it=>it.taskType==100).length, sortedGroups[0].tasks.filter(it=>it.taskType==100).length]
     }, {
         name: '成品回框',
         name: '空框入库',
         type: 'line',
         symbolSize: [0, 0],
         itemStyle: {
             color: '#69dbf7'
         },
         data: [70, 113, 118, 111, 89, 99,  32]
         data: [sortedGroups[6].tasks.filter(it=>it.taskType==204).length, sortedGroups[5].tasks.filter(it=>it.taskType==204).length, sortedGroups[4].tasks.filter(it=>it.taskType==204).length, sortedGroups[3].tasks.filter(it=>it.taskType==204).length, sortedGroups[2].tasks.filter(it=>it.taskType==204).length, sortedGroups[1].tasks.filter(it=>it.taskType==204).length, sortedGroups[0].tasks.filter(it=>it.taskType==204).length]
     }, { //水波纹点
         name: '成品入库',
         name: '实框入库',
         type: 'effectScatter',
         symbolSize: [5, 5],
         rippleEffect: {
@@ -487,10 +485,9 @@
                 color: 'rgba(254,176,30,.3)'
             }])
         },
         data: [160, 156, 150, 180, 170, 200,  20]

         data: [sortedGroups[6].tasks.filter(it=>it.taskType==200).length, sortedGroups[5].tasks.filter(it=>it.taskType==200).length, sortedGroups[4].tasks.filter(it=>it.taskType==200).length, sortedGroups[3].tasks.filter(it=>it.taskType==200).length, sortedGroups[2].tasks.filter(it=>it.taskType==200).length, sortedGroups[1].tasks.filter(it=>it.taskType==200).length, sortedGroups[0].tasks.filter(it=>it.taskType==200).length],
     }, { //水波纹点
         name: '成品出库',
         name: '实框出库',
         type: 'effectScatter',
         symbolSize: [5, 5],
         rippleEffect: {
@@ -507,10 +504,10 @@
                 color: 'rgba(27,229,122,.3)'
             }])
         },
         data: [80, 115, 120, 130, 91, 99,  20]
         data:[sortedGroups[6].tasks.filter(it=>it.taskType==100).length, sortedGroups[5].tasks.filter(it=>it.taskType==100).length, sortedGroups[4].tasks.filter(it=>it.taskType==100).length, sortedGroups[3].tasks.filter(it=>it.taskType==100).length, sortedGroups[2].tasks.filter(it=>it.taskType==100).length, sortedGroups[1].tasks.filter(it=>it.taskType==100).length, sortedGroups[0].tasks.filter(it=>it.taskType==100).length]

     }, { //水波纹点
         name: '成品回框',
         name: '空框入库',
         type: 'effectScatter',
         symbolSize: [5, 5],
         rippleEffect: {
@@ -531,7 +528,7 @@
             symbol: "none",
             label: {
                 normal: {
                     show: false,
                     show: true,
                 }
             },
             lineStyle: {
@@ -543,7 +540,7 @@
                 yAxis: 60
             }]
         },
         data: [70, 113, 118, 111, 89, 99, 32]
         data: [sortedGroups[6].tasks.filter(it=>it.taskType==204).length, sortedGroups[5].tasks.filter(it=>it.taskType==204).length, sortedGroups[4].tasks.filter(it=>it.taskType==204).length, sortedGroups[3].tasks.filter(it=>it.taskType==204).length, sortedGroups[2].tasks.filter(it=>it.taskType==204).length, sortedGroups[1].tasks.filter(it=>it.taskType==204).length, sortedGroups[0].tasks.filter(it=>it.taskType==204).length]

     }]
 };
@@ -551,6 +548,7 @@
    },
    //轮询
    switper() {
        
      if (this.timer) {
        return;
      }