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 radarUrl = '/mock/radarData'
|
||||||
export const heatMapUrl = '/mock/heatMapData'
|
export const heatMapUrl = '/mock/heatMapData'
|
||||||
export const scatterBasicUrl = '/mock/scatterBasic'
|
export const scatterBasicUrl = '/mock/scatterBasic'
|
||||||
|
export const wordCloudUrl = '/mock/wordCloud'
|
||||||
|
|
||||||
const mockObject: MockMethod[] = [
|
const mockObject: MockMethod[] = [
|
||||||
{
|
{
|
||||||
@ -73,6 +74,11 @@ const mockObject: MockMethod[] = [
|
|||||||
method: RequestHttpEnum.GET,
|
method: RequestHttpEnum.GET,
|
||||||
response: () => test.fetchScatterBasic
|
response: () => test.fetchScatterBasic
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
url: wordCloudUrl,
|
||||||
|
method: RequestHttpEnum.GET,
|
||||||
|
response: () => test.fetchWordCloud
|
||||||
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
export default mockObject
|
export default mockObject
|
||||||
|
@ -198,5 +198,44 @@ export default {
|
|||||||
status: 200,
|
status: 200,
|
||||||
msg: '请求成功',
|
msg: '请求成功',
|
||||||
data: scatterJson
|
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 { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
|
||||||
import { isPreview } from '@/utils'
|
import { isPreview } from '@/utils'
|
||||||
import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent } from 'echarts/components'
|
import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent } from 'echarts/components'
|
||||||
|
import dataJson from './data.json'
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
themeSetting: {
|
themeSetting: {
|
||||||
@ -47,17 +48,25 @@ const option = computed(() => {
|
|||||||
return mergeTheme(props.chartConfig.option, props.themeSetting, includes)
|
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 无法变更条数的补丁
|
// dataset 无法变更条数的补丁
|
||||||
watch(
|
watch(
|
||||||
() => props.chartConfig.option.dataset,
|
() => props.chartConfig.option.dataset,
|
||||||
newData => {
|
newData => {
|
||||||
// eslint-disable-next-line vue/no-mutating-props
|
dataSetHandle(newData)
|
||||||
props.chartConfig.option.series[0].data = newData
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
deep: false
|
deep: false
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore)
|
const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore, (newData: typeof dataJson) => {
|
||||||
|
dataSetHandle(newData)
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user