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:
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user