From 2171e52259e2b6e64178f77d14eda487f45ed8d6 Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期二, 12 十二月 2023 16:50:16 +0800
Subject: [PATCH] 统计分析模块更改
---
Source/UBCS-WEB/src/views/flow/manager.vue | 4 +
Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue | 6 +-
Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue | 19 +++---
Source/UBCS-WEB/src/components/StatisticsComponent/pieChart.vue | 100 +++++++++++++++------------------
4 files changed, 61 insertions(+), 68 deletions(-)
diff --git a/Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue b/Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue
index a30dac6..76fc6c0 100644
--- a/Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue
+++ b/Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue
@@ -331,7 +331,7 @@
datetime: "datetime",
},
tableData: [],
- tableHeight: 'calc(100vh - 300px)',
+ tableHeight: 'calc(100vh - 350px)',
DataVisible: false,
tableHeadData: [],
items: {},
@@ -513,7 +513,7 @@
this.tableHeight = 'calc(100vh - 630px)';
this.$refs.dataTable.doLayout()
} else {
- this.tableHeight = 'calc(100vh - 310px)';
+ this.tableHeight = 'calc(100vh - 350px)';
this.$refs.dataTable.doLayout()
}
},
@@ -1091,7 +1091,7 @@
<style lang="scss" scoped>
//鍥哄畾鍒楅珮搴�
/deep/ .el-table__fixed {
- height: calc(100vh - 370px) !important;
+ height: calc(100vh - 365px) !important;
}
// 婊氬姩鏉℃牱寮忎慨鏀�
diff --git a/Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue b/Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue
index 7c180bc..f37802e 100644
--- a/Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue
+++ b/Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue
@@ -31,15 +31,14 @@
handler(newval, oldval) {
if (newval) {
const series = newval.map((data, index) => ({
- name: index === 0 ? "鎬婚噺" : "鏂板",
- type: "line",
+ name: index === 0 ? '鎬婚噺' : '鏂板',
+ type: 'line',
smooth: true,
- stack: "Total",
+ stack: index === 0 ? 'Total' : 'total2', // 鏍规嵁 index 鍖哄垎鎬婚噺鍜屾柊澧炵殑鍫嗗彔鎯呭喌
label: {
show: true,
- position: "top",
textStyle: {
- fontSize: 14 // 璋冩暣瀛椾綋澶у皬
+ fontSize: 14
}
},
data: data.map(value => ({value}))
@@ -49,14 +48,14 @@
}
}
},
- chartName:{
- handler(newval,oldval){
- if(newval){
+ chartName: {
+ handler(newval, oldval) {
+ if (newval) {
this.chartOptions.title.text = newval + "鏁版嵁缁熻"
}
},
- immediate:true,
- deep:true
+ immediate: true,
+ deep: true
}
},
data() {
diff --git a/Source/UBCS-WEB/src/components/StatisticsComponent/pieChart.vue b/Source/UBCS-WEB/src/components/StatisticsComponent/pieChart.vue
index 9efd832..d81c227 100644
--- a/Source/UBCS-WEB/src/components/StatisticsComponent/pieChart.vue
+++ b/Source/UBCS-WEB/src/components/StatisticsComponent/pieChart.vue
@@ -6,11 +6,11 @@
<script>
import 'echarts'
-import 'echarts/lib/chart/pie'
+import 'echarts/lib/chart/bar' // 瀵煎叆鏌辩姸鍥剧粍浠�
import 'echarts/lib/component/tooltip'
import 'echarts/lib/component/legend'
export default {
- name: "pieChart",
+ name: "polarBarChart",
props:{
pieData:{
type:Array,
@@ -19,97 +19,89 @@
chartName:{
type:String,
default: ""
+ },
+ monthData:{
+ type:Array,
+ default: () => ['涓�鏈�', '浜屾湀', '涓夋湀', '鍥涙湀', '浜旀湀', '鍏湀', '涓冩湀', '鍏湀', '涔濇湀', '鍗佹湀', '鍗佷竴鏈�', '鍗佷簩鏈�']
}
},
watch:{
pieData:{
immediate:true,
- handler(newval,oldval){
+ handler(newval, oldval){
if (newval) {
- // console.log(newval)
- const series=[
+ const series = [
{
- name: '',
- type: 'pie',
- radius: ['40%', '70%'],
- avoidLabelOverlap:false,
- label: {
- formatter: '{b}\n{d}%',
- fontSize:14
+ type: 'bar',
+ name: '鏂板',
+ data: newval[1],
+ coordinateSystem: 'polar',
+ stack: 'a',
+ emphasis: {
+ focus: 'series'
},
itemStyle: {
- color: function(params) {
- // 鏍规嵁鍏蜂綋闇�姹傝缃鑹�
- const colorList = ['#5470C6', '#91CC75', '#fac858', '#EE6666', '#3BA272', '#FC8452', '#9A60B4', '#e34d4d', '#b3e9b9', '#eaaaed', '#1bc6e4', '#c6b3e9'];
- return colorList[params.dataIndex % colorList.length];
- }
+ color: '#91cc75' // 鏂板鐨勯鑹�
+ }
+ },
+ {
+ type: 'bar',
+ name: '鎬婚噺',
+ data: newval[0],
+ coordinateSystem: 'polar',
+ stack: 'a',
+ emphasis: {
+ focus: 'series'
},
- data:newval[0].map((value, index) => {
- return {
- value: value,
- name: this.getMonthName(index),
- newValue: newval[1][index]
- };
- }),
+ itemStyle: {
+ color: '#5470c6' // 鎬婚噺鐨勯鑹�
+ }
}
- ]
+ ];
this.chartOptions.series = series;
}
}
},
chartName:{
- handler(newval,oldval){
+ handler(newval, oldval){
if(newval){
this.chartOptions.title.text = newval + "鏁版嵁缁熻"
}
},
- immediate:true,
- deep:true
+ immediate:true
}
},
data() {
return {
chartOptions: {
title: {
- text: '渚涘簲鍟嗕富鏁版嵁缁熻',
- left: 'center'
- },
- tooltip: {
- trigger: 'item',
- formatter: function (params) {
- let result = '';
- if (params.componentType === 'series') {
- result += params.name + '<br/>';
- result += '鏂板锛�' + params.data.newValue + '<br/>';
- result += '鎬婚噺锛�' + params.data.value + '<br/>';
- result += '鐧惧垎姣旓細' + params.percent + '%';
- }
- return result;
- }
+ text: '',
},
legend: {
- orient: 'vertical',
- right: 10,
- top: 'middle',
+ data: ['鎬婚噺', '鏂板'],
+ },
+ polar: {},
+ angleAxis: {
+ type: 'category',
data: ['涓�鏈�', '浜屾湀', '涓夋湀', '鍥涙湀', '浜旀湀', '鍏湀', '涓冩湀', '鍏湀', '涔濇湀', '鍗佹湀', '鍗佷竴鏈�', '鍗佷簩鏈�']
},
+ radiusAxis: {},
+ tooltip: {
+ trigger: 'axis'
+ },
series: []
- },
+ }
}
},
- methods:{
- getMonthName(index){
- const monthNames = ['涓�鏈�', '浜屾湀', '涓夋湀', '鍥涙湀', '浜旀湀', '鍏湀', '涓冩湀', '鍏湀', '涔濇湀', '鍗佹湀', '鍗佷竴鏈�', '鍗佷簩鏈�'];
- return monthNames[index];
- }
+ created(){
+ this.chartOptions.color = ['#5470c6', '#91cc75', '#fac858', '#ca8622', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4'];
}
}
</script>
<style scoped lang="scss">
#chart {
- width: 90%;
+ width: 97%;
height: 530px;
}
-
</style>
diff --git a/Source/UBCS-WEB/src/views/flow/manager.vue b/Source/UBCS-WEB/src/views/flow/manager.vue
index e228670..a8c6a30 100644
--- a/Source/UBCS-WEB/src/views/flow/manager.vue
+++ b/Source/UBCS-WEB/src/views/flow/manager.vue
@@ -25,8 +25,10 @@
<el-button type="text"
size="small"
icon="el-icon-refresh"
+ :style="{color: scope.row.suspensionState === 1 ? '#67C23A' : '#F56C6C'}"
v-if="permissionList.state"
- @click.stop="handleDoState(scope.row,scope.index)">{{scope.row.suspensionState===1?'婵�娲�':'鎸傝捣'}}
+ @click.stop="handleDoState(scope.row, scope.index)">
+ {{ scope.row.suspensionState === 1 ? '婵�娲�' : '鎸傝捣' }}
</el-button>
<el-button type="text"
size="small"
--
Gitblit v1.9.3