1优化顶部返回按钮定位

master
sws 2023-10-09 15:24:26 +08:00
parent d5cb2f2448
commit b1756eb4d6
3 changed files with 100 additions and 59 deletions

View File

@ -1,14 +1,14 @@
<template>
<view class="signin-container">
<view v-if="(data || null) != null" class="pr">
<view class="pa z-i left-0 top-0 right-0" :style="'padding-top:' + (status_bar_height > 0 ? status_bar_height + 5 : 10) + 'px;'">
<!-- 返回 -->
<!-- #ifdef MP-WEIXIN || MP-QQ || MP-KUAISHOU || H5 || APP -->
<view v-if="is_realstore_top_nav_back == 1" class="nav-back padding-horizontal-main padding-top-sm round va-m cr-white">
<iconfont name="icon-tongyong-fanhui" size="40rpx" @tap="top_nav_left_back_event"></iconfont>
</view>
<!-- #endif -->
<view class="pf z-i left-0 top-0 right-0 pa-w" :style="'padding-top:' + (status_bar_height > 0 ? status_bar_height + 5 : 10) + 'px;background-color:rgba(255,255,255,' + opacity + ')'">
<!-- 返回 -->
<!-- #ifdef MP-WEIXIN || MP-QQ || MP-KUAISHOU || H5 || APP -->
<view v-if="is_realstore_top_nav_back == 1" class="nav-back padding-horizontal-main padding-vertical-sm round va-m" :class="opacity > 0.3 ? 'cr-black' : 'cr-white'">
<iconfont name="icon-tongyong-fanhui" size="40rpx" @tap="top_nav_left_back_event"></iconfont>
</view>
<!-- #endif -->
</view>
<view v-if="(data || null) != null" class="pr">
<image :src="signin_static_url + 'signin-bg.png'" mode="widthFix" class="signin-bg"></image>
<view class="signin-opration-group pa right-0 flex-col cr-white">
<view v-if="(data_base.is_share || 0) == 1" class="share oh flex-row">
@ -142,6 +142,8 @@
status_bar_height: parseInt(app.globalData.get_system_info('statusBarHeight', 0)),
//
is_realstore_top_nav_back: app.globalData.data.is_realstore_top_nav_back || 0,
//
opacity: 0,
//
home_page_url: app.globalData.data.tabbar_pages[0],
data_bottom_line_status: false,
@ -437,6 +439,7 @@
this.$refs.share.init();
}
},
//
top_nav_left_back_event(e) {
var pages = getCurrentPages();
@ -448,6 +451,14 @@
uni.navigateBack();
}
},
//
onPageScroll(e) {
var top = e.scrollTop > 47 ? 1 : e.scrollTop / 47;
this.setData({
opacity: top,
});
},
},
};
</script>

View File

