优化图表大小及描述
This commit is contained in:
@@ -39,7 +39,7 @@
|
||||
const statusDict = ref<DictData[]>([]);
|
||||
|
||||
const STATUS_COLORS = ['#3B82F6', '#10B981', '#F97316', '#EC4899', '#8B5CF6', '#06B6D4'];
|
||||
const AMOUNT_LINE_COLOR = '#F59E0B';
|
||||
const AMOUNT_LINE_COLOR = '#FBBF24';
|
||||
let pieChartInstance: echarts.ECharts | null = null;
|
||||
let barChartInstance: echarts.ECharts | null = null;
|
||||
let resizeObserver: ResizeObserver | null = null;
|
||||
@@ -208,7 +208,7 @@
|
||||
series.push({
|
||||
name: '空态环',
|
||||
type: 'pie',
|
||||
radius: ['46%', '72%'],
|
||||
radius: ['40%', '64%'],
|
||||
center: ['50%', '44%'],
|
||||
silent: true,
|
||||
legendHoverLink: false,
|
||||
@@ -234,7 +234,7 @@
|
||||
series.push({
|
||||
name: '合同状态',
|
||||
type: 'pie',
|
||||
radius: total ? ['46%', '72%'] : [0, 0],
|
||||
radius: total ? ['40%', '64%'] : [0, 0],
|
||||
center: ['50%', '44%'],
|
||||
avoidLabelOverlap: true,
|
||||
minAngle: total ? 4 : 0,
|
||||
@@ -245,9 +245,9 @@
|
||||
},
|
||||
label: {
|
||||
show: total,
|
||||
formatter: ({ name, value, percent }) => (total ? `${name}\n${value}项 / ${percent}%` : ''),
|
||||
formatter: ({ name, percent }) => (total && Number(percent) >= 8 ? `${name}\n${percent}%` : ''),
|
||||
color: isDark ? '#e2e8f0' : '#334155',
|
||||
fontSize: 12,
|
||||
fontSize: 11,
|
||||
},
|
||||
emphasis: {
|
||||
scale: true,
|
||||
@@ -257,6 +257,9 @@
|
||||
silent: !total,
|
||||
labelLine: {
|
||||
show: total,
|
||||
length: 4,
|
||||
length2: 3,
|
||||
maxSurfaceAngle: 80,
|
||||
},
|
||||
});
|
||||
|
||||
@@ -316,7 +319,7 @@
|
||||
left: 'center',
|
||||
top: '51%',
|
||||
style: {
|
||||
text: `金额 ${formatAmountWan(totalContractAmount.value, 2)}万元`,
|
||||
text: ` ${formatAmountWan(totalContractAmount.value, 2)}万元`,
|
||||
fill: isDark ? '#94a3b8' : '#64748b',
|
||||
fontSize: 12,
|
||||
fontWeight: 500,
|
||||
@@ -401,7 +404,7 @@
|
||||
yAxisIndex: 1,
|
||||
smooth: true,
|
||||
symbol: 'circle',
|
||||
symbolSize: 6,
|
||||
symbolSize: 4,
|
||||
itemStyle: {
|
||||
color: AMOUNT_LINE_COLOR,
|
||||
},
|
||||
@@ -409,6 +412,19 @@
|
||||
color: AMOUNT_LINE_COLOR,
|
||||
width: 2,
|
||||
},
|
||||
areaStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{ offset: 0, color: 'rgba(251, 191, 36, 0.28)' },
|
||||
{ offset: 1, color: 'rgba(251, 191, 36, 0.04)' },
|
||||
],
|
||||
},
|
||||
},
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
@@ -460,8 +476,16 @@
|
||||
left: 'center',
|
||||
itemGap: 16,
|
||||
data: [...statusItems.map((item) => item.label), ...(hasData ? ['合同金额'] : [])],
|
||||
formatter: (name) => (name === '合同金额' ? `{amount|${name}}` : name),
|
||||
textStyle: {
|
||||
color: isDark ? '#e2e8f0' : '#475569',
|
||||
rich: {
|
||||
amount: {
|
||||
color: isDark ? '#94a3b8' : '#64748b',
|
||||
fontSize: 12,
|
||||
fontWeight: 400,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
@@ -509,12 +533,16 @@
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
nameGap: 8,
|
||||
nameTextStyle: {
|
||||
color: isDark ? '#94a3b8' : '#64748b',
|
||||
padding: [0, 0, 2, 0],
|
||||
color: isDark ? 'rgba(148, 163, 184, 0.72)' : 'rgba(100, 116, 139, 0.88)',
|
||||
padding: [0, 0, 0, 0],
|
||||
align: 'right',
|
||||
fontSize: 11,
|
||||
fontWeight: 400,
|
||||
},
|
||||
axisLabel: {
|
||||
color: isDark ? '#94a3b8' : '#64748b',
|
||||
color: isDark ? 'rgba(148, 163, 184, 0.78)' : 'rgba(100, 116, 139, 0.92)',
|
||||
formatter: (value) => `${value}`,
|
||||
},
|
||||
},
|
||||
|
||||
@@ -179,7 +179,7 @@
|
||||
series.push({
|
||||
name: '空态环',
|
||||
type: 'pie',
|
||||
radius: ['46%', '72%'],
|
||||
radius: ['40%', '64%'],
|
||||
center: ['50%', '44%'],
|
||||
silent: true,
|
||||
legendHoverLink: false,
|
||||
@@ -205,7 +205,7 @@
|
||||
series.push({
|
||||
name: '任务状态',
|
||||
type: 'pie',
|
||||
radius: total ? ['46%', '72%'] : [0, 0],
|
||||
radius: total ? ['40%', '64%'] : [0, 0],
|
||||
center: ['50%', '44%'],
|
||||
avoidLabelOverlap: true,
|
||||
minAngle: total ? 4 : 0,
|
||||
@@ -216,9 +216,9 @@
|
||||
},
|
||||
label: {
|
||||
show: total,
|
||||
formatter: ({ name, value, percent }) => (total ? `${name}\n${value}项 / ${percent}%` : ''),
|
||||
formatter: ({ name, percent }) => (total && Number(percent) >= 8 ? `${name}\n${percent}%` : ''),
|
||||
color: isDark ? '#e2e8f0' : '#334155',
|
||||
fontSize: 12,
|
||||
fontSize: 11,
|
||||
},
|
||||
emphasis: {
|
||||
scale: true,
|
||||
@@ -228,6 +228,9 @@
|
||||
silent: !total,
|
||||
labelLine: {
|
||||
show: total,
|
||||
length: 4,
|
||||
length2: 3,
|
||||
maxSurfaceAngle: 80,
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user