@chenchaolong/plugin-trade-compliance-workbench 0.1.8 → 0.1.10

package/dist/lib/remote-components/trade-compliance-workbench/app.js

@@ -269,7 +269,7 @@
     }
 
     return h('div', { className: 'tcw-shell' },
-      h('header', { className: 'tcw-header' },
+      h('header', { className: 'tcw-header tcw-frame' },
         h('div', { className: 'tcw-title-block' },
           h('span', { className: 'tcw-kicker' }, '外贸合规工作台'),
           h('h1', null, pageTitle(activePage)),
@@ -281,13 +281,13 @@
         )
       ),
       notice ? h('div', { className: 'tcw-notice' }, notice) : null,
-      h('nav', { className: 'tcw-tabs' }, [
+      h('nav', { className: 'tcw-tabs tcw-frame' }, [
         tab('overview-page', '工作台总览'),
         tab('controlled-goods-page', '管控商品'),
         tab('products-page', '供应商商品'),
         tab('workbooks-page', '销售发票')
       ]),
-      h('main', { className: 'tcw-main' },
+      h('main', { className: 'tcw-main tcw-frame' },
         h('section', { className: 'tcw-content' },
           activePage === 'overview-page' ? renderOverviewPage() : null,
           activePage === 'controlled-goods-page' ? renderControlledGoodsPage() : null,
@@ -321,12 +321,14 @@
 
     function renderControlledGoodsPage() {
       return h('div', { className: 'tcw-page controlled-goods-page' },
-        pageToolbar('管控商品', '智能体识别结果先进入待审核，确认后写入正式管控商品库。', [
+        businessPanel('管控商品', '上传管控目录后，识别结果在列表内完成审核、驳回和入库。', [
           uploadButton('upload_controlled_goods_file', '上传管控商品文件'),
           h('button', { className: 'tcw-btn tcw-btn-soft', onClick: () => setShowManualForm(!showManualForm) }, showManualForm ? '收起新增' : '手动新增')
-        ]),
-        showManualForm ? renderControlledGoodsForm() : null,
-        renderListPanel('管控商品列表', 'pending-controlled-goods confirmed-controlled-goods', controlledReviews, ['商品名称', '海关编码', '关键词', '管控说明', '来源'], (item) => {
+        ], [
+          showManualForm ? renderControlledGoodsForm() : null,
+          renderListToolbar('管控商品列表', controlledReviews.length),
+          h('div', { className: 'pending-controlled-goods confirmed-controlled-goods tcw-table-section' },
+            reviewTable(['商品名称', '海关编码', '关键词', '管控说明', '来源'], controlledReviews, (item) => {
             const row = readMerged(item)
             return [
               value(row.productName || item.title),
@@ -335,7 +337,9 @@
               value(row.controlNote),
               value(item.sourceLocation || row.sourceFileName)
             ]
-          }, '暂无管控商品识别结果。上传目录并等待智能体调用工具后会显示在这里。')
+            }, '暂无管控商品识别结果。上传目录并等待智能体调用工具后会显示在这里。')
+          )
+        ])
       )
     }
 
@@ -458,7 +462,26 @@
     }
 
     function reviewTable(headers, rows, mapRow, emptyText) {
-      return table(['', ...headers, '状态', '操作'], rows, (row) => [
+      const selectableIds = getSelectableRowIds(rows)
+      const selectedVisibleIds = selectableIds.filter((id) => selectedIds.includes(id))
+      const allVisibleSelected = selectableIds.length > 0 && selectedVisibleIds.length === selectableIds.length
+      const partiallySelected = selectedVisibleIds.length > 0 && selectedVisibleIds.length < selectableIds.length
+      return table([
+        h('input', {
+          className: 'row-selection-checkbox',
+          type: 'checkbox',
+          'aria-label': '全选当前列表',
+          checked: allVisibleSelected,
+          disabled: selectableIds.length === 0,
+          ref: (node) => {
+            if (node) node.indeterminate = partiallySelected
+          },
+          onChange: (event) => toggleAllVisibleRows(rows, event.target.checked)
+        }),
+        ...headers,
+        '状态',
+        '操作'
+      ], rows, (row) => [
         h('input', {
           className: 'row-selection-checkbox',
           type: 'checkbox',
@@ -480,6 +503,21 @@
       setSelectedIds(checked ? Array.from(new Set([...selectedIds, id])) : selectedIds.filter((item) => item !== id))
     }
 
+    function toggleAllVisibleRows(rows, checked) {
+      const visibleIds = getSelectableRowIds(rows)
+      if (checked) {
+        setSelectedIds(Array.from(new Set([...selectedIds, ...visibleIds])))
+        return
+      }
+      setSelectedIds(selectedIds.filter((id) => !visibleIds.includes(id)))
+    }
+
+    function getSelectableRowIds(rows) {
+      return (rows || [])
+        .filter((row) => row.id && !row.materializedOnly && row.reviewStatus !== 'confirmed')
+        .map((row) => row.id)
+    }
+
     function pageToolbar(title, subtitle, actions) {
       return h('div', { className: 'tcw-page-head' },
         h('div', null, h('h2', null, title), h('p', null, subtitle)),
@@ -523,7 +561,7 @@
     if (!rows || rows.length === 0) return empty(emptyText || '暂无数据。')
     return h('div', { className: 'tcw-table-wrap' },
       h('table', { className: 'tcw-table' },
-        h('thead', null, h('tr', null, headers.map((item) => h('th', { key: item }, item)))),
+        h('thead', null, h('tr', null, headers.map((item, index) => h('th', { key: index }, item)))),
         h('tbody', null, rows.map((row, index) =>
           h('tr', { key: row.id || index, className: onRowClick ? 'clickable' : '', onClick: onRowClick ? () => onRowClick(row) : undefined },
             mapRow(row).map((cell, cellIndex) => h('td', { key: cellIndex }, cell))
@@ -753,8 +791,9 @@
 * { box-sizing: border-box; }
 body { margin: 0; background: var(--tcw-bg); color: var(--tcw-text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
 button, input { font: inherit; letter-spacing: 0; }
-.tcw-shell { display: grid; gap: 10px; min-height: 100vh; padding: 12px 14px 18px; }
-.tcw-header { display: grid; grid-template-columns: minmax(260px, .72fr) minmax(340px, 520px); gap: 12px; align-items: center; border: 1px solid var(--tcw-border); border-radius: 8px; background: var(--tcw-card); padding: 12px 14px; }
+.tcw-shell { display: grid; grid-template-rows: auto auto auto 1fr; gap: 10px; min-height: 100vh; padding: 12px 8px 18px; }
+.tcw-frame { width: 100%; max-width: none; margin: 0; justify-self: stretch; }
+.tcw-header { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(340px, 520px); gap: 12px; align-items: center; border: 1px solid var(--tcw-border); border-radius: 8px; background: var(--tcw-card); padding: 12px 14px; }
 .tcw-title-block { display: grid; gap: 3px; }
 .tcw-kicker { color: var(--tcw-primary); font-size: 12px; font-weight: 900; }
 .tcw-title-block h1 { margin: 0; font-size: 20px; line-height: 1.22; }
@@ -777,16 +816,16 @@ button, input { font: inherit; letter-spacing: 0; }
 .tcw-main.with-drawer { grid-template-columns: minmax(0, 1fr) minmax(340px, 410px); }
 .tcw-content, .tcw-drawer, .tcw-panel, .tcw-supplier-block { border: 1px solid var(--tcw-border); border-radius: 8px; background: var(--tcw-card); }
 .tcw-content { min-width: 0; border: 0; background: transparent; padding: 0; }
-.tcw-page { display: grid; gap: 12px; }
+.tcw-page { display: grid; gap: 12px; width: 100%; }
 .tcw-page-head, .tcw-drawer-head, .tcw-supplier-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
 .tcw-page-head h2, .tcw-drawer-head h2, .tcw-panel h3 { margin: 0 0 4px; font-size: 16px; line-height: 1.35; }
 .tcw-button-row { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
 .tcw-panel { display: grid; gap: 10px; padding: 12px; }
-.tcw-business-panel { display: grid; gap: 0; border: 1px solid var(--tcw-border); border-radius: 8px; background: var(--tcw-card); overflow: hidden; }
-.tcw-business-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--tcw-border); background: var(--tcw-card); padding: 14px 16px; }
+.tcw-business-panel { display: grid; width: 100%; gap: 0; border: 1px solid var(--tcw-border); border-radius: 8px; background: var(--tcw-card); overflow: hidden; }
+.tcw-business-head { display: flex; min-height: 118px; align-items: flex-start; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--tcw-border); background: var(--tcw-card); padding: 22px 28px; }
 .tcw-business-head h2 { margin: 0 0 4px; font-size: 18px; line-height: 1.25; }
 .tcw-business-head p { margin: 0; color: var(--tcw-muted); font-size: 13px; }
-.tcw-business-body { display: grid; gap: 12px; padding: 14px 16px 16px; }
+.tcw-business-body { display: grid; gap: 12px; padding: 20px 28px 24px; }
 .tcw-table-section { display: grid; gap: 0; }
 .tcw-history-section { display: grid; gap: 10px; border-top: 1px solid var(--tcw-border); padding-top: 14px; }
 .tcw-subsection-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@chenchaolong/plugin-trade-compliance-workbench",
-  "version": "0.1.8",
+  "version": "0.1.10",
   "description": "Trade Compliance Workbench app plugin for controlled goods review, supplier product management, and customs workbook generation.",
   "author": {
     "name": "XpertAI",