perf(table): 新增 row 行单击 row-double 行双击事件

docs/docs/zh-CN/components/avatar.md

@@ -13,7 +13,7 @@ import { ref } from 'vue'
 export default {
   setup() {
 
-    const src = ref("https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png")
+    const src = ref("https://portrait.gitee.com/uploads/avatars/user/30/92529_sentsin_1578917144.jpg")
 
     return {
         src
@@ -40,7 +40,7 @@ export default {
 
     setup() {
 
-        const src = "https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png"
+        const src = "https://portrait.gitee.com/uploads/avatars/user/30/92529_sentsin_1578917144.jpg"
         
         return {
             src
@@ -69,7 +69,7 @@ import { ref } from 'vue'
 export default {
     setup() {
 
-        const src = "https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png"
+        const src = "https://portrait.gitee.com/uploads/avatars/user/30/92529_sentsin_1578917144.jpg"
 
         return {
             src

docs/docs/zh-CN/components/table.md

@@ -195,7 +195,7 @@ export default {
 ::: demo
 
 <template>
-  <lay-table :columns="columns" id="id" :dataSource="dataSource" v-model:selectedKeys="selectedKeys"  :checkbox="checkbox" :default-toolbar="defaultToolbar">
+  <lay-table :columns="columns" id="id" :dataSource="dataSource" v-model:selectedKeys="selectedKeys"  :checkbox="checkbox" :default-toolbar="defaultToolbar" @row="rowClick" @row-double="rowDoubleClick">
     <template v-slot:toolbar>
       <lay-button size="sm">新增</lay-button>
       <lay-button size="sm">删除</lay-button>
@@ -247,12 +247,22 @@ export default {
       {id:"2", username:"woow", password:"woow", age:"20"}
     ]
 
+    const rowClick = function(data) {
+      alert(JSON.stringify(data))
+    }
+    
+    const rowDoubleClick = function(data) {
+      alert(JSON.stringify(data))
+    }
+
     return {
       columns,
       dataSource,
       selectedKeys,
       checkbox,
-      defaultToolbar
+      defaultToolbar,
+      rowClick,
+      rowDoubleClick
     }
   }
 }
@@ -274,10 +284,19 @@ export default {
 | default-toolbar          | 开启工具栏 | `lg` `md` `sm` |
 | size                     | 尺寸       | --             |
 
-::: title table slots
+::: title 表格事件
 
 :::
 
-|         |              |     |
+| 属性                     | 描述        | 参数         |
+| ------------------------ | ---------- | -------------- |
+| row                  | 行单击     | data : 当前行       |
+| row-double           | 行双击     | data : 当前行       |
+
+::: title 表格插槽
+
+:::
+
+| 插槽     | 描述         | 默认     |
 | ------- | ------------ | --- |
 | toolbar | 自定义工具栏 | --  |

docs/docs/zh-CN/guide/changelog.md

@@ -11,7 +11,7 @@
 <template>
 <lay-timeline>
 <lay-timeline-item title="0.2.3">
-[新增] useFullScreen 全屏 hooks。<br>
+[新增] table 表格 row 行单击, row-double 行双击事件。<br>
 </lay-timeline-item>
 <lay-timeline-item title="0.2.2">
 [新增] useFullScreen 全屏 hooks。<br>

src/module/table/component/checkbox.vue

@@ -1,5 +1,5 @@
 <template>
-  <span @click="handleClick">
+  <span @click.stop="handleClick">
     <input type="checkbox" :name="name" :value="label" />
     <div
       class="layui-unselect"

src/module/table/index.vue

@@ -19,7 +19,9 @@
           </div>
         </div>
       </div>
+
       <div class="layui-table-box">
+        <!-- 表格头部 -->
         <div class="layui-table-header">
           <table class="layui-table" :lay-size="size">
             <thead>
@@ -46,11 +48,12 @@
             </thead>
           </table>
         </div>
+        <!-- 表格数据 -->
         <div class="layui-table-body layui-table-main">
           <table class="layui-table" :lay-size="size">
             <tbody>
               <template v-for="data in dataSource" :key="data">
-                <tr>
+                <tr @click.stop="rowClick(data)" @dblclick.stop="rowDoubleClick(data)">
                   <td v-if="checkbox" class="layui-table-col-special">
                     <div class="layui-table-cell laytable-cell-checkbox">
                       <table-item-checkbox
@@ -154,7 +157,7 @@ const props = withDefaults(
   }
 )
 
-const emit = defineEmits(['change', 'update:selectedKeys'])
+const emit = defineEmits(['change','row','row-double', 'update:selectedKeys'])
 
 const slot = useSlots()
 const slots = slot.default && slot.default()
@@ -192,6 +195,14 @@ const change = function (page: any) {
   emit('change', page)
 }
 
+const rowClick = function(data: any) {
+  emit('row', data)
+}
+
+const rowDoubleClick = function(data: any) {
+  emit('row-double', data)
+}
+
 const print = function () {
   let subOutputRankPrint = document.getElementById('lay-table') as HTMLElement
   let newContent = subOutputRankPrint.innerHTML