category.ts
1.77 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
import { ref } from 'vue'
import { defineStore } from 'pinia'
import type { Category, CategoryRootType } from '../type'
export const useCategoryStore = defineStore('category', () => {
const list = ref<CategoryRootType[]>([])
const selectedCategory = ref('') // 选中的一级类别
const selectedSubCategory = ref('') // 选中的二级类别
const selectedFuncCategory = ref('')
const categoryVisible = ref(true)
let resetFuncValue = ''
let resetCategoryValue = ''
const getList = async () => {
const config = useRuntimeConfig()
// 在SSR中，数据仅在服务器端获取并传递到客户端。
const { data } = await useAsyncData('category', () => $fetch('/shop/product/category', {
method: 'GET',
}), {
server: true // 仅在服务器端获取数据
})
const rootList = data.value.data.rootCategoryList
list.value = rootList || []
resetCategoryValue = selectedCategory.value = rootList[0].categoryDisplayName
selectedSubCategory.value = rootList[0].list[0].id
resetFuncValue = selectedFuncCategory.value = rootList[0].productFunctions[0].id
}
const updateCategory = (value: string) => {
selectedCategory.value = value
updateFuncCategory(value === resetCategoryValue ? resetFuncValue : '')
}
const updateSubCategory = (value: string) => {
selectedSubCategory.value = value
}
const updateFuncCategory = (value?: string) => {
selectedFuncCategory.value = value || ''
}
const updateDisplay = (visible: boolean) => {
categoryVisible.value = visible
}
return {
list,
selectedCategory,
selectedSubCategory,
selectedFuncCategory,
resetCategoryValue,
categoryVisible,
getList,
updateCategory,
updateSubCategory,
updateFuncCategory,
updateDisplay
}
})