refactor: merge channel groups into single list in matrix

This commit is contained in:
王源
2026-09-07 14:45:17 +08:00
parent 3775b8861e
commit 40be4b62de
+8 -19
View File
@@ -550,7 +550,7 @@
function renderMatrix() { function renderMatrix() {
// 列 = 产品(按 pkg 区分,同名产品用地区区分显示);行 = 渠道 // 列 = 产品(按 pkg 区分,同名产品用地区区分显示);行 = 渠道
// 每个订单条目是一列 // 每个订单条目是一列,代投+自投渠道合并
const cols = orderData.map(o => ({ const cols = orderData.map(o => ({
key: o.pkg, key: o.pkg,
label: o.product, label: o.product,
@@ -559,15 +559,13 @@
channels: new Set([...(o.agency_channels||[]), ...(o.self_channels||[])]) channels: new Set([...(o.agency_channels||[]), ...(o.self_channels||[])])
})); }));
// 收集所有渠道,分代投 / 自投两组 // 收集所有渠道(代投+自投合并去重,保持出现顺序)
const agencySet = new Set(); const channels = [];
const selfSet = new Set();
orderData.forEach(o => { orderData.forEach(o => {
(o.agency_channels||[]).forEach(c => agencySet.add(c)); [...(o.agency_channels||[]), ...(o.self_channels||[])].forEach(c => {
(o.self_channels||[]).forEach(c => selfSet.add(c)); if (!channels.includes(c)) channels.push(c);
});
}); });
const agencyChannels = [...agencySet];
const selfChannels = [...selfSet];
// 表头 // 表头
const thead = document.querySelector('#matrixTable thead'); const thead = document.querySelector('#matrixTable thead');
@@ -588,22 +586,13 @@
return `<td style="text-align:center;"><span class="status-badge ${cls}" style="padding:2px 8px;font-size:10px;">${col.status}</span></td>`; return `<td style="text-align:center;"><span class="status-badge ${cls}" style="padding:2px 8px;font-size:10px;">${col.status}</span></td>`;
}; };
const groupRows = (title, channels) => { const tbody = document.querySelector('#matrixTable tbody');
if (!channels.length) return ''; tbody.innerHTML = channels.map(ch => `
let html = `<tr><td colspan="${cols.length+1}" style="background:#eef2ff;font-weight:700;color:#4338ca;font-size:12px;">${title}</td></tr>`;
html += channels.map(ch => `
<tr> <tr>
<td style="position:sticky;left:0;background:#fff;font-weight:500;">${ch}</td> <td style="position:sticky;left:0;background:#fff;font-weight:500;">${ch}</td>
${cols.map(col => cell(col, ch)).join('')} ${cols.map(col => cell(col, ch)).join('')}
</tr> </tr>
`).join(''); `).join('');
return html;
};
const tbody = document.querySelector('#matrixTable tbody');
tbody.innerHTML =
groupRows('代投渠道', agencyChannels) +
groupRows('平台自投渠道', selfChannels);
} }
function populateFilters() { function populateFilters() {