class DataCollection extends HTMLElement {
constructor() {
super();
this.attachShadow({ mode: 'open' });
this.monitorStatus = 0; // 0-未监控，1-监控中，2-错误
this.statusTimer = null;
}
getCurrentSelection() {
const selection = localStorage.getItem('xnsim-selection');
if (!selection) {
return { plane: '', configurationId: '', domainId: '' };
}
try {
const parsedSelection = JSON.parse(selection);
return {
plane: parsedSelection.plane || '',
configurationId: parsedSelection.configurationId || '',
domainId: parsedSelection.domainId || ''
};
} catch (error) {
return { plane: '', configurationId: '', domainId: '' };
}
}
async loadInterfaces() {
try {
const { configurationId } = this.getCurrentSelection();
if (!configurationId) {
console.warn('未找到配置ID');
this.interfaces = [];
return;
}
const response = await fetch(`/api/interface/list?systemName=XNSim&confID=${configurationId}`);
const data = await response.json();
this.interfaces = data;
} catch (error) {
console.error('加载接口数据失败:', error);
this.interfaces = [];
}
}
async connectedCallback() {
await this.loadInterfaces();
this.render();
setTimeout(() => {
this.startStatusTimer();
}, 1000);
}
startStatusTimer() {
if (this.statusTimer) {
clearInterval(this.statusTimer);
}
this.statusTimer = setInterval(async () => {
try {
const res = await fetch('/api/dds-monitor/status');
if (!res.ok) throw new Error('网络错误');
const data = await res.json();
if (data.isInitialized) {
this.monitorStatus = 1;
} else {
this.monitorStatus = 0;
}
} catch (e) {
this.monitorStatus = 2;
}
this.updateMonitorStatus();
}, 1000);
}
disconnectedCallback() {
if (this.statusTimer) {
clearInterval(this.statusTimer);
this.statusTimer = null;
}
}
updateMonitorStatus() {
const statusIndicator = this.shadowRoot.getElementById('statusIndicator');
const statusText = this.shadowRoot.getElementById('statusText');
if (statusIndicator) {
statusIndicator.classList.remove('active', 'inactive', 'error');
switch (this.monitorStatus) {
case 1:
statusIndicator.classList.add('active');
break;
case 2:
statusIndicator.classList.add('error');
break;
default:
statusIndicator.classList.add('inactive');
}
}
if (statusText) {
switch (this.monitorStatus) {
case 1:
statusText.textContent = '监控中';
break;
case 2:
statusText.textContent = '监控错误';
break;
default:
statusText.textContent = '未监控';
}
}
}
render() {
// 树型控件分组
const groupedInterfaces = (this.interfaces || []).reduce((groups, item) => {
const group = groups[item.ModelStructName] || [];
group.push(item);
groups[item.ModelStructName] = group;
return groups;
}, {});
this.shadowRoot.innerHTML = `
`;
this.updateMonitorStatus();
}
}
customElements.define('data-collection', DataCollection);