u

code/g3soft-libs/docs/examples/table/selection.vue

@@ -4,31 +4,37 @@ import { G3Table } from '@g3soft/ui'
 import type { G3TableColumn, TableRow } from '@g3soft/ui'
 
 // 多选：传 rowSelection 即在最前注入选择列。
-// getCheckboxProps 可禁用个别行（禁用行不参与「全选」的分母）。
+// - selectedRowKeys 用 v-model 式双向绑定，勾选变化会回写
+// - getCheckboxProps 可禁用个别行；**禁用行不计入「全选」的分母**
+//   （所以下面表格里表头全选只会选中 2 行）
 const columns: G3TableColumn<TableRow>[] = [
   { dataIndex: 'name', title: '名称', width: 180 },
   { dataIndex: 'amount', title: '金额', width: 120, align: 'right' },
+  { dataIndex: 'owner', title: '负责人', width: 120 },
 ]
 
 const data: TableRow[] = [
-  { id: 1, name: '框架合同', amount: 120000 },
-  { id: 2, name: '采购订单', amount: 86000, locked: true },
-  { id: 3, name: '验收单', amount: 43000 },
+  { id: 1, name: '框架合同', amount: 120000, owner: '张三' },
+  { id: 2, name: '采购订单', amount: 86000, owner: '李四', locked: true },
+  { id: 3, name: '验收单', amount: 43000, owner: '王五' },
 ]
 
 const selectedRowKeys = ref<Array<string | number>>([])
-const selectedText = ref('')
+const selectedNames = ref<string[]>([])
 
 function onSelectionChange(keys: Array<string | number>, rows: TableRow[]) {
   selectedRowKeys.value = keys
-  selectedText.value = rows.map((row) => row.name).join('、')
+  selectedNames.value = rows.map((row) => String(row.name))
 }
 </script>
 
 <template>
   <div>
     <p style="margin: 0 0 8px; color: #666; font-size: 13px">
-      已选：{{ selectedText || '（无）' }}
+      已选 {{ selectedRowKeys.length }} 项：{{ selectedNames.join('、') || '（无）' }}
+    </p>
+    <p style="margin: 0 0 8px; color: #999; font-size: 12px">
+      「采购订单」被 getCheckboxProps 禁用，不参与全选。
     </p>
     <div style="height: 260px">
       <G3Table