feat: 新增首页列表接口

This commit is contained in:
奔跑的面条 2022-05-22 15:06:45 +08:00
parent dee2ff8dee
commit 09b31547e1
4 changed files with 69 additions and 40 deletions

View File

@ -114,7 +114,7 @@ export const logout = async () => {
routerTurnByName(PageEnum.BASE_LOGIN_NAME) routerTurnByName(PageEnum.BASE_LOGIN_NAME)
} }
} catch (error) { } catch (error) {
window['$message'].success(window['$t']('global.logout_success')) window['$message'].success(window['$t']('global.logout_failure'))
} }
} }

View File

@ -1,41 +1,60 @@
import { ref } from 'vue' import { ref, reactive } from 'vue';
import { goDialog } from '@/utils' import { goDialog } from '@/utils'
import { DialogEnum } from '@/enums/pluginEnum' import { DialogEnum } from '@/enums/pluginEnum'
import { ChartList } from '../../..' import { projectListApi } from '@/api/path/project'
import { ChartList } from '../../../index.d'
// 数据初始化 // 数据初始化
export const useDataListInit = () => { export const useDataListInit = () => {
const list = ref<ChartList>([
{ const paginat = reactive({
id: 1, // 当前页数
title: '物料1-假数据不可用', page: 1,
release: true, // 每页值
label: '官方案例' limit: 12,
}, // 总数
{ count: 10,
id: 2, })
title: '物料2-假数据不可用',
release: false, const list = ref<ChartList>([])
label: '官方案例'
}, // 数据请求
{ const fetchList = async () => {
id: 3, try {
title: '物料3-假数据不可用', const res: any = await projectListApi({
release: false, page: paginat.page,
label: '官方案例' limit: paginat.limit
}, })
{ if (res.data) {
id: 4, const { count } = res
title: '物料4-假数据不可用', paginat.count = count
release: false, list.value = res.data.map((e:any) => {
label: '官方案例' const {id, projectName, state, createTime, createUserId} = e
}, return {
{ id: id,
id: 5, title: projectName,
title: '物料5-假数据不可用', createId: createUserId,
release: false, time: createTime,
label: '官方案例' 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) => { const deleteHandle = (cardData: object, index: number) => {
@ -51,8 +70,13 @@ export const useDataListInit = () => {
}) })
} }
// 立即请求
fetchList()
return { return {
paginat,
list, list,
fetchList, changeSize, changePage,
deleteHandle deleteHandle
} }
} }

View File

@ -17,8 +17,12 @@
</n-grid> </n-grid>
<div class="list-pagination"> <div class="list-pagination">
<n-pagination <n-pagination
:item-count="10" :page="paginat.page"
:page-sizes="[10, 20, 30, 40]" :page-size="paginat.limit"
:item-count="paginat.count"
:page-sizes="[12, 24, 36, 48]"
@update:page="changePage"
@update:page-size="changeSize"
show-size-picker show-size-picker
/> />
</div> </div>
@ -40,9 +44,8 @@ import { useModalDataInit } from './hooks/useModal.hook'
import { useDataListInit } from './hooks/useData.hook' import { useDataListInit } from './hooks/useData.hook'
const { CopyIcon, EllipsisHorizontalCircleSharpIcon } = icon.ionicons5 const { CopyIcon, EllipsisHorizontalCircleSharpIcon } = icon.ionicons5
const { list, deleteHandle } = useDataListInit() const { modalData, modalShow, closeModal, resizeHandle, editHandle } = useModalDataInit()
const { modalData, modalShow, closeModal, resizeHandle, editHandle } = const { paginat, list, changeSize,changePage, fetchList, deleteHandle } = useDataListInit()
useModalDataInit()
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@ -2,7 +2,9 @@ export type Chartype = {
id: number | string id: number | string
title: string // 标题 title: string // 标题
label: string // 标签 label: string // 标签
release: boolean // 0未发布 | 1已发布 time: string, // 时间
createId: string, // 创建者
release: boolean // false 未发布 | true 已发布
} }
export type ChartList = Chartype[] export type ChartList = Chartype[]