<template>
	<view class="index-header" @tap="go.to('PAGES_STAT')">
		<view class="index-selected">
			<view class="index-time">
				<block v-for="v in timeList" :key="v.value">
					<view class="time-item flex-center" :class="{ 'time-active': vdata.timeSelected == v.value }" @tap.stop="changeTimeFunc(v.value)">
						{{ v.title }}
					</view>
				</block>
			</view>
			<view class="index-scan flex-center" @click.stop="scanFunc">
				<image src="/static/iconImg/icon-scan-index.svg" mode="scaleToFill" />
			</view>
		</view>
		<view class="receipts-money">
			<text class="money-title">成交金额 (元)</text>
			<view class="money-num">{{ list.sale.incomeAmountAll||0}}</view>
		</view>
		<view class="money-list">
			<view class="money-item">
				<text class="money-title">消费笔数</text>
				<view class="money-num">{{  list.vip.useNum||0 }}</view>
			</view>
			<view class="money-item">
				<text class="money-title">退款金额 (元)</text>
				<view class="money-num">{{ list.sale.outAmount||0}}</view>
			</view>
			<view class="money-item">
				<text class="money-title">消费金额</text>
				<view class="money-num">{{  list.vip.useAmount||0 }}</view>
			</view>
		</view>
		<view class="money-list" v-if="vdata.memberIsShow">
			<view class="money-item">
				<text class="money-title">会员充值(元)</text>
				<view class="money-num">{{ cal.cert2Dollar(memberData.payAmount) }}</view>
			</view>
			<view class="money-item">
				<text class="money-title">会员消费(元)</text>
				<view class="money-num">{{ cal.cert2Dollar(Math.abs(memberData.changeAmount)) }}</view>
			</view>

			<view class="money-item">
				<text class="money-title">会员消费笔数</text>
				<view class="money-num">{{ memberData.changeCount }}</view>
			</view>
		</view>
		<view>
			<!-- <text class="money-title">展开全部</text> -->
		</view>
		<!-- <button v-if="ak.ent.has('ENT_C_QUICKCASHIER')" class="quick-money flex-center" @tap.stop="go.to('PAGES_QUICK_PAY')">快捷收银</button> -->
	</view>
</template>

<script setup>
import { ref, reactive, onMounted } from 'vue';
import { $indexStatistics, $memberInfoCount } from '@/http/apiManager.js';
import cal from '@/commons/utils/cal.js';
import go from '@/commons/utils/go.js';
import ak from '@/commons/utils/ak.js';
import ent from '@/commons/utils/ent.js';
import unionScan from '@/commons/utils/unionScan.js';
import storageManage from '@/commons/utils/storageManage.js';
	import dayjs from 'dayjs' //时间格式库
	import {
		summaryTrade,
	} from '@/http/yskApi/requestAll.js';
onMounted(() => {
	vdata.memberIsShow = ent.has('ENT_MCH_MEMBER') && storageManage.userInfo().isHasMemberEnt;
	if (ent.has('ENT_MCH_MEMBER') && storageManage.userInfo().isHasMemberEnt) {
		getMemberData();
	}
	getList()
});
const emits = defineEmits(['click']);
const timeList = [
	{ title: '今天', value: 'today' },
	{ title: '昨天', value: 'yesterday' },
	{ title: '近7天', value: 'circumference' },
	{ title: '近30天', value: 'moon' }
];
let list = ref()
const vdata = reactive({
	timeSelected: 'today', // 当前时间选择器的
	payAmount: -1, // 实收金额
	payCount: -1, // 交易笔数
	refundAmount: -1, // 退款金额
	refundCount: -1, // 退款笔数
	memberIsShow: false //是否开启会员模块
});
const memberData = reactive({});
function getList(){
	let startTime, endTime;
	if (vdata.timeSelected == 'today') {
		startTime = dayjs().format('YYYY-MM-DD') + ' 00:00:00'
		endTime = dayjs().format('YYYY-MM-DD') + ' 23:59:59'
	} else if (vdata.timeSelected == 'yesterday') {
		startTime = formatTime() + ' 00:00:00'
		endTime = formatTime() + ' 23:59:59'
	} else if (vdata.timeSelected == 'circumference') {
		startTime = dayjs().add(-7, 'day').format('YYYY-MM-DD 00:00:00')
		endTime = dayjs().format('YYYY-MM-DD 23:59:59')
	} else if (vdata.timeSelected == 'moon') {
		startTime = dayjs().add(-30, 'day').format('YYYY-MM-DD 00:00:00')
		endTime = dayjs().format('YYYY-MM-DD 23:59:59')
	} else if (vdata.timeSelected == 'custom') {
		startTime = start
		endTime = end
	}
	summaryTrade({
		shopId: uni.getStorageSync('shopId'),
		startTime,
		endTime,
	}).then((res) => {
		list.value = res
	})
}
// 切换 时间卡片
function changeTimeFunc(val) {
	vdata.timeSelected = val;
	getList()
	// console.log(vdata.timeSelected,'调试121')
	// refData();
	// if (vdata.memberIsShow) {
	// 	getMemberData();
	// }
}
// 根据选择请求数据
function refData() {
	// 获取 统计数据
	$indexStatistics(vdata.timeSelected).then(({ bizData }) => {
		vdata.payAmount = bizData.totalSuccAmt;
		vdata.payCount = bizData.totalSuccNum;
		vdata.refundAmount = bizData.totalRefundAmt;
		vdata.refundCount = bizData.totalRefundNum;
	});
}

