-
+
+
+ 电池总数{{ deviceNum }}
+
+
+ 电池白名单数{{ whiteNum }}
+
+
- 代派单：150
+ 处理中：{{ handleNum }}
- 处理中：100
+ 审批中：{{ approveNum }}
- 已关闭：200
+ 已完成：{{ finishNum }}
@@ -95,14 +116,15 @@ import resize from '../dashboard/mixins/resize';
import boxBoardTit from './boxBoardTit';
import boxBoardBody from './boxBoardBody';
-import leftTop from './components/leftTop';
import { parseTime } from '@/utils/ruoyi';
+import myStyleJson from './custom_map_config.json';
+
export default {
name: 'Chart',
mixins: [resize],
- components: { boxBoardTit, boxBoardBody, leftTop },
+ components: { boxBoardTit, boxBoardBody },
data() {
return {
bottomChart: null,
@@ -123,21 +145,53 @@ export default {
'2': '待回单',
'3': '已回单'
},
- myStyleJson: [
- {
- featureType: 'land',
- elementType: 'geometry',
- stylers: {
- color: '#f5f6f7ff'
- }
- }
- ]
+ myStyleJson,
+ rnNum: 0,
+ ttNum: 0,
+ deviceNum: 0,
+ whiteNum: 0,
+ handleNum: 0,
+ finishNum: 0,
+ approveNum: 0,
+ projectNum: 0,
+ productNum: 0,
+ userNum: 0,
+ updateFileNum: 0,
+ orderNum: 0,
+ warnNum: 0
};
},
computed: {
time() {
return parseTime(this.date, '{h} : {i} : {s}');
+ },
+ num1() {
+ return (
+ (
+ (this.handleNum /
+ (this.handleNum + this.approveNum + this.finishNum)) *
+ 100
+ ).toFixed(2) - 0 || 0
+ );
+ },
+ num2() {
+ return (
+ (
+ (this.approveNum /
+ (this.handleNum + this.approveNum + this.finishNum)) *
+ 100
+ ).toFixed(2) - 0 || 0
+ );
+ },
+ num3() {
+ return (
+ (
+ (this.finishNum /
+ (this.handleNum + this.approveNum + this.finishNum)) *
+ 100
+ ).toFixed(2) - 0 || 0
+ );
}
},
mounted() {
@@ -149,32 +203,74 @@ export default {
timer = null;
});
- this.getData().then(({ code, msg, list, work, activity, devCount }) => {
- if (200 == code) {
- let spotList = [];
- list.map(v => {
- spotList.push({
- id: v.id,
- deviceId: v.deviceId,
- deviceName: v.deviceName,
- value: [parseFloat(v.longitude), parseFloat(v.latitude)]
+ this.getData().then(
+ ({
+ code,
+ msg,
+ list,
+ work,
+ activity,
+ devCount,
+ deviceNum,
+ whiteNum,
+ handleNum,
+ finishNum,
+ approveNum,
+ deviceMonthNum,
+ rnNum,
+ ttNum,
+ projectNum,
+ productNum,
+ userNum,
+ updateFileNum,
+ orderNum,
+ warnNum,
+ warnMonthNum
+ }) => {
+ if (200 == code) {
+ let spotList = [];
+ list.map(v => {
+ spotList.push({
+ id: v.id,
+ deviceId: v.deviceId,
+ deviceName: v.deviceName,
+ value: [parseFloat(v.longitude), parseFloat(v.latitude)]
+ });
});
- });
- this.spotList = spotList;
- this.devCount = devCount;
+ // this.spotList = spotList;
+ this.spotList = [];
+ this.devCount = devCount;
- this.$nextTick(() => {
- this.initBmpChart();
- // this.initTicketAllChart(work);
- // this.initAlarmAllChart(activity);
- this.initCenterChart(activity);
- this.initBottomChart();
- this.initTopChart();
- this.initAlarmTrendChart();
- });
+ this.deviceNum = deviceNum;
+ this.whiteNum = whiteNum;
+
+ this.handleNum = handleNum;
+ this.finishNum = finishNum;
+ this.approveNum = approveNum;
+
+ this.rnNum = rnNum;
+ this.ttNum = ttNum;
+
+ (this.projectNum = projectNum),
+ (this.productNum = productNum),
+ (this.userNum = userNum),
+ (this.updateFileNum = updateFileNum),
+ (this.orderNum = orderNum),
+ (this.warnNum = warnNum);
+
+ this.$nextTick(() => {
+ this.initBmpChart();
+ // this.initTicketAllChart(work);
+ // this.initAlarmAllChart(activity);
+ this.initCenterChart(activity);
+ this.initBottomChart(deviceMonthNum);
+ this.initTopChart();
+ this.initAlarmTrendChart(warnMonthNum);
+ });
+ }
}
- });
+ );
// this.getTicketData().then(({ code, msg, day, month }) => {
// if (200 == code) {
@@ -193,12 +289,12 @@ export default {
method: 'get'
});
},
- getTicketData() {
- return request({
- url: '/system/warning/warningList',
- method: 'get'
- });
- },
+ // getTicketData() {
+ // return request({
+ // url: '/system/warning/warningList',
+ // method: 'get'
+ // });
+ // },
initTicketAllChart(ticketAll) {
if (!this.ticketAllChart) {
this.ticketAllChart = echarts.init(this.$refs.ticketAll);
@@ -254,25 +350,20 @@ export default {
};
this.ticketAllChart.setOption(option);
},
- initAlarmTrendChart() {
+ initAlarmTrendChart(monthNum) {
this.alarmTrendChart = echarts.init(this.$refs.alarmTrend);
+ let months = [];
+ let nums = [];
+ monthNum.map(item => {
+ // item.month += '月';
+ months.push(item.month);
+ nums.push(item.num);
+ });
let option = {
xAxis: {
+ name: '数量',
type: 'category',
- data: [
- '01月',
- '02月',
- '03月',
- '04月',
- '05月',
- '06月',
- '07月',
- '08月',
- '09月',
- '10月',
- '11月',
- '12月'
- ],
+ data: months,
axisLine: {
//这是x轴文字颜色
lineStyle: {
@@ -281,6 +372,7 @@ export default {
}
},
yAxis: {
+ name: '月份',
type: 'value',
axisLine: {
//这是x轴文字颜色
@@ -291,20 +383,7 @@ export default {
},
series: [
{
- data: [
- 820,
- 932,
- 901,
- 934,
- 1290,
- 1330,
- 1320,
- 820,
- 932,
- 901,
- 934,
- 1290
- ],
+ data: nums,
// 线的颜色
lineStyle: {
color: '#06ccf9'
@@ -369,7 +448,7 @@ export default {
});
},
initCenterChart(alarmAll) {
- // initCenterChart1(alarmAll) {
+ // initCenterChart1(alarmAll) {
this.centerChart = echarts.init(this.$refs.centerRight);
let snapAlarmAll = [];
for (let index = 0; index < 4; index++) {
@@ -457,7 +536,7 @@ export default {
},
initAlarmAllChart(alarmAll) {
- // initCenterChart(alarmAll) {
+ // initCenterChart(alarmAll) {
// if (!this.alarmAllChart) {
// this.alarmAllChart = echarts.init(this.$refs.alarmAll);
// }
@@ -471,7 +550,7 @@ export default {
}
}
console.log(snapAlarmAll);
- debugger
+ debugger;
let level4 = '四级告警 ' + snapAlarmAll[3];
let level3 = '三级告警 ' + snapAlarmAll[2];
let level2 = '二级告警 ' + snapAlarmAll[1];
@@ -566,25 +645,20 @@ export default {
series: series
});
},
- initBottomChart() {
+ initBottomChart(monthNum) {
this.bottomChart = echarts.init(this.$refs.bottomLeftChart);
+ let months = [];
+ let nums = [];
+ monthNum.map(item => {
+ // item.month += '月';
+ months.push(item.month);
+ nums.push(item.num);
+ });
let option = {
xAxis: {
+ name: '数量',
type: 'category',
- data: [
- '01月',
- '02月',
- '03月',
- '04月',
- '05月',
- '06月',
- '07月',
- '08月',
- '09月',
- '10月',
- '11月',
- '12月'
- ],
+ data: months,
axisLine: {
//这是x轴文字颜色
lineStyle: {
@@ -593,6 +667,7 @@ export default {
}
},
yAxis: {
+ name: '月份',
type: 'value',
axisLine: {
//这是y轴文字颜色
@@ -615,7 +690,7 @@ export default {
{
type: 'bar',
barWidth: 20,
- data: [100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 900, 800], //数据
+ data: nums, //数据
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -648,7 +723,7 @@ export default {
let option = {
tooltip: {
trigger: 'item',
- formatter: "{a}
{b}: {c} ({d}%)"
+ formatter: '{a}
{b}: {c} ({d}%)'
},
legend: {
orient: 'vertical',
@@ -657,30 +732,39 @@ export default {
color: '#fff'
}
},
- series : [{
- name: '设备详情',
- type: 'pie',
- radius: ['40%', '70%'],
- center: ['50%', '50%'],
- data:[
- { value: 580, name: '锐能设备',itemStyle: { color: '#0a7ef6' } },
- { value: 484, name: '铁塔设备',itemStyle: { color: '#77c8ff' } },
+ series: [
+ {
+ name: '设备详情',
+ type: 'pie',
+ radius: ['40%', '70%'],
+ center: ['50%', '50%'],
+ data: [
+ {
+ value: this.rnNum,
+ name: '锐能设备',
+ itemStyle: { color: '#0a7ef6' }
+ },
+ {
+ value: this.ttNum,
+ name: '铁塔设备',
+ itemStyle: { color: '#77c8ff' }
+ }
],
- itemStyle: {
- emphasis: {
- shadowBlur: 10,
- shadowOffsetX: 0,
- shadowColor: 'rgba(0, 0, 0, 0.5)'
- },
- normal:{
- label:{
- show: true,
- // formatter: '{b} : {c} ({d}%)'
- },
- labelLine :{show:true}
- }
- }
+ itemStyle: {
+ emphasis: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ },
+ normal: {
+ label: {
+ show: true
+ // formatter: '{b} : {c} ({d}%)'
+ },
+ labelLine: { show: true }
+ }
}
+ }
]
};
this.topChart.setOption(option);
@@ -804,6 +888,7 @@ export default {
width: 100%;
height: 100%;
position: relative;
+ user-select: none;
background-image: url('../../assets/image/chartbg.png');
background-size: cover;
}
@@ -815,12 +900,11 @@ export default {
text-align: center;
vertical-align: middle;
overflow: hidden;
- pointer-events: none;
+ // pointer-events: none;
}
.center,
.left,
.right {
- border: 1px solid #f00;
position: absolute;
top: 0;
width: 28vw;
@@ -853,6 +937,32 @@ export default {
right: 0;
padding: 70px 35px 15px 2px;
}
+.content-box {
+ // padding: 10px;
+ padding: 10px 30px;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-evenly;
+ height: calc(100% - 20px);
+ div {
+ // border: 1px solid #f00;
+ // box-shadow: 0px 0px 10px 2px rgb(60,172,238) inset;
+ background-image: url('../../assets/image/ltbg.png');
+ background-size: 100% 100%;
+ padding: 10px 20px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ > span:nth-child(2) {
+ font-weight: 700;
+ font-size: 24px;
+ color: #ff4c4c;
+ }
+ }
+ > div:nth-child(2) span:nth-child(2) {
+ color: #35ffff;
+ }
+}
.my_context {
width: 100%;
height: 100%;
@@ -875,11 +985,11 @@ export default {
height: 100%;
padding-top: 15px;
}
-.my_cenbottom{
+.my_cenbottom {
display: flex;
justify-content: space-evenly;
margin-top: 23px;
- div{
+ div {
width: 210px;
height: 50px;
display: flex;
@@ -887,7 +997,7 @@ export default {
align-items: center;
background-image: url('../../assets/image/xiaokuang.png');
background-size: cover;
- span{
+ span {
font-size: 20px;
}
}
diff --git a/src/views/workOrderManage/orderHistory/detail.vue b/src/views/workOrderManage/orderHistory/detail.vue
index 9a3c69f..79d2831 100644
--- a/src/views/workOrderManage/orderHistory/detail.vue
+++ b/src/views/workOrderManage/orderHistory/detail.vue
@@ -152,8 +152,8 @@ export default {
派单编号：{this.tableHeader.id}
派单时间：{this.tableHeader.createTime}
处理人：{this.tableHeader.nick_name}
-
提交时间：{this.tableHeader.finishTime}
-
通过时间：{this.tableHeader.updateTime}
+
提交时间：{this.tableHeader.updateTime}
+
通过时间：{this.tableHeader.finishTime}