From fa4675095102d0c4e72e48e493a5b95e40ea8668 Mon Sep 17 00:00:00 2001 From: dzq Date: Tue, 30 Dec 2025 17:27:44 +0800 Subject: [PATCH] =?UTF-8?q?feat(shop):=20=E9=87=8D=E6=9E=84=E5=BA=97?= =?UTF-8?q?=E9=93=BA=E5=88=97=E8=A1=A8=E9=A1=B5=E9=9D=A2=EF=BC=8C=E6=94=AF?= =?UTF-8?q?=E6=8C=81=E6=8C=89=E6=A8=A1=E5=BC=8F=E5=88=86=E7=B1=BB=E7=AD=9B?= =?UTF-8?q?=E9=80=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 新增模式映射常量文件 - 扩展店铺列表接口参数类型 - 重构店铺列表页面布局为左右结构 - 添加模式分类导航功能 - 优化店铺列表筛选逻辑 --- src/api/shop/index.ts | 14 +- src/api/shop/types.ts | 11 ++ src/pages/index/index.vue | 313 +++++++++++++++++++++++++------------- src/utils/maps/mode.ts | 8 + 4 files changed, 231 insertions(+), 115 deletions(-) create mode 100644 src/utils/maps/mode.ts diff --git a/src/api/shop/index.ts b/src/api/shop/index.ts index 1db0d35..2100c8d 100644 --- a/src/api/shop/index.ts +++ b/src/api/shop/index.ts @@ -2,6 +2,7 @@ import { http } from "@/http/http"; import type { GetBalanceResponse, GetOrdersByOpenIdDTO, + GetShopListParams, OpenCabinetApiData, QyLoginDTO, QyLoginRequestParams, @@ -70,16 +71,15 @@ export async function getUserBalance(corpid: string, ab98UserId: number) { return await http.get("payment/getUserBalance", { corpid, ab98UserId }); } -export async function getShopListApi(corpid: string, mode?: number) { - const params: any = { - corpid - }; - if (typeof mode !== 'undefined') { - params.mode = mode; - } +export async function getShopListApi(params: GetShopListParams) { return await http.get("shop/list", params); } export async function getCorpidById(cid?: number) { return await http.get("qy/getCorpidById", { id: cid ? cid : 0 }); +} + +/** 获取模式列表 */ +export function getModeListApi() { + return http.get("shop/mode/list") } \ No newline at end of file diff --git a/src/api/shop/types.ts b/src/api/shop/types.ts index 71cec21..edc0051 100644 --- a/src/api/shop/types.ts +++ b/src/api/shop/types.ts @@ -253,4 +253,15 @@ export interface SearchGoodsDO extends ShopGoodsEntity { cellNoStr?: string; /** 已分配库存 */ totalStock?: number; +} + +export interface GetShopListParams { + /** 企业微信id */ + corpid: string; + /** 不包含的运行模式 */ + mode?: number; + /** 只查询该运行模式（0-支付模式 1-审批模式 2-借还模式 3-会员模式 4-耗材模式 5-暂存模式） */ + eqMode?: number; + /** 运行模式列表（逗号分隔） */ + modeList?: string; } \ No newline at end of file diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue index 9925105..71ef10b 100644 --- a/src/pages/index/index.vue +++ b/src/pages/index/index.vue @@ -16,6 +16,8 @@ import { useAb98UserStore } from '@/pinia/stores/ab98-user' import { storeToRefs } from 'pinia' import { useWxParamsStore } from '@/pinia/stores/wx-params' import { useStorageCabinetStore } from '@/pinia/stores/storageCabinet' +import { getModeListApi } from '@/api/shop' +import { MODE_MAP } from '@/utils/maps/mode' definePage({ style: { @@ -36,24 +38,35 @@ const showShopList = ref(true) const shopList = ref([]) const shopId = ref(0) -// tabs状态 -const activeTab = ref(0) -const tabs = [ - { title: '借还柜', value: 0 }, - { title: '暂存柜', value: 1 } -] +// mode分类状态 +const modeList = ref([]) +const activeModeCategory = ref(0) // 根据activeTab过滤店铺列表 +// const filteredShopList = computed(() => { +// if (!shopList.value.length) return [] +// if (activeTab.value === 0) { +// // 借还柜：显示mode不为5的shop +// return shopList.value.filter(shop => shop.mode !== 5) +// } else { +// // 暂存柜：显示mode为5的shop +// return shopList.value.filter(shop => shop.mode === 5) +// } +// }) + +// 分类模式列表（包含"全部"） +const categoryModes = computed(() => ['全部', ...modeList.value]) + +// 根据选中的mode分类过滤店铺列表 const filteredShopList = computed(() => { if (!shopList.value.length) return [] - - if (activeTab.value === 0) { - // 借还柜：显示mode不为5的shop - return shopList.value.filter(shop => shop.mode !== 5) - } else { - // 暂存柜：显示mode为5的shop - return shopList.value.filter(shop => shop.mode === 5) + // 如果选中了"全部"或没有模式列表，返回所有店铺 + if (activeModeCategory.value === 0 || !modeList.value.length) { + return shopList.value } + // 根据选中的mode过滤 + const selectedMode = modeList.value[activeModeCategory.value - 1] + return shopList.value.filter(shop => shop.mode === selectedMode) }) // 计算当前选中的店铺模式 @@ -74,6 +87,33 @@ const isStorageMode = computed(() => selectedShopMode.value === 5) onMounted(async () => { }) +// 点击mode分类导航 +function handleModeCategoryClick(index: number) { + activeModeCategory.value = index + // 重新获取店铺列表 + fetchShopListByMode() +} + +// 根据选中的mode分类获取店铺列表 +async function fetchShopListByMode() { + try { + await wxStore.waitForHandleWxCallbackComplete() + const eqMode = activeModeCategory.value === 0 + ? undefined + : modeList.value[activeModeCategory.value - 1] + const res = await getShopListApi({ corpid: wxStore.corpid || '', eqMode }) + console.log('获取店铺列表:', res) + if (res?.code === 0 && res?.data?.length > 0) { + shopList.value = res.data + } else { + shopList.value = [] + } + } catch (error) { + console.error('获取店铺列表失败:', error) + shopList.value = [] + } +} + // 点击分类导航 function handleShopSelect(selectedShopId: number) { shopId.value = selectedShopId @@ -187,86 +227,104 @@ onLoad(async (query) => { console.error('用户登录处理失败:', error); } + // 获取mode列表 + try { + const modeRes = await getModeListApi(); + if (modeRes?.code === 0 && modeRes?.data?.length > 0) { + modeList.value = modeRes.data; + } + } catch (error) { + console.error('获取mode列表失败:', error); + } + // 获取店铺列表 if (showShopList.value) { - try { - await wxStore.waitForHandleWxCallbackComplete(); - const res = await getShopListApi(wxStore.corpid || ''); - console.log('获取店铺列表:', res); - if (res?.code === 0 && res?.data?.length > 0) { - shopList.value = res.data; - } - } catch (error) { - console.error('获取店铺列表失败:', error); - } + await fetchShopListByMode(); } }); onShow(async () => { // 获取店铺列表 if (showShopList.value) { - try { - await wxStore.waitForHandleWxCallbackComplete(); - const res = await getShopListApi(wxStore.corpid || ''); - console.log('获取店铺列表:', res); - if (res?.code === 0 && res?.data?.length > 0) { - shopList.value = res.data; + // 如果mode列表还没获取，先获取 + if (modeList.value.length === 0) { + try { + const modeRes = await getModeListApi(); + if (modeRes?.code === 0 && modeRes?.data?.length > 0) { + modeList.value = modeRes.data; + } + } catch (error) { + console.error('获取mode列表失败:', error); } - } catch (error) { - console.error('获取店铺列表失败:', error); } + await fetchShopListByMode(); } })