From 46567cb15c877376ea8ce9cce36271ed89b724a0 Mon Sep 17 00:00:00 2001
From: xiaoxian521 <1923740402@qq.com>
Date: Tue, 22 Nov 2022 10:05:54 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=20`@pureadmin/table`?=
 =?UTF-8?q?=20=E5=A4=9A=E7=A7=8D=E6=95=B0=E6=8D=AE=E6=A0=BC=E5=BC=8F?=
 =?UTF-8?q?=EF=BC=88=E6=B7=B1=E5=B1=82=E7=BB=93=E6=9E=84=EF=BC=89=E7=A4=BA?=
 =?UTF-8?q?=E4=BE=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/pure-table/components/index.ts     |  4 +-
 src/views/pure-table/components/nestProp.vue | 86 ++++++++++++++++++++
 src/views/pure-table/list.tsx                |  9 +-
 3 files changed, 97 insertions(+), 2 deletions(-)
 create mode 100644 src/views/pure-table/components/nestProp.vue

diff --git a/src/views/pure-table/components/index.ts b/src/views/pure-table/components/index.ts
index 94d678de0..c93246c92 100644
--- a/src/views/pure-table/components/index.ts
+++ b/src/views/pure-table/components/index.ts
@@ -18,6 +18,7 @@ import TotalRow from "./totalRow.vue";
 import Merge from "./merge.vue";
 import CustomIndex from "./customIndex.vue";
 import Layout from "./layout.vue";
+import NestProp from "./nestProp.vue";
 
 export {
   Base,
@@ -39,5 +40,6 @@ export {
   TotalRow,
   Merge,
   CustomIndex,
-  Layout
+  Layout,
+  NestProp
 };
diff --git a/src/views/pure-table/components/nestProp.vue b/src/views/pure-table/components/nestProp.vue
new file mode 100644
index 000000000..54269a877
--- /dev/null
+++ b/src/views/pure-table/components/nestProp.vue
@@ -0,0 +1,86 @@
+<script setup lang="ts">
+const tableData = [
+  {
+    userInfo: { name: "Test1", age: 22 },
+    other: [
+      { sex: "女" },
+      {
+        more: {
+          content: '<div><span style="color: red">我是 html 片段</span></div>'
+        }
+      }
+    ],
+    role: "设计师"
+  },
+  {
+    userInfo: { name: "Test2", age: 28 },
+    other: [
+      { sex: "男" },
+      {
+        more: {
+          content:
+            '<img width="100" height="100" src="https://xiaoxian521.github.io/pure-admin-table/imgs/11.jpg">'
+        }
+      }
+    ],
+    role: "后端"
+  },
+  {
+    userInfo: { name: "Test3", age: 20 },
+    other: [
+      { sex: "女" },
+      {
+        more: {
+          content:
+            '<img width="100" height="100" src="https://xiaoxian521.github.io/pure-admin-table/imgs/1.jpg">'
+        }
+      }
+    ],
+    role: "程序员鼓励师"
+  },
+  {
+    userInfo: { name: "Test4", age: 26 },
+    other: [
+      { sex: "男" },
+      {
+        more: {
+          content:
+            '<a href="https://github.com/xiaoxian521" target="_black">我是链接，点我去 Follow</a>'
+        }
+      }
+    ],
+    role: "前端"
+  }
+];
+
+const columns: TableColumnList = [
+  {
+    label: "姓名",
+    prop: "userInfo.name"
+  },
+  {
+    label: "性别",
+    prop: "other[0].sex"
+  },
+  {
+    label: "年龄",
+    prop: "userInfo.age"
+  },
+  {
+    label: "Html片段",
+    slot: "content"
+  },
+  {
+    label: "角色",
+    prop: "role"
+  }
+];
+</script>
+
+<template>
+  <pure-table :data="tableData" :columns="columns">
+    <template #content="{ row }">
+      <span v-html="row.other[1].more.content" />
+    </template>
+  </pure-table>
+</template>
diff --git a/src/views/pure-table/list.tsx b/src/views/pure-table/list.tsx
index 74b3053f1..254c65285 100644
--- a/src/views/pure-table/list.tsx
+++ b/src/views/pure-table/list.tsx
@@ -18,7 +18,8 @@ import {
   TotalRow,
   Merge,
   CustomIndex,
-  Layout
+  Layout,
+  NestProp
 } from "./components";
 
 const rendContent = (val: string) =>
@@ -150,5 +151,11 @@ export const list = [
     content: rendContent("layout"),
     title: "表格布局",
     component: Layout
+  },
+  {
+    key: "nestProp",
+    content: rendContent("nestProp"),
+    title: "多种数据格式（深层结构）",
+    component: NestProp
   }
 ];