xyy-m/src/components/TravelProjectDetail/BottomBar.vue

<template>
  <div
    class="fixed bottom-0 px-20 left-0 right-0 h-70 z-50 bg-white shadow-[0px_2px_14px_1px_rgba(0,0,0,0.12)] flex justify-center items-center"
  >
    <span class="text-black-6">总价：</span>
    <span class="text-[#FF2222] text-3xl font-semibold">¥{{ totalPrice }}</span>
    <van-button
      @click="$emit('onOk')"
      class="flex-1"
      :loading="loading"
      style="
        background-color: #fd9a00;
        color: #fff;
        font-weight: bold;
        margin-left: 30px;
      "
      >立即预定</van-button
    >
  </div>
</template>

<script setup>
defineProps({
  totalPrice: {
    type: String,
    default: "",
  },
  loading: Boolean,
});
defineEmits(["onOk"]);
</script>

<style lang="scss" scoped></style>