Files
xk-doctor-wx/subPackages/sub_salesperson/components/business-page-layout.vue
2026-06-18 15:05:14 +08:00

84 lines
1.8 KiB
Vue

<template>
<view class="clinic-layout safe-area-inset-bottom">
<u-navbar
:title="title"
:is-back="showBack"
title-size="34"
title-color="#fff"
:background="{ background: 'linear-gradient(90deg, #00BFA6 0%, #6ACDBB 93%)' }"
/>
<view class="clinic-body" :style="bodyStyle">
<slot />
</view>
<image-gallery-picker />
<u-tabbar
v-if="showTabbar"
:value="tabIndex"
:list="tabList"
active-color="#6ACDBB"
@change="onTabChange"
/>
</view>
</template>
<script>
import businessMixin from '@/subPackages/sub_salesperson/common/businessMixin.js';
import ImageGalleryPicker from '@/subPackages/sub_salesperson/components/ImageGalleryPicker.vue';
export default {
name: 'BusinessPageLayout',
mixins: [businessMixin],
components: { ImageGalleryPicker },
props: {
title: { type: String, default: '' },
showBack: { type: Boolean, default: false },
showTabbar: { type: Boolean, default: false },
tabIndex: { type: Number, default: 0 },
},
data() {
return {
statusBarHeight: 0,
navbarHeight: 0,
};
},
computed: {
tabList() {
return this.bizCtx.tabList || [];
},
bodyStyle() {
const top = this.statusBarHeight + this.navbarHeight;
let bottom = '32rpx';
if (this.showTabbar) {
bottom = 'calc(100rpx + env(safe-area-inset-bottom))';
}
return {
paddingTop: top + 'px',
paddingBottom: bottom,
minHeight: '100vh',
boxSizing: 'border-box',
};
},
},
created() {
this.statusBarHeight = this.$statusBarHeight || 0;
this.navbarHeight = this.$navbarHeight || 44;
},
methods: {
onTabChange(index) {
if (index === this.tabIndex) return;
const target = this.tabList[index];
if (target && target.pagePath) {
uni.reLaunch({ url: target.pagePath });
}
},
},
};
</script>
<style lang="scss" scoped>
.clinic-layout {
min-height: 100vh;
background: #f9fafb;
}
</style>