fix: 增加 mock api,修复预览模式下动态数据更新问题
This commit is contained in:
parent
c4a7c673f8
commit
99cad606e7
@ -14,6 +14,7 @@ export const scrollBoardUrl = '/mock/scrollBoard'
|
||||
export const radarUrl = '/mock/radarData'
|
||||
export const heatMapUrl = '/mock/heatMapData'
|
||||
export const scatterBasicUrl = '/mock/scatterBasic'
|
||||
export const wordCloudUrl = '/mock/wordCloud'
|
||||
|
||||
const mockObject: MockMethod[] = [
|
||||
{
|
||||
@ -73,6 +74,11 @@ const mockObject: MockMethod[] = [
|
||||
method: RequestHttpEnum.GET,
|
||||
response: () => test.fetchScatterBasic
|
||||
},
|
||||
{
|
||||
url: wordCloudUrl,
|
||||
method: RequestHttpEnum.GET,
|
||||
response: () => test.fetchWordCloud
|
||||
}
|
||||
]
|
||||
|
||||
export default mockObject
|
||||
|
@ -198,5 +198,44 @@ export default {
|
||||
status: 200,
|
||||
msg: '请求成功',
|
||||
data: scatterJson
|
||||
},
|
||||
// 词云
|
||||
fetchWordCloud: {
|
||||
code: 0,
|
||||
status: 200,
|
||||
msg: '请求成功',
|
||||
data: [
|
||||
{
|
||||
name: '@name',
|
||||
value: 8000,
|
||||
textStyle: {
|
||||
color: '#78fbb2'
|
||||
},
|
||||
emphasis: {
|
||||
textStyle: {
|
||||
color: 'red'
|
||||
}
|
||||
}
|
||||
},
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' },
|
||||
{ name: '@name', value: '@integer(10, 8000)' }
|
||||
]
|
||||
}
|
||||
}
|
||||
|
@ -23,6 +23,7 @@ import { useChartDataFetch } from '@/hooks'
|
||||
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
|
||||
import { isPreview } from '@/utils'
|
||||
import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent } from 'echarts/components'
|
||||
import dataJson from './data.json'
|
||||
|
||||
const props = defineProps({
|
||||
themeSetting: {
|
||||
@ -47,17 +48,25 @@ const option = computed(() => {
|
||||
return mergeTheme(props.chartConfig.option, props.themeSetting, includes)
|
||||
})
|
||||
|
||||
const dataSetHandle = (dataset: typeof dataJson) => {
|
||||
// eslint-disable-next-line vue/no-mutating-props
|
||||
dataset && (props.chartConfig.option.series[0].data = dataset)
|
||||
|
||||
vChartRef.value && isPreview() && vChartRef.value.setOption(props.chartConfig.option)
|
||||
}
|
||||
|
||||
// dataset 无法变更条数的补丁
|
||||
watch(
|
||||
() => props.chartConfig.option.dataset,
|
||||
newData => {
|
||||
// eslint-disable-next-line vue/no-mutating-props
|
||||
props.chartConfig.option.series[0].data = newData
|
||||
dataSetHandle(newData)
|
||||
},
|
||||
{
|
||||
deep: false
|
||||
}
|
||||
)
|
||||
|
||||
const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore)
|
||||
const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore, (newData: typeof dataJson) => {
|
||||
dataSetHandle(newData)
|
||||
})
|
||||
</script>
|
||||
|
Loading…
x
Reference in New Issue
Block a user