feat: [TablesV1Checkbox] 添加 prop checkTrigger: 选择 check 触发方式

EralChen · Dec 16, 2024 · 4702ba8 · 4702ba8
1 parent fe9a91d
commit 4702ba8
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 4 deletions.
diff --git a/docs/examples/tables-v1-checkbox/basic.vue b/docs/examples/tables-v1-checkbox/basic.vue
@@ -65,5 +65,6 @@ function toggleMultiple () {
     :total="100"
     :disabled="disabled"
     background
+    check-trigger="rowClick"
   ></VkTablesV1Checkbox>
 </template>
diff --git a/docs/pages/zh-CN/guide/changelog/+Page.md b/docs/pages/zh-CN/guide/changelog/+Page.md
@@ -1,5 +1,9 @@
 # Changelog 更新日志
 
+## 1.1.1
+
++ [TablesV1Checkbox] 添加 prop `checkTrigger`: 选择 check 触发方式
+
 ## 1.1.0
 
 + [TablesV1] 新增 component `TablesV1`: ElTable、ElTableColumn、ElPagination 的集成组件

diff --git a/packages/components/tables-v1-checkbox/src/ctx.ts b/packages/components/tables-v1-checkbox/src/ctx.ts
@@ -47,6 +47,14 @@ export const props = {
     default: false,
   },
 
+  /**
+   * check触发方式
+   */
+  checkTrigger: {
+    type: String as PropType<'check' | 'rowClick'>,
+    default: 'check',
+  },
+
 }
 
 export const emits = {

diff --git a/packages/components/tables-v1-checkbox/src/index.vue b/packages/components/tables-v1-checkbox/src/index.vue
@@ -5,6 +5,7 @@ import type { CheckboxValueType } from 'element-plus'
 import type { RadioProps } from 'naive-ui'
 import { _VkTabelsV1Ctx, VkTablesV1 } from '@vunk-plus/components/tables-v1'
 import { VkCheckRecordLogic, VkCheckRecordLogicProvider } from '@vunk/core'
+import { noop } from '@vunk/shared/function'
 import { ElCheckbox } from 'element-plus'
 import { NRadio } from 'naive-ui'
 import { defineComponent } from 'vue'
@@ -30,7 +31,7 @@ export default defineComponent({
   emits,
   setup (props, { emit }) {
     const coreProps = _VkTabelsV1Ctx.createBindProps(props, ['columns'])
-    const coreEmits = _VkTabelsV1Ctx.createOnEmits(emit)
+    const coreEmits = _VkTabelsV1Ctx.createOnEmits(emit, ['row-click'])
     const getCurrentPageCheckInfo = () => {
       const oidField = props.oidField
       const allCheckedId = props.modelValue.map(d => d[oidField])
@@ -81,12 +82,15 @@ export default defineComponent({
       }
     }
 
+    const changeEvents = {} as Record<string/* id */, AnyFunc>
+
     const checkboxCol: __VkTablesV1.Column = {
       prop: undefined,
       label: '',
       width: '50',
       align: 'center',
       headerAlign: 'center',
+
       slots: {
         default: e => (
           <VkCheckRecordLogic
@@ -99,20 +103,28 @@ export default defineComponent({
                   ? toggle
                   : () => singleChange(e.row)
 
+                if (!props.disabled) {
+                  changeEvents[e.row[props.oidField]] = onChange
+                }
+
+                const handleCheck = props.checkTrigger === 'check'
+                  ? onChange
+                  : noop
+
                 return props.multiple
                   ? (
                     <ElCheckbox
                       disabled={props.disabled}
                       modelValue={isActive}
-                      onChange={onChange}
+                      onChange={handleCheck}
                     >
                     </ElCheckbox>
                   )
                   : (
                     <NRadio
                       disabled={props.disabled}
                       checked={isActive}
-                      onUpdate:checked={onChange}
+                      onUpdate:checked={handleCheck}
                       theme-overrides={radioThemeOverrides}
                     >
                     </NRadio>
@@ -144,10 +156,24 @@ export default defineComponent({
       },
     }
 
+    /* triggle row-click */
+    function handleRowClick (...e) {
+      const [row] = e
+      if (props.checkTrigger === 'rowClick') {
+        const id = row[props.oidField]
+        changeEvents[id]?.()
+      }
+
+      // eslint-disable-next-line vue/custom-event-name-casing
+      emit('row-click', ...e)
+    }
+    /* endof triggle row-click */
+
     return {
       coreProps,
       coreEmits,
       checkboxCol,
+      handleRowClick,
     }
   },
 })
@@ -169,6 +195,8 @@ export default defineComponent({
         selectionHidden ? { hidden: true } : checkboxCol,
         ...columns,
       ]"
+
+      @row-click="handleRowClick"
       v-on="coreEmits"
     ></VkTablesV1>
   </VkCheckRecordLogicProvider>

diff --git a/packages/entry/package.json b/packages/entry/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vunk/plus",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "",
   "author": "",
   "license": "ISC",