@ -1,17 +1,18 @@
<template>
<view>
<scroll-view :scroll-y="true" class="scroll-box scroll-wallet" @scrolltolower="scroll_lower" lower-threshold="60">
<view v-if="(data_base || null) != null" :style="'padding-top:' + (status_bar_height > 0 ? status_bar_height + 5 : 10) + 'px;'">
<scroll-view :scroll-y="true" class="scroll-box scroll-wallet" @scrolltolower="scroll_lower" lower-threshold="60" @scroll="scroll_event">
<view class="pf z-i left-0 top-0 right-0 pa-w" :style="'padding-top:' + (status_bar_height > 0 ? status_bar_height + 5 : 10) + 'px;background-color:rgba(255,255,255,' + opacity + ')'">
<!-- 返回 -->
<!-- #ifdef MP-WEIXIN || MP-QQ || MP-KUAISHOU || H5 || APP -->
<view v-if="is_realstore_top_nav_back == 1" class="nav-back padding-horizontal-main padding-vertical-sm round va-m" :class="opacity > 0.3 ? 'cr-black' : 'cr-white'">
<iconfont name="icon-tongyong-fanhui" size="40rpx" @tap="top_nav_left_back_event"></iconfont>
</view>
<!-- #endif -->
</view>
<view v-if="(data_base || null) != null" class="padding-top-xxxl">
<!-- 头部背景 -->
<image :src="wallet_static_url + 'title-bg.png'" mode="widthFix" class="pa top-0 bg-img wh-auto wallet-bg" />
<view class="pr z-i">
<!-- 返回 -->
<!-- #ifdef MP-WEIXIN || MP-QQ || MP-KUAISHOU || H5 || APP -->
<view v-if="is_realstore_top_nav_back == 1" class="nav-back padding-horizontal-main padding-top-sm round va-m cr-white">
<iconfont name="icon-tongyong-fanhui" size="40rpx" @tap="top_nav_left_back_event"></iconfont>
</view>
<!-- #endif -->
<view class="pr padding-top-main">
<!-- 钱包信息 -->
<view class="padding-top-xxxl oh margin-top-main">
<view class="wallet-head padding-horizontal-xxxl">
@ -105,6 +106,8 @@
status_bar_height: parseInt(app.globalData.get_system_info('statusBarHeight', 0)),
//
is_realstore_top_nav_back: app.globalData.data.is_realstore_top_nav_back || 0,
//
opacity: 0,
theme_color: app.globalData.get_theme_color(),
data_list_loding_status: 1,
data_list_loding_msg: '',
@ -245,12 +248,14 @@
});
app.globalData.updateQueryStringParameter([{ key: 'type', value: e.currentTarget.dataset.index }]);
},
//
scroll_lower(e) {
this.setData({
scroll_lower_bool: !this.scroll_lower_bool,
});
},
//
top_nav_left_back_event(e) {
var pages = getCurrentPages();
@ -262,10 +267,19 @@
uni.navigateBack();
}
},
//
pay_success_event() {
this.get_data();
},
//
scroll_event(e) {
var top = e.detail.scrollTop > 47 ? 1 : e.detail.scrollTop / 47;
this.setData({
opacity: top,
});
},
},
};
</script>

View File