// 扫码动作
function scanFunc() {
	unionScan.scan(true).then((res) => {
		// 登录类型
		if (res.type == unionScan.QR_TYPE_LOGIN) {
			return go.to('PAGES_SCAN_LOGIN', { qrcodeNo: res.originQrVal });
		}

		// 二维码
		if (res.type == unionScan.QR_TYPE_QRC) {
			return go.to('PAGES_APP_CODE_BIND', { qrcId: res.bizValue });
		}
	});
}
	// 获取当前时间
	function getdate() {
		const dt = new Date();
		const y = dt.getFullYear();
		const m = (dt.getMonth() + 1 + "").padStart(2, "0");
		const d = (dt.getDate() + "").padStart(2, "0");
		const hh = (dt.getHours() + "").padStart(2, "0");
		const mm = (dt.getMinutes() + "").padStart(2, "0");
		const ss = (dt.getSeconds() + "").padStart(2, "0");
		return `${y}-${m}-${d}`;
	}
	// 获取昨天时间
	const formatTime = () => {
		let strDate = getdate()
		let dateFormat = new Date(strDate);
		dateFormat = dateFormat.setDate(dateFormat.getDate() - 1);
		dateFormat = new Date(dateFormat);
		let y = dateFormat.getFullYear()
		let m = (dateFormat.getMonth() + 1).toString().padStart(2, '0')
		let d = dateFormat.getDate().toString().padStart(2, '0')
		return `${y}-${m}-${d}`
	}
const getMemberData = () => {
	$memberInfoCount({ queryDateRange: vdata.timeSelected }).then(({ bizData }) => {
		Object.assign(memberData, bizData);
	});
};
defineExpose({ refData });
</script>

<style lang="scss" scoped>
.index-header {
	width: 680rpx;
	margin: 0 auto;
	transform: translateY(30rpx);
	margin-bottom: 25rpx;
	padding: 20rpx;
	box-sizing: border-box;
	border-radius: $J-b-r32;
	background: $jeepay-bg-primary;
	backdrop-filter: blur(20rpx);
	box-shadow: 0 50rpx 70rpx -60rpx rgba(0, 65, 164, 0.5);
	.index-selected {
		display: flex;
		justify-content: space-between;
		.index-time {
			display: flex;
			justify-content: space-between;
			align-items: center;
			width: 490rpx;
			height: 90rpx;
			border-radius: 20rpx;
			padding: 10rpx;
			background-color: rgba($color: #fff, $alpha: 0.1);
			.time-item {
				flex: 1;
				// width: 120rpx;
				height: 100%;
				font-size: 32rpx;
				font-weight: 500;
				color: rgba(255, 255, 255, 0.75);
			}
			.time-active {
				background-color: $J-bg-ff;
				color: $J-color-t21;
				border-radius: 12rpx;
			}
		}
		.index-scan {
			width: 110rpx;
			height: 110rpx;
			border-radius: 20rpx;
			background-color: rgba($color: #fff, $alpha: 0.1);
			image {
				width: 41rpx;
				height: 35rpx;
			}
		}
	}
	.receipts-money {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin: 30rpx 0;
		color: $J-color-tff;
		.money-num {
			font-size: 70rpx;
			font-weight: 500;
		}
	}
	.money-list {
		display: flex;
		justify-content: space-between;
		padding: 0 72rpx;
		margin-bottom: 50rpx;
		text-align: center;
		color: $J-color-tff;
		.money-item {
			.money-num {
				font-size: 32rpx;
				font-weight: 500;
			}
		}
	}
	.money-title {
		margin-bottom: 10rpx;
		font-size: 26rpx;
		font-weight: 400;
		color: $J-color-tSff;
	}
	.quick-money {
		height: 110rpx;
		border-radius: 20rpx;
		color: $J-color-t29;
	}
}
</style>
