From b1b3397951809f6c6a1c9937bd101c67d111b166 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=B1=E7=9C=A0=E5=84=80=E5=BC=8F?= <854085467@qq.com>
Date: Sun, 26 Jun 2022 23:24:05 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8(component):=20=E6=96=B0=E5=A2=9E=20ta?=
 =?UTF-8?q?ble=20=E7=BB=84=E4=BB=B6=20even=20=E5=B1=9E=E6=80=A7,=20?=
 =?UTF-8?q?=E7=94=A8=E4=BA=8E=E5=BC=80=E5=90=AF=E6=96=91=E9=A9=AC=E6=9D=A1?=
 =?UTF-8?q?=E7=BA=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../component/src/component/table/index.less  |  2 +-
 .../component/src/component/table/index.vue   |  4 +-
 .../src/document/zh-CN/components/table.md    | 54 +++++++++++++++++++
 3 files changed, 58 insertions(+), 2 deletions(-)

diff --git a/package/component/src/component/table/index.less b/package/component/src/component/table/index.less
index 0ce0ecc8..a797d21a 100644
--- a/package/component/src/component/table/index.less
+++ b/package/component/src/component/table/index.less
@@ -27,7 +27,7 @@
 .layui-table-tool,
 .layui-table-total,
 .layui-table-total tr,
-.layui-table[lay-even] tr:nth-child(even) {
+.layui-table.layui-table-even tr:nth-child(even) {
   background-color: var(--global-neutral-color-1);
 }
 
diff --git a/package/component/src/component/table/index.vue b/package/component/src/component/table/index.vue
index 7bbe3a3f..eaf3672d 100644
--- a/package/component/src/component/table/index.vue
+++ b/package/component/src/component/table/index.vue
@@ -29,6 +29,7 @@ export interface LayTableProps {
   childrenColumnName?: string;
   height?: number;
   maxHeight?: string;
+  even?: boolean;
 }
 
 const props = withDefaults(defineProps<LayTableProps>(), {
@@ -39,6 +40,7 @@ const props = withDefaults(defineProps<LayTableProps>(), {
   dataSource: () => [],
   selectedKeys: () => [],
   maxHeight: "auto",
+  even: false,
 });
 
 const tableId = uuidv4();
@@ -364,7 +366,7 @@ props.dataSource.map((value: any) => {
           :style="{ height: height, maxHeight: maxHeight }"
           ref="tableBody"
         >
-          <table class="layui-table" :lay-size="size">
+          <table class="layui-table" :class="{'layui-table-even': props.even}" :lay-size="size">
             <colgroup>
               <col v-if="checkbox" class="layui-table-col-special" />
               <template v-for="column in columns" :key="column">
diff --git a/package/document-component/src/document/zh-CN/components/table.md b/package/document-component/src/document/zh-CN/components/table.md
index 7774a742..33e1529a 100644
--- a/package/document-component/src/document/zh-CN/components/table.md
+++ b/package/document-component/src/document/zh-CN/components/table.md
@@ -476,6 +476,60 @@ export default {
 
 :::
 
+::: title 斑马条纹
+:::
+
+::: demo 通过 `even` 属性, 开启斑马条纹, 默认为 false。
+
+<template>
+  <lay-table :columns="columns1" :dataSource="dataSource1" even></lay-table>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    const columns1 = [
+      {
+        title:"账户",
+        width:"200px",
+        key:"username"
+      },{
+        title:"密码",
+        width: "180px",
+        key:"password"
+      },{
+        title:"年龄",
+        width: "180px",
+        key:"age"
+      },{
+        title:"备注",
+        width: "180px",
+        key:"remark",
+        ellipsisTooltip: true,
+      }
+    ]
+
+    const dataSource1 = [
+      {username:"root", password:"root", age:"18", remark: 'layui - vue（谐音：类 UI) '},
+      {username:"root", password:"root", age:"18", remark: 'layui - vue（谐音：类 UI) '},
+      {username:"woow", password:"woow", age:"20", remark: 'layui - vue（谐音：类 UI) '},
+      {username:"woow", password:"woow", age:"20", remark: 'layui - vue（谐音：类 UI) '},
+      {username:"woow", password:"woow", age:"20", remark: 'layui - vue（谐音：类 UI) '}
+    ]
+
+    return {
+      columns1,
+      dataSource1
+    }
+  }
+}
+</script>
+
+:::
+
 ::: title Table 属性
 :::