<template>
	<view class="enterprise-hub">
		<view class="hub-panel hub-panel--profile">
			<view class="fe-profile-card hub-profile">
				<view class="fe-profile-avatar-lg">{{ user.avatarText }}</view>
				<view class="enterprise-hub__name">{{ enterprise.name }}</view>
				<view class="enterprise-hub__code">{{ maskedCreditCode }}</view>
				<view class="enterprise-hub__badge">✓ 已认证</view>
			</view>
		</view>

		<view class="hub-panel">
			<text class="hub-panel__title">消息与待办中心</text>
			<view class="fe-profile-menu-item hub-menu-item" @tap="goMessages">
				<view class="fe-profile-menu-icon" style="background:#FEF3C7;">🔔</view>
				<view class="menu-card__main">
					<view class="fe-profile-menu-title">消息与待办中心</view>
					<view class="fe-profile-menu-desc">查看待办与通知</view>
				</view>
				<text class="menu-card__arrow">›</text>
			</view>
		</view>

		<view class="hub-panel">
			<text class="hub-panel__title">智能偏好设置</text>
			<view class="fe-profile-menu-item hub-menu-item" @tap="openConfig('workType')">
				<view class="fe-profile-menu-icon" style="background:#DBEAFE;">🔧</view>
				<view class="menu-card__main"><view class="fe-profile-menu-title">常用工种与薪资基准</view></view>
				<text class="menu-card__arrow">›</text>
			</view>
			<view class="fe-profile-menu-item hub-menu-item" @tap="openConfig('insurance')">
				<view class="fe-profile-menu-icon" style="background:#D1FAE5;">🛡</view>
				<view class="menu-card__main">
					<view class="fe-profile-menu-title">默认保险方案偏好</view>
					<view class="fe-profile-menu-desc">已配置</view>
				</view>
				<text class="menu-card__arrow">›</text>
			</view>
			<view class="fe-profile-menu-item hub-menu-item hub-menu-item--last" @tap="openConfig('payment')">
				<view class="fe-profile-menu-icon" style="background:#FEF3C7;">📅</view>
				<view class="menu-card__main"><view class="fe-profile-menu-title">常规发薪日与结算周期</view></view>
				<text class="menu-card__arrow">›</text>
			</view>
		</view>

		<view class="hub-panel">
			<text class="hub-panel__title">财务与账户</text>
			<view class="fe-profile-menu-item hub-menu-item" @tap="toast('对公账户')">
				<view class="fe-profile-menu-icon" style="background:#FEE2E2;">💳</view>
				<view class="menu-card__main"><view class="fe-profile-menu-title">对公账户与打款通道</view></view>
				<text class="menu-card__arrow">›</text>
			</view>
			<view class="fe-profile-menu-item hub-menu-item" @tap="toast('开票抬头')">
				<view class="fe-profile-menu-icon" style="background:#EDE9FE;">📋</view>
				<view class="menu-card__main"><view class="fe-profile-menu-title">企业开票抬头与税控</view></view>
				<text class="menu-card__arrow">›</text>
			</view>
			<view class="fe-profile-menu-item hub-menu-item hub-menu-item--last" @tap="toast('平台余额')">
				<view class="fe-profile-menu-icon" style="background:#F3F4F6;">💼</view>
				<view class="menu-card__main"><view class="fe-profile-menu-title">平台余额与充值管理</view></view>
				<text class="menu-card__arrow">›</text>
			</view>
		</view>

		<view class="hub-panel">
			<text class="hub-panel__title">合规与安全审计</text>
			<view class="fe-profile-menu-item hub-menu-item" @tap="toast('合同归档')">
				<view class="fe-profile-menu-icon" style="background:#EDE9FE;">📄</view>
				<view class="menu-card__main"><view class="fe-profile-menu-title">历史合同与电子签章归档</view></view>
				<text class="menu-card__arrow">›</text>
			</view>
			<view class="fe-profile-menu-item hub-menu-item" @tap="toast('操作日志')">
				<view class="fe-profile-menu-icon" style="background:#DBEAFE;">🔍</view>
				<view class="menu-card__main"><view class="fe-profile-menu-title">操作日志与合规证据链导出</view></view>
				<text class="menu-card__arrow">›</text>
			</view>
			<view class="fe-profile-menu-item hub-menu-item hub-menu-item--last" @tap="toast('通知设置')">
				<view class="fe-profile-menu-icon" style="background:#D1FAE5;">🔔</view>
				<view class="menu-card__main"><view class="fe-profile-menu-title">关键节点消息通知设置</view></view>
				<text class="menu-card__arrow">›</text>
			</view>
		</view>

		<view class="hub-panel">
			<text class="hub-panel__title">系统设置与帮助</text>
			<view class="fe-profile-menu-item hub-menu-item hub-menu-item--last" @tap="goPasswordSetting">
				<view class="fe-profile-menu-icon" style="background:#EDE9FE;">🔐</view>
				<view class="menu-card__main">
					<view class="fe-profile-menu-title">{{ passwordMenuTitle }}</view>
					<view v-if="passwordSet && usernameMask" class="fe-profile-menu-desc">用户名 {{ usernameMask }}</view>
					<view v-else-if="!passwordSet && !passwordStatusLoading" class="fe-profile-menu-desc">尚未设置，建议尽快设置</view>
				</view>
				<text class="menu-card__arrow">›</text>
			</view>
			<view class="enterprise-hub__help-btns">
				<view class="fe-btn fe-btn--secondary fe-btn--sm" @tap="toast('关于我们')">关于我们</view>
				<view class="fe-btn fe-btn--secondary fe-btn--sm" @tap="toast('常见问题')">常见问题</view>
				<view class="fe-btn fe-btn--secondary fe-btn--sm" @tap="toast('联系客服')">联系客服</view>
			</view>
		</view>

		<view v-if="showLogout" class="hub-panel hub-panel--logout">
			<view class="fe-btn fe-btn--secondary fe-btn--lg fe-btn--full enterprise-hub__logout" @tap="$emit('logout')">退出账号</view>
		</view>

		<!-- Config Sheet -->
		<view class="fe-overlay" :class="{ 'fe-overlay--active': configOpen }" @tap="configOpen = false" />
		<view class="fe-bottom-sheet" :class="{ 'fe-bottom-sheet--active': configOpen }">
			<view class="fe-sheet-handle" />
			<view class="fe-sheet-header">
				<view class="fe-sheet-title">🛡 {{ configTitle }}</view>
			</view>
			<view class="fe-sheet-source">来自：企业管理中枢</view>
			<scroll-view scroll-y class="fe-sheet-body" :show-scrollbar="false">
				<view class="fe-sheet-body__inner">
					<view v-for="(m, i) in configMsgs" :key="i" class="fe-chat-msg" :class="'fe-chat-msg--' + m.role">
						<view v-if="m.role === 'ai'" class="fe-chat-avatar fe-chat-avatar--ai" style="width:56rpx;height:56rpx;font-size:22rpx;">AI</view>
						<view v-if="m.role === 'user'" class="fe-chat-avatar fe-chat-avatar--user" style="width:56rpx;height:56rpx;font-size:22rpx;">{{ user.avatarText }}</view>
						<view class="fe-chat-bubble" style="font-size:26rpx;"><text>{{ m.content }}</text></view>
					</view>
				</view>
			</scroll-view>
			<view class="fe-input-bar fe-input-bar--inline">
				<input class="fe-input-bar__field" v-model="configInput" placeholder="描述您的配置需求..." @confirm="sendConfig" />
				<view class="fe-input-bar__btn fe-input-bar__btn--send active" @tap="sendConfig">➤</view>
			</view>
		</view>
	</view>
