Refactor code structure and remove redundant changes
This commit is contained in:
124
pages/personal-Center/components/resource-center.vue
Normal file
124
pages/personal-Center/components/resource-center.vue
Normal file
@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<div class="box-border min-h-494px w-913px border border-[#EEEEEE] rounded-6px border-solid bg-[#FFFFFF] px-30px py-21px">
|
||||
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
|
||||
<el-tab-pane label="我的上传" name="我的上传">
|
||||
<uploadTable v-model:type="pageReq.type" v-model="result.list" :refresh="handlerefresh" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="我的购买" name="我的购买">
|
||||
<downloadTable v-model="result.list" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="收藏夹" name="收藏夹">
|
||||
<favoriteTable v-model:type="pageReq.type" v-model="result.list" :refresh="handlerefresh" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="浏览记录" name="浏览记录">
|
||||
<browseTable v-model="result.list" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<!-- 分页 -->
|
||||
<div class="mt-10px flex justify-center">
|
||||
<el-pagination
|
||||
v-model:current-page="pageReq.pageNum"
|
||||
v-model:page-size="pageReq.pageSize"
|
||||
:page-sizes="[10, 20, 30]"
|
||||
:total="result.total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@size-change="handleClickSize"
|
||||
@current-change="handeClickCurrent"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive } from 'vue'
|
||||
|
||||
import { getContentPage, getUserToolBoxPage, getUserFavoritePage, getOwnContentPage } from '@/api/personal-center/index'
|
||||
// import { ProjectHistoryResVO } from '@/api/personal-center/types'
|
||||
|
||||
import uploadTable from './components/upload-table.vue'
|
||||
import downloadTable from './components/download-table.vue'
|
||||
import favoriteTable from './components/favorite-table.vue'
|
||||
import browseTable from './components/browse-table.vue'
|
||||
import useUserStore from '@/store/user'
|
||||
const userStore = useUserStore()
|
||||
|
||||
const activeName = ref('我的上传')
|
||||
const pageReq = reactive({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
type: 1, //类型 1 图纸 2 工具箱
|
||||
})
|
||||
const result = reactive({
|
||||
total: 0, //总条数
|
||||
list: [] as any[], //列表
|
||||
})
|
||||
|
||||
const handleClickSize = (val: number) => {
|
||||
pageReq.pageSize = val
|
||||
fetchData()
|
||||
}
|
||||
|
||||
const handeClickCurrent = (val: number) => {
|
||||
pageReq.pageNum = val
|
||||
fetchData()
|
||||
}
|
||||
|
||||
const fetchData = async () => {
|
||||
let res = {} as any
|
||||
switch (activeName.value) {
|
||||
case '我的上传':
|
||||
res = await getOwnContentPage({ ...pageReq, pageNo: pageReq.pageNum }) // 我的上传
|
||||
if (res.code === 0) {
|
||||
result.total = res.data.total || 0
|
||||
result.list = res.data.list || []
|
||||
}
|
||||
break
|
||||
case '我的购买':
|
||||
res = await getUserToolBoxPage({ ...pageReq, type: undefined }) // 我的下载
|
||||
if (res.code === 0) {
|
||||
result.total = res.data.total || 0
|
||||
result.list = res.data.list || []
|
||||
}
|
||||
break
|
||||
case '收藏夹':
|
||||
res = await getUserFavoritePage({ ...pageReq, pageNo: pageReq.pageNum, userId: userStore.userId }) // 收藏夹
|
||||
if (res.code === 0) {
|
||||
result.total = res.data.total || 0
|
||||
result.list = res.data.list || []
|
||||
}
|
||||
break
|
||||
case '浏览记录':
|
||||
res = await getContentPage(pageReq) // 浏览记录
|
||||
if (res.code === 0) {
|
||||
result.total = res.data.total || 0
|
||||
result.list = res.data.list || []
|
||||
}
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
const handlerefresh = () => {
|
||||
pageReq.pageNum = 1
|
||||
fetchData()
|
||||
}
|
||||
|
||||
const handleClick = (tab: any) => {
|
||||
console.log(tab)
|
||||
activeName.value = tab.props.name
|
||||
pageReq.pageNum = 1
|
||||
result.list = []
|
||||
result.total = 0
|
||||
fetchData()
|
||||
}
|
||||
|
||||
fetchData()
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
:deep(.el-input__inner) {
|
||||
text-align: center !important;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user