<script>
	import {
		userStore
	} from '@/store/index.js';
	// 判断是否是微信环境
	function isWeChat() {
		var ua = window.navigator.userAgent.toLowerCase();
		if (ua.match(/micromessenger/i) == 'micromessenger') {
			return true;
		} else {
			return false;
		}
	}
	export default {
		onLaunch: function() {
			console.log('App Launch')

			// 初始化用户登录状态
			userStore.actions.initLoginState();
			// 延迟检查登录状态，确保页面加载完成
			// setTimeout(() => {
			// 	this.checkLoginStatus();
			// }, 100);
		},
		onShow: function() {
			console.log('App Show')
			// 在应用显示时检查登录状态
			// this.checkLoginStatus();

			// 判断是否是微信环境 当前不在error页面
			// if (!isWeChat() && window.location.href.indexOf('error') === -1) {
			// 	// 跳转到自定义的错误页面
			// 	setTimeout(() => {
			// 		window.location.href = 'https://m1.whjhft.com/singer-card/pages/error/error';
			// 	}, 500); 

			// 	return;
			// }
		},
		onHide: function() {
			console.log('App Hide')
		},
		onUnload() {
			// uni-app 页面卸载
			this.handleExit();
		},
		methods: {
			// 触发退出逻辑
			async handleExit() {
				await userStore.actions.logout()
			},

			// 检查登录状态和路由拦截
			checkLoginStatus() {
				try {
					// 获取当前页面路径
					const pages = getCurrentPages();
					if (!pages || pages.length === 0) {
						console.log('页面栈为空，跳过路由检查');
						return;
					}

					const currentPage = pages[pages.length - 1];
					const currentRoute = '/' + currentPage.route;

					console.log('当前路由:', currentRoute);

					// 获取登录状态（通过device_id判断）
					const deviceId = uni.getStorageSync('device_id');
					const isLoggedInStorage = uni.getStorageSync('isLoggedIn');
					const isLoggedIn = !!deviceId && !!isLoggedInStorage;

					console.log('登录状态:', isLoggedIn, '设备ID:', deviceId);

					// 如果已登录但在登录页面，跳转到首页
					if (isLoggedIn && currentRoute === '/pages/login/login') {
						uni.showToast({
							title: "已登录但在登录页面，跳转到首页",
							icon: "none"
						})
						uni.setTimeout(() => {
							uni.redirectTo({
								url: '/pages/index/index',
								fail: (err) => {
									console.error('跳转到首页失败:', err);
								}
							})
						}, 200)
						return;
					}

					// 如果未登录且不在登录页面，跳转到登录页
					if (!isLoggedIn && currentRoute !== '/pages/login/login') {
						console.log('未登录，跳转到登录页');
						uni.showToast({
							title: "未登录，跳转到登录页",
							icon: "none"
						})
						uni.setTimeout(() => {
							uni.redirectTo({
								url: '/pages/login/login',
								fail: (err) => {
									console.error('跳转到登录页失败:', err);
								}
							})
						}, 200)
						return;
					}

					console.log('路由检查通过，无需跳转');
				} catch (error) {
					console.error('路由检查出错:', error);
				}
			}
		}
	}
</script>

