update dashboard
This commit is contained in:
@@ -5,6 +5,7 @@ import {
|
|||||||
DollarOutlined,
|
DollarOutlined,
|
||||||
DatabaseOutlined,
|
DatabaseOutlined,
|
||||||
} from '@ant-design/icons-vue'
|
} from '@ant-design/icons-vue'
|
||||||
|
import type { Component } from 'vue'
|
||||||
import type { DataTypeCount } from '@/types/api'
|
import type { DataTypeCount } from '@/types/api'
|
||||||
|
|
||||||
defineProps<{
|
defineProps<{
|
||||||
@@ -12,7 +13,7 @@ defineProps<{
|
|||||||
loading: boolean
|
loading: boolean
|
||||||
}>()
|
}>()
|
||||||
|
|
||||||
const iconMap: Record<string, ReturnType<typeof ShoppingCartOutlined>> = {
|
const iconMap: Record<string, Component> = {
|
||||||
order: ShoppingCartOutlined,
|
order: ShoppingCartOutlined,
|
||||||
product: ShoppingOutlined,
|
product: ShoppingOutlined,
|
||||||
refund: DollarOutlined,
|
refund: DollarOutlined,
|
||||||
|
|||||||
@@ -66,11 +66,16 @@ function handleDataTypeChange(val: unknown) {
|
|||||||
emit('update:dataType', (val as string) || undefined)
|
emit('update:dataType', (val as string) || undefined)
|
||||||
}
|
}
|
||||||
|
|
||||||
watch(flatData, () => {
|
watch(flatData, (newData) => {
|
||||||
if (chart) {
|
if (newData.length === 0 && chart) {
|
||||||
chart.changeData(flatData.value)
|
chart.destroy()
|
||||||
|
chart = null
|
||||||
|
} else if (!chart && chartRef.value && newData.length > 0) {
|
||||||
|
nextTick(() => createChart())
|
||||||
|
} else if (chart) {
|
||||||
|
chart.changeData(newData)
|
||||||
}
|
}
|
||||||
})
|
}, { flush: 'post' })
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
if (props.data.length > 0) {
|
if (props.data.length > 0) {
|
||||||
@@ -78,15 +83,6 @@ onMounted(() => {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(
|
|
||||||
() => props.data,
|
|
||||||
(newVal) => {
|
|
||||||
if (newVal.length > 0 && !chart) {
|
|
||||||
nextTick(() => createChart())
|
|
||||||
}
|
|
||||||
},
|
|
||||||
)
|
|
||||||
|
|
||||||
onBeforeUnmount(() => {
|
onBeforeUnmount(() => {
|
||||||
if (chart) {
|
if (chart) {
|
||||||
chart.destroy()
|
chart.destroy()
|
||||||
|
|||||||
@@ -2,9 +2,7 @@ import { api } from '@/utils/request'
|
|||||||
import type {
|
import type {
|
||||||
DashboardOverview,
|
DashboardOverview,
|
||||||
DashboardTrendPoint,
|
DashboardTrendPoint,
|
||||||
DashboardTrendParams,
|
|
||||||
DashboardBreakdownItem,
|
DashboardBreakdownItem,
|
||||||
DashboardBreakdownParams,
|
|
||||||
} from '@/types/api'
|
} from '@/types/api'
|
||||||
|
|
||||||
export const useDashboardStore = defineStore('dashboard', () => {
|
export const useDashboardStore = defineStore('dashboard', () => {
|
||||||
@@ -49,7 +47,7 @@ export const useDashboardStore = defineStore('dashboard', () => {
|
|||||||
trendLoading.value = true
|
trendLoading.value = true
|
||||||
trendError.value = ''
|
trendError.value = ''
|
||||||
try {
|
try {
|
||||||
const params: DashboardTrendParams = {
|
const params: Record<string, unknown> = {
|
||||||
group_by: trendGroupBy.value,
|
group_by: trendGroupBy.value,
|
||||||
data_type: trendDataType.value,
|
data_type: trendDataType.value,
|
||||||
from: trendFrom.value,
|
from: trendFrom.value,
|
||||||
@@ -57,7 +55,7 @@ export const useDashboardStore = defineStore('dashboard', () => {
|
|||||||
}
|
}
|
||||||
trendData.value = await api.get<DashboardTrendPoint[]>(
|
trendData.value = await api.get<DashboardTrendPoint[]>(
|
||||||
'/api/v1/dashboard/trend',
|
'/api/v1/dashboard/trend',
|
||||||
params as unknown as Record<string, unknown>,
|
params,
|
||||||
)
|
)
|
||||||
} catch (err: unknown) {
|
} catch (err: unknown) {
|
||||||
const msg = err instanceof Error ? err.message : '获取趋势数据失败'
|
const msg = err instanceof Error ? err.message : '获取趋势数据失败'
|
||||||
@@ -72,7 +70,7 @@ export const useDashboardStore = defineStore('dashboard', () => {
|
|||||||
breakdownLoading.value = true
|
breakdownLoading.value = true
|
||||||
breakdownError.value = ''
|
breakdownError.value = ''
|
||||||
try {
|
try {
|
||||||
const params: DashboardBreakdownParams = {
|
const params: Record<string, unknown> = {
|
||||||
dimension: breakdownDimension.value,
|
dimension: breakdownDimension.value,
|
||||||
data_type: breakdownDataType.value,
|
data_type: breakdownDataType.value,
|
||||||
from: breakdownFrom.value,
|
from: breakdownFrom.value,
|
||||||
@@ -80,7 +78,7 @@ export const useDashboardStore = defineStore('dashboard', () => {
|
|||||||
}
|
}
|
||||||
breakdownData.value = await api.get<DashboardBreakdownItem[]>(
|
breakdownData.value = await api.get<DashboardBreakdownItem[]>(
|
||||||
'/api/v1/dashboard/breakdown',
|
'/api/v1/dashboard/breakdown',
|
||||||
params as unknown as Record<string, unknown>,
|
params,
|
||||||
)
|
)
|
||||||
} catch (err: unknown) {
|
} catch (err: unknown) {
|
||||||
const msg = err instanceof Error ? err.message : '获取分维度数据失败'
|
const msg = err instanceof Error ? err.message : '获取分维度数据失败'
|
||||||
|
|||||||
+1
@@ -0,0 +1 @@
|
|||||||
|
{"version":"4.1.0","results":[[":frontend/src/pages/failed-messages/__tests__/index.spec.ts",{"duration":0,"failed":true}]]}
|
||||||
Reference in New Issue
Block a user