feat:173版本

This commit is contained in:
2026-08-29 13:02:46 +08:00
parent 23b30c8f04
commit 388c0d5185
17 changed files with 704 additions and 197 deletions
+8 -10
View File
@@ -8,7 +8,7 @@
<view class="indicator-num">
<text class="indicator-num__text">{{ currentNum + 1 }}/{{ swiperList.length }}</text>
<qiaobao-assistant page-key="pages/active/super-subsidy/super-subsidy" title="超级补贴" />
</view>
</view>
</template>
</up-swiper>
<view class="img_comm left_warp">
@@ -18,16 +18,16 @@
</view>
<view class="tab-view">
<scroll-view scroll-x class="tab-view" :show-scrollbar="false">
<view class="tab-list" @click="onTab(index)" v-for="(item, index) in tabList" :key="index">
<text class="text-28 text-space" :style="{
color: curTab == index ? '#7A35F6' : '#666',
}">{{ item.name }}</text>
<view class="line" v-if="curTab == index"></view>
</view>
</view>
</scroll-view>
<mescroll-uni ref="mescrollRef" top="660rpx" @down="downCallback" @up="upCallback" :up="upOption"
<mescroll-uni ref="mescrollRef" top="650rpx" @down="downCallback" @up="upCallback" :up="upOption"
:down="downOption" @init="mescrollInit">
<view class="setting-view">
<view class="name-box">
@@ -276,26 +276,24 @@ export default {
width: 100%;
height: 80rpx;
min-height: 80rpx;
display: flex;
flex-direction: row;
white-space: nowrap;
padding: 0 32rpx;
box-sizing: border-box;
background-color: #fff;
overflow-x: auto;
position: absolute;
position: fixed;
top: 600rpx;
left: 0;
z-index: 99;
.tab-list {
margin-right: 24rpx;
display: flex;
display: inline-flex;
flex-direction: column;
height: 60rpx;
min-height: 60rpx;
align-items: center;
justify-content: space-between;
margin-top: 22rpx;
margin-top: 14rpx;
}
.line {
+67 -52
View File
@@ -4,9 +4,8 @@
<view class="header_title_warp" :class="{ 'is-scrolled': isScrolled }" :style="headerContainerStyle">
<view class="language_warp" style="flex: 1; justify-content: flex-start;" :style="languageBoxStyle"
@click.stop="jumpSearch">
<view :style="isMP ? 'display: flex; align-items: center;margin-top: 0;' : 'margin-top: 0;'">
<up-image src="https://static.tbmall.xin/static/home/search_b.png" width="20" height="20" bgColor="#f1f6ff00"
:style="searchIconStyle"></up-image>
<view class="search_icon_box">
<image src="https://static.tbmall.xin/static/home/search_b.png" class="tab-icon"></image>
</view>
<text class="search_msg_warp" :style="searchMsgStyle">搜索</text>
</view>
@@ -71,13 +70,9 @@
</view>
</view>
<view class="yp_content">
<!-- <up-loading-icon :show="productLoading"></up-loading-icon> -->
<view class="yp_item" v-for="item in faddishProduct" :key="item.id" @click.stop="jumpInfo(item)">
<view class="yp_item_image_wrapper">
<image :src="item.url" mode="aspectFill" lazy-load class="yp_item_image" shape="square" radius="15">
</image>
<!-- <up-image :src="item.url" width="100%" height="88" bgColor="#f1f6ff00" shape="square"
radius="15"></up-image> -->
<image :src="item.url" mode="cover" lazy-load class="yp_item_image"></image>
</view>
<view class="yp_item_info">
<view class="yp_item_name">{{ item.title }}</view>
@@ -502,43 +497,42 @@ export default {
});
},
initMPHeader() {
// #ifdef MP-WEIXIN || MP
try {
const menuButton = uni.getMenuButtonBoundingClientRect();
const systemInfo = uni.getSystemInfoSync();
const statusBarHeight = systemInfo.statusBarHeight || 0;
const menuButtonHeight = menuButton.height;
const menuButtonTop = menuButton.top;
const menuButtonLeft = menuButton.left;
const windowWidth = systemInfo.windowWidth;
if (menuButton && menuButton.top && menuButton.top > 0) {
const menuButtonHeight = menuButton.height || 32;
const menuButtonTop = menuButton.top;
const menuButtonLeft = menuButton.left;
const windowWidth = systemInfo.windowWidth;
// Calculate top offset below capsule button specifically for WeChat Mini Program
const headerTop = menuButtonTop + menuButtonHeight + 8;
this.mpHeaderStyle = {
paddingTop: `${headerTop}px`,
paddingRight: '15px',
paddingBottom: '10px',
paddingLeft: '15px',
height: `${menuButtonHeight}px`,
boxSizing: 'content-box',
display: 'flex',
alignItems: 'center'
};
const rightPadding = windowWidth - menuButtonLeft + 10;
this.mpLanguageStyle = {
height: `${menuButtonHeight}px`,
boxSizing: 'border-box',
display: 'flex',
alignItems: 'center'
};
this.mpHeaderStyle = {
paddingTop: `${menuButtonTop}px`,
paddingRight: `${rightPadding}px`,
paddingLeft: '12px',
paddingBottom: '8px',
height: `${menuButtonHeight}px`,
boxSizing: 'content-box',
display: 'flex',
alignItems: 'center'
};
const warpPaddingTop = headerTop + menuButtonHeight;
this.mpHeaderWarpStyle = {
paddingTop: `${warpPaddingTop}px`
};
this.mpLanguageStyle = {
height: `${menuButtonHeight}px`,
borderRadius: `${menuButtonHeight / 2}px`,
boxSizing: 'border-box',
display: 'flex',
alignItems: 'center'
};
}
} catch (e) {
console.error("initMPHeader error:", e);
}
// #endif
},
// 切换活动类型
jumpTab(item, type) {
@@ -912,7 +906,11 @@ export default {
};
},
languageBoxStyle() {
const base = this.isMP ? { height: this.mpLanguageStyle?.height, boxSizing: 'border-box' } : {};
const base = this.isMP ? {
height: this.mpLanguageStyle?.height,
borderRadius: this.mpLanguageStyle?.borderRadius,
boxSizing: 'border-box'
} : {};
if (this.isScrolled) {
return {
...base,
@@ -927,7 +925,7 @@ export default {
};
},
searchMsgStyle() {
const base = this.isMP ? { lineHeight: '1' } : {};
const base = { lineHeight: '1' };
if (this.isScrolled) {
return { ...base, color: '#888888' };
}
@@ -1034,6 +1032,17 @@ export default {
border-radius: 34rpx;
box-sizing: border-box;
transition: all 0.3s ease;
.search_icon_box {
display: flex;
align-items: center;
justify-content: center;
.tab-icon {
width: 40rpx;
height: 40rpx;
}
}
}
.chart_img {
@@ -1078,6 +1087,9 @@ export default {
font-size: 28rpx;
color: rgba(255, 255, 255, 0.95);
transition: color 0.3s ease;
line-height: 1;
display: flex;
align-items: center;
}
}
@@ -1216,7 +1228,7 @@ export default {
margin: 0 30rpx 100rpx;
box-sizing: border-box;
height: auto;
background: #fff;
background: linear-gradient(344deg, #FFFFFF 0%, #EDE3FF 100%);
border-radius: 28rpx;
border: 1rpx solid #dfdfdf;
padding: 24rpx 20rpx 20rpx;
@@ -1250,7 +1262,7 @@ export default {
.yp_title_sub {
font-size: 22rpx;
color: #333333;
color: #000000;
font-weight: 500;
}
@@ -1287,19 +1299,17 @@ export default {
justify-content: space-between;
align-items: stretch;
width: 100%;
gap: 16rpx;
}
.yp_item {
// flex: 0 0 32%;
flex: 1;
// height: 268rpx;
max-width: 33.3%;
gap: 10rpx;
min-width: 0;
background-color: #ffffff;
background: #F0E7FE;
border-radius: 24rpx;
border: 1rpx solid #eae5f9;
padding: 16rpx;
padding: 0;
overflow: hidden;
box-sizing: border-box;
display: flex;
flex-direction: column;
@@ -1308,13 +1318,16 @@ export default {
.yp_item_image_wrapper {
width: 100%;
height: 174rpx;
border-radius: 24rpx 24rpx 0 0;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
.yp_item_image {
width: 100%;
height: 176rpx;
border-radius: 15rpx;
height: 100%;
}
}
@@ -1324,10 +1337,12 @@ export default {
align-items: center;
width: 100%;
min-width: 0;
padding: 12rpx 10rpx 14rpx 10rpx;
box-sizing: border-box;
}
.yp_item_name {
font-size: 24rpx;
font-size: 30rpx;
color: #000000;
font-weight: bold;
text-align: center;
@@ -1335,18 +1350,18 @@ export default {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 12rpx;
margin-bottom: 10rpx;
}
.yp_item_price_tag {
width: 100%;
background: linear-gradient(270deg, #b164fb 0%, #7632ff 100%);
background: linear-gradient(90deg, #7632FF 0%, #B164FB 100%);
color: #ffffff;
font-size: 20rpx;
font-size: 22rpx;
display: flex;
justify-content: center;
align-items: center;
height: 44rpx;
height: 48rpx;
border-radius: 12rpx;
white-space: nowrap;
font-weight: bold;
+105 -16
View File
@@ -1,13 +1,18 @@
<template>
<view class="register_warp">
<view class="header_">
<view style="margin-top: 10rpx">
<up-image src="/static/common/left.png" width="18" height="20" bgColor="#f1f6ff00" @click="jumpMine" />
<!-- 顶部固定导航栏 -->
<view class="navbar-sticky-wrapper" :style="mpWarpStyle">
<view class="custom-navbar" :style="mpHeaderStyle">
<view class="back_btn" @click="jumpMine">
<up-image src="/static/common/left.png" width="18" height="20" bgColor="#f1f6ff00" />
</view>
<view class="nav-title">绑定手机号</view>
<view class="nav-right"></view>
</view>
<view class="title_">绑定手机号</view>
<view></view>
</view>
<view class="register_content">
<view class="register_ifo_warp">
<view class="register_info_item">
<up-input placeholder="请输入手机号" border="surround" v-model="form.mobile" :customStyle="inputCss"></up-input>
@@ -46,6 +51,8 @@
</up-checkbox>
</view>
</view>
<up-toast ref="uToastRef"></up-toast>
<u-modal :show="tipsShow" title="提示" showCancelButton @cancel="onCancel" @confirm="onConfirm">
<view class="slot-content">
@@ -71,6 +78,8 @@ import {
export default {
data() {
return {
mpWarpStyle: {},
mpHeaderStyle: {},
form: {
mobile: null,
smsCode: null, // 验证码
@@ -94,6 +103,7 @@ export default {
},
onLoad(option) {
this.initMPHeader();
this.form.token = option.token;
this.type = option.type;
console.log("-----1", option, this.form.token, this.type);
@@ -102,7 +112,9 @@ export default {
submit() {
if (!this.isPolicy) {
this.tipsShow = true;
return;
}
this.registerFun();
},
onCancel() {
this.tipsShow = false;
@@ -112,9 +124,54 @@ export default {
this.isPolicy = true;
this.registerFun();
},
initMPHeader() {
try {
const systemInfo = uni.getSystemInfoSync();
const statusBarHeight = systemInfo.statusBarHeight || 0;
// #ifdef MP-WEIXIN || MP
const menuButton = uni.getMenuButtonBoundingClientRect();
if (menuButton && menuButton.top && menuButton.top > 0) {
const menuButtonHeight = menuButton.height || 32;
const menuButtonTop = menuButton.top;
const menuButtonLeft = menuButton.left;
const windowWidth = systemInfo.windowWidth;
this.mpWarpStyle = {
paddingTop: `${menuButtonTop}px`
};
this.mpHeaderStyle = {
height: `${menuButtonHeight}px`,
paddingRight: `${windowWidth - menuButtonLeft + 10}px`,
display: 'flex',
alignItems: 'center'
};
return;
}
// #endif
// APP-PLUS 或 H5 或 无胶囊环境
this.mpWarpStyle = {
paddingTop: `${statusBarHeight}px`
};
this.mpHeaderStyle = {
height: '88rpx',
display: 'flex',
alignItems: 'center'
};
} catch (e) {
console.error("initMPHeader error:", e);
}
},
jumpMine() {
uni.reLaunch({
url: "/pages/login_package/login/login",
uni.navigateBack({
fail: () => {
uni.redirectTo({
url: "/pages/login_package/login/login",
});
}
});
},
// 用户协议
@@ -237,21 +294,53 @@ export default {
</script>
<style lang="scss" scoped>
.header_ {
.register_warp {
min-height: 100vh;
box-sizing: border-box;
background-color: #ffffff;
}
.navbar-sticky-wrapper {
position: sticky;
top: 0;
z-index: 100;
background-color: #ffffff;
width: 100%;
}
.custom-navbar {
height: 88rpx;
background-color: #ffffff;
display: flex;
align-items: center;
padding: calc(24rpx + env(safe-area-inset-bottom)) 30rpx 0 30rpx;
justify-content: space-between;
padding: 0 24rpx;
position: relative;
box-sizing: border-box;
.title_ {
font-weight: bold;
font-size: 36rpx;
margin-left: 20rpx;
.back_btn {
width: 60rpx;
height: 100%;
display: flex;
align-items: center;
justify-content: flex-start;
}
.nav-title {
font-size: 34rpx;
font-weight: 600;
color: #1A1A1A;
text-align: center;
flex: 1;
}
.nav-right {
width: 60rpx;
}
}
.register_warp {
height: calc(100vh - 280rpx);
padding: 40rpx;
.register_content {
padding: 0 40rpx;
}
.register_title_warp {
+111 -34
View File
@@ -1,5 +1,5 @@
<template>
<view class="login_warp">
<view class="login_warp" @touchmove.stop.prevent>
<u-icon size="30rpx" name="arrow-left" color="#333" @click="onBack"></u-icon>
<view class="login_logo_warp">
<view style="text-align: center">
@@ -72,20 +72,18 @@
<!-- #ifdef APP-PLUS -->
<view class="other_login">其他登录方式</view>
<view class="login_other_icon">
<view class="login_other_item" @click="wechatOneLogin(2)">
<up-image src="/pages/login_package/static/login/WXICON.png" width="44" height="44"
<view class="login_other_item" v-if="(isIOS && isWechatInstalled) || !isIOS" @click="wechatOneLogin(2)">
<up-image src="https://static.tbmall.xin/static/home/wechat.png" width="44" height="44"
bgColor="#f1f6ff00"></up-image>
微信登录
</view>
<!-- <view class="login_other_item" @click="aa"> -->
<view v-if="!isIOS" class="login_other_item" @click="alipayOneLogin">
<up-image src="/pages/login_package/static/login/ZFB.png" width="44" height="44"
<up-image src="https://static.tbmall.xin/static/home/alipay.png" width="44" height="44"
bgColor="#f1f6ff00"></up-image>
支付宝登录
</view>
<view v-if="isIOS" class="login_other_item" @click="appleOneLogin">
<up-icon name="apple-fill" size="44" color="#000000"></up-icon>
Apple登录
<up-image src="https://static.tbmall.xin/static/home/apple.png" width="44" height="44"
bgColor="#f1f6ff00"></up-image>
</view>
</view>
<!-- #endif -->
@@ -93,11 +91,14 @@
<!-- #ifdef MP-WEIXIN -->
<view class="other_login">其他登录方式</view>
<view class="login_other_icon">
<view class="login_other_item" @click="wechatOneLogin(1)">
<up-image src="/pages/login_package/static/login/WXICON.png" width="44" height="44"
<view v-if="!isPolicy" class="login_other_item" @click="handleUnpolicyWXLogin">
<up-image src="https://static.tbmall.xin/static/home/wechat.png" width="44" height="44"
bgColor="#f1f6ff00"></up-image>
微信登录
</view>
<button v-else class="login_other_item" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
<up-image src="https://static.tbmall.xin/static/home/wechat.png" width="44" height="44"
bgColor="#f1f6ff00"></up-image>
</button>
</view>
<view class="login_other_icon">
<view class="login_other_item_you" @click="jumpHome">
@@ -124,6 +125,7 @@
<script>
import InputCodeComm from "@/pages/login_package/components/code-comm/code-comm.vue";
import {
SMS_TYPE
} from "@/utils/enumUtils.js";
@@ -145,6 +147,7 @@ import {
USER_LOGIN_TIME,
} from "@/utils/auth.js";
import CryptoJS from "crypto-js";
import { loginFn, getPhoneNumberFn } from "@/utils/login.js";
// #ifdef APP-PLUS
const hyyAlipay = uni.requireNativePlugin("Hyy-Alipay");
@@ -162,9 +165,17 @@ export default {
uni.setStorageSync("version-1", inf.version); // 大版本号
uni.setStorageSync("versionCode", inf.versionCode); // 小版本号
});
let uuid = plus.device.uuid;
// #endif
},
onLoad() {
// #ifdef APP-PLUS
// 判断微信是否安装 (iOS 的 scheme 为 weixin://)
this.isWechatInstalled = plus.runtime.isApplicationExist({
action: 'weixin://'
});
// #endif
},
components: {
InputCodeComm,
},
@@ -189,6 +200,7 @@ export default {
countdown: false, // 清空倒计时
loading: false,
showPolicyModal: false,
isWechatInstalled: false,
};
},
methods: {
@@ -198,31 +210,14 @@ export default {
url: '/pages/home/home'
})
},
aa() {
const nativiPlugin = uni.requireNativePlugin('WITTestUniPlugin');
console.log("隐藏原生tabbar", nativiPlugin)
nativiPlugin.testAsyncFunc({},
(ret) => {
uni.showToast({
title: '调用异步方法 ' + ret,
icon: "none"
})
console.log(ret);
});
},
jumpHome() {
// const sysPlatform = getCurrentSysPlatform();
// if(sysPlatform === "android"){
// uni.switchTab({
// url: '/pages/message/message',
// })
// }else{
uni.switchTab({
url: "/pages/home/home",
});
// }
},
async loginFun(val = {}) {
const then = this;
const form = this.form;
@@ -268,7 +263,6 @@ export default {
uni.setStorageSync('version-1', inf.version); // 大版本号
uni.setStorageSync('versionCode', inf.versionCode); // 小版本号
});
let uuid = plus.device.uuid;
// #endif
this.$refs.uToastRef.show({
@@ -593,6 +587,79 @@ export default {
});
// #endif
},
handleUnpolicyWXLogin() {
this.showPolicyModal = true;
},
handlePolicyConfirm() {
this.isPolicy = true;
this.showPolicyModal = false;
// #ifdef MP-WEIXIN
this.$refs.uToastRef.show({
type: "success",
message: "已同意协议,请再次点击微信登录",
});
// #endif
// #ifndef MP-WEIXIN
this.loginFun();
// #endif
},
getPhoneNumber(e) { // 在bindgetphonenumber回调中获取code动态令牌
if (!e || !e.detail || !e.detail.code) {
console.log('用户拒绝授权手机号或获取失败:', e);
return;
}
loginFn().then(res => { // 微信登录&服务端获取code
console.log("微信登录", res.code, e.detail.code)
// return
getPhoneNumberFn(res.code, e.detail.code).then(response => { // 服务端获取手机号
if (response && response.bizcode === 100) {
const data = response.data;
setStorageFun(TOKEN_NAME, data.token);
// 用于无感登录
setStorageFun(USER_KEY, "");
const userInfo = {
avatar: data.avatarUrl,
name: data.name,
userId: data.userId,
grade: data.grade,
inviteCode: data.inviteCode,
};
setStorageFun(USER_DATA, userInfo);
// 当前登录得时间戳
let currentTimeStamp = new Date().getTime();
setStorageFun(USER_LOGIN_TIME, currentTimeStamp);
const sysInfo = uni.getSystemInfoSync();
uni.setStorageSync("platform", sysInfo.platform);
// #ifdef APP-PLUS
// 获取应用版本信息
plus.runtime.getProperty(plus.runtime.appid, function (inf) {
console.log("版本信息", inf.versionCode);
uni.setStorageSync("version-1", inf.version); // 大版本号
uni.setStorageSync("versionCode", inf.versionCode); // 小版本号
});
// #endif
this.$refs.uToastRef.show({
type: "success",
message: response.msg,
});
setTimeout(() => {
uni.switchTab({
url: "/pages/home/home",
});
}, 1200);
} else if (response && response.msg) {
this.$refs.uToastRef.show({
type: "error",
message: response.msg,
});
}
});
});
},
},
computed: {
@@ -608,7 +675,8 @@ export default {
<style lang="scss" scoped>
.login_warp {
min-height: 100vh;
height: 100vh;
overflow: hidden;
box-sizing: border-box;
padding: 120rpx 50rpx 40rpx;
display: flex;
@@ -697,6 +765,15 @@ export default {
flex-direction: column;
align-items: center;
margin-bottom: 80rpx;
background: transparent;
border: none;
padding: 0;
line-height: normal;
color: inherit;
&::after {
border: none;
}
}
.login_other_item_you {
+166
View File
@@ -0,0 +1,166 @@
<template>
<view class="privacy" v-if="showPrivacy">
<view class="content">
<view class="title">隐私保护指引</view>
<view class="des">
在使用当前小程序服务之前,请仔细阅读<text class="link" @tap="openPrivacyContract">{{ privacyContractName }}</text>。如你同意{{
privacyContractName }},请点击“同意”开始使用。
</view>
<view class="btns">
<button class="item reject" @tap="exitMiniProgram">拒绝</button>
<button id="agree-btn" class="item agree" open-type="agreePrivacyAuthorization"
@agreeprivacyauthorization="handleAgreePrivacyAuthorization">同意</button>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
privacyContractName: '《XXX隐私保护引导》',
showPrivacy: false
}
},
methods: {
checkPrivacySetting() {
uni.getPrivacySetting({
success: res => {
console.log("getPrivacySetting", res)
this.showPrivacy = true
// 返回结果为: res = { needAuthorization: true/false, privacyContractName: '《xxx隐私保护指引》' }
// if (res.needAuthorization) {
// 需要弹出隐私协议
// this.showPrivacy = false
// } else {
// this.showPrivacy = true
// 用户已经同意过隐私协议,所以不需要再弹出隐私协议,也能调用已声明过的隐私接口
// wx.getUserProfile()
// wx.chooseMedia()
// wx.getClipboardData()
// wx.startRecord()
// }
},
fail: () => { },
complete: () => { }
})
},
// 打开隐私协议
openPrivacyContract() {
uni.openPrivacyContract({
fail: () => {
uni.showToast({
title: '遇到错误',
icon: 'error'
})
}
})
},
// 拒绝隐私协议
exitMiniProgram() {
console.log("拒绝隐私协议")
const that = this;
// 直接退出小程序
// wx.exitMiniProgram()
uni.showModal({
// 如果拒绝,我们将无法获取您的信息, 包括手机号、位置信息、相册等该小程序十分重要的功能,您确定要拒绝吗?
content: '您确定要拒绝吗?',
success: res => {
if (res.confirm) {
that.showPrivacy = false;
uni.exitMiniProgram({
success: () => {
console.log('退出小程序成功');
}
});
}
}
});
},
// 同意隐私协议
handleAgreePrivacyAuthorization() {
wx.requirePrivacyAuthorize({
success: () => {
// 用户同意授权
// 继续小程序逻辑
this.showPrivacy = false
},
fail: () => { }, // 用户拒绝授权
complete: () => { }
})
}
}
}
</script>
<style scoped>
.privacy {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, .5);
z-index: 9999999;
display: flex;
align-items: center;
justify-content: center;
}
.content {
width: 632rpx;
padding: 48rpx;
box-sizing: border-box;
background: #fff;
border-radius: 16rpx;
}
.content .title {
text-align: center;
color: #333;
font-weight: bold;
font-size: 32rpx;
}
.content .des {
font-size: 26rpx;
color: #666;
margin-top: 40rpx;
text-align: justify;
line-height: 1.6;
}
.content .des .link {
color: #07c160;
text-decoration: underline;
}
.btns {
margin-top: 48rpx;
display: flex;
}
.btns .item {
justify-content: space-between;
width: 244rpx;
height: 80rpx;
display: flex;
align-items: center;
justify-content: center;
border-radius: 16rpx;
box-sizing: border-box;
border: none;
}
.btns .reject {
background: #f4f4f5;
color: #909399;
}
.btns .agree {
background: #07c160;
color: #fff;
}
</style>
@@ -3,10 +3,9 @@
<!-- 顶部固定导航栏 -->
<view class="navbar-sticky-wrapper" :style="mpWarpStyle">
<view class="custom-navbar" :style="mpHeaderStyle">
<view class="nav-left" @click="goBack">
<view class="back-btn-box">
<text class="back-arrow">‹</text>
</view>
<view class="back_btn" @click="goBack">
<up-image src="/static/common/left.png" width="20" height="20" bgColor="#f1f6ff00"></up-image>
</view>
<view class="nav-title">申请退款</view>
<view class="nav-right"></view>
@@ -193,9 +192,7 @@ export default {
}
},
onLoad(options) {
// #ifdef MP-WEIXIN || MP
this.initMPHeader();
// #endif
let orderId = options ? options.id : null;
@@ -227,10 +224,12 @@ export default {
}
},
initMPHeader() {
// #ifdef MP-WEIXIN || MP
try {
const menuButton = uni.getMenuButtonBoundingClientRect();
const systemInfo = uni.getSystemInfoSync();
const statusBarHeight = systemInfo.statusBarHeight || 0;
// #ifdef MP-WEIXIN || MP
const menuButton = uni.getMenuButtonBoundingClientRect();
if (menuButton && menuButton.top && menuButton.top > 0) {
const menuButtonHeight = menuButton.height || 32;
const menuButtonTop = menuButton.top;
@@ -247,11 +246,23 @@ export default {
display: 'flex',
alignItems: 'center'
};
return;
}
// #endif
// APP-PLUS 或 H5 或 无胶囊环境:获取系统状态栏高度安全边距
this.mpWarpStyle = {
paddingTop: `${statusBarHeight}px`
};
this.mpHeaderStyle = {
height: '88rpx',
display: 'flex',
alignItems: 'center'
};
} catch (e) {
console.error("initMPHeader error:", e);
}
// #endif
},
goBack() {
uni.navigateBack({
@@ -404,11 +415,12 @@ export default {
<style lang="scss" scoped>
.apply-refund-container {
min-height: 100vh;
height: 100vh;
background-color: #F6F7F9;
display: flex;
flex-direction: column;
box-sizing: border-box;
overflow: hidden;
/* 顶部固定导航栏包装器 */
.navbar-sticky-wrapper {
@@ -430,26 +442,22 @@ export default {
position: relative;
box-sizing: border-box;
.back_btn,
.nav-left {
width: 60rpx;
height: 100%;
display: flex;
align-items: center;
justify-content: flex-start;
flex-shrink: 0;
.back-btn-box {
width: 44rpx;
height: 44rpx;
border: 1rpx dashed #C8C9CC;
border-radius: 6rpx;
display: flex;
align-items: center;
justify-content: center;
.back-arrow {
font-size: 36rpx;
color: #333333;
line-height: 1;
margin-top: -4rpx;
}
height: 100%;
margin-right: 20rpx;
flex-shrink: 0;
}
}
@@ -468,8 +476,8 @@ export default {
/* 主滚动区域 */
.content-scroll {
flex: 1;
height: 0;
height: 100%;
min-height: 0;
}
.main-content {
@@ -182,9 +182,7 @@ export default {
}
},
onLoad(options) {
// #ifdef MP-WEIXIN || MP
this.initMPHeader();
// #endif
let afterId = options ? (options.afterId || options.id) : null;
@@ -224,10 +222,12 @@ export default {
}
},
initMPHeader() {
// #ifdef MP-WEIXIN || MP
try {
const menuButton = uni.getMenuButtonBoundingClientRect();
const systemInfo = uni.getSystemInfoSync();
const statusBarHeight = systemInfo.statusBarHeight || 0;
// #ifdef MP-WEIXIN || MP
const menuButton = uni.getMenuButtonBoundingClientRect();
if (menuButton && menuButton.top && menuButton.top > 0) {
const menuButtonHeight = menuButton.height || 32;
const menuButtonTop = menuButton.top;
@@ -244,11 +244,23 @@ export default {
display: 'flex',
alignItems: 'center'
};
return;
}
// #endif
// APP-PLUS 或 H5 或 无胶囊环境
this.mpWarpStyle = {
paddingTop: `${statusBarHeight}px`
};
this.mpHeaderStyle = {
height: '88rpx',
display: 'flex',
alignItems: 'center'
};
} catch (e) {
console.error("initMPHeader error:", e);
}
// #endif
},
goBack() {
uni.navigateBack({
@@ -389,7 +401,8 @@ export default {
/* 主滚动区域 */
.content-scroll {
flex: 1;
height: 0;
height: 100%;
min-height: 0;
}
.main-content {
@@ -1356,9 +1356,9 @@ export default {
.order_submit_warp {
background-color: $app-bj;
height: calc(100% - 200rpx - env(safe-area-inset-bottom));
padding: 20rpx;
overflow-y: auto;
min-height: 100vh;
padding: 20rpx 20rpx calc(180rpx + env(safe-area-inset-bottom)) 20rpx;
box-sizing: border-box;
}
.order_submit_header_warp {
@@ -1547,26 +1547,33 @@ export default {
.order_pay_but {
position: fixed;
bottom: 0;
height: 144rpx;
left: 0;
width: 100%;
box-sizing: border-box;
padding: 20rpx 32rpx calc(20rpx + env(safe-area-inset-bottom)) 32rpx;
background: #ffffff;
display: flex;
justify-content: space-between;
width: calc(100% - 34rpx);
padding-top: 20rpx;
align-items: center;
z-index: 99;
._but {
padding: 20rpx 72rpx;
text-align: center;
background: $app-bt-bj;
border-radius: 16rpx 16rpx 16rpx 16rpx;
border-radius: 16rpx;
color: #fff;
height: 46rpx;
display: flex;
align-items: center;
justify-content: center;
}
.price_ {
font-weight: bold;
font-size: 36rpx;
color: $app-bt-bj;
display: flex;
align-items: baseline;
}
}
</style>
@@ -1289,9 +1289,9 @@ export default {
.order_submit_warp {
background-color: $app-bj;
height: calc(100% - 200rpx - env(safe-area-inset-bottom));
padding: 20rpx;
overflow-y: auto;
min-height: 100vh;
padding: 20rpx 20rpx calc(180rpx + env(safe-area-inset-bottom)) 20rpx;
box-sizing: border-box;
}
.order_submit_header_warp {
@@ -1480,26 +1480,33 @@ export default {
.order_pay_but {
position: fixed;
bottom: 0;
height: 144rpx;
left: 0;
width: 100%;
box-sizing: border-box;
padding: 20rpx 32rpx calc(20rpx + env(safe-area-inset-bottom)) 32rpx;
background: #ffffff;
display: flex;
justify-content: space-between;
width: calc(100% - 34rpx);
padding-top: 20rpx;
align-items: center;
z-index: 99;
._but {
padding: 20rpx 72rpx;
text-align: center;
background: $app-bt-bj;
border-radius: 16rpx 16rpx 16rpx 16rpx;
border-radius: 16rpx;
color: #fff;
height: 46rpx;
display: flex;
align-items: center;
justify-content: center;
}
.price_ {
font-weight: bold;
font-size: 36rpx;
color: $app-bt-bj;
display: flex;
align-items: baseline;
}
}
</style>
+1 -1
View File
@@ -50,7 +50,7 @@
<!-- 4. 猜你喜欢部分 -->
<view class="recommend-container">
<view class="recommend-header">
<text class="section-title">猜你喜欢</text>
<text class="section-title">热门商品</text>
</view>
<view class="recommend-content">
<choiceness :isTitle="false" />
+68 -25
View File
@@ -1,15 +1,17 @@
<template>
<view class="sort_warp" :class="platformType ? '' : 'iosplatformType'">
<!-- #ifndef MP-WEIXIN -->
<TopSafe bgColor="#F2EBFF"></TopSafe>
<TopSafe v-if="!isMP" bgColor="#F2EBFF"></TopSafe>
<!-- #endif -->
<!-- 顶部固定区域:搜索 + 分类区域 -->
<view class="top_fixed_header" :class="{ is_expanded: showAllCategories }" :style="mpHeaderStyle">
<!-- 搜索框 -->
<view class="search_bar" @click="jumpSearch">
<u-icon name="search" size="18" color="#999"></u-icon>
<text class="search_placeholder">搜索</text>
<view class="top_fixed_header" :class="{ is_expanded: showAllCategories }">
<!-- 搜索框容器 -->
<view class="search_bar_container" :style="mpHeaderStyle">
<view class="search_bar" :style="mpSearchStyle" @click="jumpSearch">
<u-icon name="search" size="18" color="#999"></u-icon>
<text class="search_placeholder">搜索</text>
</view>
</view>
<!-- 1. 未展开时:顶部分类横向滚动条 -->
@@ -171,6 +173,9 @@ export default {
data() {
return {
platformType: true,
isMP: false,
mpHeaderStyle: {},
mpSearchStyle: {},
categoryList: [], // 一级分类列表 (parentId = 0)
currentCategoryIndex: 0, // 当前选中的一级分类索引
subCategoryList: [], // 二级分类列表 (parentId = 一级ID)
@@ -179,7 +184,6 @@ export default {
showAllCategories: false,
sortBy: 'relevance', // 'relevance' | 'sales' | 'price'
sortOrder: 'asc', // 'asc' | 'desc'
capsuleTop: 0,
defaultIcon: 'https://static.tbmall.xin/static/new-home/xinren.png',
defaultProductImg: 'https://static.tbmall.xin/static/new-home/nangua.png',
isFromSortShop: false,
@@ -191,15 +195,6 @@ export default {
};
},
computed: {
mpHeaderStyle() {
/*#ifdef MP-WEIXIN*/
if (this.capsuleTop) {
return { paddingTop: this.capsuleTop + 'px' };
}
return { paddingTop: '80rpx' };
/*#endif*/
return {};
},
currentCategory() {
return this.categoryList[this.currentCategoryIndex] || null;
},
@@ -207,6 +202,12 @@ export default {
return this.subCategoryList[this.currentSubCategoryIndex] || null;
}
},
onLoad() {
// #ifdef MP-WEIXIN || MP
this.isMP = true;
this.initMPHeader();
// #endif
},
onShow() {
/*#ifdef APP-PLUS*/
uni.hideTabBar({ animation: false });
@@ -214,14 +215,10 @@ export default {
this.platformType = appUpdate == "android" ? "ANDROID" : "IOS";
/*#endif*/
/*#ifdef MP-WEIXIN*/
try {
const menu = uni.getMenuButtonBoundingClientRect();
if (menu && menu.bottom) {
this.capsuleTop = menu.bottom + 6;
}
} catch (e) { }
/*#endif*/
// #ifdef MP-WEIXIN || MP
this.isMP = true;
this.initMPHeader();
// #endif
const isBackFromSortShop = this.isFromSortShop;
this.isFromSortShop = false;
@@ -229,6 +226,42 @@ export default {
this.fetchCategories(isBackFromSortShop);
},
methods: {
initMPHeader() {
// #ifdef MP-WEIXIN || MP
try {
const menuButton = uni.getMenuButtonBoundingClientRect();
const systemInfo = uni.getSystemInfoSync();
if (menuButton && menuButton.top && menuButton.top > 0) {
const menuButtonHeight = menuButton.height || 32;
const menuButtonTop = menuButton.top;
const menuButtonLeft = menuButton.left;
const windowWidth = systemInfo.windowWidth;
const rightPadding = windowWidth - menuButtonLeft + 12;
this.mpHeaderStyle = {
paddingTop: `${menuButtonTop}px`,
paddingRight: `${rightPadding}px`,
paddingLeft: '12px',
paddingBottom: '8px',
height: `${menuButtonTop + menuButtonHeight + 8}px`,
boxSizing: 'border-box',
display: 'flex',
alignItems: 'center'
};
this.mpSearchStyle = {
height: `${menuButtonHeight}px`,
borderRadius: `${menuButtonHeight / 2}px`,
boxSizing: 'border-box'
};
}
} catch (e) {
console.error("initMPHeader error:", e);
}
// #endif
},
getSellingPointTags(sellingPoint) {
if (!sellingPoint || typeof sellingPoint !== 'string') return [];
return sellingPoint
@@ -492,15 +525,25 @@ page {
}
}
/* 搜索框容器 */
.search_bar_container {
width: 100%;
padding: 16rpx 24rpx 12rpx;
box-sizing: border-box;
display: flex;
align-items: center;
}
/* 搜索框 */
.search_bar {
margin: 16rpx 24rpx 12rpx;
width: 100%;
height: 72rpx;
background-color: #ffffff;
border-radius: 36rpx;
padding: 0 28rpx;
display: flex;
align-items: center;
box-sizing: border-box;
.search_placeholder {
font-size: 28rpx;
+51 -9
View File
@@ -1,9 +1,9 @@
<template>
<view class="content-two">
<view class="top-header-container">
<TopSafe></TopSafe>
<view class="head-view">
<view class="head-search" @click="onJumpSearch">
<TopSafe v-if="!isMP"></TopSafe>
<view class="head-view" :style="mpHeaderStyle">
<view class="head-search" :style="mpSearchStyle" @click="onJumpSearch">
<u-icon size="24" name="search" color="#999"></u-icon>
<text class="text-28 text-fu" style="margin-left: 12rpx">搜索</text>
</view>
@@ -82,8 +82,8 @@ export default {
// #endif
},
mescrollTop() {
// #ifdef MP-WEIXIN
return '400rpx';
// #ifdef MP-WEIXIN || MP
return this.mpMescrollTop || '360rpx';
// #endif
// #ifdef H5
return '260rpx';
@@ -104,6 +104,10 @@ export default {
},
data() {
return {
isMP: false,
mpHeaderStyle: {},
mpSearchStyle: {},
mpMescrollTop: '',
itemType: 1, // 1: 图2样式, 2: 图1样式
dataList: [],
tabArr: [
@@ -157,6 +161,10 @@ export default {
};
},
onLoad(options) {
// #ifdef MP-WEIXIN || MP
this.isMP = true;
this.initMPHeader();
// #endif
console.log("+++++", options)
if (options.index) {
this.curTab = options.index;
@@ -185,6 +193,44 @@ export default {
}
},
methods: {
initMPHeader() {
// #ifdef MP-WEIXIN || MP
try {
const menuButton = uni.getMenuButtonBoundingClientRect();
const systemInfo = uni.getSystemInfoSync();
if (menuButton && menuButton.top && menuButton.top > 0) {
const menuButtonHeight = menuButton.height || 32;
const menuButtonTop = menuButton.top;
const menuButtonLeft = menuButton.left;
const windowWidth = systemInfo.windowWidth;
const rightPadding = windowWidth - menuButtonLeft + 12;
this.mpHeaderStyle = {
paddingTop: `${menuButtonTop}px`,
paddingRight: `${rightPadding}px`,
paddingLeft: '16px',
paddingBottom: '8px',
height: `${menuButtonTop + menuButtonHeight + 8}px`,
boxSizing: 'border-box',
display: 'flex',
alignItems: 'center'
};
this.mpSearchStyle = {
height: `${menuButtonHeight}px`,
borderRadius: `${menuButtonHeight / 2}px`,
boxSizing: 'border-box'
};
const totalHeaderPx = menuButtonTop + menuButtonHeight + 8 + 80;
this.mpMescrollTop = `${totalHeaderPx}px`;
}
} catch (e) {
console.error("initMPHeader error:", e);
}
// #endif
},
getTabColor(item) {
if (!item) return '#7A35F6';
if (item.color) return item.color;
@@ -317,10 +363,6 @@ export default {
width: 100%;
z-index: 99;
background-color: #fff;
/* #ifdef MP-WEIXIN */
padding-top: 40rpx;
/* #endif */
}
.head-view {