From 09b31547e1ed643337ee9e3c05e23293a74675ff Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A5=94=E8=B7=91=E7=9A=84=E9=9D=A2=E6=9D=A1?=
 <1262327911@qq.com>
Date: Sun, 22 May 2022 15:06:45 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E9=A6=96=E9=A1=B5?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E6=8E=A5=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/router.ts                           |  2 +-
 .../ProjectItemsList/hooks/useData.hook.ts    | 90 ++++++++++++-------
 .../components/ProjectItemsList/index.vue     | 13 +--
 src/views/project/items/index.d.ts            |  4 +-
 4 files changed, 69 insertions(+), 40 deletions(-)

diff --git a/src/utils/router.ts b/src/utils/router.ts
index e5235399..2b28bf65 100644
--- a/src/utils/router.ts
+++ b/src/utils/router.ts
@@ -114,7 +114,7 @@ export const logout = async () => {
       routerTurnByName(PageEnum.BASE_LOGIN_NAME)
     }
   } catch (error) {
-    window['$message'].success(window['$t']('global.logout_success'))
+    window['$message'].success(window['$t']('global.logout_failure'))
   }
 }
 
diff --git a/src/views/project/items/components/ProjectItemsList/hooks/useData.hook.ts b/src/views/project/items/components/ProjectItemsList/hooks/useData.hook.ts
index aa3b91d9..1957f364 100644
--- a/src/views/project/items/components/ProjectItemsList/hooks/useData.hook.ts
+++ b/src/views/project/items/components/ProjectItemsList/hooks/useData.hook.ts
@@ -1,41 +1,60 @@
-import { ref } from 'vue'
+import { ref, reactive } from 'vue';
 import { goDialog } from '@/utils'
 import { DialogEnum } from '@/enums/pluginEnum'
-import { ChartList } from '../../..'
+import { projectListApi } from '@/api/path/project'
+import { ChartList } from '../../../index.d'
+
 // 数据初始化
 export const useDataListInit = () => {
-  const list = ref<ChartList>([
-    {
-      id: 1,
-      title: '物料1-假数据不可用',
-      release: true,
-      label: '官方案例'
-    },
-    {
-      id: 2,
-      title: '物料2-假数据不可用',
-      release: false,
-      label: '官方案例'
-    },
-    {
-      id: 3,
-      title: '物料3-假数据不可用',
-      release: false,
-      label: '官方案例'
-    },
-    {
-      id: 4,
-      title: '物料4-假数据不可用',
-      release: false,
-      label: '官方案例'
-    },
-    {
-      id: 5,
-      title: '物料5-假数据不可用',
-      release: false,
-      label: '官方案例'
+
+  const paginat = reactive({
+    // 当前页数
+    page: 1,
+    // 每页值
+    limit: 12,
+    // 总数
+    count: 10,
+  })
+
+  const list = ref<ChartList>([])
+
+  // 数据请求
+  const fetchList = async () => {
+    try {
+      const res: any = await projectListApi({
+        page: paginat.page,
+        limit: paginat.limit
+      })
+      if (res.data) {
+        const { count } = res
+        paginat.count = count
+        list.value = res.data.map((e:any) => {
+          const {id, projectName, state, createTime, createUserId} = e
+          return {
+            id: id,
+            title: projectName,
+            createId: createUserId,
+            time: createTime,
+            release: state !== -1
+          }
+        })
+      }
+    } catch (error) {
+      window['$message'].error(window['$t']('http.error_message'))
     }
-  ])
+  }
+
+  // 修改页数
+  const changePage = (_page: number) => {
+    paginat.page = _page
+    fetchList()
+  }
+
+  // 修改大小
+  const changeSize = (_size: number) => {
+    paginat.limit = _size
+    fetchList()
+  }
 
   // 删除
   const deleteHandle = (cardData: object, index: number) => {
@@ -51,8 +70,13 @@ export const useDataListInit = () => {
     })
   }
 
+  // 立即请求
+  fetchList()
+
   return {
+    paginat,
     list,
+    fetchList, changeSize, changePage,
     deleteHandle
   }
 }
diff --git a/src/views/project/items/components/ProjectItemsList/index.vue b/src/views/project/items/components/ProjectItemsList/index.vue
index dc4f9206..7c969e15 100644
--- a/src/views/project/items/components/ProjectItemsList/index.vue
+++ b/src/views/project/items/components/ProjectItemsList/index.vue
@@ -17,8 +17,12 @@
     </n-grid>
     <div class="list-pagination">
       <n-pagination
-        :item-count="10"
-        :page-sizes="[10, 20, 30, 40]"
+        :page="paginat.page"
+        :page-size="paginat.limit"
+        :item-count="paginat.count"
+        :page-sizes="[12, 24, 36, 48]"
+        @update:page="changePage"
+        @update:page-size="changeSize"
         show-size-picker
       />
     </div>
@@ -40,9 +44,8 @@ import { useModalDataInit } from './hooks/useModal.hook'
 import { useDataListInit } from './hooks/useData.hook'
 
 const { CopyIcon, EllipsisHorizontalCircleSharpIcon } = icon.ionicons5
-const { list, deleteHandle } = useDataListInit()
-const { modalData, modalShow, closeModal, resizeHandle, editHandle } =
-  useModalDataInit()
+const { modalData, modalShow, closeModal, resizeHandle, editHandle } = useModalDataInit()
+const { paginat, list, changeSize,changePage, fetchList, deleteHandle } = useDataListInit()
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/views/project/items/index.d.ts b/src/views/project/items/index.d.ts
index 1795c4a5..1ff9b248 100644
--- a/src/views/project/items/index.d.ts
+++ b/src/views/project/items/index.d.ts
@@ -2,7 +2,9 @@ export type Chartype = {
   id: number | string
   title: string // 标题
   label: string // 标签
-  release: boolean // 0未发布 | 1已发布
+  time: string, // 时间
+  createId: string, // 创建者
+  release: boolean // false 未发布 | true 已发布
 }
 
 export type ChartList = Chartype[]
\ No newline at end of file