<!-- 首页 -->
<template>
	<view class="page-wrapper" style="overflow:visible;height:auto">
		<!-- 背景图片view -->
		<view class="bg-img-view" >
			  
			<!-- 背景颜色view -->
			<view class="bg-color-view" style="position: absolute;top: 0;left: 0;right: 0;height: 550rpx;border-radius:0 0 32rpx 32rpx;background-color: #318AFE!important;">
				  <view class="bgbottomStyle">
				  </view>
			</view>
		</view>
	    <!-- 解决定位层级问题 -->
	    <view class="bg-main">
			<!-- 导航条 -->
			<up-navbar title="首页" bg-color="#318AFE" titleStyle="color:#fff;font-size:16px;" @leftClick="toSetting">
				<template #left>
					<up-icon name="/static/indexImg/icon-menu.svg" color="#fff" :size="16"></up-icon>
				</template>
			</up-navbar>
			<view class="income">
				<view class="u-flex u-row-center u-relative">
					<view class="u-flex u-col-center">
						<view class="u-m-r-12">总收入</view>
						<up-icon name="/static/indexImg/icon-help.svg" color="#fff" :size="12"
							@click="toggleTips"></up-icon>
					</view>
					<view class="tips u-absolute color-666 u-font-20 u-text-left " :class="{'showTips':showTips}">
						<view class="sanjiao u-flex"><up-icon name="play-left-fill" size="12" color="#fff"></up-icon></view>
						总收入为除会员余额
						支付外所有收入
					</view>
				</view>
				<view class="u-flex u-row-center">
					<view class="">￥{{((totalRevenuedata||0)*1).toFixed(2)}}</view>
				</view>
				<view>{{shopName||''}}</view>
			</view>
			<!-- 统计 or 快捷扫码 -->
			<!-- <Stats ref="statsRef" /> -->
			<statistics @totalRevenue="totalRevenue"></statistics>
			<!-- 导航栅格 -->
			<JeepayNavigation :navList="navList" type="grid" />    
	    </view>
	</view>
		
</template>