<style lang="scss">
	/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
	@import "uview-plus/index.scss";

	/* ================================
	   Apple Design System - Variables
	   ================================ */
	:root {
		/* Apple Color Palette */
		--apple-blue: #ff6800;
		--apple-green: #34C759;
		--apple-orange: #FF9500;
		--apple-red: #FF3B30;
		--apple-purple: #AF52DE;
		--apple-pink: #FF2D92;
		--apple-indigo: #5856D6;
		--apple-teal: #5AC8FA;

		/* Neutral Colors */
		--system-gray: #8E8E93;
		--system-gray-2: #AEAEB2;
		--system-gray-3: #C7C7CC;
		--system-gray-4: #D1D1D6;
		--system-gray-5: #E5E5EA;
		--system-gray-6: #F2F2F7;

		/* Background Colors */
		--background-primary: #FFFFFF;
		--background-secondary: #F2F2F7;
		--background-tertiary: #FFFFFF;
		--background-grouped: #F2F2F7;

		/* Text Colors */
		--text-primary: #000000;
		--text-secondary: #3C3C43;
		--text-tertiary: #3C3C4399;
		--text-quaternary: #3C3C4366;

		/* Shadow System */
		--shadow-small: 0 2rpx 4rpx rgba(0, 0, 0, 0.06);
		--shadow-medium: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
		--shadow-large: 0 8rpx 24rpx rgba(0, 0, 0, 0.12);
		--shadow-extra-large: 0 16rpx 48rpx rgba(0, 0, 0, 0.16);

		/* Border Radius */
		--radius-small: 8rpx;
		--radius-medium: 16rpx;
		--radius-large: 24rpx;
		--radius-extra-large: 32rpx;

		/* Spacing System (8pt grid) */
		--space-xs: 8rpx;
		--space-sm: 16rpx;
		--space-md: 24rpx;
		--space-lg: 32rpx;
		--space-xl: 40rpx;
		--space-2xl: 48rpx;

		/* Animation */
		--transition-fast: 0.2s ease-out;
		--transition-normal: 0.3s ease-out;
		--transition-slow: 0.5s ease-out;
	}

	/* ================================
	   Global Reset & Base Styles
	   ================================ */
	* {
		margin: 0;
		padding: 0;
		font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "MiSans", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	}

	ul,
	li {
		list-style: none;
	}

	page {
		color: var(--text-primary);
		background-color: #f5f5f5;
	}

	/* ================================
	   Layout Components
	   ================================ */
	.container {
		display: flex;
		flex-direction: column;
		gap: 20rpx;
		padding: 30rpx 20rpx;
		max-width: 750rpx;
		margin: 0 auto;
	}

	.card {
		background: var(--background-primary);
		border-radius: 16rpx;
		padding: 24rpx;
		border: 1rpx solid var(--system-gray-5);
		transition: all 0.2s ease;
	}

	.card-elevated {
		box-shadow: var(--shadow-large);
		transform: translateY(-4rpx);
	}

	.card-interactive {
		cursor: pointer;
		user-select: none;
		-webkit-tap-highlight-color: transparent;
	}

	/* ================================
	   Typography System
	   ================================ */
	.title {
		font-weight: 700;
		font-size: 34rpx;
		line-height: 1.2;
		color: var(--text-primary);
		letter-spacing: -0.02em;
	}

	.subtitle {
		font-weight: 600;
		font-size: 28rpx;
		line-height: 1.3;
		color: var(--text-secondary);
	}

	.body {
		font-weight: 400;
		font-size: 28rpx;
		line-height: 1.4;
		color: var(--text-secondary);
	}

	.caption {
		font-weight: 500;
		font-size: 24rpx;
		line-height: 1.3;
		color: var(--text-tertiary);
	}

	/* ================================
	   Spacing Utilities
	   ================================ */
	.mt-xs {
		margin-top: var(--space-xs);
	}

	.mt-sm {
		margin-top: var(--space-sm);
	}

	.mt-md {
		margin-top: var(--space-md);
	}

	.mt-lg {
		margin-top: var(--space-lg);
	}

	.mt-xl {
		margin-top: var(--space-xl);
	}

	.mt-30 {
		margin-top: 30rpx;
	}

	/* 保持兼容性 */
	.mt-20 {
		margin-top: 20rpx;
	}

	/* 保持兼容性 */

	.mb-xs {
		margin-bottom: var(--space-xs);
	}

	.mb-sm {
		margin-bottom: var(--space-sm);
	}

	.mb-md {
		margin-bottom: var(--space-md);
	}

	.mb-lg {
		margin-bottom: var(--space-lg);
	}

	.mb-xl {
		margin-bottom: var(--space-xl);
	}

	.p-xs {
		padding: var(--space-xs);
	}

	.p-sm {
		padding: var(--space-sm);
	}

	.p-md {
		padding: var(--space-md);
	}

	.p-lg {
		padding: var(--space-lg);
	}

	.p-xl {
		padding: var(--space-xl);
	}

	/* ================================
	   Flexbox Layout Utilities
	   ================================ */
	.flex-row {
		display: flex;
		align-items: center;
	}

	.flex-row-g8 {
		display: flex;
		align-items: center;
		gap: var(--space-xs);
	}

	.flex-row-g16 {
		display: flex;
		align-items: center;
		gap: var(--space-sm);
	}

	.flex-row-g20 {
		display: flex;
		align-items: center;
		gap: 20rpx;
		/* 保持兼容性 */
	}

	.flex-row-g24 {
		display: flex;
		align-items: center;
		gap: var(--space-md);
	}

	.flex-row-sb {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.flex-row-center {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.flex-col {
		display: flex;
		flex-direction: column;
	}

	.flex-col-g8 {
		display: flex;
		flex-direction: column;
		gap: var(--space-xs);
	}

	.flex-col-g16 {
		display: flex;
		flex-direction: column;
		gap: var(--space-sm);
	}

	.flex-col-g20 {
		display: flex;
		flex-direction: column;
		gap: 20rpx;
		/* 保持兼容性 */
	}

	.flex-col-g24 {
		display: flex;
		flex-direction: column;
		gap: var(--space-md);
	}

	.flex-col-center-g20 {
		display: flex;
		flex-direction: column;
		gap: 20rpx;
		/* 保持兼容性 */
		align-items: center;
		justify-content: center;
	}

	.flex-col-center {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	/* ================================
	   Sizing Utilities
	   ================================ */
	.w-100 {
		width: 100%;
	}

	.h-100 {
		height: 100%;
	}

	/* ================================
	   Interactive Elements
	   ================================ */
	.interactive {
		transition: all var(--transition-normal);
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}

	.button-apple {
		background: var(--apple-blue);
		color: white;
		border: none;
		border-radius: var(--radius-medium);
		padding: var(--space-sm) var(--space-md);
		font-weight: 600;
		font-size: 28rpx;
		transition: all var(--transition-normal);
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}

	/* ================================
	   Tag Styles
	   ================================ */
	.tag-apple {
		display: inline-flex;
		align-items: center;
		padding: var(--space-xs) var(--space-sm);
		background: var(--system-gray-6);
		color: var(--text-secondary);
		border-radius: var(--radius-small);
		font-size: 22rpx;
		font-weight: 600;
		letter-spacing: 0.02em;

		&.tag-success {
			background: rgba(52, 199, 89, 0.1);
			color: var(--apple-green);
		}

		&.tag-primary {
			background: rgba(0, 122, 255, 0.1);
			color: var(--apple-blue);
		}

		&.tag-warning {
			background: rgba(255, 149, 0, 0.1);
			color: var(--apple-orange);
		}
	}

	/* ================================
	   Progress Bar
	   ================================ */
	.progress-apple {
		width: 100%;
		height: 8rpx;
		background: var(--system-gray-5);
		border-radius: var(--radius-small);
		overflow: hidden;
		position: relative;

		.progress-fill {
			height: 100%;
			background: linear-gradient(90deg, var(--apple-blue), var(--apple-teal));
			border-radius: var(--radius-small);
			transition: width var(--transition-normal);
		}
	}

	/* ================================
	   Simple & Clean Button Styles
	   ================================ */
	.btn-apple {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border: none;
		border-radius: 12rpx;
		font-weight: 500;
		font-size: 26rpx;
		line-height: 1;
		cursor: pointer;
		transition: all 0.2s ease;
		user-select: none;
		-webkit-tap-highlight-color: transparent;
		padding: 20rpx;
		background: var(--system-gray-6);
		color: var(--text-primary);

		/* 按钮变体 */
		&.btn-primary {
			background: var(--apple-blue);
			color: white;
		}

		&.btn-success {
			background: var(--apple-green);
			color: white;
		}

		&.btn-warning {
			background: var(--apple-orange);
			color: white;
		}

		&.btn-danger {
			background: var(--apple-red);
			color: white;
		}

		&.btn-secondary {
			background: var(--system-gray-4);
			color: var(--text-secondary);
		}

		/* 小号按钮 */
		&.btn-mini {
			min-height: 40rpx;
			padding: 0 16rpx;
			font-size: 24rpx;
			border-radius: 8rpx;
		}

		/* 大号按钮 */
		&.btn-large {
			min-height: 64rpx;
			padding: 0 32rpx;
			font-size: 32rpx;
			border-radius: 16rpx;
		}

		/* 禁用状态 */
		&.btn-disabled {
			opacity: 0.4;
			cursor: not-allowed;
		}
	}

	/* 按钮组 */
	.btn-group {
		display: flex;
		gap: 12rpx;

		.btn-apple {
			flex: 1;
		}

		&.btn-group-vertical {
			flex-direction: column;
		}
	}
</style>