You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
76 lines
2.2 KiB
76 lines
2.2 KiB
<template>
|
|
<div>
|
|
<!-- 搜索框与表格部分 -->
|
|
<van-tabs
|
|
v-model:active="active"
|
|
shrink
|
|
line-width="60px"
|
|
color="#59B4FF"
|
|
title-active-color="#59B4FF"
|
|
>
|
|
<van-tab title="我的申请">
|
|
<div class="h-full bg-white px-4">
|
|
<div class="mt-4 flex flex-col h-96 overflow-hidden">
|
|
<div class="py-4 pb-0 text-gray-500 font-semibold">历史申请</div>
|
|
<Search class="px-4 pt-0" />
|
|
<HistoricalApplication class="px-4 mt-0" />
|
|
</div>
|
|
<!-- 底部提交按钮部分 -->
|
|
<div class="fixed w-11/12 box-border bottom-10 " @click="toApplication">
|
|
<van-button type="primary" block size="small">发起申请</van-button>
|
|
</div>
|
|
</div>
|
|
|
|
</van-tab>
|
|
|
|
<van-tab title="我的奖金">
|
|
<div class="mt-4 bg-white">
|
|
<div class="p-4 pb-0 text-gray-500 font-semibold">奖金领取记录</div>
|
|
<Search class="px-4 pt-0" />
|
|
<BonusCollection class="px-4 mt-0" />
|
|
</div>
|
|
<div class="mt-4 bg-white">
|
|
<div class="text-gray-500 font-semibold m-4 py-3 border-b">
|
|
待领取奖金
|
|
</div>
|
|
<div class="text-ms text-gray-400 pl-4">可领取:</div>
|
|
<div
|
|
class="w-full h-20 text-gray-400 font-semibold text-center leading-loose"
|
|
v-if="!isBonus"
|
|
>
|
|
暂无可领取的奖金
|
|
</div>
|
|
<div
|
|
class="w-full h-20 text-blue-500 font-semibold text-center leading-loose text-2xl"
|
|
v-if="isBonus"
|
|
>
|
|
500元
|
|
</div>
|
|
<div class="px-8">
|
|
<van-button type="primary" size="small" block :disabled="!isBonus"
|
|
>立即领取</van-button
|
|
>
|
|
</div>
|
|
</div>
|
|
</van-tab>
|
|
</van-tabs>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from 'vue';
|
|
import { useRouter } from 'vue-router';
|
|
|
|
const router = useRouter();
|
|
|
|
const active = ref(0);
|
|
const isBonus = ref(true);
|
|
|
|
function toApplication() {
|
|
const routeValue = router.currentRoute.value;
|
|
const query = routeValue.query;
|
|
router.push({ path: '/Initiate-application', query });
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped></style>
|
|
|