40 lines
913 B
Vue
40 lines
913 B
Vue
<!-- 页面描述 -->
|
|
<template>
|
|
<view :style="{ bottom: bottomSafeAreaHeight() }" class="jy-bottom-btn">
|
|
<button class="bottom-btn" @click="emit('click')">
|
|
<slot></slot>
|
|
</button>
|
|
</view>
|
|
<!-- 幽灵盒子 -->
|
|
<view class="jy-bottom-btn-ghost"></view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, defineEmits } from 'vue'
|
|
import { bottomSafeAreaHeight } from '@/components/public/Mixins.js'
|
|
const emit = defineEmits(['click'])
|
|
</script>
|
|
<style scoped lang="scss">
|
|
.jy-bottom-btn-ghost {
|
|
height: 200rpx;
|
|
}
|
|
|
|
.jy-bottom-btn {
|
|
// 定位
|
|
bottom: 0;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background-color: #ffffff;
|
|
position: fixed;
|
|
width: 100%;
|
|
}
|
|
|
|
.bottom-btn {
|
|
background: linear-gradient(270deg, #FF9B27 20%, #FDC123 103%);
|
|
font-size: 32rpx;
|
|
color: #FFFFFF;
|
|
width: 100%;
|
|
margin: 20rpx;
|
|
}
|
|
</style> |