wangqiao/front-pc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update async navigation and optimize detail page

Browse Source
This commit is contained in:
wangqiao
2025-08-26 22:42:39 +08:00
parent 84a7263f36
commit dd46a68b6c
4 changed files with 49 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
pages/down-drawe-detail/[id].vue
View File

@ -96,15 +96,15 @@
</div>
<div class="ml-[22px]">
<div class="box-border h-[269px] w-[397px] border border-[#EEEEEE] rounded-[12px] border-solid bg-[#FFFFFF] pa-[22px]">
<div class="mb-[10px]">图纸ID: {{ detail?.id }}</div>
<div class="mb-[10px]">文件大小：{{ detail?.filesInfo?.fileSize || 0 }} </div>
<div class="mb-[8px]">图纸ID: {{ detail?.id }}</div>
<div class="mb-[8px]">文件大小：{{ detail?.filesInfo?.fileSize || 0 }} </div>
<!-- <div class="mb-10px">图纸版本：{{ detail.editionsName }} </div> -->
<div class="mb-[10px]">图纸格式：{{ detail?.formatType?.toString() }}</div>
<div class="mb-[10px]">所需金币：{{ detail?.points }}金币</div>
<div class="mb-[10px]">发布时间：{{ dayjs(detail?.createTime).format('YYYY-MM-DD HH:mm:ss') }}</div>
<div class="mb-[10px]">图纸参数：{{ detail?.editTypeName }}</div>
<div class="mb-[10px]">图纸分类：{{ detail?.projectTypeName }}</div>
<div class="mb-[10px]">软件分类：{{ detail?.editionsName }}</div>
<div class="mb-[8px]">图纸格式：{{ detail?.formatType?.toString() }}</div>
<div class="mb-[8px]">所需金币：{{ detail?.points }}金币</div>
<div class="mb-[8px]">发布时间：{{ dayjs(detail?.createTime).format('YYYY-MM-DD HH:mm:ss') }}</div>
<div class="mb-[8px]">图纸参数：{{ detail?.editTypeName }}</div>
<div class="mb-[8px]">图纸分类：{{ detail?.projectTypeName }}</div>
<div class="mb-[8px]">软件分类：{{ detail?.editionsName }}</div>
</div>
<div class="mt-[20px] w-[398px] border border-[#EEEEEE] border-rd-[10px_10px_0px_0px] border-solid bg-[#FFFFFF]">
<img src="~/assets/images/banner.png" alt="" srcset="" class="w-[100%]" />
@ -179,7 +179,7 @@
import ThumBnail from './components/swiper.vue'
import CommentSection from '~/components/comment-section/index.vue'
import { useRoute } from 'vue-router'
import { ref } from 'vue'
import { onMounted } from 'vue'
import type { ProjectRespVO, ProjectDrawPageRespVO, UserExtendSimpleRespDTO, ProjectDrawMemberRespVO } from '~/api/drawe-detail/types'
import useUserStore from '~/stores/user'
const message = useMessage()
@ -187,15 +187,19 @@
// 获取路由参数
const route = useRoute()
const id = route.params.id as string
// 获取详情
// const detail = ref<ProjectRespVO>({} as ProjectRespVO)
const {data: detail } = await useAsyncData('getDetail', async () => {
const {data: detail, refresh: refreshDetail } = await useAsyncData(`getDetail${id}`, async () => {
const res = await getDetail({ id })
return res.data
})
console.log('==', detail.value);
if (!detail.value) {
throw createError({
statusCode: 404,
@ -219,35 +223,41 @@
// }
// init()
const [{data:mainWork},{data:userInfo},{data:relationRecommend}] = await Promise.all([
getMainWork({ id: detail.value?.id, limit: 10, memberId: detail.value?.ownedUserId }),
getUserInfo({ id: detail.value?.id }),
getRelationRecommend({ type: detail.value?.type, projectType: detail.value?.projectType[0] })
])
// 获取最新发布
const mainWork = ref<ProjectDrawMemberRespVO[]>([])
const handleGetMainWork = () => {
getMainWork({ id: detail.value?.id, limit: 10, memberId: detail.value?.ownedUserId }).then((res) => {
if (res.code === 0) {
mainWork.value = res.data
}
})
}
// const mainWork = ref<ProjectDrawMemberRespVO[]>([])
// const handleGetMainWork = () => {
// getMainWork({ id: detail.value?.id, limit: 10, memberId: detail.value?.ownedUserId }).then((res) => {
// if (res.code === 0) {
// mainWork.value = res.data
// }
// })
// }
// 获取用户信息
const userInfo = ref<UserExtendSimpleRespDTO>({} as UserExtendSimpleRespDTO)
const handleGetUserInfo = () => {
getUserInfo({ id: detail.value?.id }).then((res) => {
if (res.code === 0) {
userInfo.value = res.data
}
})
}
// const userInfo = ref<UserExtendSimpleRespDTO>({} as UserExtendSimpleRespDTO)
// const handleGetUserInfo = () => {
// getUserInfo({ id: detail.value?.id }).then((res) => {
// if (res.code === 0) {
// userInfo.value = res.data
// }
// })
// }
// 获取关联推荐
const relationRecommend = ref<ProjectDrawPageRespVO[]>([])
const getRelationRecommendList = () => {
getRelationRecommend({ type: detail.value?.type, projectType: detail.value?.projectType[0] }).then((res) => {
if (res.code === 0) {
relationRecommend.value = res.data
}
})
}
// const relationRecommend = ref<ProjectDrawPageRespVO[]>([])
// const getRelationRecommendList = () => {
// getRelationRecommend({ type: detail.value?.type, projectType: detail.value?.projectType[0] }).then((res) => {
// if (res.code === 0) {
// relationRecommend.value = res.data
// }
// })
// }
const changeSwiper = (index: number) => {
console.log(index)
@ -350,7 +360,7 @@
})
if (res.code === 0) {
ElMessage.success(`${detail.value?.favoriteId ? '取消' : '收藏'}成功`)
// init()
refreshDetail()
}
}