diff --git a/src/components/e-charts/bar-chartTwo.vue b/src/components/e-charts/bar-chart-two.vue
similarity index 63%
rename from src/components/e-charts/bar-chartTwo.vue
rename to src/components/e-charts/bar-chart-two.vue
index 72dc575696da477ae3416d5f866b896d4dac2a4e..0b13e2bde104f1b0f83c9b520e2d600232bb16ac 100644
--- a/src/components/e-charts/bar-chartTwo.vue
+++ b/src/components/e-charts/bar-chart-two.vue
@@ -7,73 +7,72 @@ import { graphic } from "echarts/lib/export";
export default {
props: {
data: {
- type: Array,
+ type: Object,
default: () => {
- return [];
- }
+ return null;
+ },
},
bar_width: {
type: Number,
- default: 12
+ default: 12,
},
colors: {
type: Array,
default: () => {
return ["#515fe7", "#e56600"];
- }
+ },
},
bar_border_radius: {
type: Array,
default: () => {
return [10, 10, 10, 10];
- }
+ },
},
show_split: {
type: Boolean,
- default: false
+ default: false,
},
x_router: {
type: Number,
- default: 0
- }
+ default: 0,
+ },
},
- data: () => ({}),
- mounted() {},
methods: {
bar() {
- let self = this;
+ let _self = this;
+ let xAxis = (_self.data && _self.data.xAxis) || [];
+ let series = (_self.data && _self.data.series) || [{}, {}];
+
return {
grid: {
left: 10,
right: 10,
bottom: 25,
top: 25,
- containLabel: true
+ containLabel: true,
},
legend: {
left: "right",
itemWidth: 10,
itemHeight: 10,
orient: "horizontal",
- backgroundColor: "#f4f7fc"
+ backgroundColor: "#f4f7fc",
+ data: series.map((item) => item.name),
},
- color: this.colors,
- tooltip: {},
- dataset: {
- source: self.data
+ tooltip: {
+ trigger: "axis",
},
xAxis: {
type: "category",
- // data: self.data.legendData,
axisLabel: {
margin: 20,
color: "#0d1847",
textStyle: {
- fontSize: 12
+ fontSize: 12,
},
interval: 0,
- rotate: self.x_router,
- formatter: function(value) {
+ rotate: _self.x_router,
+ /* formatter: function(value) {
let valueTxt = "";
if (value.length > 6) {
valueTxt = value.substring(0, 5) + "...";
@@ -81,57 +80,59 @@ export default {
valueTxt = value;
}
return valueTxt;
- }
+ }, */
},
axisLine: {
lineStyle: {
- color: "#f2f2f2"
- }
+ color: "#f2f2f2",
+ },
},
axisTick: {
- show: false
+ show: false,
},
splitArea: {
show: true,
areaStyle: {
color: ["#fff", "#f8f9fd"],
- opacity: 0.5
+ opacity: 0.5,
},
- interval: 0
- }
+ interval: 0,
+ },
+ axisPointer: {
+ type: "shadow",
+ },
+ data: xAxis,
},
yAxis: [
{
axisLabel: {
color: "#a9aec0",
textStyle: {
- fontSize: 12
- }
+ fontSize: 12,
+ },
},
minInterval: 1,
axisLine: {
lineStyle: {
- color: "rgba(0, 0, 0, 0)"
- }
+ color: "rgba(0, 0, 0, 0)",
+ },
},
axisTick: {
- show: false
+ show: false,
},
splitLine: {
lineStyle: {
color: "#f2f2f2",
- type: "solid"
- }
- }
- }
+ type: "solid",
+ },
+ },
+ },
],
- // Declare several bar series, each will be mapped
- // to a column of dataset.source by default.
series: [
{
type: "bar",
type: "bar",
- barWidth: self.bar_width,
+ barWidth: _self.bar_width,
itemStyle: {
normal: {
color: function(params) {
@@ -143,24 +144,26 @@ export default {
[
{
offset: 0,
- color: self.colors[0] // 0% 处的颜色
+ color: _self.colors[0], // 0% 处的颜色
},
{
offset: 1,
- color: self.colors[0] // 100% 处的颜色
- }
+ color: _self.colors[0], // 100% 处的颜色
+ },
],
false
);
},
- barBorderRadius: self.bar_border_radius
- }
- }
+ barBorderRadius: _self.bar_border_radius,
+ },
+ },
+ name: series[0].name,
+ data: series[0].data,
},
{
type: "bar",
type: "bar",
- barWidth: self.bar_width,
+ barWidth: _self.bar_width,
itemStyle: {
normal: {
color: function(params) {
@@ -172,24 +175,26 @@ export default {
[
{
offset: 0,
- color: self.colors[1] // 0% 处的颜色
+ color: _self.colors[1], // 0% 处的颜色
},
{
offset: 1,
- color: self.colors[1] // 100% 处的颜色
- }
+ color: _self.colors[1], // 100% 处的颜色
+ },
],
false
);
},
- barBorderRadius: self.bar_border_radius
- }
- }
- }
- ]
+ barBorderRadius: _self.bar_border_radius,
+ },
+ },
+ name: series[1].name,
+ data: series[1].data,
+ },
+ ],
};
- }
- }
+ },
+ },
};
\ No newline at end of file
+
diff --git a/src/components/e-charts/bar-chart.vue b/src/components/e-charts/bar-chart.vue
index 1a9efdb08afccd46b42986cd20f31a8beb46e0af..2400096d8aaadfa6fe630482c2423a9f97088914 100644
--- a/src/components/e-charts/bar-chart.vue
+++ b/src/components/e-charts/bar-chart.vue
@@ -46,6 +46,17 @@ export default {
bar() {
let self = this;
return {
+ tooltip: {
+ trigger: "axis",
+ formatter: function(params) {
+ var htmlStr = "";
+ for (var i = 0; i < params.length; i++) {
+ htmlStr += params[i].name + " : ";
+ htmlStr += params[i].value;
+ }
+ return htmlStr;
+ }
+ },
grid: {
left: 10,
right: 10,
@@ -65,7 +76,7 @@ export default {
},
interval: 0,
rotate: self.x_router,
- formatter: function(value) {
+ /* formatter: function(value) {
let valueTxt = "";
if (value.length > 6) {
valueTxt = value.substring(0, 5) + "...";
@@ -73,7 +84,7 @@ export default {
valueTxt = value;
}
return valueTxt;
- }
+ } */
},
axisLine: {
lineStyle: {
@@ -91,6 +102,9 @@ export default {
},
interval: 0
},
+ axisPointer: {
+ type: "shadow",
+ },
}
],
yAxis: [
diff --git a/src/components/e-charts/the-list.vue b/src/components/e-charts/the-list.vue
index e714b230ee0a2b656490798c5a0de48880c183ba..fccd403db93a74c437a8ca1b74e121cb2ce385e8 100644
--- a/src/components/e-charts/the-list.vue
+++ b/src/components/e-charts/the-list.vue
@@ -56,7 +56,7 @@ export default {
this.$el.scrollTop = 0;
this.timer = setInterval(() => {
- let itemHeight = 50;
+ let itemHeight = 60;
let curScrollTop = this.$el.scrollTop + itemHeight;
if (
curScrollTop >=
diff --git a/src/pages/data-analysis/operation-overview.vue b/src/pages/data-analysis/operation-overview.vue
index 19dbf166829f639b463594e2856baec07832b29a..f97de8ccd1010ff0ccb444f78d82529d78e12011 100644
--- a/src/pages/data-analysis/operation-overview.vue
+++ b/src/pages/data-analysis/operation-overview.vue
@@ -21,28 +21,31 @@
@@ -53,7 +56,11 @@
title="服务状态统计"
class="block"
>
-
+
@@ -66,7 +73,7 @@
title="服务注册发布数量排名"
class="block"
>
-
+
@@ -94,12 +101,12 @@
title="服务被调用次数排名"
class="block"
:buttons_arr="['累计', '今日']"
- @changeButton="changeServeiceNumBtn"
+ @changeButton="changeAction1"
>
@@ -110,7 +117,7 @@
title="应用被部署次数排名"
class="block"
:buttons_arr="['累计', '今日']"
- @changeButton="changeBsNumBtn"
+ @changeButton="changeActions"
>
@@ -134,21 +141,24 @@
