From b18bf9d4b5baf647f47a4c410c172e205315a2ca Mon Sep 17 00:00:00 2001
From: pany <939630029@qq.com>
Date: Fri, 22 Nov 2024 21:13:49 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E9=87=8D=E6=9E=84=20Notify=20?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E7=BB=93=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Notify/{NotifyList.vue => List.vue}       |  8 ++++----
 src/components/Notify/data.ts                 | 19 ++++++-------------
 src/components/Notify/index.vue               |  8 ++++----
 src/components/Notify/type.ts                 |  8 ++++++++
 tests/components/Notify.test.ts               |  6 +++---
 5 files changed, 25 insertions(+), 24 deletions(-)
 rename src/components/Notify/{NotifyList.vue => List.vue} (87%)
 create mode 100644 src/components/Notify/type.ts

diff --git a/src/components/Notify/NotifyList.vue b/src/components/Notify/List.vue
similarity index 87%
rename from src/components/Notify/NotifyList.vue
rename to src/components/Notify/List.vue
index b9d1b93b..174a42aa 100644
--- a/src/components/Notify/NotifyList.vue
+++ b/src/components/Notify/List.vue
@@ -1,16 +1,16 @@
 <script lang="ts" setup>
-import type { ListItem } from "./data"
+import type { NotifyItem } from "./type"
 
 interface Props {
-  list: ListItem[]
+  data: NotifyItem[]
 }
 
 const props = defineProps<Props>()
 </script>
 
 <template>
-  <el-empty v-if="props.list.length === 0" />
-  <el-card v-else v-for="(item, index) in props.list" :key="index" shadow="never" class="card-container">
+  <el-empty v-if="props.data.length === 0" />
+  <el-card v-else v-for="(item, index) in props.data" :key="index" shadow="never" class="card-container">
     <template #header>
       <div class="card-header">
         <div>
diff --git a/src/components/Notify/data.ts b/src/components/Notify/data.ts
index b54b4568..6d4b55bc 100644
--- a/src/components/Notify/data.ts
+++ b/src/components/Notify/data.ts
@@ -1,28 +1,21 @@
-export interface ListItem {
-  avatar?: string
-  title: string
-  datetime?: string
-  description?: string
-  status?: "primary" | "success" | "info" | "warning" | "danger"
-  extra?: string
-}
+import type { NotifyItem } from "./type"
 
-export const notifyData: ListItem[] = [
+export const notifyData: NotifyItem[] = [
   {
     avatar: "https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png",
     title: "V3 Admin Vite 上线啦",
-    datetime: "一年前",
+    datetime: "两年前",
     description: "一个免费开源的中后台管理系统基础解决方案，基于 Vue3、TypeScript、Element Plus、Pinia 和 Vite 等主流技术"
   },
   {
     avatar: "https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png",
     title: "V3 Admin 上线啦",
-    datetime: "两年前",
+    datetime: "三年前",
     description: "一个中后台管理系统基础解决方案，基于 Vue3、TypeScript、Element Plus 和 Pinia"
   }
 ]
 
-export const messageData: ListItem[] = [
+export const messageData: NotifyItem[] = [
   {
     avatar: "https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png",
     title: "来自楚门的世界",
@@ -43,7 +36,7 @@ export const messageData: ListItem[] = [
   }
 ]
 
-export const todoData: ListItem[] = [
+export const todoData: NotifyItem[] = [
   {
     title: "任务名称",
     description: "这家伙很懒，什么都没留下",
diff --git a/src/components/Notify/index.vue b/src/components/Notify/index.vue
index 33136238..bc0df284 100644
--- a/src/components/Notify/index.vue
+++ b/src/components/Notify/index.vue
@@ -1,17 +1,17 @@
 <script lang="ts" setup>
-import type { ListItem } from "./data"
+import type { NotifyItem } from "./type"
 import { Bell } from "@element-plus/icons-vue"
 import { ElMessage } from "element-plus"
 import { computed, ref } from "vue"
 import { messageData, notifyData, todoData } from "./data"
-import NotifyList from "./NotifyList.vue"
+import List from "./List.vue"
 
 type TabName = "通知" | "消息" | "待办"
 
 interface DataItem {
   name: TabName
   type: "primary" | "success" | "warning" | "danger" | "info"
-  list: ListItem[]
+  list: NotifyItem[]
 }
 
 /** 角标当前值 */
@@ -69,7 +69,7 @@ function handleHistory() {
               <el-badge :value="item.list.length" :max="badgeMax" :type="item.type" />
             </template>
             <el-scrollbar height="400px">
-              <NotifyList :list="item.list" />
+              <List :data="item.list" />
             </el-scrollbar>
           </el-tab-pane>
         </el-tabs>
diff --git a/src/components/Notify/type.ts b/src/components/Notify/type.ts
new file mode 100644
index 00000000..d41fa7ab
--- /dev/null
+++ b/src/components/Notify/type.ts
@@ -0,0 +1,8 @@
+export interface NotifyItem {
+  avatar?: string
+  title: string
+  datetime?: string
+  description?: string
+  status?: "primary" | "success" | "info" | "warning" | "danger"
+  extra?: string
+}
diff --git a/tests/components/Notify.test.ts b/tests/components/Notify.test.ts
index 69c9bfaa..e85b6fc1 100644
--- a/tests/components/Notify.test.ts
+++ b/tests/components/Notify.test.ts
@@ -1,5 +1,5 @@
 import Notify from "@/components/Notify/index.vue"
-import NotifyList from "@/components/Notify/NotifyList.vue"
+import NotifyList from "@/components/Notify/List.vue"
 import { shallowMount } from "@vue/test-utils"
 import { describe, expect, it } from "vitest"
 
@@ -14,7 +14,7 @@ describe("notifyList", () => {
   it("list 长度为 0", () => {
     const wrapper = shallowMount(NotifyList, {
       props: {
-        list: []
+        data: []
       }
     })
     expect(wrapper.find("el-empty").exists()).toBe(true)
@@ -22,7 +22,7 @@ describe("notifyList", () => {
   it("list 长度不为 0", () => {
     const wrapper = shallowMount(NotifyList, {
       props: {
-        list: [
+        data: [
           {
             title: ""
           }