ClientApps/pqs-9100_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

微调

Browse Source
This commit is contained in:
sjl
2025-01-22 16:28:09 +08:00
parent b603ac9bdb
commit 1ad1a0198e
3 changed files with 67 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
frontend/src/components/echarts/pie/default.vue
View File

@@ -22,11 +22,16 @@ const props = defineProps({
type: Object,
default: () => ({}),
},
});
const customData: any = ref({}),
legendData: any = ref({}),
chart: any = ref();
const labelIsShow = ref(true)//引导线台数和鼠标点击饼图是否弹出提示显示
const init = () => {
customData.value = {
title: "", //标题
textAlign: "left", //标题位置可选属性left 可选属性值 left,right,center
@@ -36,6 +41,7 @@ const init = () => {
isSpace: false, //是否显示间隔
isLabelLine: true, //是否显示引导线
titleFontSize: '14px', //标题字体大小
...props.customData,
};
@@ -71,7 +77,7 @@ const init = () => {
// },
// },
tooltip: {
show: true,
show: labelIsShow.value,
trigger: "item",
formatter: customData.value.ratio ? `{b} : {c} ({d}%)` : "{b} :{c} ",
borderWidth: 1,
@@ -100,14 +106,14 @@ const init = () => {
},
label: {
normal: {
show: true,
show: labelIsShow.value,
position: "outside",
textStyle: {
//color: "#fff",
fontSize: 12,
},
formatter: function (data) {
return data.value +'台'
return labelIsShow.value ? data.value + '台' : '';
}
},
},
@@ -122,6 +128,7 @@ const init = () => {
},
],
};
option && chart.value && chart.value.setOption(option);
setTimeout(() => {
chart.value.resize();
@@ -157,6 +164,12 @@ watch(
() => props.chartsData,
(val, oldVal) => {
if (val) {
const item = props.chartsData.find(item => item.value === 0);
if(item != undefined){
labelIsShow.value = false;
}else{
labelIsShow.value = true;
}
init();
}
},

2
frontend/src/views/home/components/tree.vue
View File

@@ -25,7 +25,7 @@
<template #default='{ node, data }'>
<span class='custom-tree-node' style='display: flex;align-items: center;'>
<Platform v-if='!data.pid' style='width:18px;height: 18px;margin-right:8px;'
:style="{color:node.label=='未检'?'#F56C6C':node.label=='检测中'?'#E6A23C':'#67C23A'}" />
:style="{color:node.label=='未检'?'#fac858':node.label=='检测中'?'#ee6666':'#91cc75'}" />
<span>{{ node.label }}</span>
<!-- <Menu v-if="data.pid" @click.stop="detail(data)" style="width: 12px;margin-left: 8px;"/> -->
</span>

39
frontend/src/views/home/tabs/dashboard.vue
View File

@@ -44,7 +44,6 @@
:customData="{
title: '设备检测状态',
textAlign: 'left',
}"
:legendData="{
icon: 'circle',
@@ -149,6 +148,7 @@ const tableHeight = ref('calc(100% - 50px)') // 初始高度
const isTimeCheck = ref<boolean>(false)
const planList = ref<ResultData<Plan.ReqPlan[]>>()
const select_Plan = ref<Plan.ReqPlan>()
const isLabelLineShow = ref(true)
const handleCollapseChange = (val: CollapseModelValue) => {
// 计算新的高度
@@ -301,7 +301,6 @@ const getPieData = async (id: string) => {
const plan = findPlanById(planList.value?.data || [], id)
planName.value = '所选计划:' + plan.name
select_Plan.value = plan
if (plan) {
//isTimeCheck.value = plan.timeCheck === 1; // 将 1 转换为 true，0 转换为 false
@@ -310,7 +309,7 @@ const getPieData = async (id: string) => {
// 处理未找到计划的情况
isTimeCheck.value = false // 或者其他默认值
}
console.log('饼图getBoundPqDevList')
const pqDevList_Result2 = await getBoundPqDevList({ 'planId': id, 'checkStateList': [0, 1, 2, 3] })
boundPqDevList.value = pqDevList_Result2.data as Device.ResPqDev[]
// 遍历 boundPqDevList 并更新计数对象
@@ -332,6 +331,9 @@ const getPieData = async (id: string) => {
// 检查 checkStateCount 是否全为 0
if(boundPqDevList.value.length != 0){
isLabelLineShow.value = true;
const allZero = Object.values(checkStateCount).every(count => count === 0);
chartsData1.value = [
{ value: allZero ? 0 : checkStateCount[0] === 0 ? null : checkStateCount[0], name: '未检', itemStyle: { color: '#fac858' } },
@@ -339,7 +341,6 @@ const getPieData = async (id: string) => {
{ value: allZero ? 0 : checkStateCount[2] === 0 ? null : checkStateCount[2], name: '检测完成', itemStyle: { color: '#91cc75' } },
{ value: allZero ? 0 : checkStateCount[3] === 0 ? null : checkStateCount[3], name: '归档', itemStyle: { color: '#5470c6' } },
];
// 同样处理 chartsData2 和 chartsData3
const allZeroResult = Object.values(checkResultCount).every(count => count === 0);
chartsData2.value = [
@@ -356,6 +357,36 @@ const getPieData = async (id: string) => {
{ value: allZeroReport ? 0 : reportStateCount[0] === 0 ? null : reportStateCount[0], name: '未生成', itemStyle: { color: '#ee6666' } },
{ value: allZeroReport ? 0 : reportStateCount[1] === 0 ? null : reportStateCount[1], name: '已生成', itemStyle: { color: '#91cc75' } },
];
}else{
isLabelLineShow.value = false;//不展示引导线
chartsData1.value = [
{ value: null , name: '未检', itemStyle: { color: '#fac858' } },
{ value: null , name: '检测中', itemStyle: { color: '#ee6666' } },
{ value: null , name: '检测完成', itemStyle: { color: '#91cc75' } },
{ value: null , name: '归档', itemStyle: { color: '#5470c6' } },
{ value: 0 , itemStyle: { color: '#eeeeee' } },
];
chartsData2.value = [
{ value: null, name: '未检', itemStyle: { color: '#fac858' } },
{ value: null, name: '不符合', itemStyle: { color: '#ee6666' } },
{ value: null, name: '符合', itemStyle: { color: '#91cc75' } },
{ value: 0 , itemStyle: { color: '#eeeeee' } },
];
chartsData3.value = [
{ value: null, name: '未检', itemStyle: { color: '#fac858' } },
{ value: null, name: '未生成', itemStyle: { color: '#ee6666' } },
{ value: null, name: '已生成', itemStyle: { color: '#91cc75' } },
{ value: 0 , itemStyle: { color: '#eeeeee' } },
];
}
}else{
planName.value = '所选计划:'