70 lines
1.3 KiB
Vue
70 lines
1.3 KiB
Vue
<template>
|
|
<view class="layout">
|
|
<custom-nav-bar></custom-nav-bar>
|
|
<view class="header">
|
|
<slot name="header"></slot>
|
|
</view>
|
|
<view class="main">
|
|
<slot name="main"></slot>
|
|
</view>
|
|
<view class="footer">
|
|
<footer-loayot></footer-loayot>
|
|
</view>
|
|
<view class="float">
|
|
<!-- #ifdef MP -->
|
|
<button class="item" open-type="contact">
|
|
<uni-icons type="phone-filled" size="26" color="#888"></uni-icons>
|
|
</button>
|
|
<!-- #endif -->
|
|
<!-- #ifndef MP -->
|
|
<button class="item" @click="clickContact">
|
|
<uni-icons type="phone-filled" size="26" color="#888"></uni-icons>
|
|
</button>
|
|
<!-- #endif -->
|
|
<!-- <view @click="onRefresh">
|
|
|
|
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.layout{
|
|
width: 100vw;
|
|
background-color: #222;
|
|
.header{
|
|
min-height: 100rpx;
|
|
}
|
|
.main{
|
|
min-height: 200rpx;
|
|
}
|
|
.footer{
|
|
min-height: 120rpx;
|
|
background: orange;
|
|
}
|
|
.float {
|
|
position: fixed;
|
|
right: 30rpx;
|
|
bottom: 80rpx;
|
|
padding-bottom: env(safe-area-inset-bottom);
|
|
|
|
.item {
|
|
width: 90rpx;
|
|
height: 90rpx;
|
|
background: rgba(255, 255, 255, 0.9);
|
|
border-radius: 50%;
|
|
margin-bottom: 20rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border: 1px solid #eee;
|
|
}
|
|
|
|
}
|
|
}
|
|
</style> |