This commit is contained in:
姚宇浩 2024-10-23 09:01:01 +08:00
parent ee96424f17
commit be90156370
1 changed files with 44 additions and 37 deletions

View File

@ -3,7 +3,14 @@
</template>
<script setup>
import { onMounted, reactive, ref, onBeforeMount, defineProps,watch } from "vue";
import {
onMounted,
reactive,
ref,
onBeforeMount,
defineProps,
watch,
} from "vue";
// echarts
import * as echarts from "echarts";
const props = defineProps({
@ -19,35 +26,27 @@ const data = reactive({
//
var rich = {
name: {
color: "#666666",
fontSize: 14,
padding: [8, 30, 0, 30],
fontWeight: "400",
align: "left",
white: {
color: "#65FDFD",
align: "center",
fontSize: 18,
// padding: [21, 0],
},
value: {
color: "#333",
fontSize: 15,
padding: [0, 30, 8, 30],
fontWeight: "500",
align: "left",
yellow: {
color: "#ffc20e",
fontSize: 18,
padding: [5, 4],
align: "center",
},
percent: {
color: "#FFF",
align: "right",
fontSize: 15,
fontWeight: "500",
//padding: [0, 5]
total: {
color: "#ffc20e",
fontSize: 18,
align: "center",
},
hr: {
borderColor: "#DFDFDF",
width: "100%",
borderWidth: 1,
height: 0,
},
cir: {
fontSize: 26,
blue: {
color: "#49dff0",
fontSize: 16,
align: "center",
},
};
var colorList = ["#3BAEFF", "#41EDD5", "#FFC371", "#797AFF"];
@ -95,10 +94,15 @@ const getOption = () => {
color: "white", //
fontSize: 18, //
},
formatter: "{b}:{c}" + "个\n\n",
borderWidth: 20,
borderRadius: 4,
padding: [0, -100],
normal: {
formatter: function (param) {
return "{white|" + param.name + "}\n{yellow|" + param.value + "}";
},
borderWidth: 20,
borderRadius: 4,
padding: [0, -50],
rich: rich,
},
},
labelLine: {
normal: {
@ -151,14 +155,17 @@ const setChart = () => {
// 使
myChart.setOption(data.option);
};
watch(()=>props.list,()=>{
data.list=props.list
getOption();
setChart();
})
watch(
() => props.list,
() => {
data.list = props.list;
getOption();
setChart();
}
);
onBeforeMount(() => {
setTimeout(() => {
data.list=props.list
data.list = props.list;
getOption();
setChart();
}, 600);