From deb3e33f09302b7e65ff74d0e0d33349769dfd43 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BE=99=E8=BF=90=E6=A8=A1?= <1724894114@qq.com> Date: Thu, 17 Oct 2024 22:49:20 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=95=B0=E6=8D=AE=E9=9D=A2?= =?UTF-8?q?=E6=9D=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/directives/number.js | 27 +++++++++ src/scui.js | 2 + src/style/home.scss | 2 +- src/views/home/console/components/bar.vue | 18 +++++- .../home/console/components/progress.vue | 7 ++- src/views/home/console/index.vue | 58 ++++++++++++------- 6 files changed, 86 insertions(+), 28 deletions(-) create mode 100644 src/directives/number.js diff --git a/src/directives/number.js b/src/directives/number.js new file mode 100644 index 0000000..42b51d8 --- /dev/null +++ b/src/directives/number.js @@ -0,0 +1,27 @@ +export default { + mounted(el, binding) { + const value = binding.value; + if (value !== undefined && value !== null) { + el.textContent = formatNumber(value); + } + }, + updated(el, binding){ + const value = binding.value; + if (value !== undefined && value !== null) { + el.textContent = formatNumber(value); + } + }, + unmounted(el){ + el.removeEventListener('click', el.handler) + } +} + +function formatNumber(num) { + if (num === null || num === undefined) { + return ''; + } + + const parts = num.toString().split('.'); + parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ','); + return parts.join('.'); +} diff --git a/src/scui.js b/src/scui.js index 23d3749..7466252 100644 --- a/src/scui.js +++ b/src/scui.js @@ -40,6 +40,7 @@ import authsAll from './directives/authsAll' import role from './directives/role' import time from './directives/time' import copy from './directives/copy' +import number from './directives/number' import errorHandler from './utils/errorHandler' import * as elIcons from '@element-plus/icons-vue' @@ -94,6 +95,7 @@ export default { app.directive('role', role) app.directive('time', time) app.directive('copy', copy) + app.directive('number', number) //统一注册el-icon图标 for(let icon in elIcons){ diff --git a/src/style/home.scss b/src/style/home.scss index 3238fb8..1c7eeb2 100644 --- a/src/style/home.scss +++ b/src/style/home.scss @@ -19,7 +19,7 @@ background: #F4F5F9; border-radius: 4px; .btnItem{ - padding: 3px 16px; + padding: 4px 18px; color: #444;font-size: 12px;font-weight: initial; cursor: pointer; } diff --git a/src/views/home/console/components/bar.vue b/src/views/home/console/components/bar.vue index 84d1f24..51e5e7e 100644 --- a/src/views/home/console/components/bar.vue +++ b/src/views/home/console/components/bar.vue @@ -103,15 +103,29 @@ export default { reqParams:{ page:1, pageSize:30, - date_type:'month', + date_type:this.dataType, dateSelect:[], start:'', end:'', } } }, + props:{ + dataType:{ + type:String + } + }, + watch:{ + dataType:{ + handler(val){ + this.reqParams.date_type = val; + this.getData(); + }, + immediate:true + } + }, mounted() { - this.getData(); + // this.getData(); }, methods:{ async getData() { diff --git a/src/views/home/console/components/progress.vue b/src/views/home/console/components/progress.vue index ef4775b..39eaa99 100644 --- a/src/views/home/console/components/progress.vue +++ b/src/views/home/console/components/progress.vue @@ -22,7 +22,7 @@ export default { immediate:true, handler(val){ let option = this.$TOOL.objCopy(this.option); - option.series[0].data[0].value = val.value; + option.series[0].data[0].value = val.value==0?20:90; option.series[0].data[0].name = val.title; this.option = option; } @@ -46,7 +46,7 @@ export default { roundCap: true, clip: false, itemStyle: { - borderWidth: 1, + borderWidth: 12, } }, axisLine: { @@ -90,10 +90,11 @@ export default { value: 0, name: '', title: { + fontSize:12, offsetCenter: ['0%', '30%'] }, detail: { - fontSize:25, + fontSize:30, valueAnimation: true, offsetCenter: ['0%', '-10%'] } diff --git a/src/views/home/console/index.vue b/src/views/home/console/index.vue index ef9f6cd..0dff6db 100644 --- a/src/views/home/console/index.vue +++ b/src/views/home/console/index.vue @@ -9,7 +9,7 @@
-
{{item.value}}
+
{{item.value}}
{{item.title}}
@@ -21,7 +21,6 @@ - @@ -32,7 +31,7 @@
-
{{item.value}}
+
{{item.value}}
{{item.title}}
@@ -48,7 +47,7 @@
-
+
{{item.num}} 条
@@ -86,9 +85,14 @@
-
成本汇总
+
+ 成本汇总 +
+
{{item.label}}
+
+
- +
@@ -133,16 +137,17 @@ export default { data(){ return{ workOrder:[ - {title:"总工单数",value:2340,icon:''}, - {title:"已维修数",value:560,icon:''}, - {title:"待维修数",value:460,icon:''}, - {title:"0BD 数",value:560,icon:''}, - {title:"1BD 数",value:703,icon:''}, - {title:"当前预约数",value:180,icon:''}, + {title:"总工单数",value:0,icon:''}, + {title:"已维修数",value:0,icon:''}, + {title:"待维修数",value:0,icon:''}, + {title:"超期工单数",value:0,icon:''}, + {title:"0BD 数",value:0,icon:''}, + {title:"1BD 数",value:0,icon:''}, + {title:"当前预约数",value:0,icon:''}, ], spareParts:[ - {title:"维保库存数",value:45,icon:'sc-icon-HomeInventory'}, - {title:"预警库存MPN数",value:20,icon:'sc-icon-EarlyWarnBj'}, + {title:"维保库存数",value:0,icon:'sc-icon-HomeInventory'}, + {title:"预警库存MPN数",value:0,icon:'sc-icon-EarlyWarnBj'}, ], reachStandard:[ {title:"国内SLA 月达标率",value:0}, @@ -152,13 +157,20 @@ export default { ], reachShow:true, briefing:[ - {num:9376,name:'待提交数',icon:'sc-icon-Gather'}, - {num:126,name:'计划维修数',icon:'sc-icon-HomeSetup'}, - {num:756,name:'正在维修数',icon:'sc-icon-Repaired'}, - {num:662,name:'待审核数',icon:'sc-icon-EarlyWarn'}, - {num:3553,name:'个人中心',icon:'sc-icon-HomeUser'}, - {num:253,name:'个人中心',icon:'sc-icon-HomeChart'}, + {num:0,name:'待提交数',icon:'sc-icon-Gather'}, + {num:0,name:'计划维修数',icon:'sc-icon-HomeSetup'}, + {num:0,name:'正在维修数',icon:'sc-icon-Repaired'}, + {num:0,name:'待审核数',icon:'sc-icon-EarlyWarn'}, + {num:0,name:'占位',icon:'sc-icon-HomeUser'}, + {num:0,name:'占位',icon:'sc-icon-HomeChart'}, ], + dataTypeList:[ + {date_type:'hour',label:'按时'}, + {date_type:'day',label:'按天'}, + {date_type:'month',label:'按月'}, + {date_type:'year',label:'按年'}, + ], + dataType:"month" } }, mounted() { @@ -197,7 +209,10 @@ export default { this.reachStandard = res.data.count } } - } + }, + dateTypeClick(item){ + this.dataType = item.date_type + }, } } @@ -239,7 +254,6 @@ export default { } } - @media (max-width: 992px){ .consoleView{ display: block;