From a79582f0c67ddc681d2804669455ae13c64de8f9 Mon Sep 17 00:00:00 2001
From: ludc
Date: 星期二, 26 十二月 2023 20:20:22 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
Source/UBCS-WEB/src/components/StatisticsComponent/ColumnarChart.vue | 113 +++++++++++++++++++++++++-------------------------------
1 files changed, 51 insertions(+), 62 deletions(-)
diff --git a/Source/UBCS-WEB/src/components/StatisticsComponent/ColumnarChart.vue b/Source/UBCS-WEB/src/components/StatisticsComponent/ColumnarChart.vue
index 3824b23..bf10bb2 100644
--- a/Source/UBCS-WEB/src/components/StatisticsComponent/ColumnarChart.vue
+++ b/Source/UBCS-WEB/src/components/StatisticsComponent/ColumnarChart.vue
@@ -1,6 +1,9 @@
<template>
<basic-container>
<v-chart id="chart" :auto-resize="true" :options="chartOptions"></v-chart>
+ <div style="display: inline-block;float: right;margin-bottom: 10px;margin-right: 60px">
+ <el-button size="small" type="danger" plain @click="delHandler">鍒犻櫎</el-button>
+ </div>
</basic-container>
</template>
@@ -9,90 +12,66 @@
import 'echarts/lib/component/tooltip'
import 'echarts/lib/component/title'
import 'echarts/lib/component/legend'
+import { deleteChartId } from "@/api/statistic/chart"
export default {
name: "ColumnarChart",
- props:{
- columnarData:{
- type:Array,
- default:[]
+ props: {
+ columnarData: {
+ type: Array,
+ default: []
},
- chartName:{
- type:String,
+ chartName: {
+ type: String,
default: ""
+ },
+ btmname: {
+ type: String
}
},
- watch:{
- columnarData:{
- immediate:true,
- handler(newval,oldval){
- if(newval && newval.length > 0){
- const minValues = newval[0].map(function (_, i) {
- return Math.min.apply(
- null,
- newval.map(function (item) {
- return item[i];
- })
- );
- });
-
- let colors = ['#84C9E5', '#F68686'];
-
- const seriesData = [];
- for (let i = 0; i < newval.length; i++) {
- let curSeriesData = [];
- for (let j = 0; j < newval[i].length; j++) {
- let borderRadius = [0, 0, 0, 0];
- if (newval[i][j] === minValues[j]) {
- borderRadius = [50, 50, 0, 0];
- }
- curSeriesData.push({
- value: newval[i][j],
- itemStyle: {
- normal: {
- // barBorderRadius: borderRadius, // 璁剧疆鍦嗚
- color: colors[i],
- }
- },
- });
- }
- let seriesName = (i === 0 ? "鎬婚噺" : "鏂板")
- seriesData.push({
- name: seriesName,
- type: "bar",
- stack: "鎬婚噺",
- barWidth: 60,
- data: curSeriesData,
+ watch: {
+ columnarData: {
+ immediate: true,
+ handler(newval, oldval) {
+ if (newval && newval.length > 0) {
+ let seriesData = newval.map((data, index) => {
+ let name = index === 0 ? "鎬婚噺" : "鏂板";
+ return {
+ name: name,
+ type: 'bar',
+ data: data,
+ barWidth: '40%',
label: {
show: true,
position: 'top',
- formatter: function (params) {
- return params.value === 0 ? '' : params.value; // 鍊间负 0 涓嶆樉绀猴紝鍏朵粬鎯呭喌鏄剧ず
- }
+ // formatter: function (params) {
+ // if (params.value !== 0) {
+ // return params.value;
+ // } else {
+ // return '';
+ // }
+ // }
},
- emphasis: {
- focus: "series",
- },
- });
- this.chartOptions.series=seriesData
- }
+ };
+ });
+ this.chartOptions.series = seriesData;
}
}
},
- 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() {
return {
chartOptions: {
- color:['#84C9E5', '#F68686'],
+ color: ['#84C9E5', '#F68686'],
title: {
text: "",
},
@@ -141,6 +120,16 @@
},
created() {
},
+ methods: {
+ delHandler() {
+ deleteChartId({ btmname: this.btmname, chartId: '2' }).then(res => {
+ this.$message.success(this.chartName+'鏌辩姸鍥撅紝鍒犻櫎鎴愬姛锛�')
+ this.$emit('refresh');
+ }).catch(error => {
+ this.$message.error(error)
+ })
+ }
+ }
};
</script>
--
Gitblit v1.9.3