feat: 兼容微信小程序 h5

This commit is contained in:
admin 2024-09-14 14:16:32 +08:00
parent 04fbcd6449
commit 35735c1d80
6 changed files with 56 additions and 16 deletions

View File

@ -16,7 +16,7 @@
}" }"
class="bottom" class="bottom"
> >
<Tabbar :select="select"/> <Tabbar :select="select" />
</view> </view>
</template> </template>
@ -37,6 +37,7 @@ const navbarRect = reactive({
layoutHeight: 0, layoutHeight: 0,
}); });
// #ifndef H5
const menuButtonInfo = uni.getMenuButtonBoundingClientRect(); const menuButtonInfo = uni.getMenuButtonBoundingClientRect();
navbarRect.height = menuButtonInfo.height; navbarRect.height = menuButtonInfo.height;
navbarRect.top = menuButtonInfo.top; navbarRect.top = menuButtonInfo.top;
@ -53,6 +54,7 @@ uni.getSystemInfo({
50; 50;
}, },
}); });
// #endif
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -65,7 +67,7 @@ uni.getSystemInfo({
background-color: bisque; background-color: bisque;
} }
.layout { .layout {
background-color: #FFF; background-color: #fff;
} }
.bottom { .bottom {
position: fixed; position: fixed;

View File

@ -1,17 +1,22 @@
<template> <template>
<!-- 工作台底部菜单 --> <!-- 工作台底部菜单 -->
<view class="custom-tabbar"> <view class="custom-tabbar">
<view v-for="item in state.list" :key="item.text" @click="handleClick(item)"> <view
v-for="item in state.list"
:key="item.text"
@click="handleClick(item)"
>
<view> <view>
<image <image
:src="`${url}/static/img/tabbar/${select === item.text ? item.activeIcon : item.icon}`" :src="`${url}/static/img/tabbar/${
class="custom-img" select === item.text ? item.activeIcon : item.icon
></image> }`"
class="custom-img"
></image>
</view> </view>
<view :class="{'active': select === item.text}"> <view :class="{ active: select === item.text }">
{{ item.text }} {{ item.text }}
</view> </view>
</view> </view>
<!-- <view v-for="item in state.list" :key="item.text"> <!-- <view v-for="item in state.list" :key="item.text">
<image <image
@ -79,7 +84,7 @@ onLaunch(() => {
background: #ffffff; background: #ffffff;
// box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 56, 93, 0.12); // box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 56, 93, 0.12);
border-radius: 13rpx 13rpx 0rpx 0rpx; border-radius: 13rpx 13rpx 0rpx 0rpx;
border-top: 1px solid rgba(0,0,0,0.05); border-top: 1px solid rgba(0, 0, 0, 0.05);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-around; justify-content: space-around;

View File

@ -15,14 +15,14 @@
{ {
"path": "pagesHome/index", "path": "pagesHome/index",
"style": { "style": {
"navigationStyle": "custom", // // "navigationStyle": "custom", //
"navigationBarTitleText": "首页" "navigationBarTitleText": "首页"
} }
}, },
{ {
"path": "pagesHome/profile", "path": "pagesHome/profile",
"style": { "style": {
"navigationStyle": "custom", // // "navigationStyle": "custom", //
"navigationBarTitleText": "我的" "navigationBarTitleText": "我的"
} }
} }

View File

@ -6,7 +6,7 @@
<image :src="`${url}/static/img/profile/user.png`" class="user"></image> <image :src="`${url}/static/img/profile/user.png`" class="user"></image>
<view> <view>
<view> <view>
<text class="name">{{ '抖音用户' || "-" }}</text> <text class="name">{{ '用户' || "-" }}</text>
</view> </view>
<view> <view>
<text class="company">{{ '-' || "-" }}</text> <text class="company">{{ '-' || "-" }}</text>
@ -65,8 +65,10 @@ const hanldeClick = (item: any) => {
const openDoc = (item: string) => { const openDoc = (item: string) => {
// //
const isWX = uni.getSystemInfoSync().uniPlatform === 'mp-weixin'
console.log(`${url}/static/${isWX && (item === '在生万有隐私政策') ? 'weixin/' : ''}${item}.docx`)
uni.downloadFile({ uni.downloadFile({
url: `${url}/static/${item}.docx`, url: `${url}/static/${isWX && (item === '在生万有隐私政策') ? 'weixin/' : ''}${item}.docx`,
success: function (res) { success: function (res) {
setTimeout( setTimeout(
() => () =>
@ -92,6 +94,7 @@ const openDoc = (item: string) => {
}, },
}); });
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@ -4,10 +4,8 @@
:padding="'0px'" :padding="'0px'"
:margin="'20px'" :margin="'20px'"
:border="false" :border="false"
:cover="'cover'"
> >
<image <image
slot="cover"
style="height: 680rpx" style="height: 680rpx"
:src="`${url}/static/img/vehicle/flow.png`" :src="`${url}/static/img/vehicle/flow.png`"
mode="'aspectFit'" mode="'aspectFit'"

View File

@ -72,3 +72,35 @@ body {
.u-empty { .u-empty {
margin-bottom: 10px !important; margin-bottom: 10px !important;
} }
.uni-tabbar {
bottom: -10px !important;
}
.custom-tabbar {
background: #ffffff;
// box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 56, 93, 0.12);
border-radius: 13rpx 13rpx 0rpx 0rpx;
border-top: 1px solid rgba(0, 0, 0, 0.05);
display: flex;
align-items: center;
justify-content: space-around;
font-weight: 500;
font-size: 30rpx;
color: #999;
text-align: center;
padding-top: 20rpx;
.custom-img {
width: 48rpx;
height: 48rpx;
}
.active {
color: $u-primary;
}
}
// #ifdef H5
.bottom {
padding-bottom: 30rpx !important;
}
// #endif