feat: 兼容微信小程序 h5
This commit is contained in:
parent
04fbcd6449
commit
35735c1d80
|
@ -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;
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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": "我的"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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'"
|
||||||
|
|
|
@ -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
|
Loading…
Reference in New Issue