304a404eaf
- 修复饼图组件显示问题，取消注释使图表正常显示 - 优化数据处理逻辑，支持问题索引1和2的数据处理 - 移除不必要的响应式包装，直接使用JSON对象提高性能 - 清理未使用的导入和函数，如showToast、surveys等 - 添加对空选项数组的条件判断，避免渲染空数据 - 移除控制台日志输出，提高代码整洁度 - 更新IDE图标主题为material-icon-theme - 优化图表配置结构，简化代码
38 lines
935 B
TypeScript
38 lines
935 B
TypeScript
import { onMounted, ref, type ShallowRef, watch } from 'vue';
|
||
import type { ECOption } from '@/utils/echarts';
|
||
import { chart } from '@/utils/echarts';
|
||
import { pieOption } from './data/pie';
|
||
|
||
type dataOption = Partial<ECOption['data']>;
|
||
|
||
/**
|
||
* 饼图的 option
|
||
*/
|
||
function useSetPieChart(
|
||
dom: Readonly<ShallowRef<HTMLSpanElement | null>>,
|
||
series: any,
|
||
opts: optsType = {}
|
||
): void {
|
||
// 图表实例
|
||
let chartInstance: any;
|
||
|
||
onMounted(() => {
|
||
// 检测边界范围 dom 和 series 是否存在
|
||
if (!dom.value && !series) return;
|
||
|
||
// 在 dom 挂载之后，显示饼图
|
||
chartInstance = chart.init(dom.value);
|
||
pieOption.series = JSON.parse(JSON.stringify(series.value));
|
||
|
||
// 设置图表选项
|
||
chartInstance.setOption(pieOption, opts);
|
||
});
|
||
|
||
// 如果 data 变动，重新生成图表w
|
||
watch(series, (value) => {
|
||
chartInstance.setOption(value, opts);
|
||
});
|
||
}
|
||
|
||
export { useSetPieChart };
|