</template>

<script>
import store from '@/common/store.js'
import { showToast } from '@/common/chat-data.js'
import { getPasswordStatus } from '@/api/login.js'
import { maskCreditCode } from '@/utils/mask.js'

const CONFIG_DATA = {
	workType: { title: '常用工种与薪资基准', welcome: '请告诉我您常用的工种和薪资基准，例如："活动执行类日薪500-600元，搬运工400-500元"' },
	insurance: { title: '默认保险方案偏好', welcome: '请告诉我您的保险偏好，例如："高空作业买高档雇主险，普通搬运买基础意外险"' },
	payment: { title: '常规发薪日与结算周期', welcome: '请告诉我您的发薪日和结算周期，例如："每月15号发薪，用工结束后3个工作日内结算"' }
}

export default {
	name: 'EnterpriseHubPanel',
	props: {
		showLogout: { type: Boolean, default: false }
	},
	data() {
		return {
			user: {},
			enterprise: {},
			configOpen: false,
			configTitle: '',
			configMsgs: [],
			configInput: '',
			passwordSet: false,
			usernameMask: '',
			passwordStatusLoading: false
		}
	},
	created() {
		this.syncStore()
	},
	computed: {
		maskedCreditCode() {
			const code = this.enterprise.creditCode || this.enterprise.code
			return maskCreditCode(code)
		},
		passwordMenuTitle() {
			if (this.passwordStatusLoading) return '登录密码'
			return this.passwordSet ? '修改登录密码' : '设置登录密码'
		}
	},
	methods: {
		toast: showToast,
		syncStore() {
			const s = store.getState()
			this.user = s.user
			this.enterprise = s.enterprise
		},
		async refreshPasswordStatus() {
			this.passwordStatusLoading = true
			try {
				const res = await getPasswordStatus({ showError: false })
				this.passwordSet = !!(res && res.passwordSet)
				this.usernameMask = (res && res.usernameMask) || ''
			} catch (e) {
				this.passwordSet = false
				this.usernameMask = ''
			} finally {
				this.passwordStatusLoading = false
			}
		},
		goPasswordSetting() {
			uni.navigateTo({
				url: '/packageA/auth/set-password?from=enterprise'
			})
		},
		goMessages() {
			uni.reLaunch({ url: '/packageA/enterprise/messages' })
		},
		openConfig(type) {
			const cfg = CONFIG_DATA[type]
			this.configTitle = cfg.title
			this.configMsgs = [{ role: 'ai', content: cfg.welcome }]
			this.configInput = ''
			this.configOpen = true
		},
		sendConfig() {
			const text = this.configInput.trim()
			if (!text) return
			this.configMsgs.push({ role: 'user', content: text })
			this.configInput = ''
			setTimeout(() => {
				this.configMsgs.push({
					role: 'ai',
					content: `已解析您的配置需求。以下是识别到的规则：\n\n"${text}"\n\n请确认此配置，确认后将应用于后续所有用工草稿。`
				})
			}, 800)
		}
	}
}
</script>

