|
@@ -37,8 +37,10 @@ export default {
|
|
computed: {},
|
|
computed: {},
|
|
methods: {
|
|
methods: {
|
|
initChart() {
|
|
initChart() {
|
|
|
|
+ let themeName = '';
|
|
|
|
+ this.$store.state.themeName === "dark" ? themeName = true : themeName = false;
|
|
|
|
+
|
|
let chart = echarts.init(this.$el);
|
|
let chart = echarts.init(this.$el);
|
|
-
|
|
|
|
let value = this.value;
|
|
let value = this.value;
|
|
let option = {
|
|
let option = {
|
|
grid: {
|
|
grid: {
|
|
@@ -60,7 +62,7 @@ export default {
|
|
width: 8,
|
|
width: 8,
|
|
color: [
|
|
color: [
|
|
[0, partten.getColor("gray") + "33"],
|
|
[0, partten.getColor("gray") + "33"],
|
|
- [value / 100, partten.getColor("green")],
|
|
|
|
|
|
+ [value / 100,themeName ? partten.getColor("green") : partten.getColor("blue")],
|
|
[1, partten.getColor("gray") + "33"],
|
|
[1, partten.getColor("gray") + "33"],
|
|
],
|
|
],
|
|
},
|
|
},
|
|
@@ -93,7 +95,7 @@ export default {
|
|
return params;
|
|
return params;
|
|
},
|
|
},
|
|
textStyle: {
|
|
textStyle: {
|
|
- color: partten.getColor("green"),
|
|
|
|
|
|
+ color: themeName ? partten.getColor("green") : partten.getColor("blue"),
|
|
fontSize: util.vh(16),
|
|
fontSize: util.vh(16),
|
|
},
|
|
},
|
|
},
|
|
},
|
|
@@ -115,7 +117,7 @@ export default {
|
|
lineStyle: {
|
|
lineStyle: {
|
|
width: 1,
|
|
width: 1,
|
|
color: [
|
|
color: [
|
|
- [this.value / 100, partten.getColor("green")],
|
|
|
|
|
|
+ [this.value / 100, themeName ? partten.getColor("green") : partten.getColor("blue")],
|
|
[1, "#fff5"],
|
|
[1, "#fff5"],
|
|
],
|
|
],
|
|
},
|
|
},
|
|
@@ -152,6 +154,11 @@ export default {
|
|
this.initChart();
|
|
this.initChart();
|
|
});
|
|
});
|
|
},
|
|
},
|
|
|
|
+ watch: {
|
|
|
|
+ "$store.state.themeName"() {
|
|
|
|
+ this.initChart();
|
|
|
|
+ },
|
|
|
|
+ },
|
|
};
|
|
};
|
|
</script>
|
|
</script>
|
|
|
|
|