<template>
	<view>
		<u-navbar :is-back="false" :title="t('robot.title')" :background="{backgroundColor: '#0066ff'}"
			title-color="#FFFFFF">
			<view class="flex justify-end w-full pr-[20rpx]">
				<navigator hover-class="none" url="/pages/robot/record">
					<u-icon size="40" name="/static/images/common/record.png"></u-icon>
				</navigator>
			</view>
		</u-navbar>
		<view class="bg-[#0066ff] px-[30rpx] pt-[30rpx]" style="border-radius: 0 0 50% 50%;">
			<view class="bg-[url('/static/images/quantify/quantifybg.png')] bg-cover p-[30rpx] rounded-2xl">
				<view class="flex  mb-[20rpx]">
					<u-icon size="38" name="clock-fill"></u-icon>
					<text class="ml-[6rpx]">{{date}}</text>
				</view>
				<view class="bg-white px-[20rpx] py-[30rpx] rounded-xl">
					<view class="flex justify-around">
						<view class="text-center w-1/2">
							<view class="font-bold text-2xl">
								{{formatMoney(data.user.todayMoney)}}/{{formatMoney(data.user.totalyMoney)}}
							</view>
							<view class="text-xs text-center text-muted  mt-[10rpx]">
								{{t('robot.lhMoneyTotal')}}
							</view>
						</view>
						<view class="text-center w-1/2 ">
							<view class="font-bold text-2xl">
								{{formatMoney(data.user.todayIncome)}}
							</view>
							<view class="text-xs text-center text-muted  mt-[10rpx]">
								{{t('robot.todayIncome')}}
							</view>
						</view>
					</view>
					<view class="flex justify-around mt-[60rpx]">
						<view class="text-center w-1/2">
							<view class="font-bold text-2xl">
								{{data.user.todayOrder}}/{{data.user.todayTotalOrder}}
							</view>
							<view class="text-xs  text-center text-muted  mt-[10rpx]">
								{{t('robot.todayLhNum')}}
							</view>
						</view>

						<view class="text-center w-1/2">
							<view class="font-bold text-2xl">
								{{formatMoney(data.user.totalIncome)}}
							</view>
							<view class="text-xs  text-center text-muted  mt-[10rpx]">
								{{t('robot.totalIncome')}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<view class="px-[30rpx] my-[40rpx]">
			<u-button type="primary" :ripple="true" :disabled="step!=0" :loading="step!=0" @click="handleLh">
				{{t('robot.startBtn')}}
			</u-button>
		</view>

		<view class="px-[30rpx] my-[30rpx]">
			<view class="font-bold mb-[10px]">
				{{t('robot.runProcess')}}
			</view>
			<view class="text-muted">
				<view class="mb-[5rpx]" v-if="step>0">
					{{t('robot.run0')}}
				</view>
				<view class="mb-[5rpx]" v-if="step>1">
					{{t('robot.run1')}}
				</view>
				<view class="mb-[5rpx]" v-if="step>2">
					{{t('robot.run2')}}
				</view>
				<view class="mb-[5rpx]" v-if="step>3">
					{{t('robot.run3')}}
				</view>
				<view class="mb-[5rpx]" v-if="step>4">
					{{t('robot.run4')}}
				</view>
				<view class="mb-[5rpx]" v-if="step>5">
					{{t('robot.run5')}}
				</view>
				<view class="mb-[5rpx]" v-if="step>6">
					{{t('robot.run6')}}
				</view>
			</view>
		</view>

		<view class="vipbg mx-[30rpx] my-[30rpx] relative items-center flex">
			<view class="text-white text-left mx-[30rpx]">{{t('robot.currentLevel')}}: {{data.user.member.name}}</view>
			<view class="absolute right-[30rpx] top-[-30rpx]">
				<u-image width="200rpx" mode="widthFix" :src="data.user.member.logo"></u-image>
			</view>
		</view>

		<view class="px-[30rpx] my-[30rpx] font-bold">
			{{t('vip.vipTitle')}}
		</view>
		<view class="mx-[30rpx] mb-[20rpx] relative">
			<u-swiper :list="vip.list" :current="vip.current" :autoplay="false" mode="none" bg-color="none"
				:showText="true" :showTips="true" @change="changeHandle"></u-swiper>
		</view>
		<view class="bg-[#FDEED0] mx-[30rpx] pt-[30rpx] mb-[20rpx] rounded-xl">
			<view class="px-[30rpx] mb-[30rpx]">
				<text class="text-[#F4AE00]">{{vip.currentVip.text}} {{t('robot.upgradeConditions')}}</text>
			</view>
			<view class=" bg-white rounded-xl p-[30rpx]">
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-muted">
						{{t('robot.validAmount')}}
					</view>
					<view class="">
						{{formatMoney(data.user.balance)}}/{{vip.currentVip.money}}
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-muted">
						{{t('robot.levelNum')}}
					</view>
					<view class="">
						{{vip.currentVip.team_num}}/{{vip.currentVip.level1_num}}
					</view>
				</view>
				<view class="flex justify-between">
					<view class="text-muted">
						{{t('robot.userVIpName')}}
					</view>
					<view class="">
						{{vip.currentVip.vip_name}}
					</view>
				</view>
			</view>
		</view>
		<view class="bg-[#C9DEFF] mx-[30rpx] pt-[30rpx] rounded-xl">
			<view class="px-[30rpx] mb-[30rpx]">
				<text class="text-[#0066FF]">{{vip.currentVip.text}} {{t('robot.rights')}}</text>
			</view>
			<view class=" bg-white rounded-xl p-[30rpx]">
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-muted">
						{{t('robot.lhRate')}}
					</view>
					<view class="">
						{{vip.currentVip.rate_min}}% - {{vip.currentVip.rate_max}}%
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-muted">
						{{t('robot.lhMin')}}
					</view>
					<view class="">
						{{vip.currentVip.lh_min}}
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-muted">
						{{t('robot.lhMax')}}
					</view>
					<view class="">
						{{vip.currentVip.lh_max}}
					</view>
				</view>
				<view class="flex justify-between">
					<view class="text-muted">
						{{t('robot.lhNum')}}
					</view>
					<view class="">
						{{vip.currentVip.lh_num}}
					</view>
				</view>
			</view>
		</view>
	</view>
	<tabbar />
</template>

<script lang="ts" setup>
	import { reactive, ref } from 'vue'
	import { onUnload, onHide, onShow } from '@dcloudio/uni-app'
	import { getCurrency, formatDate, formatMoney, t, randomDelay } from '@/utils/util'
	import { getIndex, buy } from '@/api/robot'
	import { vipAll } from '@/api/vip'

	uni.setNavigationBarTitle({ title: t('robot.title') })
	let timer : any = null

	const date = ref('')
	const step = ref(0)
	const step_is_lh = ref(0)//用于后端开启量化后可继续执行下一步操作
	const data = reactive({
		status: 0,
		pay_pwd: '',
		user: {
			todayMoney: 0,
			totalyMoney: 0,
			todayIncome: 0,
			todayOrder: 0,
			todayTotalOrder: 0,
			totalIncome: 0,
			balance: 0,
			team_num: 0,
			is_lh: 0,
			member: []
		},
		date: ''
	})
	const vip = reactive({
		list: [],
		currentVip: [],
		current: 0
	})
	const getTimer = async () => {
		timer && clearInterval(timer)
		
		timer = setInterval(() => {
			let serverDateTime = new Date(data.date)
			serverDateTime.setSeconds(serverDateTime.getSeconds() + 1)
			date.value = formatDate(new Date(serverDateTime).getTime() / 1000, uni.getStorageSync('formatTime'));
			data.date = date.value;
		}, 1000)
	}

	const getData = async () => {
		const res = await getIndex({ date: formatDate(Math.round(Date.now() / 1000)) })

		data.date = res.server_date
		getTimer();
		
		data.user = res.user;

		const vips = await vipAll()
		vips.forEach((item : any, index : number) => {
			if (data.user.member.id == item.id) {
				vip.current = index;
				vip.currentVip = item;
				item['locked'] = false;
				item['tips'] = t('vip.unlocked');
			} else {
				item['locked'] = true;
				item['tips'] = t('vip.locked');
			}
			item['textStyle'] = {
				color: item['text_color']
			}
			item['tipsStyle'] = {
				color: item['text_color']
			}
		})
		vip.list = vips;
		if (step_is_lh.value == 0 && data.user.is_lh == 1 && step.value == 2) {
			handleLh()
		}
	}

	const changeHandle = (index : number) => {
		vip.currentVip = vip.list[index];
	}

	const handleLh = async () => {
		try {
			//判断用户余额
			if (data.user.balance - data.user.member.lh_min < 0) return uni.$u.toast(t('robot.lhMinError') + ': ' + getCurrency() + data.user.member.lh_min);
			//判断每日量化次数
			if (data.user.todayOrder - data.user.member.lh_num >= 0) return uni.$u.toast(t('robot.lhNumError') + ': ' + data.user.member.lh_num);
			step.value = 1;
			await randomDelay(1, 5); // 延时1-5秒
			step.value = 2;
			if (data.user.is_lh != 1) {
				step_is_lh.value = 0
				return
			}
			await randomDelay(1, 5); // 延时1-5秒
			step.value = 3;
			await randomDelay(1, 5); // 延时1-5秒
			step.value = 4;
			await randomDelay(1, 5); // 延时1-5秒
			step.value = 5;
			await randomDelay(1, 5); // 延时1-5秒
			step.value = 6;
			await buy({ 'buy': 1 });
			await randomDelay(1, 5); // 延时1-5秒
			step.value = 7;
			await randomDelay(2, 2); // 延时1-5秒
			step.value = 0;
			getData();
		} catch (error) {
			console.log(error);
			step.value = 0;
		}
	}
	onUnload(() => {
		timer && clearInterval(timer)
	})
	onShow(() => {
		getData()
	})
	onHide(() => {
		timer && clearInterval(timer)
	})
</script>

<style lang="scss">
	.vipbg {
		background-image: url('/static/images/quantify/vipbg.png');
		background-size: 100% auto;
		background-repeat: no-repeat;
		background-position: center;
		height: 68px;
	}
</style>