feat(fittingRoom): 新增衣服长度选择功能在上传衣服页面增加分类和长度选择功能,支持用户选择衣服类型和具体长度部位。新增 pattern 常量定义各种长度选项,并在 store 中添加相应的状态管理。同时更新了相关样式和组件依赖。

fix(uploadClothes): 修复上传页面分类选择逻辑

调整上传衣服页面的分类选择逻辑,使用 uv-radio-group 实现单选功能,支持衣服类型和长度部位的选择。引入 fittingRoom store 中的 tabs 和 pattern 数据,优化用户交互体验。

chore(deps): 更新 uv-icon 和 uv-radio 组件版本更新 uv-icon 和 uv-radio 组件的 package.json 配置文件,设置版本号为1.0.13。更新 changelog 文档,记录组件的优化和 bug 修复历史。完善组件的平台兼容性配置和依赖关系。

style(components): 调整上传页面样式布局优化上传衣服页面的样式布局,新增 warp、title、container 等样式类,改善分类和长度选择区域的显示效果。调整单选框的间距和对齐方式,提升用户界面的美观性和可用性。
This commit is contained in:
guigongli
2025-09-22 22:35:30 +08:00
parent 18931e653d
commit 8f68f9b0c8
16 changed files with 1438 additions and 2 deletions
+63 -2
View File
@@ -9,6 +9,45 @@
@click="uploadFile"
></image>
</view>
<view class="warp">
<view class="container">
<view class="title">分类</view>
<uv-radio-group v-model="fittingRoomStore.selectClothesType">
<template v-for="(item, index) in fittingRoomStore.tabs">
<uv-radio
shape="square"
:customStyle="{margin: '12rpx'}"
v-if="index !== 0 && index !== 5"
:key="index"
:label="item"
size="26rpx"
iconSize="20rpx"
activeColor="#606060"
:name="index">
</uv-radio>
</template>
</uv-radio-group>
</view>
</view>
<view class="warp">
<view class="container">
<view class="title">长度</view>
<uv-radio-group v-model="fittingRoomStore.selectPattern">
<uv-radio
v-for="(item, index) in pattern"
shape="square"
:customStyle="{margin: '12rpx'}"
:key="index"
:label="item.label"
size="26rpx"
iconSize="20rpx"
activeColor="#606060"
:name="item.value">
</uv-radio>
</uv-radio-group>
</view>
</view>
</view>
</template>
@@ -17,11 +56,14 @@
import { onLoad, onPageScroll, onPullDownRefresh } from '@dcloudio/uni-app';
import sheep from '@/sheep';
import SelectPic from '@/pages/uploadClothes/SelectPic.vue';
import { pattern } from '@/sheep/store/fittingRoom';
const fittingRoom = sheep.$store('fittingRoom');
const fittingRoomStore = sheep.$store('fittingRoom');
const imageUrl = ref('https://picsum.photos/600/300?random=3')
function selectColthesType(val) {
console.log("🚀 ~ selectColthesType ~ val: ", val);
}
// 隐藏原生tabBar
uni.hideTabBar({
fail: () => {},
@@ -72,6 +114,25 @@
</script>
<style lang="scss" scoped>
.warp {
display: flex;
justify-content: center;
align-items: center;
}
.title {
font-size: 28rpx;
}
.container {
width: 323*2rpx;
display: flex;
justify-content: center;
align-items: flex-start;
}
.selectCheckbox {
display: inline-flex;
align-items: center;
justify-content: center;
}
.clothes-box {
display: flex;
justify-content: center;