@chenchaolong/plugin-trade-compliance-workbench 0.1.45 → 0.1.47

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

@@ -630,7 +630,6 @@
           )
         )
       ),
-      renderAssistantPanel(),
       detailItem ? renderDetailModal() : null,
       formDialog ? renderFormModal() : null,
       deleteDialog ? renderDeleteConfirmModal() : null,
@@ -647,61 +646,18 @@
           )
         ),
         h('nav', { className: 'tcw-nav', 'aria-label': '主导航' }, [
-          tab('overview-page', '总览', '1', pendingItems.length, 'blue'),
-          tab('controlled-goods-page', '管控规则库', '2', controlledReviews.length, 'green'),
-          tab('products-page', '供应商商品', '3', supplierReviews.length, 'orange'),
-          tab('workbooks-page', '销售发票', '4', salesReviews.length + filteredWorkbooks.length, 'violet'),
-          tab('hs-code-search-page', '工具', '5', null, 'slate')
-        ]),
-        h('section', { className: 'tcw-sidebar-section' },
-          h('h2', null, '主流程'),
-          h('ol', { className: 'tcw-flow-list' }, [
-            '维护管控规则',
-            '上传供应商合同',
-            '确认 HS 编码候选',
-            '审核供应商商品',
-            '上传购销合同',
-            '生成销售发票'
-          ].map((item) => h('li', { key: item }, h('span', null), item)))
-        ),
-        h('section', { className: 'tcw-sidebar-section compact' },
-          h('h2', null, '数据关系'),
-          h('p', null, '管控规则用于匹配供应商商品，已确认商品进入销售发票生成流程。')
-        )
-      )
-    }
-
-    function renderAssistantPanel() {
-      return h('aside', { className: 'tcw-assistant' },
-        h('div', { className: 'tcw-assistant-head' },
-          h('span', { className: 'tcw-assistant-mark' }, 'AI'),
-          h('div', null,
-            h('strong', null, '外贸合规助手'),
-            h('p', null, '按流程处理识别结果，减少来回切换。')
-          )
-        ),
-        h('section', { className: 'tcw-assistant-card' },
-          h('h3', null, '当前建议'),
-          h('p', null, assistantTip(activePage))
-        ),
-        h('section', { className: 'tcw-assistant-card' },
-          h('h3', null, '快捷入口'),
-          h('div', { className: 'tcw-assistant-actions' }, [
-            h('button', { className: 'tcw-mini-btn', onClick: () => setActivePage('controlled-goods-page') }, '管控规则'),
-            h('button', { className: 'tcw-mini-btn', onClick: () => setActivePage('products-page') }, '商品审核'),
-            h('button', { className: 'tcw-mini-btn', onClick: () => setActivePage('hs-code-search-page') }, '查 HS 编码')
-          ])
-        ),
-        h('section', { className: 'tcw-assistant-card' },
-          h('h3', null, '处理顺序'),
-          h('p', null, '先把管控规则和供应商商品确认入库，再审核购销合同并生成销售发票。')
-        )
+          tab('overview-page', '总览', 'dashboard', pendingItems.length, 'blue'),
+          tab('controlled-goods-page', '管控商品', 'shield', controlledReviews.length, 'green'),
+          tab('products-page', '供应商商品', 'box', supplierReviews.length, 'orange'),
+          tab('workbooks-page', '销售发票', 'invoice', salesReviews.length + filteredWorkbooks.length, 'violet'),
+          tab('hs-code-search-page', '工具', 'search', null, 'slate')
+        ])
       )
     }
 
     function tab(key, label, icon, count, tone) {
       return h('button', { key, className: key === activePage ? 'tcw-tab active' : 'tcw-tab', onClick: () => setActivePage(key) },
-        h('span', { className: 'tcw-nav-icon ' + (tone || 'blue') }, icon),
+        h('span', { className: 'tcw-nav-icon ' + (tone || 'blue') }, iconImage(icon, label, tone)),
         h('span', null, label),
         count == null ? null : h('em', null, count)
       )
@@ -713,22 +669,22 @@
         : pendingItems.filter((item) => item.type === overviewTab).slice(0, 12)
       return h('div', { className: 'tcw-page overview-page' },
         h('section', { className: 'tcw-metrics' },
-          metric('待审核', pendingItems.length, '总', 'blue'),
-          metric('管控识别待审', pendingControlledReviews.length, '盾', 'green'),
-          metric('供应商商品待审', pendingSupplierReviews.length, '品', 'orange'),
-          metric('销售合同待审', pendingSalesReviews.length, '票', 'violet'),
-          metric('已入库管控商品', data.controlledGoods.length, '仓', 'slate'),
-          metric('已入库供应商商品', data.products.length, '商', 'green'),
-          metric('销售发票历史', data.workbookGenerations.length, '文', 'violet'),
-          metric('全部审核记录', reviewItems.length, '记', 'blue')
+          metric('待审核', pendingItems.length, 'dashboard', 'blue'),
+          metric('管控识别待审', pendingControlledReviews.length, 'shield', 'green'),
+          metric('供应商商品待审', pendingSupplierReviews.length, 'box', 'orange'),
+          metric('销售合同待审', pendingSalesReviews.length, 'invoice', 'violet'),
+          metric('已入库管控商品', data.controlledGoods.length, 'archive', 'slate'),
+          metric('已入库供应商商品', data.products.length, 'supplier', 'green'),
+          metric('销售发票历史', data.workbookGenerations.length, 'document', 'violet'),
+          metric('全部审核记录', reviewItems.length, 'records', 'blue')
         ),
         panel('待办事项明细',
           h('div', { className: 'tcw-overview-panel' },
             h('div', { className: 'tcw-overview-tabs' }, [
               overviewTabButton('all', '全部', pendingItems.length),
-              overviewTabButton('controlled_goods', '规则', pendingItems.filter((item) => item.type === 'controlled_goods').length),
-              overviewTabButton('supplier_product', '商品', pendingItems.filter((item) => item.type === 'supplier_product').length),
-              overviewTabButton('customs_workbook', '发票', pendingItems.filter((item) => item.type === 'customs_workbook').length)
+              overviewTabButton('controlled_goods', '管控商品', pendingItems.filter((item) => item.type === 'controlled_goods').length),
+              overviewTabButton('supplier_product', '供应商商品', pendingItems.filter((item) => item.type === 'supplier_product').length),
+              overviewTabButton('customs_workbook', '销售发票', pendingItems.filter((item) => item.type === 'customs_workbook').length)
             ]),
             pendingOverviewItems.length
               ? compactReviewList(pendingOverviewItems)
@@ -1307,7 +1263,7 @@
 
   function metric(label, valueText, icon, tone) {
     return h('div', { className: 'tcw-metric' },
-      h('span', { className: 'tcw-metric-icon ' + (tone || 'blue') }, icon || '·'),
+      h('span', { className: 'tcw-metric-icon ' + (tone || 'blue') }, iconImage(icon, label, tone)),
       h('div', { className: 'tcw-metric-body' },
         h('span', null, label),
         h('strong', null, valueText)
@@ -1315,6 +1271,34 @@
     )
   }
 
+  function iconImage(name, label, tone) {
+    return h('img', { src: iconDataUri(name, tone), alt: label || '', 'aria-hidden': label ? undefined : true })
+  }
+
+  function iconDataUri(name, tone) {
+    const colors = {
+      blue: '#2563eb',
+      green: '#139160',
+      orange: '#e07818',
+      violet: '#7c3aed',
+      slate: '#526174'
+    }
+    const color = colors[tone] || colors.blue
+    const paths = {
+      dashboard: '<rect x="4" y="4" width="7" height="7" rx="1.5"/><rect x="13" y="4" width="7" height="7" rx="1.5"/><rect x="4" y="13" width="7" height="7" rx="1.5"/><rect x="13" y="13" width="7" height="7" rx="1.5"/>',
+      shield: '<path d="M12 3l7 3v5c0 4.8-2.9 8.2-7 10-4.1-1.8-7-5.2-7-10V6l7-3z"/><path d="M9 12l2 2 4-5"/>',
+      box: '<path d="M4 8l8-4 8 4-8 4-8-4z"/><path d="M4 8v8l8 4 8-4V8"/><path d="M12 12v8"/>',
+      invoice: '<path d="M7 3h8l4 4v14l-3-1.5L13 21l-3-1.5L7 21V3z"/><path d="M15 3v5h4"/><path d="M9 11h6"/><path d="M9 15h6"/>',
+      search: '<circle cx="11" cy="11" r="6"/><path d="M16 16l4 4"/>',
+      archive: '<path d="M4 7h16v13H4V7z"/><path d="M3 4h18v3H3z"/><path d="M9 11h6"/>',
+      supplier: '<path d="M4 20V8l8-4 8 4v12"/><path d="M8 20v-7h8v7"/><path d="M10 9h4"/>',
+      document: '<path d="M7 3h7l5 5v13H7V3z"/><path d="M14 3v6h5"/><path d="M9 13h6"/><path d="M9 17h6"/>',
+      records: '<path d="M6 5h12v16H6V5z"/><path d="M9 3h6v4H9z"/><path d="M9 11h6"/><path d="M9 15h6"/>'
+    }
+    const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="${color}" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">${paths[name] || paths.dashboard}</svg>`
+    return 'data:image/svg+xml;utf8,' + encodeURIComponent(svg)
+  }
+
   function panel(title, content) {
     return h('section', { className: 'tcw-panel' }, h('h3', null, title), content)
   }
@@ -1824,7 +1808,7 @@
 
     function pageTitle(key) {
       if (key === 'overview-page') return '总览'
-      if (key === 'controlled-goods-page') return '管控规则库'
+      if (key === 'controlled-goods-page') return '管控商品'
       if (key === 'products-page') return '供应商商品'
       if (key === 'hs-code-search-page') return '工具'
       return '销售发票'
@@ -1840,20 +1824,12 @@
 
     function pageBreadcrumb(key) {
       if (key === 'overview-page') return 'Workspace / 总览'
-      if (key === 'controlled-goods-page') return 'Workspace / 管控规则库'
+      if (key === 'controlled-goods-page') return 'Workspace / 管控商品'
       if (key === 'products-page') return 'Workspace / 供应商商品'
       if (key === 'workbooks-page') return 'Workspace / 销售发票'
       return 'Workspace / 工具'
     }
 
-    function assistantTip(key) {
-      if (key === 'overview-page') return '从总览开始，优先确认管控规则和供应商商品，再推进发票生成。'
-      if (key === 'controlled-goods-page') return '维护管控商品时，建议先核对 HS 编码和关键词，再保存入库。'
-      if (key === 'products-page') return '供应商商品可先选用候选 HS 编码，再检查英文品名和管控状态。'
-      if (key === 'workbooks-page') return '购销合同审核完毕后，再生成销售发票，避免后面重改。'
-      return '海关编码查询页用于人工确认候选结果，必要时可回到商品页继续处理。'
-    }
-
   function isObject(value) {
     return value && typeof value === 'object' && !Array.isArray(value)
   }
@@ -1926,6 +1902,11 @@ button, input, textarea, select { font: inherit; letter-spacing: 0; }
   font-size: 18px;
   font-weight: 900;
 }
+.tcw-metric-icon img {
+  width: 22px;
+  height: 22px;
+  color: currentColor;
+}
 .tcw-metric-icon.blue { background: #e8f0ff; color: var(--tcw-primary); }
 .tcw-metric-icon.green { background: #e7f8ef; color: var(--tcw-success); }
 .tcw-metric-icon.orange { background: #fff2df; color: var(--tcw-warning); }
@@ -2041,7 +2022,7 @@ button, input, textarea, select { font: inherit; letter-spacing: 0; }
 body { background: var(--tcw-bg); letter-spacing: 0; }
 .tcw-shell {
   display: grid;
-  grid-template-columns: 248px minmax(0, 1fr) 300px;
+  grid-template-columns: 248px minmax(0, 1fr);
   grid-template-rows: 1fr;
   gap: 0;
   min-height: 100vh;
@@ -2144,48 +2125,16 @@ body { background: var(--tcw-bg); letter-spacing: 0; }
   font-size: 11px;
   font-weight: 900;
 }
+.tcw-nav-icon img {
+  width: 16px;
+  height: 16px;
+  color: currentColor;
+}
 .tcw-nav-icon.blue { background: #e8f0ff; color: var(--tcw-primary); }
 .tcw-nav-icon.green { background: #e7f8ef; color: var(--tcw-success); }
 .tcw-nav-icon.orange { background: #fff2df; color: var(--tcw-warning); }
 .tcw-nav-icon.violet { background: #f1eaff; color: var(--tcw-violet); }
 .tcw-nav-icon.slate { background: #eef2f6; color: var(--tcw-slate); }
-.tcw-sidebar-section {
-  display: grid;
-  gap: 8px;
-  border-top: 1px solid var(--tcw-border);
-  padding: 14px 6px 0;
-}
-.tcw-sidebar-section h2 {
-  margin: 0;
-  color: var(--tcw-muted);
-  font-size: 12px;
-}
-.tcw-sidebar-section.compact p {
-  margin: 0;
-  color: var(--tcw-muted);
-  font-size: 12px;
-  line-height: 1.6;
-}
-.tcw-flow-list {
-  display: grid;
-  gap: 8px;
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  color: var(--tcw-text);
-  font-size: 12px;
-}
-.tcw-flow-list li {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-}
-.tcw-flow-list span {
-  width: 7px;
-  height: 7px;
-  border-radius: 999px;
-  background: var(--tcw-primary);
-}
 .tcw-workspace {
   display: grid;
   grid-template-rows: auto 1fr;
@@ -2276,68 +2225,12 @@ body { background: var(--tcw-bg); letter-spacing: 0; }
 }
 .tcw-table td { background: var(--tcw-card); }
 .tcw-table tr:hover td { background: #fbfdff; }
-.tcw-assistant {
-  display: grid;
-  align-content: start;
-  gap: 12px;
-  border-left: 1px solid var(--tcw-border);
-  background: var(--tcw-card);
-  padding: 18px 14px;
-}
-.tcw-assistant-head {
-  display: flex;
-  align-items: flex-start;
-  gap: 10px;
-  padding: 2px 4px 8px;
-}
-.tcw-assistant-mark {
-  display: grid;
-  place-items: center;
-  width: 32px;
-  height: 32px;
-  border-radius: 8px;
-  background: #e7f8ef;
-  color: var(--tcw-success);
-  font-size: 12px;
-  font-weight: 900;
-}
-.tcw-assistant-head strong { display: block; font-size: 15px; }
-.tcw-assistant-head p {
-  margin: 3px 0 0;
-  color: var(--tcw-muted);
-  font-size: 12px;
-  line-height: 1.5;
-}
-.tcw-assistant-card {
-  display: grid;
-  gap: 8px;
-  border: 1px solid var(--tcw-border);
-  border-radius: 8px;
-  background: var(--tcw-soft);
-  padding: 12px;
-}
-.tcw-assistant-card h3 {
-  margin: 0;
-  font-size: 13px;
-}
-.tcw-assistant-card p {
-  margin: 0;
-  color: var(--tcw-muted);
-  font-size: 12px;
-  line-height: 1.6;
-}
-.tcw-assistant-actions {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-}
 .tcw-status.ok { background: #e7f8ef; color: var(--tcw-success); }
 .tcw-status.warn { background: #fff2df; color: #b35b00; }
 .tcw-status.danger { background: #fde8e6; color: var(--tcw-danger); }
 .tcw-status.muted { background: #eef2f6; color: var(--tcw-muted); }
 @media (max-width: 1280px) {
   .tcw-shell { grid-template-columns: 230px minmax(0, 1fr); }
-  .tcw-assistant { display: none; }
 }
 @media (max-width: 900px) {
   .tcw-shell { grid-template-columns: 1fr; }

package/package.json

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