<template>
	<view class="content pt-[44px]">
		<view class="w-full">
			<wd-navbar fixed safeAreaInsetTop :leftText="user_info?.info?.name || '商城首页'">
				<template #right>
					<wd-icon name="setting" size="22px"></wd-icon>
				</template>
			</wd-navbar>
		</view>

		<view class="order mb-2">
			<wd-grid bg-color="#f7f8fa" v-show="oneLine.ok">
				<wd-grid-item icon="round" :text="`用户 (${oneLine.user_count})`" />
				<wd-grid-item icon="round" :text="`商品 (${oneLine.goods_count})`" />
				<wd-grid-item icon="round" :text="`售罄 (${oneLine.empty_stock_count})`" />
				<wd-grid-item icon="round" :text="`订单 (${oneLine.order_count})`" />
			</wd-grid>
		</view>

		<view style="transition: 1s;" class="flex-1 w-full h-full bg-white pt-4 rounded-tr-3xl rounded-tl-3xl shadow-lg oh">
			<view class="w-full grid grid-cols-2 gap-3 px-3">
				<view @click="utils.toUrl('/store/goods/index')" class="text-white rounded-3xl p-4 pb-3 shadow-lg overflow-hidden"
					style="background-image: linear-gradient(to top, #7ea0ff 0%, #a9bdf5 100%);">
					<view class="font-bold">商品管理</view>
					<view class="h-0.5 w-5 mt-0.5 bg-white"></view>

					<view class="flex justify-end">
						<div class="rotate-[-28deg] translate-y-5 translate-x-5">
							<wd-icon name="goods opacity-80" size="46px"></wd-icon>
						</div>
					</view>
				</view>

				<view @click="utils.toUrl('/store/order/index')" class="text-white rounded-3xl p-4 pb-3 shadow-lg overflow-hidden"
					style="background-image: linear-gradient(to top, #7ea0ff 0%, #a9bdf5 100%);">
					<view class="font-bold">订单中心</view>
					<view class="h-0.5 w-5 mt-0.5 bg-white"></view>

					<view class="flex justify-end">
						<div class="rotate-[-20deg] translate-y-5 translate-x-5">
							<wd-icon name="gift opacity-80" size="46px"></wd-icon>
						</div>
					</view>
				</view>
				<!-- <view class="bg-dark shadow-md rounded-md p-4">
				<wd-icon name="goods" size="22px"></wd-icon>
				<view class="mt-2 text-end font-bold">订单中心</view>
			</view>

			<view class="bg-dark shadow-md rounded-md p-4">
				<wd-icon name="goods" size="22px"></wd-icon>
				<view class="mt-2 text-end font-bold">订单中心</view>
			</view> -->
			</view>
		</view>


	</view>
</template>

<script setup>
import { ref } from 'vue'
import utils from '@/utils/utils.js'
import index from '@/api/store/index.js'

const user_info = uni.getStorageSync("user_info");

const oneLine = ref({})
const getOneLine = () => {
	index.dataCount.oneLine().then(res => {
		oneLine.value = res.data
		oneLine.value.ok = true
	})
}
getOneLine()
</script>

<style lang="scss" scoped></style>
