74 lines
4.0 KiB
TypeScript
74 lines
4.0 KiB
TypeScript
|
import { pinia } from "@/pinia"
|
|||
|
|
import { getShopGoodsApi } from "@@/apis/shop"
|
|||
|
|
|
|||
|
|
export interface Product {
|
|||
|
|
id: number // 商品ID
|
|||
|
|
name: string // 商品名称
|
|||
|
|
price: number // 商品价格
|
|||
|
|
stock: number // 商品库存
|
|||
|
|
description: string // 商品描述
|
|||
|
|
image: string // 商品图片URL
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export const useProductStore = defineStore("product", () => {
|
|||
|
|
// 商品数据
|
|||
|
|
const labels = ref([
|
|||
|
|
{ id: 1, name: "热门推荐" },
|
|||
|
|
{ id: 2, name: "手机数码" },
|
|||
|
|
{ id: 3, name: "家用电器" },
|
|||
|
|
{ id: 4, name: "电脑办公" }
|
|||
|
|
])
|
|||
|
|
const categories = ref([
|
|||
|
|
{ id: 1, name: "商品1", price: 99.9, image: "/img/1.jpg", label: 1, stock: 10, description: "主动降噪，30小时续航，IPX4防水等级" },
|
|||
|
|
{ id: 2, name: "商品2", price: 199.9, image: "/img/2.jpg", label: 1, stock: 990, description: "主动降噪，30小时续航，IPX4防水等级" },
|
|||
|
|
{ id: 3, name: "旗舰手机", price: 5999, image: "/img/3.jpg", label: 2, stock: -1, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 4, name: "旗舰手机", price: 5999, image: "/img/4.jpg", label: 2, stock: -1, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 5, name: "旗舰手机", price: 5999, image: "/img/5.jpg", label: 2, stock: -1, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 6, name: "旗舰手机", price: 5999, image: "/img/6.jpg", label: 2, stock: -1, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 7, name: "旗舰手机", price: 5999, image: "/img/7.jpg", label: 2, stock: 999, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 10, name: "旗舰手机", price: 5999, image: "/img/10.jpg", label: 3, stock: 999, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 13, name: "旗舰手机", price: 5999, image: "/img/13.jpg", label: 3, stock: 999, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 14, name: "旗舰手机", price: 5999, image: "/img/14.jpg", label: 3, stock: 999, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 15, name: "旗舰手机", price: 5999, image: "/img/15.jpg", label: 3, stock: 0, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 16, name: "旗舰手机", price: 5999, image: "/img/16.jpg", label: 3, stock: 0, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 17, name: "旗舰手机", price: 5999, image: "/img/17.jpg", label: 3, stock: 0, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 18, name: "旗舰手机", price: 5999, image: "/img/18.jpg", label: 4, stock: 50, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" },
|
|||
|
|
{ id: 20, name: "旗舰手机", price: 5999, image: "/img/20.jpg", label: 4, stock: 10, description: "骁龙8 Gen2处理器，1亿像素主摄，120Hz刷新率屏幕" }
|
|||
|
|
])
|
|||
|
|
|
|||
|
|
const getGoods = async () => {
|
|||
|
|
try {
|
|||
|
|
const { data } = await getShopGoodsApi()
|
|||
|
|
|
|||
|
|
// 转换分类标签
|
|||
|
|
labels.value = data.categoryList.map(c => ({
|
|||
|
|
id: c.categoryId, // 使用分类名称生成ID
|
|||
|
|
name: c.categoryName
|
|||
|
|
}))
|
|||
|
|
|
|||
|
|
// 转换商品数据
|
|||
|
|
categories.value = data.goodsList.map(g => ({
|
|||
|
|
id: g.goodsId,
|
|||
|
|
name: g.goodsName,
|
|||
|
|
price: g.price,
|
|||
|
|
stock: g.stock,
|
|||
|
|
description: g.goodsDetail || "暂无描述",
|
|||
|
|
image: g.coverImg,
|
|||
|
|
label: g.categoryId
|
|||
|
|
}))
|
|||
|
|
} catch (error) {
|
|||
|
|
console.error('获取商品数据失败:', error)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
getGoods();
|
|||
|
|
return { labels: labels, categories, getGoods }
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* @description 在 SPA 应用中可用于在 pinia 实例被激活前使用 store
|
|||
|
|
* @description 在 SSR 应用中可用于在 setup 外使用 store
|
|||
|
|
*/
|
|||
|
|
export function useProductStoreOutside() {
|
|||
|
|
return useProductStore(pinia)
|
|||
|
|
}
|