【GEDS-15824】仪表板弹框的关闭按钮事件
本帖最后由 KarenGao 于 2024-10-22 16:03 编辑场景描述:
客户集成仪表板。仪表板设置了跳转,跳转到其他仪表板。同页面中,客户有显示一段文本内容的标签,通过css代码设置了显示层级。这就导致,文字内容始终悬浮在仪表板组件上面。不好看:
需求:
建议早呢更加弹框的出现和关闭事件的监听。方便与外部交互。
您好,这是高级分析查看器和标准版查看器的一个demo。
仪表板实例初始化后,用户可以监听事件(show.modal / hide.modal)
const appConfig: IAppConfig = {
...config,
...global.wynbi,
token,
};
const ins = global.WynBi.create('DashboardViewer', appConfig);
ins.initialize({
container: document.querySelector('#root'),
}).then(() => {
ins.on('show.modal', (e) => {
console.log('>>> show modal', e);
});
ins.on('hide.modal', (e) => {
console.log('>>> close modal', e);
});
});
// lite
const appConfig: IAppConfig = {
...config,
...global.wynbi,
token,
};
const ins = global.WynBi.createViewerLite(appConfig);
const container = document.querySelector('#root');
const dom = document.createElement('div');
dom.className = 'dashboard-container';
container.appendChild(dom);
ins.initialize({
container,
}).then((dash) => {
// ...connect UIDashboard
ins.on('show.modal', (e) => {
console.log('>>> show modal', e);
});
ins.on('hide.modal', (e) => {
console.log('>>> close modal', e);
});
}, (err) => {
console.log(err);
});
页:
[1]