<script setup>
	import { reactive, ref, onMounted, nextTick } from 'vue';
	import { onPullDownRefresh, onLoad, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app';

	import go from '@/commons/utils/go.js';
	import Stats from './components/Stats.vue';
	import statistics from './components/statistics.vue'
	import storageManage from '@/commons/utils/storageManage.js';
	import { hasPermission } from '@/commons/utils/hasPermission.js'
	
	uni.hideTabBar()
	let shopName = ref()
	let totalRevenuedata = ref()
	let totalRevenue = (d) => {
		totalRevenuedata.value = d
	}

	let showTips = ref(false)
	function toggleTips() {
		showTips.value = !showTips.value
	}

	function toSetting() {
		go.to('PAGES_SHOP_SETUP')
	}
	// 导航列表
	const navList = [
		{
			title: '销售汇总',
			icon: '/static/indexImg/PAGE_SALES_SUMMARY.svg',
			pageUrl: 'PAGES_SALES_SUMMARY'
		},
		{
			title: '代客下单',
			icon: '/static/indexImg/icon-substitute-ordering.svg',
			pageUrl: 'PAGES_CREATE_ORDER',
			clickFunc: () => {
				hasPermission('允许下单').then(res => {
					if (res) {
						go.to('PAGES_CREATE_ORDER')
					}
				})
			}
		},
		{
			title: '桌台',
			icon: '/static/indexImg/icon-table.svg',
			pageUrl: 'PAGES_TABLE'
		},
		{
			title: '商品管理',
			icon: '/static/indexImg/icon-product-control.svg',
			pageUrl: 'PAGES_PRODUCT',
		},
		{
			title: '分组管理',
			icon: '/static/indexImg/goods-group.svg',
			pageUrl: 'PAGES_GOODS_GROUP',
		},
		{
			title: '分类管理',
			icon: '/static/indexImg/icon-category.svg',
			pageUrl: 'PAGES_CATEGORY',
		},
		{
			title: '会员管理',
			icon: '/static/indexImg/icon-user.svg',
			pageUrl: 'PAGES_USER_CONTROL',
		}, {
			title: '员工管理',
			icon: '/static/indexImg/icon-staff.svg',
			pageUrl: 'PAGES_STAFF'
		},
		{
			title: '耗材管理',
			icon: '/static/indexImg/PAGE_SALES_SUMMARY.svg',
			pageUrl: 'PAGES_SALES_CONSUMABLES'
		},
		{
			title: '订单管理',
			icon: '/static/indexImg/icon-order.svg',
			pageUrl: 'PAGES_ORDER_INDEX',
		},
		{
			title: '设备管理',
			icon: '/static/indexImg/icon-printer.svg',
			pageUrl: 'PAGES_PRINTER_INDEX',
		},
		{
			title: '交班',
			icon: '/static/indexImg/icon-work.svg',
			pageUrl: 'PAGES_WORK_INDEX',
		},
		{
			title: '排队',
			icon: '/static/indexImg/icon-line-up.svg',
			pageUrl: 'PAGES_LINE_UP'
		},
		{
			title: '霸王餐',
			icon: '/static/indexImg/icon-bwc.svg',
			pageUrl: 'PAGES_BWC'
		},
		{
			title: '优惠券',
			icon: '/static/coupon/icon_coupon.svg',
			pageUrl: 'PAGES_COUPON_INDEX',
		},
		{
			title: '订阅通知',
			icon: '/static/indexImg/icon-notification.svg',
			pageUrl: 'PAGES_NOTIFICATION_INDEX',
		},
		{
			title: '挂账管理',
			icon: '/static/indexImg/icon_credit.svg',
			pageUrl: 'PAGES_CREDIT_BUYER_INDEX',
		},
		{
			title: '核销管理',
			icon: '/static/indexImg/pagewriteoff.svg',
			pageUrl: 'PAGES_WEITEOFF'
		},
		{
			title: '退出登录',
			icon: '/static/indexImg/icon-login-out.svg',
			pageUrl: 'PAGES_LOGIN',
			clickFunc: () => {
				storageManage.cleanByLogout()
				go.to('PAGES_LOGIN', {}, 'redirect')
			}
		}
		// {
		// 	title: '成员管理',
		// 	icon: '/static/indexImg/icon-staff.svg',
		// 	pageUrl: 'PAGES_USER'
		// },
		// {
		// 	title: '订阅通知',
		// 	icon: '/static/indexImg/icon-notification.svg',
		// 	pageUrl: 'PAGES_NOTIFICATION_INDEX',
		// },
		// {
		// 	title: '进销存',
		// 	icon: '/static/indexImg/icon-invoicing.svg',
		// 	pageUrl: 'PAGES_INVOICING_INDEX',
		// },
		// {
		// 	title: '预定座位',
		// 	icon: '/static/indexImg/icon-yuyue-zuo.svg',
		// 	pageUrl: 'PAGES_RESERVE_SEAT_INDEX',
		// },
		// {
		// 	title: '预约管理',
		// 	icon: '/static/indexImg/icon-yuyue.svg',
		// 	pageUrl: 'PAGES_BOOKING_INDEX',
		// },
		// {
		// 	title: '充值管理',
		// 	icon: '/static/indexImg/icon-recharge.svg',
		// 	pageUrl: 'PAGES_RECHARGE_INDEX',
		// },
		// {
		// 	title: '进件管理',
		// 	icon: '/static/indexImg/icon-passage.svg',
		// 	pageUrl: 'PAGES_APPLYMENT',
		// 	entId: 'ENT_MCH_APPLYMENT_LIST'
		// },
		// {
		// 	title: '商户管理',
		// 	icon: '/static/indexImg/business.svg',
		// 	pageUrl: 'PAGES_APPLYMENT_BUSINESS',
		// 	entId: 'ENT_MCH_APPLYMENT_LIST'
		// },
		// {
		// 	title: '门店管理',
		// 	icon: '/static/indexImg/icon-store.svg',
		// 	pageUrl: 'PAGES_STORE',
		// 	entId: 'ENT_MCH_STORE'
		// },
		// {
		// 	title: '设备管理',
		// 	icon: '/static/indexImg/icon-calc.svg',
		// 	pageUrl: 'PAGES_DEVICE_MAIN',
		// 	entId: 'ENT_DEVICE'
		// },
		
		// 	{
		// 		title: '数据中心',
		// 		icon: '/static/indexImg/icon-pro.svg',
		// 		pageUrl: 'PAGES_STAT',
		// 		entId: 'ENT_ORDER_STATISTIC'
		// 	},
		// 	{
		// 	  title: '商户应用',
		// 	  icon: '/static/indexImg/icon-app.svg',
		// 	  pageUrl: 'PAGES_APP',
		// 	  entId: 'ENT_MCH_APP_LIST'
		// 	},
		// 	{
		// 		title: '会员中心',
		// 		icon: '/static/indexImg/icon-member.svg',
		// 		pageUrl: 'PAGES_MEMBER_CENTER',
		// 		entId: 'ENT_MCH_MEMBER'
		// 	},
		// 	{
		// 		title: '广告管理',
		// 		icon: '/static/indexImg/icon-ad.svg',
		// 		pageUrl: 'PAGES_AD_LIST',
		// 		entId: 'ENT_ADVERT_CONTROL'
		// 	},
		

	];
	
	const vdata = reactive({
		noticeList: [], // 公告列表
		adList: [],
		shareImgUrl: '' //分享图片
	});
	
	onLoad((options) => {
		shopName.value = uni.getStorageSync('shopInfo').shopName;
	});
	
	// 启动加载
	onMounted(() => {
		// refData();
	});
	
	// 如果不是超管 删除 刷脸广告菜单
	if (storageManage.userInfo().userType != 1) {
		const index = navList.findIndex((v) => v.entId == 'ENT_ADVERT_CONTROL');
		if (index != -1) {
			navList.splice(index, 1);
		}
	}

	async function refData() {
		//   调用子组件方法 , 避免组件没有加载完成。
		
		// nextTick(() => statsRef.value.refData());
		// 停止刷新  
		uni.stopPullDownRefresh();
	}
	
	/**
	 * 微信分享
	 */
	onShareAppMessage((res) => {
		if (res.from == 'menu')
			return {
				title: uni.$appName,
				path: '/pages/index/index',
				imageUrl: vdata.shareImgUrl
			};
	});
	
	/**
	 * 分享到朋友圈
	 */
	onShareTimeline(() => {
		return {
			title: uni.$appName,
			imageUrl: vdata.shareImgUrl
		};
	});
	// 下拉刷新
	onPullDownRefresh(() => {
		refData();
	});
</script>

<style lang="scss" scoped>
	.bg-main{
	  position: relative;
	  z-index: 10;
	}
	.bgbottomStyle{
		position: absolute;
		bottom: -2rpx;
		left: 0;
		
		width: 750rpx;
		height: 74rpx;
		background: linear-gradient( 180deg, rgba(195,215,235,0) 0%, #F9F9F9 100%);
	}
	.income {
		/* #ifdef H5 */
		padding-top: calc(84rpx);
		/* #endif */
		/* #ifndef H5 */
		padding-top: calc(84rpx + 44px);

		/* #endif */
		>view {
			text-align: center;
			color: #FFFFFF;
			font-family: Source Han Sans CN, Source Han Sans CN;
		}

		>view:nth-child(1) {
			font-weight: 400;
			font-size: 28rpx;
			margin-top: 84rpx;
		}

		>view:nth-child(2) {
			margin-top: 20rpx;
			font-weight: 500;
			font-size: 64rpx;
		}

		>view:nth-child(3) {
			font-weight: 400;
			font-size: 28rpx;
			margin-top: 50rpx;
		}
	}

	.tips {
		opacity: 0;
		right: 28rpx;
		transition: opacity .3s;
		background: #FFFFFF;
		padding: 20rpx 14rpx;
		width: 211rpx;
		box-sizing: border-box;
		border-radius: 8rpx 8rpx 8rpx 8rpx;

		&.showTips {
			opacity: 1;
		}

		.sanjiao {
			position: absolute;
			right: 100%;
			top: 50%;
			transform: translateX(10rpx) translateY(-50%);
		}
	}
</style>