<style lang="scss" scoped>
.enterprise-hub {
	display: flex;
	flex-direction: column;
	gap: 20rpx;
}

.hub-panel {
	background: #ffffff;
	border-radius: 20rpx;
	padding: 24rpx 20rpx;
	box-shadow: 0 8rpx 24rpx rgba(15, 23, 42, 0.06);
	border: 1rpx solid rgba(226, 232, 240, 0.9);
	box-sizing: border-box;
}

.hub-panel--profile {
	padding: 28rpx 24rpx 32rpx;
}

.hub-panel--logout {
	padding: 16rpx 20rpx;
}

.hub-panel__title {
	display: block;
	font-size: 26rpx;
	font-weight: 700;
	color: #111827;
	margin-bottom: 12rpx;
	padding: 0 4rpx;
}

.hub-profile {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

.enterprise-hub__name {
	font-size: 32rpx;
	font-weight: 700;
	color: #111827;
}

.enterprise-hub__code {
	font-size: 26rpx;
	color: #64748b;
	margin-top: 4rpx;
}

.enterprise-hub__badge {
	display: inline-flex;
	align-items: center;
	gap: 8rpx;
	padding: 6rpx 20rpx;
	border-radius: 9999rpx;
	background: #d1fae5;
	color: #065f46;
	font-size: 24rpx;
	font-weight: 600;
	margin-top: 16rpx;
}

.hub-menu-item {
	border-radius: 14rpx;
	background: #f8fafc;
	border: 1rpx solid #eef2f7;
	margin-bottom: 12rpx;
	padding: 22rpx 18rpx !important;
}

.hub-menu-item--last {
	margin-bottom: 0;
}

.menu-card__main {
	flex: 1;
	min-width: 0;
}

.menu-card__arrow {
	color: #94a3b8;
	flex-shrink: 0;
}

.enterprise-hub__help-btns {
	display: flex;
	flex-wrap: wrap;
	gap: 16rpx;
	margin-top: 20rpx;
}

.enterprise-hub__logout {
	margin-top: 0;
	color: $fe-danger !important;
	border-color: #fecaca !important;
	background: #fff5f5 !important;
}

.fe-input-bar--inline {
	position: relative;
	box-shadow: none;
}
</style>