@ -1,49 +1,55 @@
<template>
<view class="pr" :style="'padding-top:' + (status_bar_height > 0 ? status_bar_height + 5 : 10) + 'px;'">
<view class="pa top-0 left-0 right-0 nav-top">
<image mode="widthFix" :src="answers_static_url + 'nav-top.png'" class="wh-auto"></image>
<view>
<view class="pf z-i left-0 top-0 right-0 pa-w" :style="'padding-top:' + (status_bar_height > 0 ? status_bar_height + 5 : 10) + 'px;background-color:rgba(255,255,255,' + opacity + ')'">
<!-- 返回 -->
<!-- #ifdef MP-WEIXIN || MP-QQ || MP-KUAISHOU || H5 || APP -->
<view v-if="is_realstore_top_nav_back == 1" class="nav-back padding-horizontal-main padding-vertical-sm round va-m" :class="opacity > 0.3 ? 'cr-black' : 'cr-white'">
<iconfont name="icon-tongyong-fanhui" size="40rpx" @tap="top_nav_left_back_event"></iconfont>
</view>
<!-- #endif -->
</view>
<!-- 返回 -->
<!-- #ifdef MP-WEIXIN || MP-QQ || MP-KUAISHOU || H5 || APP -->
<view v-if="is_realstore_top_nav_back == 1" class="nav-back padding-left-main round va-m cr-white pr z-i">
<iconfont name="icon-tongyong-fanhui" size="40rpx" @tap="top_nav_left_back_event"></iconfont>
</view>
<!-- #endif -->
<view v-if="Object.keys(detail_data.length !== 0)" class="padding-main pr z-i margin-top-main">
<view class="bg-white border-radius-main padding-main text-size">
<view class="fw-b text-size-lg spacing-mb">提问详情</view>
<view v-if="detail_data.user && detail_data.user.user_name_view" class="spacing-mb">
<view class="cr-grey-9">联系人</view>
<view class="margin-top-xs">{{ detail_data.user.user_name_view }}</view>
</view>
<view v-if="detail_data.tel" class="spacing-mb">
<view class="cr-grey-9">联系电话</view>
<view class="margin-top-xs">{{ detail_data.tel }}</view>
</view>
<view v-if="detail_data.title" class="spacing-mb">
<view class="cr-grey-9">标题</view>
<view class="margin-top-xs">{{ detail_data.title }}</view>
</view>
<view v-if="detail_data.content" class="spacing-mb">
<view class="cr-grey-9">内容</view>
<view class="margin-top-xs">{{ detail_data.content }}</view>
</view>
<view v-if="detail_data.reply" class="spacing-mb">
<view class="cr-grey-9">回复内容</view>
<view class="margin-top-xs">{{ detail_data.reply }}</view>
</view>
<view v-if="detail_data.reply_time_time" class="spacing-mb">
<view class="cr-grey-9">回复时间</view>
<view class="margin-top-xs">{{ detail_data.reply_time_time }}</view>
</view>
<view v-if="detail_data.add_time_time" class="spacing-mb">
<view class="cr-grey-9">创建时间</view>
<view class="margin-top-xs">{{ detail_data.add_time_time }}</view>
<view v-if="Object.keys(detail_data.length !== 0)" class="padding-top-xxxl">
<view class="pa top-0 left-0 right-0 nav-top pa-w">
<image mode="widthFix" :src="answers_static_url + 'nav-top.png'" class="wh-auto"></image>
</view>
<view class="padding-main pr margin-top-xxxl">
<view class="bg-white border-radius-main padding-main text-size">
<view class="fw-b text-size-lg spacing-mb">提问详情</view>
<view v-if="detail_data.user && detail_data.user.user_name_view" class="spacing-mb">
<view class="cr-grey-9">联系人</view>
<view class="margin-top-xs">{{ detail_data.user.user_name_view }}</view>
</view>
<view v-if="detail_data.tel" class="spacing-mb">
<view class="cr-grey-9">联系电话</view>
<view class="margin-top-xs">{{ detail_data.tel }}</view>
</view>
<view v-if="detail_data.title" class="spacing-mb">
<view class="cr-grey-9">标题</view>
<view class="margin-top-xs">{{ detail_data.title }}</view>
</view>
<view v-if="detail_data.content" class="spacing-mb">
<view class="cr-grey-9">内容</view>
<view class="margin-top-xs">{{ detail_data.content }}</view>
</view>
<view v-if="detail_data.reply" class="spacing-mb">
<view class="cr-grey-9">回复内容</view>
<view class="margin-top-xs">{{ detail_data.reply }}</view>
</view>
<view v-if="detail_data.reply_time_time" class="spacing-mb">
<view class="cr-grey-9">回复时间</view>
<view class="margin-top-xs">{{ detail_data.reply_time_time }}</view>
</view>
<view v-if="detail_data.add_time_time" class="spacing-mb">
<view class="cr-grey-9">创建时间</view>
<view class="margin-top-xs">{{ detail_data.add_time_time }}</view>
</view>
</view>
</view>
</view>
<!-- 提示信息 -->
<component-no-data :propStatus="data_list_loding_status"></component-no-data>
<view v-else>
<!-- 提示信息 -->
<component-no-data :propStatus="data_list_loding_status"></component-no-data>
</view>
</view>
</template>
<script>
@ -57,6 +63,8 @@
status_bar_height: parseInt(app.globalData.get_system_info('statusBarHeight', 0)),
//
is_realstore_top_nav_back: app.globalData.data.is_realstore_top_nav_back || 0,
//
opacity: 0,
detail_data: {},
data_list_loding_status: 1,
params: '',
@ -160,6 +168,14 @@
uni.navigateBack();
}
},
//
onPageScroll(e) {
var top = e.scrollTop > 47 ? 1 : e.scrollTop / 47;
this.setData({
opacity: top,
});
},
},
};
</script>