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

refactor: 更新API路径和优化面包屑功能

Browse Source
This commit is contained in:
wangqiao
2025-08-30 12:44:51 +08:00
parent 3153a35daf
commit 9675261481
2 changed files with 61 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
api/home/index.ts
View File

@ -86,5 +86,5 @@ export const tab2 = () => {
* 获取具有上下级关系的当前的名称
*/
export const getDictTree = (params: { type: number, id: number}) => {
return useDollarFetchRequest.get<IResponse<ProjectDictNodeVO[]>>('/business/app/dict/path-by-id', { query: params })
return useDollarFetchRequest.get<IResponse<ProjectDictNodeVO[]>>('/prod-api/app-api/business/app/dict/path-by-id', { query: params })
}

101
components/kl-wallpaper-category/index.vue
View File

@ -1,8 +1,8 @@
<template>
<!-- 面包屑 -->
<div v-if="level.length > 1" class="mb-[-10px] mt-[20px] pl-[20px]">
<div v-if="breadList && breadList.length > 1" class="mb-[-10px] mt-[20px] pl-[20px]">
<el-breadcrumb :separator-icon="ArrowRight">
<el-breadcrumb-item v-for="(item, index) in level" :key="item.name" class="cursor-pointer" @click="handleClickBread(item, index)">{{
<el-breadcrumb-item v-for="(item, index) in breadList" :key="item.name" class="cursor-pointer" @click="handleClickBread(item, index)">{{
item.name
}}</el-breadcrumb-item>
</el-breadcrumb>
@ -75,23 +75,35 @@
const query = defineModel<pageReq>('modelValue', {
required: true,
})
const level = defineModel<{ id: string; name: string; isChildren?: boolean }[]>('level', {
required: true,
})
// const level = defineModel<{ id: string; name: string; isChildren?: boolean }[]>('level', {
// required: true,
// })
const computType = computed(() => {
return props.type === 1 ? '图纸' : props.type === 3 ? '模型' : '文本'
})
const handleParentId = () => {
if (level?.value?.length > 1) {
if (level.value.find((c: any) => c.isChildren)) {
return level.value[level.value.length - 2].id || '' // 获取最后一个元素的 id 或 defaul
}
return level.value[level.value.length - 1].id || '' // 获取最后一个元素的 id 或 defaul
// 获取面包屑
const { data: breadList } = await useAsyncData(
`breadList-${props.type}-${props.id}-${query.value.projectType}-${Date.now()}`,
async () => {
const res = await getDictTree({ type: props.type, id: query.value.projectType })
const all = [
{
id: -1,
name: props.type === 1 ? '图纸库' : props.type === 3 ? '模型库' : '文本库',
isChildren: false,
},
]
const arr = [...res.data, ...all]
return arr.reverse()
},
{
immediate: true,
}
return '0'
}
)
console.log('breadList', breadList);
// const projectTypeList = ref<any>([])
/** 获取分类下拉框 */
@ -121,21 +133,28 @@
// }
// getEditionsList()
// 获取面包屑
const {data: breadList} = await useAsyncData(`breadList-${props.type}-${props.id}-${query.value.projectType}-${Date.now()}`, async () => {
const res = await getDictTree({ type: props.type, id: query.value.projectType })
return res.data
})
console.log('breadList', breadList);
/**获取分类下拉框 */
const { data: projectTypeList, refresh } = useAsyncData(`projectType-draw-${props.type}-${Date.now()}`, async () => {
const res = await parent({ type: 1, parentId: handleParentId() })
const all = [{ id: '-1', name: '全部' }]
return [...all, ...res.data]
})
const { data: projectTypeList } = await useAsyncData(
`projectType-draw-${props.type}-${query.value.projectType}`,
async () => {
let parentId: any = '0'
if (breadList?.value && breadList?.value.length > 1) {
if (breadList.value.length > 2) {
const length = breadList.value?.length
parentId = breadList?.value[length - 2].id
} else {
const length = breadList.value?.length
parentId = breadList?.value[length - 1].id
}
}
const res = await parent({ type: 1, parentId: parentId })
const all = [{ id: parentId === '0' ? '-1' : parentId, name: '全部' }]
return [...all, ...res.data]
},
{
immediate: true,
}
)
/** 版本 */
const { data: editionsList } = useAsyncData(`editionsList-${props.type}-${Date.now()}`, async () => {
@ -147,25 +166,25 @@
const handleClick = (row: any) => {
query.value.title = ''
query.value.projectType = row.id
if (row.name === '全部') return
const isChildren = level.value.find((c: any) => c.isChildren)
if (!row.isChildren && isChildren) {
const index = level.value.length - 1
level.value[index] = { id: row.id, name: row.name, isChildren: true }
} else if (!row.isChildren && !isChildren) {
level.value.push({ id: row.id, name: row.name, isChildren: true })
} else {
level.value.push({ id: row.id, name: row.name })
// getParent()
refresh()
}
// if (row.name === '全部') return
// const isChildren = breadList.value.find((c: any) => c.isChildren)
// if (!row.isChildren && isChildren) {
// const index = breadList.value.length - 1
// breadList.value[index] = { id: row.id, name: row.name, isChildren: true }
// } else if (!row.isChildren && !isChildren) {
// breadList.value.push({ id: row.id, name: row.name, isChildren: true })
// } else {
// breadList.value.push({ id: row.id, name: row.name })
// // getParent()
// refresh()
// }
}
const handleClickBread = (row: any, index: number) => {
level.value.splice(index + 1)
// breadList.value.splice(index + 1)
query.value.title = ''
query.value.projectType = row.id
// getParent()
refresh()
// refresh()
}
</script>