Showing
1 changed file
with
48 additions
and
0 deletions
src/components/bottom-button.vue
0 → 100644
| 1 | +<!-- | ||
| 2 | + * @Date: 2022-09-28 10:43:53 | ||
| 3 | + * @LastEditors: hookehuyr hookehuyr@gmail.com | ||
| 4 | + * @LastEditTime: 2022-09-28 11:07:39 | ||
| 5 | + * @FilePath: /swx/src/components/bottom-button.vue | ||
| 6 | + * @Description: 文件描述 | ||
| 7 | +--> | ||
| 8 | +<template> | ||
| 9 | + <view class="confirm-wrapper-page"> | ||
| 10 | + <view class="box"> | ||
| 11 | + <view @tap="onSubmit" class="button"><slot></slot></view> | ||
| 12 | + </view> | ||
| 13 | + </view> | ||
| 14 | +</template> | ||
| 15 | + | ||
| 16 | +<script setup> | ||
| 17 | +import { ref } from 'vue' | ||
| 18 | + | ||
| 19 | +const emit = defineEmits(['on-submit']) | ||
| 20 | + | ||
| 21 | +const onSubmit = () => { | ||
| 22 | + emit('on-submit', true) | ||
| 23 | +} | ||
| 24 | + | ||
| 25 | +</script> | ||
| 26 | + | ||
| 27 | +<style lang="less"> | ||
| 28 | +.confirm-wrapper-page { | ||
| 29 | + background-color: #FFFFFF; | ||
| 30 | + box-shadow: 0rem -0.17rem 0.67rem 0rem rgba(0,0,0,0.05); | ||
| 31 | + position: fixed; | ||
| 32 | + bottom: 0; | ||
| 33 | + width: 100%; | ||
| 34 | + .box { | ||
| 35 | + padding: 1rem 0; | ||
| 36 | + margin: 1rem; | ||
| 37 | + padding-bottom: 2rem; | ||
| 38 | + margin-top: 0; | ||
| 39 | + text-align: center; | ||
| 40 | + .button { | ||
| 41 | + color: #FFFFFF; | ||
| 42 | + background-color: #199A74; | ||
| 43 | + padding: 0.65rem 1rem; | ||
| 44 | + border-radius: 1.5rem; | ||
| 45 | + } | ||
| 46 | + } | ||
| 47 | +} | ||
| 48 | +</style> |
-
Please register or login to post a comment