From 31612136346954091921d97046745eafa9d95f17 Mon Sep 17 00:00:00 2001
From: 王旭 <1377869194@qq.com>
Date: 星期四, 16 二月 2023 17:44:54 +0800
Subject: [PATCH] 调整运维管理部分页面格式1
---
src/components/echart11.vue | 110 +++++++++++++++++++++++++++---------------------------
1 files changed, 55 insertions(+), 55 deletions(-)
diff --git a/src/components/echart11.vue b/src/components/echart11.vue
index c0d52f6..c0a0195 100644
--- a/src/components/echart11.vue
+++ b/src/components/echart11.vue
@@ -10,73 +10,73 @@
components: {},
data() {
//杩欓噷瀛樻斁鏁版嵁
- return { myChart: null };
+ return { myChart: null }
},
mounted() {
- this.lineChart();
- this.$bus.$on('resizeEchart', (res) => {
- this.myChart.resize();
- });
+ this.lineChart()
+ this.$bus.$on("resizeEchart", res => {
+ this.myChart.resize()
+ })
},
//鏂规硶闆嗗悎
methods: {
lineChart() {
let option = {
title: {
- text: '鐩綍鍒嗗竷',
- top: '15',
+ text: "鐩綍鍒嗗竷",
+ top: "15",
textStyle: {
-
- color: '#fff',
+ color: "#fff",
},
+ show: false,
},
tooltip: {
- trigger: 'axis',
+ trigger: "axis",
axisPointer: {
- type: 'shadow',
+ type: "shadow",
},
},
// legend: {},
grid: {
- left: '0%',
-
- right: '4%',
- bottom: '0%',
+ top: "5",
+ left: "0%",
+ right: "4%",
+ bottom: "10",
containLabel: true,
},
xAxis: {
- type: 'value',
+ type: "value",
boundaryGap: [0, 0.01],
axisLine: {
lineStyle: {
- color: '#ccc',
+ color: "#ccc",
},
},
axisLabel: {
show: true,
textStyle: {
- color: '#fff',
+ color: "#fff",
},
},
},
yAxis: {
- type: 'category',
- data: ['A1', 'A2', 'A3', 'A4', 'A5', 'A6', 'A7'],
+ type: "category",
+ data: ["A1", "A2", "A3", "A4", "A5", "A6", "A7"],
axisLine: {
lineStyle: {
- color: '#ccc',
+ color: "#ccc",
},
},
axisLabel: {
show: true,
textStyle: {
- color: '#fff',
+ color: "#fff",
},
formatter: function (params) {
- var newParamsName = ''; // 鏈�缁堟嫾鎺ユ垚鐨勫瓧绗︿覆
- var paramsNameNumber = params.length; // 瀹為檯鏍囩鐨勪釜鏁�
- var provideNumber = 4; // 姣忚鑳芥樉绀虹殑瀛楃殑涓暟
- var rowNumber = Math.ceil(paramsNameNumber / provideNumber); // 鎹㈣鐨勮瘽锛岄渶瑕佹樉绀哄嚑琛岋紝鍚戜笂鍙栨暣
+ var newParamsName = "" // 鏈�缁堟嫾鎺ユ垚鐨勫瓧绗︿覆
+ var paramsNameNumber = params.length // 瀹為檯鏍囩鐨勪釜鏁�
+ var provideNumber = 4 // 姣忚鑳芥樉绀虹殑瀛楃殑涓暟
+ var rowNumber = Math.ceil(paramsNameNumber / provideNumber) // 鎹㈣鐨勮瘽锛岄渶瑕佹樉绀哄嚑琛岋紝鍚戜笂鍙栨暣
/**
* 鍒ゆ柇鏍囩鐨勪釜鏁版槸鍚﹀ぇ浜庤瀹氱殑涓暟锛� 濡傛灉澶т簬锛屽垯杩涜鎹㈣澶勭悊 濡傛灉涓嶅ぇ浜庯紝鍗崇瓑浜庢垨灏忎簬锛屽氨杩斿洖鍘熸爣绛�
*/
@@ -84,32 +84,32 @@
if (paramsNameNumber > provideNumber) {
/** 寰幆姣忎竴琛�,p琛ㄧず琛� */
for (var p = 0; p < rowNumber; p++) {
- var tempStr = ''; // 琛ㄧず姣忎竴娆℃埅鍙栫殑瀛楃涓�
- var start = p * provideNumber; // 寮�濮嬫埅鍙栫殑浣嶇疆
- var end = start + provideNumber; // 缁撴潫鎴彇鐨勪綅缃�
+ var tempStr = "" // 琛ㄧず姣忎竴娆℃埅鍙栫殑瀛楃涓�
+ var start = p * provideNumber // 寮�濮嬫埅鍙栫殑浣嶇疆
+ var end = start + provideNumber // 缁撴潫鎴彇鐨勪綅缃�
// 姝ゅ鐗规畩澶勭悊鏈�鍚庝竴琛岀殑绱㈠紩鍊�
if (p == rowNumber - 1) {
// 鏈�鍚庝竴娆′笉鎹㈣
- tempStr = params.substring(start, paramsNameNumber);
+ tempStr = params.substring(start, paramsNameNumber)
} else {
// 姣忎竴娆℃嫾鎺ュ瓧绗︿覆骞舵崲琛�
- tempStr = params.substring(start, end) + '\n';
+ tempStr = params.substring(start, end) + "\n"
}
- newParamsName += tempStr; // 鏈�缁堟嫾鎴愮殑瀛楃涓�
+ newParamsName += tempStr // 鏈�缁堟嫾鎴愮殑瀛楃涓�
}
} else {
// 灏嗘棫鏍囩鐨勫�艰祴缁欐柊鏍囩
- newParamsName = params;
+ newParamsName = params
}
//灏嗘渶缁堢殑瀛楃涓茶繑鍥�
- return newParamsName;
+ return newParamsName
},
},
},
series: [
{
- name: '鐩綍鍒嗗竷',
- type: 'bar',
+ name: "鐩綍鍒嗗竷",
+ type: "bar",
barWidth: 20,
data: [120, 150, 110, 50, 70, 20, 70],
showBackground: true,
@@ -117,17 +117,17 @@
normal: {
// 鏌卞舰鍥惧渾瑙掞紝鍒濆鍖栨晥鏋�
- color: (params) => {
+ color: params => {
var colorList = [
- ['#188df0', '#83bff6'],
- ['#188df0', '#83bff6'],
- ['#188df0', '#83bff6'],
- ['#188df0', '#83bff6'],
- ['#188df0', '#83bff6'],
- ['#188df0', '#83bff6'],
- ['#188df0', '#83bff6'],
- ];
- var colorItem = colorList[params.dataIndex];
+ ["#188df0", "#83bff6"],
+ ["#188df0", "#83bff6"],
+ ["#188df0", "#83bff6"],
+ ["#188df0", "#83bff6"],
+ ["#188df0", "#83bff6"],
+ ["#188df0", "#83bff6"],
+ ["#188df0", "#83bff6"],
+ ]
+ var colorItem = colorList[params.dataIndex]
return new this.$echarts.graphic.LinearGradient(
1,
0,
@@ -144,22 +144,22 @@
},
],
false
- );
+ )
},
},
},
},
],
- };
- this.myChart = this.$echarts.init(document.getElementById('echart6'));
- this.myChart.setOption(option);
- window.addEventListener('resize', function () {
- this.myChart.resize();
- });
+ }
+ this.myChart = this.$echarts.init(document.getElementById("echart6"))
+ this.myChart.setOption(option)
+ window.addEventListener("resize", function () {
+ this.myChart.resize()
+ })
},
},
- created() { },
-};
+ created() {},
+}
</script>
<style lang="less" scoped>
//@import url(); 寮曞叆鍏叡css绫�
--
Gitblit v1.9.3