Browse Source

时间轴调整, 柱状图顶部显示金额

zhengkaixin 4 days ago
parent
commit
690d2fb5ed
1 changed files with 76 additions and 11 deletions
  1. 76 11
      pagesFinance/statistics/index.vue

+ 76 - 11
pagesFinance/statistics/index.vue

@@ -1938,7 +1938,35 @@
 					  barMaxWidth: 50, // 柱子最大宽度
 					type: 'bar',
 				
-					data: []
+					data: [],
+				
+				}
+				if(this.current2!=1){
+					obj.label={
+						show: this.current2!=1,
+						position: 'top',
+						 formatter: function(params) {
+							
+							 var sum=0
+							 for (var i in cardTypes) {
+							 	var item = cardTypes[i]
+							 	
+							 		var num = salesData[dates[params.dataIndex]][item].rechargeAmount
+							 		sum+=num
+							 	
+							 }
+						     return `${params.value}张${sum}元`;
+						 },
+						// color: '#334155',
+						// fontFamily: 'Inter, sans-serif',
+						// fontWeight: 'bold',
+						// fontSize: 12,
+						// backgroundColor: 'rgba(255, 255, 255, 0.8)',
+						// padding: [4, 6],
+						// borderRadius: 4,
+						// shadowBlur: 2,
+						// shadowColor: 'rgba(0, 0, 0, 0.1)'
+					}
 				}
 				for (var j in dates) {
 					var sum=0
@@ -1955,12 +1983,12 @@
 
 
 				var data1 = []
-				var axisLabel={}
-				if(this.current2==1){
-					axisLabel.rotate=30
-				}
-				
-				
+				// var axisLabel={}
+				// if(this.current2==1){
+				// 	axisLabel.rotate=30
+				// }
+				var headitembyK='';
+				var showkey = "";
 				this.myChart3.clear();
 				var option = {
 					tooltip: {
@@ -2031,8 +2059,45 @@
 					},
 					
 					xAxis: {
-						type: 'category',
-						axisLabel:axisLabel,
+						type: 'category',
+						//splitNumber: 4,
+						boundaryGap: this.current2==1?false:true ,
+						axisLabel:{
+							formatter: (value) => {
+								if(this.current2!=1){
+									return value
+								}
+								
+								
+								if (headitembyK == "") {
+									headitembyK = value
+								}
+								var i = 5
+								
+								var showvalue = "";
+								var key = value.substring(0, 8 - i);
+
+								if (showkey == "" || value == headitembyK) {
+									showkey = key
+
+									showvalue = value
+									showvalue = value.substring(5 - i)
+								} else {
+									if (key != showkey) {
+										showkey = key
+										showvalue = value
+										showvalue = value.substring(5 - i)
+									} else {
+										showvalue = value.substring(8 - i)
+									}
+								}
+								return showvalue.replace("-", ".");
+
+							},
+							textStyle: {
+								color: "#333"
+							}
+						},
 						data: dates
 					},
 					yAxis: {
@@ -2893,7 +2958,7 @@
 					xAxis: {
 						//type: 'value',
 						type: 'category',
-						splitNumber: 4,
+						//splitNumber: 4,
 						boundaryGap: false,
 
 						axisLabel: {
@@ -2997,7 +3062,7 @@
 				
 				// 使用刚指定的配置项和数据显示图表。
 				this.myChart.setOption(option);
-				console.log(option)
+				
 
 
 			}