Chart open user dialog

This commit is contained in:
Natsumi
2025-02-18 18:24:40 +13:00
parent 4002e944b9
commit f7530303f6
2 changed files with 14 additions and 6 deletions
+4 -4
View File
@@ -126,8 +126,8 @@
echarts = echartsModule; echarts = echartsModule;
} }
if (this.activityData.length && echarts) { if (this.activityData.length && echarts) {
// actvity data is ready, but world name data isn't ready // activity data is ready, but world name data isn't ready
// so init echarts with empty data, redcuce the render time of init screen // so init echarts with empty data, reduce the render time of init screen
// TODO: move to created lifecycle, init screen faster // TODO: move to created lifecycle, init screen faster
this.initEcharts(true); this.initEcharts(true);
this.getAllDateOfActivity(); this.getAllDateOfActivity();
@@ -165,11 +165,11 @@
requestAnimationFrame(() => { requestAnimationFrame(() => {
this.echartsInstance.setOption(this.getNewOption(isFirstTime), { lazyUpdate: true }); this.echartsInstance.setOption(this.getNewOption(isFirstTime), { lazyUpdate: true });
this.echartsInstance.on('click', 'yAxis', this.hanleClickYAxisLable); this.echartsInstance.on('click', 'yAxis', this.handleClickYAxisLabel);
this.isLoading = false; this.isLoading = false;
}); });
}, },
hanleClickYAxisLable(params) { handleClickYAxisLabel(params) {
const detailDataIdx = this.activityDetailData.findIndex( const detailDataIdx = this.activityDetailData.findIndex(
(arr) => arr[0]?.location === this.activityData[params?.dataIndex]?.location (arr) => arr[0]?.location === this.activityData[params?.dataIndex]?.location
); );
@@ -24,7 +24,7 @@
export default { export default {
name: 'InstanceActivityDetail', name: 'InstanceActivityDetail',
inject: ['API'], inject: ['API', 'showUserDialog'],
props: { props: {
activityDetailData: { activityDetailData: {
type: Array, type: Array,
@@ -98,11 +98,18 @@
}); });
this.echartsInstance.setOption(this.getNewOption(), { lazyUpdate: true }); this.echartsInstance.setOption(this.getNewOption(), { lazyUpdate: true });
this.echartsInstance.on('click', 'yAxis', this.handleClickYAxisLabel);
setTimeout(() => { setTimeout(() => {
this.isLoading = false; this.isLoading = false;
}, 200); }, 200);
}, },
handleClickYAxisLabel(params) {
const userData = this.activityDetailData[params.dataIndex];
if (userData?.user_id) {
this.showUserDialog(userData.user_id);
}
},
getNewOption() { getNewOption() {
const getTooltip = (params) => { const getTooltip = (params) => {
const activityDetailData = this.activityDetailData; const activityDetailData = this.activityDetailData;
@@ -152,7 +159,8 @@
formatter: (value) => (value.length > 20 ? `${value.slice(0, 20)}...` : value) formatter: (value) => (value.length > 20 ? `${value.slice(0, 20)}...` : value)
}, },
inverse: true, inverse: true,
data: this.activityDetailData.map((item) => item.display_name) data: this.activityDetailData.map((item) => item.display_name),
triggerEvent: true
}, },
xAxis: { xAxis: {
type: 'value', type: 'value',