index.vue 1.53 KB
<!--
 * @Author: hookehuyr hookehuyr@gmail.com
 * @Date: 2022-05-31 18:32:38
 * @LastEditors: hookehuyr hookehuyr@gmail.com
 * @LastEditTime: 2022-05-31 19:01:49
 * @FilePath: /tswj/src/components/DonateBar/index.vue
 * @Description: 爱心助力底部固定栏
-->
<template>
  <div class="fix-btn">
    <div class="text"><slot /></div>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'

import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle } from '@/utils/generatePackage.js'
//import { } from '@/utils/generateModules.js'
//import { } from '@/utils/generateIcons.js'
//import { } from '@/composables'
const $route = useRoute();
const $router = useRouter();
useTitle($route.meta.title);

const props = defineProps({
  donateType: {
    type: String,
    default: (value) => value,
    validator: value => {
      return ['C', 'V', 'K'].includes(value);  // type: C | V | K, 儿童|访客|幼儿园
    }
  }
})

// 捐钱-游客 type: V
// 捐钱-幼儿园 type: K
console.warn(props.donateType);

</script>

<style lang="less" scoped>
.fix-btn {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: white;
  box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.07);
  .text {
    text-align: center;
    padding: 0.7rem;
    margin: 0.8rem;
    font-size: 1rem;
    font-weight: bold;
    border-radius: 24px;
    // border: 1px solid F7F7F7;
    color: #713610;
    background-color: @base-color;
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.06);
  }
}
</style>