feat: init chart

This commit is contained in:
ulleo
2025-06-09 16:07:40 +08:00
parent 53964a3f90
commit dbb721d550
2 changed files with 14 additions and 13 deletions
+4 -3
View File
@@ -85,7 +85,7 @@ const chartRef = ref()
function onTypeChange(type: string) {
console.log(type)
nextTick(()=>{
nextTick(() => {
chartRef.value?.destroyChart()
chartRef.value?.renderChart()
})
@@ -102,9 +102,10 @@ function onTypeChange(type: string) {
<el-tabs v-model="settings.type" class="type-tabs" @tab-click="handleClick" tab-position="top">
<el-tab-pane label="Chart" name="chart">
<template #label>
<el-select v-model="chartType" style="width: 80px" :disabled="settings.type!== 'chart'" @change="onTypeChange">
<el-select v-model="chartType" style="width: 80px" :disabled="settings.type!== 'chart'"
@change="onTypeChange">
<el-option value="table">table</el-option>
<el-option value="cloumn">cloumn</el-option>
<el-option value="column">column</el-option>
<el-option value="bar">bar</el-option>
<el-option value="line">line</el-option>
<el-option value="pie">pie</el-option>
+10 -10
View File
@@ -1,5 +1,5 @@
<script setup lang="ts">
import {computed, onMounted, onUnmounted, ref} from "vue";
import {computed, onMounted, onUnmounted} from "vue";
import {getChartInstance} from "@/views/chat/component/index.ts";
import type {BaseChart} from "@/views/chat/component/BaseChart.ts";
@@ -35,21 +35,21 @@ const axis = computed(() => {
return _list
})
const chartInstance = ref<BaseChart>()
let chartInstance: BaseChart | undefined
function renderChart() {
chartInstance.value = getChartInstance(params.type, chartId.value)
console.log(chartInstance.value)
if (chartInstance.value) {
chartInstance.value.init(axis.value, params.data)
chartInstance.value.render()
chartInstance = getChartInstance(params.type, chartId.value)
console.log(chartInstance)
if (chartInstance) {
chartInstance.init(axis.value, params.data)
chartInstance.render()
}
}
function destroyChart() {
if (chartInstance.value) {
chartInstance.value.destroy()
chartInstance.value = undefined
if (chartInstance) {
chartInstance.destroy()
chartInstance = undefined
}
}