feat: 完成对接
This commit is contained in:
@@ -0,0 +1,116 @@
|
||||
<route lang="json5">
|
||||
{
|
||||
style: {
|
||||
navigationBarTitleText: '我的邀请',
|
||||
navigationBarBackgroundColor: '#fff',
|
||||
navigationStyle: 'custom',
|
||||
},
|
||||
}
|
||||
</route>
|
||||
|
||||
<template>
|
||||
<view class="team-page">
|
||||
<NavBar>
|
||||
<template #right>
|
||||
<view @click="handleRule" class="text-14 text-#333">邀请奖励规则</view>
|
||||
</template>
|
||||
</NavBar>
|
||||
<view class="px-15 py-30 relative rounded-10 mt-50 w-345 mx-auto main-content">
|
||||
<image
|
||||
class="w-150 h-150 rounded-10 mt-15 mx-auto block absolute right-15 bottom-30"
|
||||
src="@/static/images/page-sub/team/team-main-hero.png"
|
||||
mode="aspectFit"
|
||||
/>
|
||||
<view class="flex flex-col">
|
||||
<view class="text-14 text-#6784C7">看看人数</view>
|
||||
<view class="text-35 font-bold text-#476FFF mt-10 leading-35">1234</view>
|
||||
</view>
|
||||
</view>
|
||||
<image
|
||||
class="w-201 h-46 rounded-10 mt-30 mx-auto block"
|
||||
src="@/static/images/page-sub/team/team-title.png"
|
||||
mode="aspectFill"
|
||||
/>
|
||||
<view class="flex overflow-auto mt-25 pr-15 pl-8">
|
||||
<view
|
||||
class="px-40 ml-8 py-10 flex-shrink-0 rounded-10 bg-white"
|
||||
v-for="(item, index) in levelList"
|
||||
:key="item.title"
|
||||
:class="{
|
||||
'btn-gradient': currentLevelIndex === index,
|
||||
}"
|
||||
@click="() => (currentLevelIndex = index)"
|
||||
>
|
||||
<image class="w-30 h-30 rounded-10 mx-auto block" :src="item.icon" mode="aspectFill" />
|
||||
<view class="text-14 mt-10 text-center">{{ item.title }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mt-25 bg-white rounded-10 w-345 mx-auto">
|
||||
<view class="flex p-15 items-center" v-for="item in 10" :key="item">
|
||||
<Avatar class="w-40 h-40" />
|
||||
<view class="flex-1 flex flex-col ml-15">
|
||||
<view class="text-14 text-#333">用户名</view>
|
||||
<view class="text-12 mt-10 text-#999">1234567890</view>
|
||||
<view class="text-12 mt-10 text-#999">2024-12-27 12:00:00</view>
|
||||
</view>
|
||||
<!-- <view class="bg-#71C78A80 text-white text-12 rounded-10 px-10 py-5">邀请成功</view> -->
|
||||
<view class="text-14 font-bold text-#FF5F5F">+20 股</view>
|
||||
</view>
|
||||
</view>
|
||||
<wd-action-sheet v-model="showRule" title="邀请奖励规则">
|
||||
<view class="text-16 text-#333 p-15">
|
||||
<view class="mb-10">1.每邀请一人可以获得1万投资金,2000数字人民币 1点认购点</view>
|
||||
<view class="mb-10">2.邀请满5人可以额外获得5万投资金。1万数字人民币 5点认购点</view>
|
||||
<view class="mb-10">3.邀请满10人可以额外获得10万投资金。2万数字人民币 10点认购点</view>
|
||||
<view class="mb-10">4.邀请满20人可以额外获得20万投资金。5万数字人民币 20点认购点</view>
|
||||
<view class="mb-10">5.邀请满50人可以额外获得50万投资金。10万数字人民币 50点认购点</view>
|
||||
</view>
|
||||
</wd-action-sheet>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Avatar from '@/components/Avatar.vue'
|
||||
import NavBar from '@/components/NavBar.vue'
|
||||
import Level1 from '@/static/images/page-sub/team/level-1.png'
|
||||
import Level2 from '@/static/images/page-sub/team/level-2.png'
|
||||
import Level3 from '@/static/images/page-sub/team/level-3.png'
|
||||
|
||||
const showRule = ref(false)
|
||||
|
||||
const handleRule = () => {
|
||||
showRule.value = true
|
||||
}
|
||||
const currentLevelIndex = ref(0)
|
||||
|
||||
const levelList = ref([
|
||||
{
|
||||
title: '一级用户',
|
||||
icon: Level1,
|
||||
},
|
||||
{
|
||||
title: '二级用户',
|
||||
icon: Level2,
|
||||
},
|
||||
{
|
||||
title: '三级用户',
|
||||
icon: Level3,
|
||||
},
|
||||
])
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.team-page {
|
||||
min-height: 100vh;
|
||||
padding-bottom: 100rpx;
|
||||
background-image: url('@/static/images/bg.png');
|
||||
background-position: top;
|
||||
background-size: cover;
|
||||
}
|
||||
.main-content {
|
||||
background-image: url('@/static/images/page-sub/team/main-bg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user