designer-hub/packages/app/src/pages-sub/mine/refferrer/index.vue

<route lang="json">
{ "style": { "navigationBarTitleText": "引荐奖励", "navigationBarBackgroundColor": "#fff" } }
</route>
<script setup lang="ts">
import Card from '@/components/card.vue'
import { phone, right } from '../../../core/libs/svgs'
import { referrerCount, distributePointsSum } from '../../../core/libs/requests'
import { handleCall } from '../../../core/utils/common'

const { data: count, run: setCount } = useRequest(() => referrerCount())
const { data: pointsSum, run: setPointsSum} = useRequest(() => distributePointsSum())
const handleClick = (path) => {
  uni.navigateTo({ url: path })
}
const tips = () =>{
	uni.showToast({
		title:"推荐的设计师，有未完成的订单，订单完成后即可获得",
		icon:"none",
		duration:3000
	})
}
onMounted(async () => {
  await setCount();
  await setPointsSum();
})
</script>
<template>
  <div class="px-[24rpx] py-[34rpx]">
	<view class="bg-white rounded-[32rpx] px-[24rpx] pt-[34rpx] pb-[60rpx] mb-[30rpx]">
	  <view class="flex items-center justify-between mb-[60rpx] border-b-1 pb-[20rpx]">
		  <view class="text-[36rpx] font-bold">我的推荐</view>
		  <view class="text-[28rpx] text-black/40" @click="handleClick('/pages-sub/mine/refferrer/details?type=recommend')">
			  <text>查看明细</text>
			  <wd-img :src="right" width="12" height="12"></wd-img>
		  </view>
	  </view>
	  <view class="flex items-start justify-between mb-[40rpx]">
		  <view class="">
			  <view class="text-[56rpx] font-bold mb-[12rpx]">{{ count.onePassCount }}</view>
			  <view class="text-[28rpx] text-black/40 ">认证设计师 (人）</view>
		  </view>
		  <view class="bg-[#F2F2F2] flex px-[32rpx] py-[10rpx] text-[24rpx] text-black/40 rounded-full items-center">
			  <text class="mr-[10rpx]">二级推荐：{{ count.twoPassCount }}人</text>
			  <icon type="info_circle" size="16" color="#999"></icon>
		  </view>
	  </view>
	  <view class="flex justify-between">
		  <view class="rounded-[8rpx] shadow-[0_4rpx_10rpx_4rpx_rgba(0,0,0,0.1)] relative min-w-[260rpx] h-[60rpx] line-height-[60rpx] overflow-hidden">
			  <view class="w-[10rpx] h-full absolute bg-[#0CBE7D] left-0 top-0"></view>
			  <view class="w-full text-center text-[24rpx] text-black/60">
				  <text>审核中</text>
				  <text class="text-[32rpx] text-black">{{ count.oneWaitCount }}</text>
				  <text>人</text>
			  </view>
		  </view>
		  <view class="rounded-[8rpx] shadow-[0_4rpx_10rpx_4rpx_rgba(0,0,0,0.1)] relative min-w-[260rpx] h-[60rpx] line-height-[60rpx] overflow-hidden">
			  <view class="w-[10rpx] h-full absolute bg-[#FFCF82] left-0 top-0"></view>
			  <view class="w-full text-center text-[24rpx] text-black/60 ">
				  <text>未通过</text>
				  <text class="text-[32rpx] text-black px-[6rpx]">{{ count.oneRejectCount }}</text>
				  <text>人</text>
			  </view>
		  </view>
	  </view>
	</view>
	<view class="bg-white rounded-[32rpx] px-[24rpx] pt-[34rpx] pb-[60rpx] mb-[30rpx]">
	  <view class="flex items-center justify-between mb-[60rpx] border-b-1 pb-[20rpx]">
		  <view class="text-[36rpx] font-bold">引荐加成奖励</view>
		  <view class="text-[28rpx] text-black/40" @click="handleClick('/pages-sub/mine/refferrer/details?type=reward')">
			  <text>查看明细</text>
			  <wd-img :src="right" width="12" height="12"></wd-img>
		  </view>
	  </view>
	  <view class="flex items-start justify-between mb-[40rpx]">
		  <view class="">
			  <view class="text-[56rpx] font-bold mb-[12rpx]">{{ pointsSum.passPoints }}</view>
			  <view class="text-[28rpx] text-black/40 ">已获得总积分</view>
		  </view>
		  <view class="bg-[#F2F2F2] flex px-[32rpx] py-[10rpx] text-[24rpx] text-black/40 rounded-full items-center">
			  <text class="mr-[10rpx]">待入账：{{ pointsSum.waitPoints }}积分</text>
			  <icon @click="tips" type="info_circle" size="16" color="#999"></icon>
		  </view>	  
	  </view>
	  <div class="flex">
		<div class="w-[50%]">
			<div class="text-[32rpx] font-bold">{{ pointsSum.onePassPoints }}</div>
			<div class="text-[24rpx] text-black/60">一级引荐奖励积分</div>
		</div>
		<div class="w-[50%]">
			<div class="text-[32rpx] font-bold">{{ pointsSum.twoPassPoints }}</div>
			<div class="text-[24rpx] text-black/60">二级引荐奖励积分</div>
		</div>
	  </div>
	</view>
	<view class="flex bg-white rounded-[32rpx] px-[24rpx] py-[34rpx]" @click="handleClick('/pages-sub/mine/refferrer/rule')">
		<view class="text-[32rpx] flex-grow">引荐奖励规则</view>
		<icon type="info_circle" size="22" color="#999"></icon>
	</view>
  </div>
</template>