|
@@ -6,6 +6,7 @@
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
import * as echarts from 'echarts'
|
|
import * as echarts from 'echarts'
|
|
|
|
+import {useAppStore} from "~src/store";
|
|
import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
|
|
import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
|
|
const props = defineProps({
|
|
const props = defineProps({
|
|
ratio: {
|
|
ratio: {
|
|
@@ -17,6 +18,8 @@ const props = defineProps({
|
|
//初始变量
|
|
//初始变量
|
|
let chart = null;
|
|
let chart = null;
|
|
const echart = ref(null)
|
|
const echart = ref(null)
|
|
|
|
+const useAppState = useAppStore()
|
|
|
|
+const AppColor = ref(useAppState.getColor);
|
|
|
|
|
|
watch(() => [
|
|
watch(() => [
|
|
props.ratio
|
|
props.ratio
|
|
@@ -53,7 +56,7 @@ const setOptions = (val1,val2) => {
|
|
{
|
|
{
|
|
name: 'Access From',
|
|
name: 'Access From',
|
|
type: 'pie',
|
|
type: 'pie',
|
|
- radius: ['80%', '90%'],
|
|
|
|
|
|
+ radius: ['100%', '70%'],
|
|
center: ["50%", "50%"],
|
|
center: ["50%", "50%"],
|
|
label: {
|
|
label: {
|
|
show: false,
|
|
show: false,
|
|
@@ -67,14 +70,14 @@ const setOptions = (val1,val2) => {
|
|
value: val1,
|
|
value: val1,
|
|
name: "完成率",
|
|
name: "完成率",
|
|
itemStyle: {
|
|
itemStyle: {
|
|
- color: "#0081ff",
|
|
|
|
|
|
+ color: AppColor.value?.color ?? "#0081ff",
|
|
}
|
|
}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
value: val2,
|
|
value: val2,
|
|
name: "",
|
|
name: "",
|
|
itemStyle: {
|
|
itemStyle: {
|
|
- color: "#F5F5F5",
|
|
|
|
|
|
+ color: "#D4DDE9",
|
|
}
|
|
}
|
|
},
|
|
},
|
|
]
|
|
]
|
|
@@ -114,6 +117,7 @@ defineExpose({
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
.RoundChart-box {
|
|
.RoundChart-box {
|
|
|
|
+ display: block;
|
|
height: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
overflow: hidden;
|
|
position: relative;
|
|
position: relative;
|