<template>
	<view class="head_box">
		<u-navbar title="商城管理" leftIconSize="0" placeholder :autoBack="true" bgColor="transparent" :titleStyle="{fontSize: '36rpx', color: '#333', fontWeight: 500}" />
		<view class="dis-flex flex-x-around mt-60">
			<view class="dis-flex flex-dir-column flex-y-center col-3d">
				<text class="f-28 l-h-38 mb-10">今日预计收入/元</text>
				<view class="f-48 f-w-500">487<text class="f-24">.05</text></view>
			</view>
			<view class="dis-flex flex-dir-column flex-y-center col-3d">
				<text class="f-28 l-h-38 mb-10">有效订单/单</text>
				<view class="f-48 f-w-500">50<text class="f-24"></text></view>
			</view>
		</view>
		
		<view class="function_list">
			<view v-for="item in funcionList" :key="item.id" class="dis-flex flex-dir-column flex-y-center" @click="goRouter(item.routerPath)">
				<image style="width: 80rpx;" class="mb-10" :src="item.iconName" mode="widthFix"></image>
				<text class="l-h-32 col-3d f-24">{{ item.text }}</text>
			</view>
		</view>
		
	</view>
</template>

<script>
	import add from '@/static/mallImg/add_goods.png'
	import edit from '@/static/mallImg/edit_goods.png'
	import del from '@/static/mallImg/del_goods.png'
	import info from '@/static/mallImg/info_goods.png'
	export default {
		name:"mallHeatar",
		data() {
			return {
				funcionList: [
					{ id: 1, text: '新建商品', iconName: add, routerPath: '/pages_mall/goods/addGoods' },
					{ id: 2, text: '商品编辑', iconName: edit, routerPath: '/pages_mall/goods/edidGoods' },
					{ id: 3, text: '下架商品', iconName: del, routerPath: '/pages_mall/goods/underGoods' },
					{ id: 4, text: '库存信息', iconName: info, routerPath: '/pages_mall/goods/stockInformation' },
				]
			};
		},
		methods: {
			goRouter(path){
				uni.navigateTo({
					url: path
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.head_box{
	height: 596rpx;
	background: linear-gradient(to right, #F7ECEC, #ECF1F7);
	.function_list{
		display: flex;
		justify-content: space-between;
		margin: 26rpx 30rpx 0;
		padding: 40rpx 38rpx;
		background: #FFFFFF;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
	}
}
</style>