-
Notifications
You must be signed in to change notification settings - Fork 1.8k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(projects): 添加请求适配adapter层应用的示例页面
- Loading branch information
1 parent
f6b6141
commit 8d11a6a
Showing
14 changed files
with
228 additions
and
86 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,4 +1,5 @@ | ||
import auth from './auth'; | ||
import route from './route'; | ||
import management from './management'; | ||
|
||
export default [...auth, ...route]; | ||
export default [...auth, ...route, ...management]; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,51 @@ | ||
import type { MockMethod } from 'vite-plugin-mock'; | ||
|
||
const apis: MockMethod[] = [ | ||
{ | ||
url: '/mock/getUserManagementList', | ||
method: 'post', | ||
response: (): Service.MockServiceResult<ApiUserManagement.UserTable[]> => { | ||
const data: ApiUserManagement.UserTable[] = [ | ||
{ | ||
id: '1', | ||
name: '张三', | ||
age: 24, | ||
gender: null, | ||
createTime: '2022-04-13', | ||
updateTime: '2022-07-29' | ||
}, | ||
{ | ||
id: '2', | ||
name: '李四', | ||
age: 22, | ||
gender: '1', | ||
createTime: '2022-05-13', | ||
updateTime: '2022-06-29' | ||
}, | ||
{ | ||
id: '3', | ||
name: '王五', | ||
gender: '1', | ||
createTime: '2022-04-18', | ||
updateTime: '2022-07-30' | ||
}, | ||
{ | ||
id: '4', | ||
name: '王小梅', | ||
age: 20, | ||
gender: '0', | ||
createTime: '2022-05-18', | ||
updateTime: '2022-07-30' | ||
} | ||
]; | ||
|
||
return { | ||
code: 200, | ||
message: 'ok', | ||
data | ||
}; | ||
} | ||
} | ||
]; | ||
|
||
export default apis; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,69 +1 @@ | ||
import type { DataTableColumn } from 'naive-ui'; | ||
|
||
type UnionColumn<T> = T extends DataTableColumn[] ? TypeUtil.ArrayToUnion<T> : never; | ||
|
||
type ColumnKey = 'key'; | ||
|
||
type InterfaceArray = { | ||
[key: string]: unknown; | ||
}; | ||
|
||
type ColumnKeyData = { | ||
key: unknown; | ||
}; | ||
|
||
type ExcludeArrayByKey<T extends InterfaceArray[]> = T extends [infer First, ...infer Rest] | ||
? First extends ColumnKeyData | ||
? Rest extends InterfaceArray[] | ||
? [First, ...ExcludeArrayByKey<Rest>] | ||
: [First] | ||
: Rest extends InterfaceArray[] | ||
? ExcludeArrayByKey<Rest> | ||
: [] | ||
: []; | ||
|
||
type GetUnionColumnKey<T extends InterfaceArray[]> = ColumnKey extends keyof UnionColumn<T> | ||
? UnionColumn<T>[ColumnKey] | ||
: never; | ||
|
||
export const columns: DataTableColumn[] = [ | ||
{ | ||
type: 'selection' | ||
}, | ||
{ | ||
title: 'Name', | ||
key: 'name', | ||
align: 'center' | ||
}, | ||
{ | ||
title: 'Age', | ||
key: 'age' | ||
}, | ||
{ | ||
title: 'Address', | ||
key: 'address' | ||
} | ||
]; | ||
|
||
export type UnionColumnKey = GetUnionColumnKey< | ||
ExcludeArrayByKey< | ||
[ | ||
{ | ||
type: 'selection'; | ||
}, | ||
{ | ||
title: 'Name'; | ||
key: 'name'; | ||
align: 'center'; | ||
}, | ||
{ | ||
title: 'Age'; | ||
key: 'age'; | ||
}, | ||
{ | ||
title: 'Address'; | ||
key: 'address'; | ||
} | ||
] | ||
> | ||
>; | ||
// import type { DataTableColumn } from 'naive-ui'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,2 +1,3 @@ | ||
export * from './auth'; | ||
export * from './demo'; | ||
export * from './management'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
import { EnumGender } from '@/enum'; | ||
import { isUndefined } from '@/utils'; | ||
|
||
export function adapterOfFetchUserManagementList( | ||
requestData: ApiUserManagement.UserTable[], | ||
adminId: string | ||
): UserManagement.UserTable[] { | ||
const genderMap: Record< | ||
NonNullable<ApiUserManagement.UserTable['gender']>, | ||
NonNullable<UserManagement.UserTable['userGender']> | ||
> = { | ||
'0': 'female', | ||
'1': 'male' | ||
}; | ||
|
||
// 1. 有可能依赖于多个接口的结果,再转换成页面的数据 | ||
// 2. 接口定义的字段有可能为null, 例如 预期是数组却返回了null,导致调用数组方法报错 | ||
// 3. 字段可能丢失 | ||
|
||
return requestData.map(item => { | ||
const { id, name, age, gender } = item; | ||
|
||
const userName = name + (adminId === id ? '(管理员)' : ''); | ||
|
||
const userAge = isUndefined(age) ? '无' : String(age); | ||
|
||
const userGender = gender !== null ? genderMap[gender] : 'null'; | ||
|
||
const result: UserManagement.UserTable = { | ||
id, | ||
userName, | ||
userAge, | ||
userGender, | ||
userGenderLabel: EnumGender[userGender] | ||
}; | ||
|
||
return result; | ||
}); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import { adapter } from '@/utils'; | ||
import { mockRequest } from '../request'; | ||
import { adapterOfFetchUserManagementList } from './management.adapter'; | ||
|
||
/** | ||
* 获取用户管理列表 | ||
*/ | ||
export async function fetchUserManagementList() { | ||
const data = await mockRequest.post<ApiUserManagement.UserTable[]>('/getUserManagementList'); | ||
|
||
const id = '2'; | ||
|
||
return adapter(adapterOfFetchUserManagementList, data, { error: null, data: id }); | ||
} | ||
|
||
// export async function fetchFilterUserManagementList( | ||
// filterKey: keyof UserManagement.UserTable, | ||
// mode: 'fontEnd' | 'backEnd', | ||
// source: UserManagement.UserTable[] | ||
// ) { | ||
|
||
// } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,9 +1,55 @@ | ||
<template> | ||
<div> | ||
<n-data-table /> | ||
<n-data-table :columns="columns" :data="tableData" :loading="loading" /> | ||
</div> | ||
</template> | ||
|
||
<script setup lang="ts"></script> | ||
<script setup lang="ts"> | ||
import { ref } from 'vue'; | ||
import type { DataTableColumns } from 'naive-ui'; | ||
import { fetchUserManagementList } from '@/service'; | ||
import { useLoading } from '@/hooks'; | ||
const { loading, startLoading, endLoading } = useLoading(false); | ||
const columns: DataTableColumns = [ | ||
{ | ||
key: 'userName', | ||
title: '用户名' | ||
}, | ||
{ | ||
key: 'userAge', | ||
title: '用户年龄' | ||
}, | ||
{ | ||
key: 'userGenderLabel', | ||
title: '性别' | ||
} | ||
]; | ||
const tableData = ref<UserManagement.UserTable[]>([]); | ||
function setTableData(data: UserManagement.UserTable[]) { | ||
tableData.value = data; | ||
} | ||
async function getTableData() { | ||
startLoading(); | ||
const { data } = await fetchUserManagementList(); | ||
if (data) { | ||
setTimeout(() => { | ||
setTableData(data); | ||
endLoading(); | ||
}, 1000); | ||
} | ||
} | ||
function init() { | ||
getTableData(); | ||
} | ||
// 初始化 | ||
init(); | ||
</script> | ||
|
||
<style scoped></style> |
Empty file.
8d11a6a
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Successfully deployed to the following URLs:
soybean-admin – ./
soybean-admin-git-main-honghuangdc.vercel.app
soybean-admin-honghuangdc.vercel.app
www.soybean.pro
soybean-admin.vercel.app
soybean.pro