优化

src/views/home-index/components/personPresence/components/item-pie.vue

@@ -80,22 +80,33 @@ export default {
                                 : (dataItem.value / total) * 100
                         ).toFixed(1)
 
+                        // 截断名称：根据 rich.a 的 width: 30，设置最大显示字符数为 4 个中文字符
+                        // 超过则截断并添加省略号，避免文字溢出覆盖后面的内容
+                        const maxNameLength = 4
+                        const displayName =
+                            name.length > maxNameLength
+                                ? name.slice(0, maxNameLength) + '..'
+                                : name
+
                         if (data.showAfter) {
-                            return `{a|${name}}  {b|${percent}%}  {c|(${dataItem.value})}`
+                            return `{a|${displayName}}  {b|${percent}%}  {c|(${dataItem.value})}`
                         } else {
                             // return `{a|${dataItem.value}}  {b|${name}}  {c|${percent}%}`
-                            return `{a|${name}}  {b|${dataItem.value}}  {c|${percent}%}`
+                            return `{a|${displayName}}  {b|${dataItem.value}}  {c|${percent}%}`
                         }
                     },
                     textStyle: {
                         fontSize: 6,
                         rich: {
                             a: {
-                                width: 30,
-                                align: 'center',
+                                // 名称部分：设置固定宽度，配合 formatter 中的截断逻辑使用
+                                // 由于 ECharts rich 文本样式对溢出处理支持有限，已在 formatter 中手动截断
+                                width: 50,
+                                align: 'center', // 左对齐，避免居中导致视觉上的不对齐
+                                overflow: 'hidden', // 作为额外保护，隐藏可能的溢出内容
                             },
                             b: {
-                                width: 40,
+                                width: 30,
                                 align: 'center',
                                 // padding: [0, 10, 0, 0],
                                 color: '#666',
@@ -112,8 +123,8 @@ export default {
                     {
                         name: '数据分布',
                         type: 'pie',
-                        radius: ['25%', '38%'],
-                        center: ['22%', '50%'], // 居左侧
+                        radius: ['30%', '45%'],
+                        center: ['25%', '50%'], // 居左侧
                         avoidLabelOverlap: false,
                         label: {
                             show: true, // 默认显示中心标签

src/views/home-index/components/projectInfo/components/item-three.vue

@@ -102,7 +102,7 @@ export default {
                     orient: 'vertical',
                     right: '5%',
                     top: 'center',
-                    itemGap: 24,
+                    itemGap: 10,
                     itemWidth: 10,
                     itemHeight: 10,
                     selectedMode: false, // 关键点：关闭 legend 的交互
@@ -129,7 +129,7 @@ export default {
                                 align: 'right',
                             },
                             b: {
-                                width: 40,
+                                width: 50,
                                 padding: [0, 10, 0, 0],
                                 color: '#666',
                             },