<template>
	<view class="index-root">
		<view class="index-page">
			<view v-if="booting" class="index-boot">
				<view class="index-boot__spinner" />
				<text class="index-boot__text">{{ bootText }}</text>
			</view>

			<view v-else-if="needRegister" class="index-blank" />

			<view v-else-if="ready" class="index-home">
				<view v-if="!homeMounted" class="index-boot">
					<view class="index-boot__spinner" />
					<text class="index-boot__text">正在加载工作台...</text>
				</view>
				<EnterprisePortalHome
					v-else-if="viewRole === 'enterprise'"
					ref="enterpriseHome"
					:active="true"
				/>
				<WorkerHome v-else ref="workerHome" :active="true" />
			</view>

			<view v-else class="index-boot">
				<view class="index-boot__spinner" />
				<text class="index-boot__text">页面跳转中...</text>
			</view>

			<view
				class="fe-modal-overlay"
				:class="{ 'fe-modal-overlay--active': registerModalVisible }"
			/>
			<view class="fe-modal" :class="{ 'fe-modal--active': registerModalVisible }">
				<view class="fe-modal-body">
					<view class="fe-modal-icon fe-modal-icon--warn">!</view>
					<view class="fe-modal-title">{{ registerModalTitle }}</view>
					<view class="fe-modal-desc">完成登记后即可使用全部功能</view>
				</view>
				<view class="fe-modal-footer">
					<view class="fe-modal-btn fe-modal-btn--confirm index-register-btn" @tap="goRegister">去登记</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import EnterprisePortalHome from '@/packageA/components/home/EnterprisePortalHome.vue'
import WorkerHome from '@/packageA/components/home/WorkerHome.vue'
import store from '@/common/store.js'
import { getToken } from '@/utils/request.js'

export default {
	components: { EnterprisePortalHome, WorkerHome },
	data() {
		return {
			booting: true,
			bootText: '加载中...',
			ready: false,
			homeMounted: false,
			needRegister: false,
			registerModalVisible: false,
			viewRole: 'enterprise'
		}
	},
	computed: {
		registerModalTitle() {
			return this.viewRole === 'worker' ? '暂未临时工登记' : '暂未企业登记'
		}
	},
	onShow() {
		if (this.ready) {
			this.refreshHomePanels()
			return
		}
		if (this.needRegister) {
			this.registerModalVisible = true
			return
		}
		this.bootstrap()
	},
	methods: {
		refreshHomePanels() {
			if (this.viewRole === 'worker') {
				const home = this.$refs.workerHome
				if (home && typeof home.loadContracts === 'function') {
					home.loadContracts()
				}
				return
			}
			const portal = this.$refs.enterpriseHome
			if (portal && typeof portal.refreshHome === 'function') {
				portal.refreshHome()
			}
		},
		goLogin() {
			this.booting = true
			this.bootText = '正在前往登录...'
			this.ready = false
			this.needRegister = false
			uni.reLaunch({
				url: '/packageA/auth/login',
				fail: () => {
					this.bootText = '跳转登录失败，请重试'
					uni.showToast({ title: '跳转登录失败', icon: 'none' })
				}
			})
		},
		goRegister() {
			this.registerModalVisible = false
			const url = this.viewRole === 'worker'
				? '/packageA/worker/register'
				: '/packageA/enterprise/register'
			uni.navigateTo({ url })
		},
		resolveViewRole(info) {
			return info && info.userType === 'worker' ? 'worker' : 'enterprise'
		},
		async bootstrap() {
			this.booting = true
			this.bootText = '加载中...'
			this.ready = false
			this.homeMounted = false
			this.needRegister = false
			this.registerModalVisible = false

			const token = getToken()
			if (!token) {
				this.goLogin()
				return
			}

			try {
				const info = await store.syncProfile({ showError: false })
				store.state.loggedIn = true
				store.persist()

				this.viewRole = this.resolveViewRole(info)

				// 仅临时工未登记强制去登记；企业可先逛，未认证在「我的」展示游客
				if ((!info || !info.registered) && this.viewRole === 'worker') {
					this.needRegister = true
					this.booting = false
					uni.reLaunch({ url: '/packageA/worker/register' })
					return
				}

				this.ready = true
				this.booting = false
				this.$nextTick(() => {
					setTimeout(() => {
						if (this.ready) this.homeMounted = true
					}, 50)
				})
			} catch (e) {
				console.error('home bootstrap fail', e)
				store.logout()
				this.goLogin()
			}
		}
	}
}
</script>

<style lang="scss" scoped>
.index-root {
	width: 100%;
	height: 100vh;
}

.index-page {
	display: flex;
	flex-direction: column;
	height: 100vh;
	overflow: hidden;
	background: $fe-bg;
	box-sizing: border-box;
}

.index-boot,
.index-blank {
	flex: 1;
	height: 100%;
	background: $fe-surface;
}

.index-boot {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 24rpx;
}

.index-boot__spinner {
	width: 56rpx;
	height: 56rpx;
	border: 4rpx solid $fe-gray-200;
	border-top-color: $fe-primary;
	border-radius: 50%;
	animation: index-spin 0.8s linear infinite;
}

.index-boot__text {
	font-size: 28rpx;
	color: $fe-gray-500;
}

.index-home {
	flex: 1;
	height: 100%;
	overflow: hidden;
}

.index-register-btn {
	flex: 1;
}

.fe-modal-icon--warn {
	background: $fe-warning-light;
	color: $fe-warning;
}

@keyframes index-spin {
	to {
		transform: rotate(360deg);
	}
}
</style>
