hjq/PixelAI-mobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

解决小程序瀑布流兼容问题

Browse Source
This commit is contained in:
Double-_-Z 2025-02-07 21:28:40 +08:00
parent 6cb6b98067
commit d82bbf1584
6 changed files with 118 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
common/config.service.js
View File

@ -4,12 +4,12 @@
let BASE_URL = '/pixelApi'; let BASE_URL = '/pixelApi';
// #endif // #endif
// #ifdef APP-PLUS ||MP // #ifdef APP-PLUS ||MP
let BASE_URL = 'http://8.138.171.103/pixelApi';// 测试环境 // let BASE_URL = 'http://8.138.171.103/pixelApi';// 测试环境
// let BASE_URL = 'https://www.ylemai.cn/pixelApi';// 正式环境 let BASE_URL = 'https://www.ylemai.cn/pixelApi';// 正式环境
// #endif // #endif
let IP = 'http://8.138.171.103/';// 测试环境 // let IP = 'http://8.138.171.103/';// 测试环境
// let IP = 'https://www.ylemai.cn/';// 正式环境 let IP = 'https://www.ylemai.cn/';// 正式环境
let FILE_URL = IP+'static/'; let FILE_URL = IP+'static/';
// 阿里OSS地址 // 阿里OSS地址
let ALIOSS_URL = 'http://guojunjie.oss-cn-hangzhou.aliyuncs.com'; let ALIOSS_URL = 'http://guojunjie.oss-cn-hangzhou.aliyuncs.com';

4
manifest.json
View File

