<template>
	<view class="w-screen h-screen flex flex-col bg-[#ededed]" :style="themeColor()">
		<view class="sidebar-margin mt-[20rpx] bg-[#ffffff]">
			<up-grid :border="true" col="2" align="center">
				<up-grid-item class="pt-[20rpx]">
					<text
						class="text-center text-lg text-[var(--primary-color)]">{{baseInfo.purchase_count.today}}</text>
					<text
						class="text-center color-[#909399] text-[28rpx] pt-[20rpx] pb-[40rpx]">{{t('todayPurchaseCount')}}</text>
				</up-grid-item>
				<up-grid-item class="pt-[20rpx]">
					<text
						class="text-center text-lg text-[var(--primary-color)]">{{baseInfo.purchase_price.today}}</text>
					<text
						class="text-center color-[#909399] text-[28rpx] pt-[20rpx] pb-[40rpx]">{{t('todayPurchaseSale')}}</text>
				</up-grid-item>
				<up-grid-item class="pt-[20rpx]">
					<text class="text-center text-lg text-[var(--primary-color)]">{{baseInfo.sell_count.today}}</text>
					<text
						class="text-center color-[#909399] text-[28rpx] pt-[20rpx] pb-[40rpx]">{{t('todaySellCount')}}</text>
				</up-grid-item>
				<up-grid-item class="pt-[20rpx]">
					<text class="text-center text-lg text-[var(--primary-color)]">{{baseInfo.sell_price.today}}</text>
					<text
						class="text-center color-[#909399] text-[28rpx] pt-[20rpx] pb-[40rpx]">{{t('todaySellSale')}}</text>
				</up-grid-item>
			</up-grid>
		</view>

		<view class="sidebar-margin mt-[20rpx] bg-[#ffffff]">
			<up-grid :border="true" col="2" align="center">
				<up-grid-item class="pt-[20rpx]">
					<text class="text-center text-lg text-[var(--primary-color)]">{{waitInfo.wait_approve_count}}</text>
					<text
						class="text-center color-[#909399] text-[28rpx] pt-[20rpx] pb-[40rpx]">{{t('waitApprovePurchase')}}</text>
				</up-grid-item>
				<up-grid-item class="pt-[20rpx]">
					<text
						class="text-center text-lg text-[var(--primary-color)]">{{waitInfo.wait_inventory_count}}</text>
					<text
						class="text-center color-[#909399] text-[28rpx] pt-[20rpx] pb-[40rpx]">{{t('waitInventoryPurchase')}}</text>
				</up-grid-item>
				<up-grid-item class="pt-[20rpx]">
					<text class="text-center text-lg text-[var(--primary-color)]">{{waitInfo.wait_return_count}}</text>
					<text
						class="text-center color-[#909399] text-[28rpx] pt-[20rpx] pb-[40rpx]">{{t('waitReturnPurchase')}}</text>
				</up-grid-item>
				<up-grid-item class="pt-[20rpx]">
					<text class="text-center text-lg text-[var(--primary-color)]">{{waitInfo.wait_sell_order}}</text>
					<text
						class="text-center color-[#909399] text-[28rpx] pt-[20rpx] pb-[40rpx]">{{t('waitSellOrder')}}</text>
				</up-grid-item>
				<up-grid-item class="pt-[20rpx]">
					<text
						class="text-center text-lg text-[var(--primary-color)]">{{waitInfo.wait_delivery_order}}</text>
					<text
						class="text-center color-[#909399] text-[28rpx] pt-[20rpx] pb-[40rpx]">{{t('waitDeliveryOrder')}}</text>
				</up-grid-item>
				<up-grid-item class="pt-[20rpx]">
					<text class="text-center text-lg text-[var(--primary-color)]">{{waitInfo.wait_return_order}}</text>
					<text
						class="text-center color-[#909399] text-[28rpx] pt-[20rpx] pb-[40rpx]">{{t('waitReturnOrder')}}</text>
				</up-grid-item>
			</up-grid>
		</view>
		<tabbar />
	</view>
</template>

<script setup lang="ts">
	import { ref } from 'vue'
	import { t } from '@/locale'
	import { getBaseInfo, getWaitInfo } from '@/addon/erp/api/statistice';
	import { onLoad } from '@dcloudio/uni-app';

	const baseInfo = ref<any>({
		purchase_count: {},
		purchase_price: {},
		sell_count: {},
		sell_price: {},
	});
	const waitInfo = ref<any>({});

	onLoad(() => {
		getBaseInfoFn();
		getWaitInfoFn();
	})

	const getBaseInfoFn = async () => {
		baseInfo.value = await (await getBaseInfo()).data;
	};

	const getWaitInfoFn = async () => {
		waitInfo.value = await (await getWaitInfo()).data;
	};
</script>

<style>
</style>