guigongli
f5bfdb812f
新增 uploadClothes 页面，支持用户上传服饰图片并展示。 包含 SelectPic 组件用于引导用户选择符合要求的图片。 页面支持下拉刷新和模板初始化逻辑。
88 lines
1.9 KiB
Vue
88 lines
1.9 KiB
Vue
<template>
|
|
<view v-if="template">
|
|
<SelectPic v-if="!imageUrl" @onChange="onChange" />
|
|
<view v-if="imageUrl" class="clothes-box">
|
|
<image
|
|
class="clothes"
|
|
mode="aspectFill"
|
|
:src="imageUrl"
|
|
@click="uploadFile"
|
|
></image>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, ref } from 'vue';
|
|
import { onLoad, onPageScroll, onPullDownRefresh } from '@dcloudio/uni-app';
|
|
import sheep from '@/sheep';
|
|
import SelectPic from '@/pages/uploadClothes/SelectPic.vue';
|
|
|
|
const fittingRoom = sheep.$store('fittingRoom');
|
|
|
|
const imageUrl = ref('https://picsum.photos/600/300?random=3')
|
|
|
|
// 隐藏原生tabBar
|
|
uni.hideTabBar({
|
|
fail: () => {},
|
|
});
|
|
|
|
function onChange(e) {
|
|
console.log(e, 12345);
|
|
imageUrl.value = e[0].tempFilePaths[0]
|
|
}
|
|
|
|
const template = computed(() => sheep.$store('app').template?.home);
|
|
|
|
onLoad((options) => {
|
|
// #ifdef MP
|
|
// 小程序识别二维码
|
|
if (options.scene) {
|
|
const sceneParams = decodeURIComponent(options.scene).split('=');
|
|
console.log('sceneParams=>', sceneParams);
|
|
options[sceneParams[0]] = sceneParams[1];
|
|
}
|
|
// #endif
|
|
|
|
// 预览模板
|
|
if (options.templateId) {
|
|
sheep.$store('app').init(options.templateId);
|
|
}
|
|
|
|
// 解析分享信息
|
|
if (options.spm) {
|
|
$share.decryptSpm(options.spm);
|
|
}
|
|
|
|
// 进入指定页面(完整页面路径)
|
|
if (options.page) {
|
|
sheep.$router.go(decodeURIComponent(options.page));
|
|
}
|
|
});
|
|
|
|
// 下拉刷新
|
|
onPullDownRefresh(() => {
|
|
sheep.$store('app').init();
|
|
setTimeout(function () {
|
|
uni.stopPullDownRefresh();
|
|
}, 800);
|
|
});
|
|
|
|
onPageScroll(() => {});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.clothes-box {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
.clothes {
|
|
width: 480rpx;
|
|
height: 700rpx;
|
|
background: #000;
|
|
border: 0.5px solid #000;
|
|
margin-top: 50rpx;
|
|
}
|
|
</style>
|