feat: separate installation detail tables

This commit is contained in:
chenxi 2026-08-31 21:50:38 +08:00
parent 06a176531e
commit d1f82b5ccf
2 changed files with 19 additions and 20 deletions

View File

@ -171,11 +171,9 @@ class InstallationDetailMirrorRepository
'detail_requested_quantity' => $value($row, 'installcount'),
'detail_settled_amount' => $value($row, 'settleItemAmount'),
'detail_received_amount' => $value($row, 'acceptItemAmount'),
'installation_company' => $value($row, 'installCompanyName'),
'available' => $value($row, 'isAvailable', 'available'),
'quote' => $value($row, 'quote'),
'quote_owner' => $value($row, 'quoteOwner'),
'quote_time' => $value($row, 'quoteTime'),
'change_reason' => $value($row, 'remark'),
'source_created_at' => $value($row, 'createTime'),
'source_modified_at' => $value($row, 'modifyTime'),
];
}

View File

@ -718,6 +718,15 @@
</table>
</div>
@if ($page['slug'] === 'installation-details')
<section class="installation-detail-panel" data-installation-detail-panel aria-label="明细子表">
<div class="biz-card-head"><div class="biz-card-title">明细子表</div></div>
<div class="biz-table-wrap" data-installation-detail-content>
<div class="installation-detail-empty">请点击上方主表记录查看商品明细</div>
</div>
</section>
@endif
@if ($page['slug'] === 'installation-details')
<script>
(() => {
@ -728,8 +737,7 @@
['item_no', '货号'], ['barcode', '条形码'], ['product_name', '商品名称'], ['supplier_name', '供应商名称'],
['detail_requested_amount', '申请明细金额'], ['detail_requested_quantity', '申请明细数量'],
['detail_settled_amount', '结算明细金额'], ['detail_received_amount', '收款明细金额'],
['installation_company', '安装公司'], ['available', '是否可用'], ['quote', '报价'],
['quote_owner', '报价人'], ['quote_time', '报价时间'],
['change_reason', '变更原因'], ['source_created_at', '创建时间'], ['source_modified_at', '修改时间'],
];
const escapeHtml = (value) => String(value ?? '').replace(/[&<>"']/g, (char) => ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#039;'}[char]));
const renderDetails = (items) => {
@ -738,30 +746,23 @@
const body = items.map((item) => `<tr>${columns.map(([key]) => `<td>${escapeHtml(item[key])}</td>`).join('')}</tr>`).join('');
return `<table class="installation-detail-table"><thead><tr>${head}</tr></thead><tbody>${body}</tbody></table>`;
};
const detailPanel = document.querySelector('[data-installation-detail-panel]');
const detailContent = detailPanel?.querySelector('[data-installation-detail-content]');
document.querySelectorAll('[data-installation-expand]').forEach((button) => {
button.addEventListener('click', async () => {
const row = button.closest('[data-installation-row]');
const existing = row.nextElementSibling;
if (existing?.matches('.installation-detail-row')) {
existing.hidden = !existing.hidden;
button.setAttribute('aria-expanded', String(!existing.hidden));
button.querySelector('.material-icons-outlined').textContent = existing.hidden ? 'chevron_right' : 'expand_more';
return;
}
const detailRow = document.createElement('tr');
detailRow.className = 'installation-detail-row';
detailRow.innerHTML = `<td colspan="{{ count($descriptor->fields) + 1 }}"><div>正在加载明细…</div></td>`;
row.after(detailRow);
if (!detailContent) return;
detailContent.innerHTML = '<div>正在加载明细…</div>';
button.disabled = true;
try {
const response = await fetch(detailUrl.replace('__GUID__', encodeURIComponent(row.dataset.guid)), {headers: {'Accept': 'application/json'}});
if (!response.ok) throw new Error('明细加载失败');
const payload = await response.json();
detailRow.firstElementChild.innerHTML = renderDetails(payload.data || []);
detailContent.innerHTML = renderDetails(payload.data || []);
button.setAttribute('aria-expanded', 'true');
button.querySelector('.material-icons-outlined').textContent = 'expand_more';
} catch (error) {
detailRow.firstElementChild.innerHTML = '<div class="installation-detail-error">明细加载失败,请稍后重试</div>';
detailContent.innerHTML = '<div class="installation-detail-error">明细加载失败,请稍后重试</div>';
} finally {
button.disabled = false;
}