feat(fittingRoom): 实现衣服数据获取与tab切换功能

新增 fittingRoom 接口调用逻辑,支持根据 tab 类型加载对应衣服列表。
在 store 中增加 `clothes` 数据字段,并通过 `getCloths` 方法请求数据。页面组件中更新 tab 切换逻辑以触发数据刷新,并调整模板绑定方式。
添加 `tabsMap` 映射表用于匹配接口所需 clothType 参数。
This commit is contained in:
liguigong
2025-09-23 09:41:34 +08:00
parent 8f68f9b0c8
commit dc2426936c
7 changed files with 142 additions and 56 deletions
+69
View File
@@ -0,0 +1,69 @@
/**
* @Author: liguigong liguigong@shopline.com
* @Date: 2025-09-23 09:41:10
* @LastEditors: liguigong liguigong@shopline.com
* @LastEditTime: 2025-09-23 09:41:23
* @FilePath: sheep/api/fittingRoom/index.js
* @Description: 这是默认设置,可以在设置》工具》File Description中进行配置
*/
import request from '@/sheep/request';
const FittingRoomApi = {
getClothList: (data) => {
return request({
url: '/api/cloth/list',
method: 'POST',
data: data,
});
},
addHairApi: (data) => {
return request({
url: '/userinfo/add_hair_data',
method: 'POST',
data: data,
});
},
getStyleApi: (data) => {
return request({
url: '/userinfo/get_user_face_info',
method: 'POST',
data: data,
});
},
praiseTextApi: (data) => {
return request({
url: '/ai/praiseTexttwo',
method: 'POST',
data: data,
});
},
wardrobeListApi: (data) => {
return request({
url: '/wardrobe/clothes_list',
method: 'POST',
data: data,
});
},
exchangeHairApi: (data) => {
return request({
url: '/api/v1/test/exchangeHair',
method: 'POST',
data: data,
});
},
exchangeHairHistoryByTaskId: (data) => {
return request({
url: '/api/v1/test/exchangeHairHistoryByTaskId',
method: 'POST',
data: data,
});
},
hairStyleListApi: (data) => {
return request({
url: '/api/v1/test/getHairDetails',
method: 'POST',
data: data,
});
},
};
export default FittingRoomApi;
+17 -17
View File
@@ -122,23 +122,23 @@ http.interceptors.response.use(
response.config.custom.showLoading && closeLoading();
// 自定义处理【error 错误提示】:如果需要显示错误提示,则显示错误提示
if (response.data.code !== 0) {
// 特殊:如果 401 错误码,则跳转到登录页 or 刷新令牌
if (response.data.code === 401) {
return refreshToken(response.config);
}
// 特殊:处理分销用户绑定失败的提示
if ((response.data.code + '').includes('1011007')) {
console.error(`分销用户绑定失败,原因:${response.data.msg}`);
} else if (response.config.custom.showError) {
// 错误提示
uni.showToast({
title: response.data.msg || '服务器开小差啦,请稍后再试~',
icon: 'none',
mask: true,
});
}
}
// if (response.data.code !== 0) {
// // 特殊:如果 401 错误码,则跳转到登录页 or 刷新令牌
// if (response.data.code === 401) {
// return refreshToken(response.config);
// }
// // 特殊:处理分销用户绑定失败的提示
// if ((response.data.code + '').includes('1011007')) {
// console.error(`分销用户绑定失败,原因:${response.data.msg}`);
// } else if (response.config.custom.showError) {
// // 错误提示
// uni.showToast({
// title: response.data.msg || '服务器开小差啦,请稍后再试~',
// icon: 'none',
// mask: true,
// });
// }
// }
// 自定义处理【showSuccess 成功提示】:如果需要显示成功提示,则显示成功提示
if (
+25 -3
View File
@@ -1,5 +1,8 @@
import { defineStore } from 'pinia';
import app from './app';
import FittingRoomApi from '../api/fittingRoom';
const tabsMap = [undefined, 'topCloth', 'bottomCloth', 'dress', 'suit', 'hair'];
export const pattern = [
{ value: 'body', label: '腰部以上'},
@@ -21,7 +24,8 @@ const fittingRoom = defineStore({
type: true, // true: 我的衣橱, false: 衣服库
tab: 0, // 对应下面tabs的序号
tabs: ['全部', '上衣', '下装', '连衣裙', '外套', '发型'],
disableTabs: [5], // 不允许上传图的tab索引
disableTabs: [5], // 不允许上传图的tab索引
clothes: [], // 接口返回的衣服数据
currentClothes: [], // 当前选的衣服
selectClothesType: 1, // 选中的衣服类型, 默认选中上衣
selectPattern: pattern[0].value,
@@ -35,13 +39,31 @@ const fittingRoom = defineStore({
},
},
actions: {
// 获取衣服类型数据查询
async getCloths(templateId = null) {
const httpResponse = await FittingRoomApi.getClothList({
sex: 'female',
isPerson: this.type ? 'yes' : 'no',
clothType: tabsMap[this.tab],
});
console.log('🚀 ~ getCloths 🐶33 ~ httpResponse: ', httpResponse.result);
this.clothes = httpResponse.result || [];
},
setVisable(visable) {
console.log('🚀 ~ setVisable 🐶15 ~ visable: ', visable);
console.log('🚀 ~ setVisable 🐶36 ~ visable: ', visable);
this.visable = visable ?? !this.visable;
},
// 我的衣服库和衣橱的切换
changeType(visable) {
console.log('🚀 ~ setVisable 🐶15 ~ visable: ', visable);
console.log('🚀 ~ setVisable 🐶40 ~ visable: ', visable);
this.type = visable ?? !this.type;
this.getCloths();
},
changeTab(index) {
console.log('切换tab');
this.tab = index;
this.getCloths();
},
// 点击衣服
changeClothes() {