@ -136,6 +136,7 @@
"proxy" : { "proxy" : {
"/pixelApi" : { "/pixelApi" : {
"target" : "http://8.138.171.103/pixelApi", // 测试环境 "target" : "http://8.138.171.103/pixelApi", // 测试环境
// "target" : "https://www.ylemai.cn/pixelApi",// 正式环境 // "target" : "https://www.ylemai.cn/pixelApi",// 正式环境
"changeOrigin" : true, "changeOrigin" : true,
"secure" : true, "secure" : true,
@ -146,6 +147,7 @@
}, },
"/upload" : { "/upload" : {
"target" : "http://8.138.171.103", // 测试环境 "target" : "http://8.138.171.103", // 测试环境
// "target" : "https://www.ylemai.cn",// 正式环境 // "target" : "https://www.ylemai.cn",// 正式环境
"changeOrigin" : true, "changeOrigin" : true,
"secure" : true, "secure" : true,
@ -153,6 +155,7 @@
}, },
"/static" : { "/static" : {
"target" : "http://8.138.171.103", // 测试环境 "target" : "http://8.138.171.103", // 测试环境
// "target" : "https://www.ylemai.cn",// 正式环境 // "target" : "https://www.ylemai.cn",// 正式环境
"changeOrigin" : true, "changeOrigin" : true,
"secure" : true, "secure" : true,
@ -160,6 +163,7 @@
}, },
"/aiupload" : { "/aiupload" : {
"target" : "http://8.138.171.103/upload", // 测试环境 "target" : "http://8.138.171.103/upload", // 测试环境
// "target" : "https://www.ylemai.cn/upload",// 正式环境 // "target" : "https://www.ylemai.cn/upload",// 正式环境
"changeOrigin" : true, "changeOrigin" : true,
"secure" : true, "secure" : true,

5
pages/mobile_web/my/child_pages/login.vue
View File

@ -75,6 +75,11 @@
<script> <script>
import configService from '@/common/config.service.js'; import configService from '@/common/config.service.js';
export default { export default {
// #ifdef MP
options: {
styleIsolation: 'shared'
},
// #endif
data(){ data(){
return{ return{
// #ifdef MP // #ifdef MP

8
pages/mobile_web/recharge/detail.vue
View File

@ -281,7 +281,11 @@ export default {
}, },
// 支付 // 支付
async payClick() { async payClick() {
// #ifndef APP // #ifdef APP || MP
this.$refs.uToast.show({type:'warning',title: "暂未开通小程序和APP端的支付方式，请使用外部浏览器进行充值"});
return;
// #endif
// #ifndef APP || MP
if(this.isMpWeb()) return; if(this.isMpWeb()) return;
// #endif // #endif
@ -317,7 +321,7 @@ export default {
this.payLoading = false; this.payLoading = false;
} }
}, },
// #ifndef APP // #ifndef APP || MP
// 判断是否在微信内置浏览器打开 // 判断是否在微信内置浏览器打开
isMpWeb(){ isMpWeb(){
if(navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == 'micromessenger'){ if(navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == 'micromessenger'){

37
pages/mobile_web/wall/detail.vue
View File

@ -295,14 +295,25 @@ export default {
if(this.touchNum == 1){ if(this.touchNum == 1){
if(item.mask){ if(item.mask){
// 添加淡出的class样式 // 添加淡出的class样式
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'display', 1);
// #endif
// #ifndef MP
item.display = 1; item.display = 1;
// #endif
this.$refs.uWaterfall.$forceUpdate(); this.$refs.uWaterfall.$forceUpdate();
// 下面的操作应该替换为请求后端数据后，再停止旋转 // 下面的操作应该替换为请求后端数据后，再停止旋转
// 模拟刷新操作，这里用setTimeout模拟 // 模拟刷新操作，这里用setTimeout模拟
setTimeout(() => { setTimeout(() => {
// 移除淡出类 // 移除淡出类
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'mask', 0);
this.$refs.uWaterfall.modify(item.id, 'display', 0);
// #endif
// #ifndef MP
item.mask = 0; item.mask = 0;
item.display = 0; item.display = 0;
// #endif
this.$refs.uWaterfall.$forceUpdate(); this.$refs.uWaterfall.$forceUpdate();
}, 800); }, 800);
}else{ }else{
@ -315,18 +326,34 @@ export default {
const result = item.mask?0:1; const result = item.mask?0:1;
if(result === 0){ if(result === 0){
// 添加淡出的class样式 // 添加淡出的class样式
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'display', 1);
// #endif
// #ifndef MP
item.display = 1; item.display = 1;
// #endif
this.$refs.uWaterfall.$forceUpdate(); this.$refs.uWaterfall.$forceUpdate();
// 下面的操作应该替换为请求后端数据后，再停止旋转 // 下面的操作应该替换为请求后端数据后，再停止旋转
// 模拟刷新操作，这里用setTimeout模拟 // 模拟刷新操作，这里用setTimeout模拟
setTimeout(() => { setTimeout(() => {
// 移除淡出类 // 移除淡出类
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'mask', result);
this.$refs.uWaterfall.modify(item.id, 'display', 0);
// #endif
// #ifndef MP
item.mask = result; item.mask = result;
item.display = 0; item.display = 0;
// #endif
this.$refs.uWaterfall.$forceUpdate(); this.$refs.uWaterfall.$forceUpdate();
}, 800); }, 800);
}else{ }else{
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'mask', result);
// #endif
// #ifndef MP
item.mask = result; item.mask = result;
// #endif
this.$refs.uWaterfall.$forceUpdate(); this.$refs.uWaterfall.$forceUpdate();
} }
} }
@ -377,8 +404,14 @@ export default {
if(resp?.success){ if(resp?.success){
await that.download(resp.data.originalPath); await that.download(resp.data.originalPath);
// 关掉蒙层 // 关掉蒙层
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'mask', 0);
this.$refs.uWaterfall.modify(item.id, 'display', 0);
// #endif
// #ifndef MP
item.mask = 0; item.mask = 0;
item.display = 0; item.display = 0;
// #endif
that.$refs.uWaterfall.$forceUpdate(); that.$refs.uWaterfall.$forceUpdate();
}else{ }else{
this.$refs.uToast.show({type:'error',title: "购买失败，请检查余额是否充足!"}); this.$refs.uToast.show({type:'error',title: "购买失败，请检查余额是否充足!"});
@ -388,7 +421,7 @@ export default {
}); });
}, },
// 判断是否在微信内置浏览器打开 // 判断是否在微信内置浏览器打开
// #ifndef APP // #ifndef APP || MP
isMpWeb(){ isMpWeb(){
if(navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == 'micromessenger'){ if(navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == 'micromessenger'){
this.$refs.uToast.show({type:'warning',title: "请在浏览器打开进行下载，或长按图片保存到相册!"}); this.$refs.uToast.show({type:'warning',title: "请在浏览器打开进行下载，或长按图片保存到相册!"});
@ -402,7 +435,7 @@ export default {
async download(path = ''){ async download(path = ''){
let that = this; let that = this;
// #ifndef APP // #ifndef APP || MP
if(this.isMpWeb()) return; if(this.isMpWeb()) return;
// #endif // #endif

55
pages/mobile_web/work/work.vue
View File

@ -38,16 +38,17 @@
<u-waterfall class="show-work" v-model="current===0?workList:collectList" ref="uWaterfall"> <u-waterfall class="show-work" v-model="current===0?workList:collectList" ref="uWaterfall">
<template v-slot:left="{leftList}"> <template v-slot:left="{leftList}">
<view @click="maskTouchend(item,index)" class="work-item work-item-odd" v-for="(item,index) in leftList" :key="item.id"> <view @click="maskTouchend(item,index)" class="work-item work-item-odd" v-for="(item,index) in leftList" :key="item.id">
<image class="trash" :class="item.display ? 'hideTrash' : ''" :src="fileUrl+trash" v-show="item.mask" @click.stop="deleteCollect(item,index)"></image>
<u-lazy-load border-radius="30" class="work-picture"
:image="item.path"></u-lazy-load>
<view class="sign-text">{{ item.type || '暂无' }}</view>
<!-- #ifdef MP --> <!-- #ifdef MP -->
<image class="trash" :class="item.display ? 'hideTrash' : ''" :src="item.trashIcon" v-if="item.mask" @click.stop="deleteCollect(item,index)"></image>
<image :lazy-load="true" class="sign" :src="item.signIcon"></image> <image :lazy-load="true" class="sign" :src="item.signIcon"></image>
<!-- #endif --> <!-- #endif -->
<!-- #ifndef MP --> <!-- #ifndef MP -->
<image class="trash" :class="item.display ? 'hideTrash' : ''" :src="fileUrl+trash" v-if="item.mask" @click.stop="deleteCollect(item,index)"></image>
<image :lazy-load="true" class="sign" :src="fileUrl+sign"></image> <image :lazy-load="true" class="sign" :src="fileUrl+sign"></image>
<!-- #endif --> <!-- #endif -->
<u-lazy-load border-radius="30" class="work-picture"
:image="item.path"></u-lazy-load>
<view class="sign-text">{{ item.type || '暂无' }}</view>
<!-- <image class="compare-sign" mode="widthFix" :src="item.compare"></image> --> <!-- <image class="compare-sign" mode="widthFix" :src="item.compare"></image> -->
<view class="item-mask" :class="item.display ? 'hideMask' : ''" v-if="!current&&item.mask"> <view class="item-mask" :class="item.display ? 'hideMask' : ''" v-if="!current&&item.mask">
<button class="mask-public" @click.stop="publicWork(item,index)">发布</button> <button class="mask-public" @click.stop="publicWork(item,index)">发布</button>
@ -57,16 +58,17 @@
</template> </template>
<template v-slot:right="{rightList}"> <template v-slot:right="{rightList}">
<view @click="maskTouchend(item,index)" class="work-item work-item-even" v-for="(item,index) in rightList" :key="item.id"> <view @click="maskTouchend(item,index)" class="work-item work-item-even" v-for="(item,index) in rightList" :key="item.id">
<image class="trash" :class="item.display ? 'hideTrash' : ''" :src="fileUrl+trash" v-show="item.mask" @click.stop="deleteCollect(item,index)"></image>
<u-lazy-load border-radius="30" class="work-picture"
:image="item.path"></u-lazy-load>
<view class="sign-text">{{ item.type || '暂无' }}</view>
<!-- #ifdef MP --> <!-- #ifdef MP -->
<image class="trash" :class="item.display ? 'hideTrash' : ''" :src="item.trashIcon" v-if="item.mask" @click.stop="deleteCollect(item,index)"></image>
<image :lazy-load="true" class="sign" :src="item.signIcon"></image> <image :lazy-load="true" class="sign" :src="item.signIcon"></image>
<!-- #endif --> <!-- #endif -->
<!-- #ifndef MP --> <!-- #ifndef MP -->
<image class="trash" :class="item.display ? 'hideTrash' : ''" :src="fileUrl+trash" v-if="item.mask" @click.stop="deleteCollect(item,index)"></image>
<image :lazy-load="true" class="sign" :src="fileUrl+sign"></image> <image :lazy-load="true" class="sign" :src="fileUrl+sign"></image>
<!-- #endif --> <!-- #endif -->
<u-lazy-load border-radius="30" class="work-picture"
:image="item.path"></u-lazy-load>
<view class="sign-text">{{ item.type || '暂无' }}</view>
<!-- <image class="compare-sign" mode="widthFix" :src="item.compare"></image> --> <!-- <image class="compare-sign" mode="widthFix" :src="item.compare"></image> -->
<view class="item-mask" :class="item.display ? 'hideMask' : ''" v-if="!current&&item.mask"> <view class="item-mask" :class="item.display ? 'hideMask' : ''" v-if="!current&&item.mask">
<button class="mask-public" @click.stop="publicWork(item,index)">发布</button> <button class="mask-public" @click.stop="publicWork(item,index)">发布</button>
@ -202,6 +204,7 @@ export default {
let nowResult = {...item,path: that.getImagePath(item.path),display:0,mask:0}; let nowResult = {...item,path: that.getImagePath(item.path),display:0,mask:0};
// #ifdef MP // #ifdef MP
nowResult.signIcon = that.fileUrl+that.sign; nowResult.signIcon = that.fileUrl+that.sign;
nowResult.trashIcon = that.fileUrl+that.trash;
// #endif // #endif
return nowResult; return nowResult;
}); });
@ -210,6 +213,7 @@ export default {
let nowResult = {...item,path: that.getImagePath(item.path),display:0,mask:0}; let nowResult = {...item,path: that.getImagePath(item.path),display:0,mask:0};
// #ifdef MP // #ifdef MP
nowResult.signIcon = that.fileUrl+that.sign; nowResult.signIcon = that.fileUrl+that.sign;
nowResult.trashIcon = that.fileUrl+that.trash;
// #endif // #endif
return nowResult; return nowResult;
})); }));
@ -234,6 +238,7 @@ export default {
let nowResult = {...item,path: that.getImagePath(item.path),display:0,mask:0}; let nowResult = {...item,path: that.getImagePath(item.path),display:0,mask:0};
// #ifdef MP // #ifdef MP
nowResult.signIcon = that.fileUrl+that.sign; nowResult.signIcon = that.fileUrl+that.sign;
nowResult.trashIcon = that.fileUrl+that.trash;
// #endif // #endif
return nowResult; return nowResult;
}); });
@ -242,6 +247,7 @@ export default {
let nowResult = {...item,path: that.getImagePath(item.path),display:0,mask:0}; let nowResult = {...item,path: that.getImagePath(item.path),display:0,mask:0};
// #ifdef MP // #ifdef MP
nowResult.signIcon = that.fileUrl+that.sign; nowResult.signIcon = that.fileUrl+that.sign;
nowResult.trashIcon = that.fileUrl+that.trash;
// #endif // #endif
return nowResult; return nowResult;
})); }));
@ -299,14 +305,25 @@ export default {
if(this.touchNum == 1){ if(this.touchNum == 1){
if(item.mask){ if(item.mask){
// 添加淡出的class样式 // 添加淡出的class样式
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'display', 1);
// #endif
// #ifndef MP
item.display = 1; item.display = 1;
// #endif
this.$refs.uWaterfall.$forceUpdate(); this.$refs.uWaterfall.$forceUpdate();
// 下面的操作应该替换为请求后端数据后，再停止旋转 // 下面的操作应该替换为请求后端数据后，再停止旋转
// 模拟刷新操作，这里用setTimeout模拟 // 模拟刷新操作，这里用setTimeout模拟
setTimeout(() => { setTimeout(() => {
// 移除淡出类 // 移除淡出类
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'mask', 0);
this.$refs.uWaterfall.modify(item.id, 'display', 0);
// #endif
// #ifndef MP
item.mask = 0; item.mask = 0;
item.display = 0; item.display = 0;
// #endif
this.$refs.uWaterfall.$forceUpdate(); this.$refs.uWaterfall.$forceUpdate();
}, 800); }, 800);
}else{ }else{
@ -319,18 +336,34 @@ export default {
const result = item.mask?0:1; const result = item.mask?0:1;
if(result === 0){ if(result === 0){
// 添加淡出的class样式 // 添加淡出的class样式
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'display', 1);
// #endif
// #ifndef MP
item.display = 1; item.display = 1;
// #endif
this.$refs.uWaterfall.$forceUpdate(); this.$refs.uWaterfall.$forceUpdate();
// 下面的操作应该替换为请求后端数据后，再停止旋转 // 下面的操作应该替换为请求后端数据后，再停止旋转
// 模拟刷新操作，这里用setTimeout模拟 // 模拟刷新操作，这里用setTimeout模拟
setTimeout(() => { setTimeout(() => {
// 移除淡出类 // 移除淡出类
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'mask', result);
this.$refs.uWaterfall.modify(item.id, 'display', 0);
// #endif
// #ifndef MP
item.mask = result; item.mask = result;
item.display = 0; item.display = 0;
// #endif
this.$refs.uWaterfall.$forceUpdate(); this.$refs.uWaterfall.$forceUpdate();
}, 800); }, 800);
}else{ }else{
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'mask', result);
// #endif
// #ifndef MP
item.mask = result; item.mask = result;
// #endif
this.$refs.uWaterfall.$forceUpdate(); this.$refs.uWaterfall.$forceUpdate();
} }
} }
@ -351,8 +384,14 @@ export default {
}); });
if(res?.success){ if(res?.success){
// 关掉蒙层 // 关掉蒙层
// #ifdef MP
this.$refs.uWaterfall.modify(item.id, 'mask', 0);
this.$refs.uWaterfall.modify(item.id, 'display', 0);
// #endif
// #ifndef MP
item.mask = 0; item.mask = 0;
item.display = 0; item.display = 0;
// #endif
that.$refs.uWaterfall.$forceUpdate(); that.$refs.uWaterfall.$forceUpdate();
that.$refs.uToast.show({type:'success',title: '作品上传分享成功！'}); that.$refs.uToast.show({type:'success',title: '作品上传分享成功！'});
}else{ }else{