-
+
+
+
-
-
-
-
-
-
+
+
+
+ 欢迎使用软件代码AI智能生成系统
-
+
-
-
+
+
-
-
-
-
-
-
+
- var init = function() {
- var $pageIframe = $('#pageIframe');
- $pageIframe.css({
- height: `${$win.height() - 200}px`
- })
- }
+
+ errorTypeChart.setOption(errorTypeOption);
+
+ // 测试用例执行趋势折线图
+ var testTrendChart = echarts.init(document.getElementById('testTrendChart'));
+ var testTrendOption = {
+ title: {
+ text: '测试用例执行趋势',
+ left: 'center'
+ },
+ tooltip: {
+ trigger: 'axis'
+ },
+ legend: {
+ data: ['通过', '失败'],
+ top: 30
+ },
+ xAxis: {
+ type: 'category',
+ data: ['5月1日', '5月5日', '5月10日', '5月15日', '5月20日', '5月25日', '5月30日', '6月2日', '6月5日', '6月10日']
+ },
+ yAxis: {
+ type: 'value'
+ },
+ series: [
+ {
+ name: '通过',
+ type: 'line',
+ data: [49, 30, 98, 20, 40, 58, 30, 70, 43, 20],
+ itemStyle: {
+ color: '#4ecdc4'
+ }
+ },
+ {
+ name: '失败',
+ type: 'line',
+ data: [1, 0, 2, 5, 0, 2, 5, 0, 2, 0],
+ itemStyle: {
+ color: '#ff6b6b'
+ }
+ }
+ ]
+ };
+ testTrendChart.setOption(testTrendOption);
+
+ // 部署成功率统计柱状图
+ var deployChart = echarts.init(document.getElementById('deployChart'));
+ var deployOption = {
+ title: {
+ text: '项目部署成功率统计',
+ left: 'center'
+ },
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'shadow'
+ }
+ },
+ legend: {
+ data: ['成功', '失败'],
+ top: 30
+ },
+ xAxis: {
+ type: 'category',
+ data: ['生产环境', '测试环境', '预生产环境']
+ },
+ yAxis: {
+ type: 'value'
+ },
+ series: [
+ {
+ name: '成功',
+ type: 'bar',
+ data: [4, 2, 2],
+ itemStyle: {
+ color: '#4ecdc4'
+ }
+ },
+ {
+ name: '失败',
+ type: 'bar',
+ data: [0, 2, 0],
+ itemStyle: {
+ color: '#ff6b6b'
+ }
+ }
+ ]
+ };
+ deployChart.setOption(deployOption);
+
diff --git a/sbewmxjxt/src/main/resources/static/route/pages/index.html b/sbewmxjxt/src/main/resources/static/route/pages/index.html
index c700228..d6b6d4c 100644
--- a/sbewmxjxt/src/main/resources/static/route/pages/index.html
+++ b/sbewmxjxt/src/main/resources/static/route/pages/index.html
@@ -1,90 +1,118 @@
-
+
设备二维码巡检系统
-
-
+
+
-
+
-
设备二维码巡检系统
-
+ 设备二维码巡检系统
+
退出系统
-
-
-
![]()
-
账号名称
-
管理人员
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
-
-
-
-
-
-
-
-
+
+
+
![]()
+
账号名称
+
管理人员
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+
+
+
-
-
-
+
+
diff --git a/xtbgxt/src/main/resources/static/route/pages/index.html b/xtbgxt/src/main/resources/static/route/pages/index.html
index 9c10ad1..9920a95 100644
--- a/xtbgxt/src/main/resources/static/route/pages/index.html
+++ b/xtbgxt/src/main/resources/static/route/pages/index.html
@@ -1,14 +1,14 @@
-
+
协同办公系统
-
+
@@ -25,9 +25,9 @@
-
+
管理员
@@ -83,21 +83,42 @@
欢迎使用协同办公系统
-
-
+
@@ -120,145 +141,114 @@
}
init();
- var homepage = document.getElementById('homepage');
+ var homepage = document.getElementById('homepage');
$(document).on('click', '.menu-item', function() {
var url = this.dataset.url;
var pageIframe = $('#pageIframe');
pageIframe.attr('src', url);
pageIframe.show();
- homepage.style.display = 'none';
+ homepage.style.display = 'none';
});
- });
- //折线图
- var lineChart = echarts.init(document.getElementById('lineChart'));
- var optionLine = {
- animation: false,
- title: {
- //text: '销售时间统计',//
- left: 'left', // Center align the title horizontally
+
+ // 任务状态分布饼图
+ var taskStatusChart = echarts.init(document.getElementById('taskStatusChart'));
+ var taskStatusOption = {
+ tooltip: {
+ trigger: 'item',
+ formatter: '{a}
{b}: {c} ({d}%)'
+ },
+ legend: {
+ orient: 'vertical',
+ left: 'right'
+ },
+ series: [{
+ name: '任务状态',
+ type: 'pie',
+ radius: ['40%', '70%'],
+ data: [
+ {value: 5, name: '已完成'},
+ {value: 3, name: '进行中'},
+ {value: 2, name: '未开始'}
+ ],
+ itemStyle: {
+ emphasis: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }]
+ };
+ taskStatusChart.setOption(taskStatusOption);
+
+ // 月度活动趋势折线图
+ var monthlyTrendChart = echarts.init(document.getElementById('monthlyTrendChart'));
+ var monthlyTrendOption = {
+ tooltip: {
+ trigger: 'axis'
+ },
+ legend: {
+ data: ['任务数量', '日程安排']
},
xAxis: {
type: 'category',
boundaryGap: false,
- data: ['2024-1', '2024-2', '2024-3', '2024-4', '2024-5', '2024-6', '2024-7']
+ data: ['1月', '2月']
},
yAxis: {
type: 'value'
},
- tooltip: {
- trigger: 'axis' // 设置触发类型为坐标轴触发
- },
series: [{
- data: [820, 733, 901, 600, 1290, 500, 1320],
+ name: '任务数量',
type: 'line',
- smooth: true,
- areaStyle: {}
+ data: [5, 5],
+ smooth: true,
+ areaStyle: {}
+ }, {
+ name: '日程安排',
+ type: 'line',
+ data: [5, 5],
+ smooth: true,
+ areaStyle: {}
}]
};
- lineChart.setOption(optionLine);
-
- var currentIndex = -1;
- var interval = 1000; // 切换间隔时间，单位是毫秒
- var timer; // 定时器变量
+ monthlyTrendChart.setOption(monthlyTrendOption);
- // 自动触发选中状态并每隔1秒自动向下一个触发
- function startAutoPlay() {
- timer = setInterval(function() {
- var dataLen = optionLine.series[0].data.length;
- // 取消之前高亮的图形
- lineChart.dispatchAction({
- type: 'downplay',
- seriesIndex: 0,
- dataIndex: currentIndex
- });
- currentIndex = (currentIndex + 1) % dataLen;
- // 高亮当前图形
- lineChart.dispatchAction({
- type: 'highlight',
- seriesIndex: 0,
- dataIndex: currentIndex
- });
- // 显示 tooltip
- lineChart.dispatchAction({
- type: 'showTip',
- seriesIndex: 0,
- dataIndex: currentIndex
- });
- }, interval);
- }
-
- // 开始自动播放
- startAutoPlay();
-
- // 鼠标悬停在图表上时暂停自动播放
- lineChart.on('mouseover', function() {
- clearInterval(timer);
- });
-
- // 鼠标离开图表区域时恢复自动播放
- lineChart.on('mouseout', function() {
- startAutoPlay();
- });
-
- // 饼状图
- var pieChart = echarts.init(document.getElementById('pieChart'));
- var optionPie = {
- animation: false,
- title: {
- //text: '订单占比系统',//
- left: 'left'
- },
+ // 部门人员分布柱状图
+ var departmentChart = echarts.init(document.getElementById('departmentChart'));
+ var departmentOption = {
tooltip: {
- trigger: 'item'
+ trigger: 'axis',
+ axisPointer: {
+ type: 'shadow'
+ }
},
- legend: {
- orient: 'vertical',
- left: 'right'
- },
- series: [{
- name: '嘻嘻',
- type: 'pie',
- radius: ['60%', '70%'],
- data: [
- {value: 150, name: 'data1'},
- {value: 274, name: 'data2'},
- {value: 310, name: 'data3'},
- {value: 335, name: 'data4'},
- {value: 400, name: 'data5'}
- ]
- }]
- };
- pieChart.setOption(optionPie);
- //柱状图
- var barChart = echarts.init(document.getElementById('barChart'));
- var optionBar = {
- animation: false,
- title: {
- // text: '收支情况'//
- },
- tooltip: {},
legend: {
- //data: ['收入', '支出'] ,//
- data: ['data1', 'data2'] ,
- left: 'right'
+ data: ['人员数量']
},
xAxis: {
- data: ['一月', '二月', '三月', '四月', '五月','六月','七月','八月','九月','十月','十一月','十二月',]
+ type: 'category',
+ data: ['生产部', '质检部', '采购部', '物流部', '技术部', '人事部', '财务部', '安环部', 'IT部']
+ },
+ yAxis: {
+ type: 'value'
},
- yAxis: {},
series: [{
- name: 'data1',
+ name: '人员数量',
type: 'bar',
- data: [5, 20, 36, 10, 10,15,16,20,12,13,35,12] // 第一条柱状图的数据
- }, {
- name: 'data2',
- type: 'bar',
- data: [15, 10, 25, 8, 15,8,30,12,11,18,25,12] // 第二条柱状图的数据
+ data: [2, 1, 1, 1, 1, 1, 1, 1, 1],
+ itemStyle: {
+ color: function(params) {
+ var colorList = ['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83', '#ca8622', '#bda29a','#6e7074'];
+ return colorList[params.dataIndex];
+ }
+ }
}]
};
- barChart.setOption(optionBar);
-
-
+ departmentChart.setOption(departmentOption);
+ });
+
+
diff --git a/zjkglxt/src/main/resources/static/route/pages/index.html b/zjkglxt/src/main/resources/static/route/pages/index.html
index bb94c7b..4e94d15 100644
--- a/zjkglxt/src/main/resources/static/route/pages/index.html
+++ b/zjkglxt/src/main/resources/static/route/pages/index.html
@@ -1,33 +1,33 @@
-
+
专家库管理系统
-
-
+
+
-
+
-
-
头像
-
账号名称
-
- -
-
-
资源配置
+
+
+
-
+
+
-
管理员
@@ -35,82 +35,119 @@
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
-
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+
-
-
-
-
+
diff --git a/zxcpxt/src/main/resources/static/route/pages/index.html b/zxcpxt/src/main/resources/static/route/pages/index.html
index d25bb4b..3bf6880 100644
--- a/zxcpxt/src/main/resources/static/route/pages/index.html
+++ b/zxcpxt/src/main/resources/static/route/pages/index.html
@@ -1,14 +1,14 @@
-
+
在线测评系统
-
+
@@ -69,19 +69,45 @@
欢迎使用在线测评系统
+
-
+
diff --git a/zxyxykhxt/src/main/resources/static/route/pages/index.html b/zxyxykhxt/src/main/resources/static/route/pages/index.html
index 2717ac8..959103c 100644
--- a/zxyxykhxt/src/main/resources/static/route/pages/index.html
+++ b/zxyxykhxt/src/main/resources/static/route/pages/index.html
@@ -1,14 +1,14 @@
-
+
在线研修与考核系统
-
+
@@ -69,15 +69,45 @@
欢迎使用在线研修与考核系统
-
-
-
-
+
+
@@ -90,6 +120,7 @@
From 917efb2106d21395fedd5e4d3d66fc610e155861 Mon Sep 17 00:00:00 2001
From: TS-QD1
Date: Thu, 3 Jul 2025 14:51:13 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E8=B0=83=E6=95=B4index?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.gitignore | 2 +-
.../resources/static/route/pages/index.html | 1498 ++++++++++++---
.../resources/static/route/pages/index.html | 1537 ++++++++++++++--
.../assets/crpm/index/index2/index2.css | 6 +-
.../resources/static/route/pages/index.html | 1622 +++++++++++++++--
.../resources/static/route/pages/index.html | 1166 ++++++++++--
.../assets/crpm/index/index4/index4.css | 4 +-
.../resources/static/route/pages/index.html | 1249 +++++++++++--
.../resources/static/route/pages/index.html | 1259 +++++++++++--
9 files changed, 7333 insertions(+), 1010 deletions(-)
diff --git a/.gitignore b/.gitignore
index e23340f..b1f148e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -39,4 +39,4 @@ mvnw*
/src/main/resources/ftl/crpm/code/frontend-generate/
/src/main/resources/ftl/crpm/code/generate/
-db/
\ No newline at end of file
+/db/**
\ No newline at end of file
diff --git a/gcsbyxjkglxt/src/main/resources/static/route/pages/index.html b/gcsbyxjkglxt/src/main/resources/static/route/pages/index.html
index 8426bc5..d08ca77 100644
--- a/gcsbyxjkglxt/src/main/resources/static/route/pages/index.html
+++ b/gcsbyxjkglxt/src/main/resources/static/route/pages/index.html
@@ -9,6 +9,431 @@
+
@@ -72,26 +497,462 @@
-
-
-
-
+
+
+
+
+
+
128
+
+ 5.3% 相比昨日
+
+
+
+
+
+
+
2.7%
+
+ 0.5% 相比上周
+
+
+
+
+
+
+
12,540kWh
+
+ 3.2% 相比昨日
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ | 设备名称 |
+ 设备编号 |
+ 状态 |
+ 运行时间(小时) |
+ 温度(°C) |
+ 电流(A) |
+ 电压(V) |
+ 功率(kW) |
+ 故障次数 |
+ 操作 |
+
+
+
+
+ | 生产线A-主电机 |
+ SB-001 |
+ 运行中 |
+ 18.5 |
+ 58 |
+ 42.5 |
+ 380 |
+ 25.6 |
+ 0 |
+ |
+
+
+ | 生产线B-主电机 |
+ SB-002 |
+ 运行中 |
+ 16.2 |
+ 62 |
+ 45.8 |
+ 380 |
+ 28.1 |
+ 1 |
+ |
+
+
+ | 生产线C-主电机 |
+ SB-003 |
+ 警告 |
+ 14.8 |
+ 78 |
+ 52.3 |
+ 378 |
+ 31.5 |
+ 2 |
+ |
+
+
+ | 冷却系统-泵1 |
+ SB-004 |
+ 运行中 |
+ 20.0 |
+ 45 |
+ 18.7 |
+ 380 |
+ 11.2 |
+ 0 |
+ |
+
+
+ | 冷却系统-泵2 |
+ SB-005 |
+ 已停止 |
+ 0 |
+ 25 |
+ 0 |
+ 0 |
+ 0 |
+ 3 |
+ |
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
运行中
+
温度: 58°C | 功率: 25.6kW
+
+
+
+
+
+
+
运行中
+
温度: 62°C | 功率: 28.1kW
+
+
+
+
+
+
+
警告
+
温度: 78°C | 功率: 31.5kW
+
+
+
+
+
+
+
运行中
+
温度: 45°C | 功率: 11.2kW
+
+
+
+
+
+
+
已停止
+
温度: 25°C | 功率: 0kW
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
接触器 CJX2-6511
+
BJ-003
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
生产线A-主电机
+
预计维护时间: 2023-06-20
+
+
+
+
+
+
+
生产线C-主电机
+
预计维护时间: 2023-06-18
+
+
+
+
+
+
+
冷却系统-泵2
+
预计维护时间: 2023-06-17
+
+
+
+
+
+
+
生产线B-主电机
+
预计维护时间: 2023-06-25
+
+
+
+
+
+
+
+
+
@@ -127,297 +988,346 @@
homepage.style.display = 'none';
});
});
- // 饼状图1
- var pieChartOne = echarts.init(document.getElementById('pieChartOne'));
- var optionPieOne = {
- animation: false,
- tooltip: {
- trigger: 'item'
- },
-
- series: [{
- //name: '嘻嘻',//
- type: 'pie',
- radius: ['0%', '70%'],
- data: [
- {value: 150, name: 'data1'},
- {value: 274, name: 'data2'},
- {value: 310, name: 'data3'},
- {value: 335, name: 'data4'},
- {value: 400, name: 'data5'}
- ]
- }]
- };
- pieChartOne.setOption(optionPieOne);
- // 饼状图2
- var pieChartTwo = echarts.init(document.getElementById('pieChartTwo'));
- var optionPieTwo = {
- animation: false,
- tooltip: {
- trigger: 'item'
- },
-
- series: [{
- //name: '嘻嘻',//
- type: 'pie',
- radius: ['0%', '70%'],
- data: [
- {value: 200, name: 'data1'},
- {value: 300, name: 'data2'},
- {value: 500, name: 'data3'},
- {value: 335, name: 'data4'},
- {value: 400, name: 'data5'}
- ]
- }]
- };
- pieChartTwo.setOption(optionPieTwo);
- // 饼状图3
- var pieChartThree = echarts.init(document.getElementById('pieChartThree'));
- var optionPieThree = {
- animation: false,
- tooltip: {
- trigger: 'item'
- },
-
- series: [{
- //name: '嘻嘻',//
- type: 'pie',
- radius: ['0%', '70%'],
- data: [
- {value: 100, name: 'data1'},
- {value: 274, name: 'data2'},
- {value: 310, name: 'data3'},
- {value: 600, name: 'data4'},
- {value: 100, name: 'data5'}
- ]
- }]
- };
- pieChartThree.setOption(optionPieThree);
- // 饼状图4
- var pieChartFour = echarts.init(document.getElementById('pieChartFour'));
- var optionPieFour = {
- animation: false,
- tooltip: {
- trigger: 'item'
- },
-
- series: [{
- //name: '嘻嘻',//
- type: 'pie',
- radius: ['0%', '70%'],
- data: [
- {value: 150, name: 'data1'},
- {value: 274, name: 'data2'},
- {value: 500, name: 'data3'},
- {value: 335, name: 'data4'},
- {value: 400, name: 'data5'}
- ]
- }]
- };
- pieChartFour.setOption(optionPieFour);
- //折线图
- var lineChart = echarts.init(document.getElementById('lineChart'));
- var optionLine = {
- animation: false,
+ // 初始化图表
+ document.addEventListener('DOMContentLoaded', function() {
+ // 设备状态分布图表
+ const deviceStatusChart = echarts.init(document.getElementById('device-status-chart'));
+ deviceStatusChart.setOption({
title: {
- //text: '业务核心数据',//
- left: 'left', // Center align the title horizontally
+ text: '设备状态分布',
+ left: 'center',
+ textStyle: {
+ color: '#333',
+ fontSize: 14
+ }
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: '{a}
{b}: {c} ({d}%)'
+ },
+ legend: {
+ orient: 'vertical',
+ left: 'left',
+ data: ['运行中', '警告', '已停止', '维护中']
+ },
+ series: [
+ {
+ name: '设备状态',
+ type: 'pie',
+ radius: '55%',
+ center: ['50%', '60%'],
+ data: [
+ {value: 128, name: '运行中'},
+ {value: 18, name: '警告'},
+ {value: 12, name: '已停止'},
+ {value: 6, name: '维护中'}
+ ],
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }
+ ]
+ });
+
+ // 能耗趋势图表
+ const energyTrendChart = echarts.init(document.getElementById('energy-trend-chart'));
+ energyTrendChart.setOption({
+ title: {
+ text: '近30天能耗趋势',
+ left: 'center',
+ textStyle: {
+ color: '#333',
+ fontSize: 14
+ }
+ },
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross',
+ crossStyle: {
+ color: '#999'
+ }
+ }
+ },
+ legend: {
+ data: ['总能耗(kWh)', '平均功率(kW)'],
+ top: '10%',
+ left: 'center'
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
- data: ['2024-1', '2024-2', '2024-3', '2024-4', '2024-5', '2024-6', '2024-7']
+ data: Array.from({length: 30}, (_, i) => `${i+1}日`)
},
- yAxis: {
- type: 'value'
- },
- tooltip: {
- trigger: 'axis' // 设置触发类型为坐标轴触发
- },
- series: [{
- data: [820, 733, 901, 600, 1290, 500, 1320],
- type: 'line',
- smooth: true,
- areaStyle: {}
- }]
- };
- lineChart.setOption(optionLine);
-
- var currentIndex = -1;
- var interval = 1000; // 切换间隔时间，单位是毫秒
- var timer; // 定时器变量
+ yAxis: [
+ {
+ type: 'value',
+ name: '能耗(kWh)',
+ min: 0,
+ axisLabel: {
+ formatter: '{value}'
+ }
+ },
+ {
+ type: 'value',
+ name: '功率(kW)',
+ min: 0,
+ axisLabel: {
+ formatter: '{value}'
+ }
+ }
+ ],
+ series: [
+ {
+ name: '总能耗(kWh)',
+ type: 'line',
+ data: Array.from({length: 30}, () => Math.floor(Math.random() * 5000) + 10000)
+ },
+ {
+ name: '平均功率(kW)',
+ type: 'line',
+ yAxisIndex: 1,
+ data: Array.from({length: 30}, () => Math.floor(Math.random() * 20) + 40)
+ }
+ ]
+ });
- // 自动触发选中状态并每隔1秒自动向下一个触发
- function startAutoPlay() {
- timer = setInterval(function() {
- var dataLen = optionLine.series[0].data.length;
- // 取消之前高亮的图形
- lineChart.dispatchAction({
- type: 'downplay',
- seriesIndex: 0,
- dataIndex: currentIndex
- });
- currentIndex = (currentIndex + 1) % dataLen;
- // 高亮当前图形
- lineChart.dispatchAction({
- type: 'highlight',
- seriesIndex: 0,
- dataIndex: currentIndex
- });
- // 显示 tooltip
- lineChart.dispatchAction({
- type: 'showTip',
- seriesIndex: 0,
- dataIndex: currentIndex
- });
- }, interval);
- }
-
- // 开始自动播放
- startAutoPlay();
-
- // 鼠标悬停在图表上时暂停自动播放
- lineChart.on('mouseover', function() {
- clearInterval(timer);
- });
-
- // 鼠标离开图表区域时恢复自动播放
- lineChart.on('mouseout', function() {
- startAutoPlay();
- });
- // 饼状图
- var pieChart = echarts.init(document.getElementById('pieChart'));
- var optionPie = {
- animation: false,
+ // 设备温度监控图表
+ const temperatureChart = echarts.init(document.getElementById('temperature-chart'));
+ temperatureChart.setOption({
title: {
- //text: '订单占比系统',//
- left: 'left'
+ text: '主要设备温度监控',
+ left: 'center',
+ textStyle: {
+ color: '#333',
+ fontSize: 14
+ }
},
tooltip: {
- trigger: 'item'
+ trigger: 'axis'
},
- legend: {
- orient: 'vertical',
- left: 'right'
- },
- series: [{
- //name: '嘻嘻',//
- type: 'pie',
- radius: ['60%', '70%'],
- data: [
- {value: 150, name: 'data1'},
- {value: 274, name: 'data2'},
- {value: 310, name: 'data3'},
- {value: 335, name: 'data4'},
- {value: 400, name: 'data5'}
- ]
- }]
- };
- pieChart.setOption(optionPie);
- //柱状图1
- var barChartOne = echarts.init(document.getElementById('barChartOne'));
- var optionBarOne = {
- animation: false,
- title: {
- //text: '业务核心数据'//
- },
- tooltip: {},
legend: {
- data: ['data1', 'data2'] ,
- left: 'right'
+ data: ['生产线A-主电机', '生产线B-主电机', '生产线C-主电机', '冷却系统-泵1', '冷却系统-泵2'],
+ top: '10%',
+ left: 'center'
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true
},
xAxis: {
- data: ['一月', '二月', '三月', '四月', '五月','六月','七月','八月','九月','十月','十一月','十二月',]
+ type: 'category',
+ data: ['00:00', '04:00', '08:00', '12:00', '16:00', '20:00']
},
- yAxis: {},
- series: [{
- name: 'data1',
- type: 'bar',
- data: [5, 20, 36, 10, 10,15,16,20,12,13,35,12] // 第一条柱状图的数据
- }, {
- name: 'data2',
- type: 'bar',
- data: [15, 10, 25, 8, 15,8,30,12,11,18,25,12] // 第二条柱状图的数据
- }]
- };
- barChartOne.setOption(optionBarOne);
- //柱状图2
- var barChartTwo = echarts.init(document.getElementById('barChartTwo'));
- var optionBarTwo = {
- animation: false,
- title: {
- //text: '业务核心数据'//
+ yAxis: {
+ type: 'value',
+ name: '温度(°C)',
+ min: 0,
+ max: 100
},
- tooltip: {
- trigger: 'axis',
- axisPointer: {
- type: 'shadow'
- }
- },
- legend: {
- data: ['Profit', 'Expenses', 'Income']
- },
- grid: {
- left: '3%',
- right: '4%',
- bottom: '3%',
- containLabel: true
- },
- xAxis: [
- {
- type: 'value'
- }
- ],
- yAxis: [
- {
- type: 'category',
- axisTick: {
- show: false
- },
- data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
- }
- ],
- series: [
- {
- name: 'Profit',
- type: 'bar',
- label: {
- show: true,
- position: 'inside'
- },
- emphasis: {
- focus: 'series'
- },
- data: [200, 170, 240, 244, 200, 220, 210]
- },
- {
- name: 'Income',
- type: 'bar',
- stack: 'Total',
- label: {
- show: true
- },
- emphasis: {
- focus: 'series'
- },
- data: [320, 302, 341, 374, 390, 450, 420]
- },
- {
- name: 'Expenses',
- type: 'bar',
- stack: 'Total',
- label: {
- show: true,
- position: 'left'
- },
- emphasis: {
- focus: 'series'
- },
- data: [-120, -132, -101, -134, -190, -230, -210]
- }
- ]
- };
- barChartTwo.setOption(optionBarTwo);
+ series: [
+ {
+ name: '生产线A-主电机',
+ type: 'line',
+ data: [45, 48, 55, 58, 56, 50]
+ },
+ {
+ name: '生产线B-主电机',
+ type: 'line',
+ data: [47, 50, 59, 62, 60, 53]
+ },
+ {
+ name: '生产线C-主电机',
+ type: 'line',
+ data: [50, 55, 70, 78, 75, 65]
+ },
+ {
+ name: '冷却系统-泵1',
+ type: 'line',
+ data: [38, 40, 42, 45, 43, 39]
+ },
+ {
+ name: '冷却系统-泵2',
+ type: 'line',
+ data: [25, 25, 25, 25, 25, 25]
+ }
+ ]
+ });
+
+ // 设备故障类型图表
+ const faultTypeChart = echarts.init(document.getElementById('fault-type-chart'));
+ faultTypeChart.setOption({
+ title: {
+ text: '设备故障类型分布',
+ left: 'center',
+ textStyle: {
+ color: '#333',
+ fontSize: 14
+ }
+ },
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'shadow'
+ }
+ },
+ xAxis: {
+ type: 'value',
+ min: 0
+ },
+ yAxis: {
+ type: 'category',
+ data: ['电气故障', '机械故障', '传感器故障', '控制系统故障', '其他故障']
+ },
+ series: [
+ {
+ name: '故障次数',
+ type: 'bar',
+ data: [28, 22, 15, 10, 5]
+ }
+ ]
+ });
+
+ // 监听窗口大小变化，调整图表
+ window.addEventListener('resize', function() {
+ deviceStatusChart.resize();
+ energyTrendChart.resize();
+ temperatureChart.resize();
+ faultTypeChart.resize();
+ });
+
+ // 刷新按钮事件
+ document.getElementById('refresh-btn').addEventListener('click', function() {
+ // 显示加载状态
+ this.innerHTML = ' 刷新中...';
+ this.disabled = true;
+
+ // 模拟数据刷新
+ setTimeout(() => {
+ // 更新设备状态分布图表
+ deviceStatusChart.setOption({
+ series: [
+ {
+ data: [
+ {value: Math.floor(Math.random() * 20) + 120, name: '运行中'},
+ {value: Math.floor(Math.random() * 10) + 10, name: '警告'},
+ {value: Math.floor(Math.random() * 5) + 5, name: '已停止'},
+ {value: Math.floor(Math.random() * 5) + 3, name: '维护中'}
+ ]
+ }
+ ]
+ });
+
+ // 更新能耗趋势图表
+ energyTrendChart.setOption({
+ series: [
+ {
+ data: Array.from({length: 30}, () => Math.floor(Math.random() * 5000) + 10000)
+ },
+ {
+ data: Array.from({length: 30}, () => Math.floor(Math.random() * 20) + 40)
+ }
+ ]
+ });
+
+ // 更新温度监控图表
+ temperatureChart.setOption({
+ series: [
+ {
+ data: [
+ Math.floor(Math.random() * 10) + 40,
+ Math.floor(Math.random() * 10) + 45,
+ Math.floor(Math.random() * 10) + 50,
+ Math.floor(Math.random() * 10) + 55,
+ Math.floor(Math.random() * 10) + 50,
+ Math.floor(Math.random() * 10) + 45
+ ]
+ },
+ {
+ data: [
+ Math.floor(Math.random() * 10) + 45,
+ Math.floor(Math.random() * 10) + 50,
+ Math.floor(Math.random() * 10) + 55,
+ Math.floor(Math.random() * 10) + 60,
+ Math.floor(Math.random() * 10) + 55,
+ Math.floor(Math.random() * 10) + 50
+ ]
+ },
+ {
+ data: [
+ Math.floor(Math.random() * 15) + 50,
+ Math.floor(Math.random() * 15) + 55,
+ Math.floor(Math.random() * 15) + 65,
+ Math.floor(Math.random() * 15) + 75,
+ Math.floor(Math.random() * 15) + 70,
+ Math.floor(Math.random() * 15) + 60
+ ]
+ },
+ {
+ data: [
+ Math.floor(Math.random() * 8) + 35,
+ Math.floor(Math.random() * 8) + 38,
+ Math.floor(Math.random() * 8) + 40,
+ Math.floor(Math.random() * 8) + 45,
+ Math.floor(Math.random() * 8) + 42,
+ Math.floor(Math.random() * 8) + 38
+ ]
+ },
+ {
+ data: [25, 25, 25, 25, 25, 25]
+ }
+ ]
+ });
+
+ // 更新故障类型图表
+ faultTypeChart.setOption({
+ series: [
+ {
+ data: [
+ Math.floor(Math.random() * 10) + 20,
+ Math.floor(Math.random() * 10) + 15,
+ Math.floor(Math.random() * 8) + 10,
+ Math.floor(Math.random() * 5) + 5,
+ Math.floor(Math.random() * 3) + 2
+ ]
+ }
+ ]
+ });
+
+ // 恢复按钮状态
+ this.innerHTML = ' 刷新数据';
+ this.disabled = false;
+
+ // 显示刷新成功提示
+ const notification = document.createElement('div');
+ notification.className = 'notification';
+ notification.style.cssText = 'position: fixed; bottom: 20px; right: 20px; background-color: #4CAF50; color: white; padding: 10px 15px; border-radius: 4px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); z-index: 1000;';
+ notification.innerHTML = ' 数据刷新成功';
+ document.body.appendChild(notification);
+
+ // 3秒后移除提示
+ setTimeout(() => {
+ notification.style.opacity = '0';
+ notification.style.transition = 'opacity 0.5s';
+ setTimeout(() => {
+ document.body.removeChild(notification);
+ }, 500);
+ }, 3000);
+ }, 1000);
+ });
+ });