From 831cfa4c439c6d073d706a82d2a439f8b1818498 Mon Sep 17 00:00:00 2001
From: yangys <y_ys79@sina.com>
Date: 星期二, 18 十一月 2025 16:59:50 +0800
Subject: [PATCH] Merge branch 'new' of http://www.beijingsoft.cn:9090/r/smart-web into new

---
 src/views/mdc/components/process-charts.vue |  110 ++++++++++++++++++++++++++++++++++++++-----------------
 1 files changed, 76 insertions(+), 34 deletions(-)

diff --git a/src/views/mdc/components/process-charts.vue b/src/views/mdc/components/process-charts.vue
index 83a276a..535daa5 100644
--- a/src/views/mdc/components/process-charts.vue
+++ b/src/views/mdc/components/process-charts.vue
@@ -1,67 +1,109 @@
 <!--
  * @Date: 2024-04-18 21:52:18
- * @LastEditors: Sneed
- * @LastEditTime: 2024-06-20 23:37:09
+ * @LastEditors: lzhe lzhe@example.com
+ * @LastEditTime: 2024-12-20 14:56:14
  * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/components/TimeAlarm.vue
 -->
 <template>
-    <div ref="processCharts" style="width: 100%;height:32px;" id="record"></div>
+    <div ref="processCharts" style="width: 100%;height:80px;" id="record"></div>
 </template>
 
 <script>
 import * as echarts from 'echarts';
+import T from '@/components/scEcharts/echarts-theme-T.js';
+import moment from 'moment'
 export default {
     data() {
         return {
             option: {
-                // tooltip: {
-                //     trigger: 'axis',
-                //     axisPointer: {
-                //         type: 'shadow'
-                //     }
-                // },
+                tooltip: {
+                    trigger: 'axis',
+                    position: 'bottom',
+                    axisPointer: {
+                        type: 'shadow'
+                    }
+                },
                 grid: {
-                    left: 20,
+                    left: 0,
+                    right: 0,
                     width: "100%"
                 },
                 xAxis: {
                     type: 'value',
-                    min: 0,
-                    max: 24, // 鏍规嵁闇�瑕佽皟鏁存渶澶у��
-                    boundaryGap: [0, 0.01], // 鐣欏嚭涓�鐐圭┖闂�
+                    interval: 0.05,
+                    axisLabel: {
+                        show: false,
+                        margin: 0
+                    },
+                    splitLine: {
+                        show: false
+                    },
+                    minorSplitLine: {
+                        show: false
+                    },
+                    splitArea: {
+                        show: false
+                    },
+                    axisTick: {
+                        show: false
+                    }
+                    // "type": "value",
+                    // "interval": 0.05,
+                    // "axisLabel": {
+
+                    // }
                 },
                 yAxis: {
                     type: 'category',
-                    data: ['鏌卞瓙'],
+                    data: [''],
                     show: false
                 },
                 series: []
             }
         }
     },
+    props: ['index','tableData'],
     methods: {
-
+        getTableData(id) {
+            this.$HTTP.get(`/api/workinghour/working-process`, {id}).then(res => {
+                if (res.code === 200) {
+                    if(res.data.length == 0) return;
+                    var timeRange = {};
+                    timeRange.startTime = res.data[0].startTime;
+                    timeRange.endTime = res.data[res.data.length - 1].endTime;
+                    var total = Math.abs(moment(timeRange.startTime).diff(moment(timeRange.endTime)));
+                    var start = timeRange.startTime;
+                    var arr = [];
+                    res.data.map((item, i) => {
+                        var current = Math.abs(moment(start).diff(moment(item.endTime)))
+                        start = item.endTime;
+                        //console.log(current / total,'鐧惧垎姣�')
+                        if(item.deviceStatus == "2") {
+                            item.deviceStatusName = "杩愯";
+                            item.color = "#307f45";
+                        }else {
+                            item.deviceStatusName = "寰呮満";
+                            item.color = "#fdff85";
+                        }
+                        var obj = {name: item.deviceStatusName,type: 'bar',stack: 'total',barWidth: "20px",data: [current / total],itemStyle: {color: item.color},"tooltip": {
+                                "trigger": "item",
+                                formatter: (value, ticket) => {
+                                    return `${item.deviceStatusName}: ${item.startTime} - ${item.endTime}<br />绋嬪簭鍚嶇О: ${item.progName}`;
+                                }
+                        }};
+                        arr.push(obj);
+                    })
+                    this.option.series = arr;
+                    var recordDom = this.$refs.processCharts;
+                    var myChart = echarts.init(recordDom);
+                    myChart.setOption(this.option);
+                }
+            })
+        }
     },
     mounted() {
-        // this.option.series = [
-        //     {name: '绌洪棽鏃堕棿',type: 'bar',stack: 'total',itemStyle: {color: '#fdff85'},data: [2]},
-        //     {name: '宸ヤ綔鏃堕棿',type: 'bar',stack: 'total',itemStyle: {color: '#307f45'},data: [3]}
-        // ]
-        var arr = [];
-        for(var i=0;i<24;i++) {
-            var obj = {name: '绌洪棽鏃堕棿',type: 'bar',stack: 'total',itemStyle: {color: '#fdff85'},data: [1]};
-            if(Math.random() >= 0.5) {
-                obj.itemStyle.color = "#fdff85";
-            }else {
-                obj.itemStyle.color = "#307f45";
-            }
-            arr.push(obj)
-        }
-        this.option.series = arr;
-        console.log(this.option.series)
-        var recordDom = this.$refs.processCharts;
-        var myChart = echarts.init(recordDom);
-        myChart.setOption(this.option);
+        var id = this.tableData[this.index - 1].id;
+        this.getTableData(id);
     },
 }
 </script>

--
Gitblit v1.9.3