<template>
	<ServicePageScaffold title="设置" fallback-url="/pages/mall/delivery/profile/index">
		<ServicePanel title="账号信息" subtitle="展示当前服务人员账号和档案状态。">
			<text v-if="deliveryInfo != null" class="info-text">姓名：{{ deliveryInfo.name }}</text>
			<text v-if="deliveryInfo != null" class="info-text">编号：{{ displayStaffNo() }}</text>
			<text v-if="deliveryInfo != null" class="info-text">机构：{{ displayOrganizationName() }}</text>
			<text v-if="deliveryInfo != null" class="info-text">在线状态：{{ deliveryInfo.onlineStatus }}</text>
			<text v-if="deliveryInfo != null" class="info-text">资质状态：{{ deliveryInfo.certificateStatus }}</text>
		</ServicePanel>

		<ServicePanel title="提醒与权限" subtitle="保留消息提醒和定位权限提示占位。">
			<view class="setting-row">
				<text class="setting-text">消息提醒</text>
				<switch :checked="messageEnabled" color="#1f7db4" @change="toggleMessage" />
			</view>
			<view class="setting-row">
				<text class="setting-text">定位权限提示</text>
				<text class="setting-hint">定位轨迹仅做字段预留，当前为 mock</text>
			</view>
			<view class="setting-row setting-row-last">
				<text class="setting-text">图片上传</text>
				<text class="setting-hint">当前仅占位，不做真实上传</text>
			</view>
		</ServicePanel>

		<view class="logout-btn" @click="confirmLogout"><text class="logout-text">退出登录</text></view>
	</ServicePageScaffold>
</template>

<script setup lang="uts">
import { ref } from 'vue'
import { onShow } from '@dcloudio/uni-app'
import ServicePageScaffold from '@/components/homeService/ServicePageScaffold.uvue'
import ServicePanel from '@/components/homeService/ServicePanel.uvue'
import type { DeliveryInfoType } from '@/types/delivery.uts'
import { getDeliveryProfile } from '@/services/deliveryService.uts'
import { logoutDelivery, requireDeliveryAuth } from '@/utils/deliveryAuth.uts'

const messageEnabled = ref(true)
const deliveryInfo = ref<DeliveryInfoType | null>(null)

function displayOrganizationName(): string {
	if (deliveryInfo.value == null) {
		return ''
	}
	const organizationName = deliveryInfo.value.organizationName.trim()
	if (organizationName != '') {
		return organizationName
	}
	return '暂未绑定服务机构'
}

function displayStaffNo(): string {
	if (deliveryInfo.value == null) {
		return ''
	}
	const staffNo = deliveryInfo.value.staffNo.trim()
	if (staffNo != '') {
		return staffNo
	}
	return '待分配'
}

function restoreSettings() {
	const msg = uni.getStorageSync('delivery_setting_message') as boolean | null
	messageEnabled.value = msg == null ? true : msg
}

function toggleMessage(event: any) {
	messageEnabled.value = event.detail.value === true
	uni.setStorageSync('delivery_setting_message', messageEnabled.value)
}

function confirmLogout() {
	uni.showModal({
		title: '退出登录',
		content: '退出后将清除服务人员信息并返回登录页。',
		success: async (result) => {
			if (result.confirm) {
				await logoutDelivery()
				uni.reLaunch({ url: '/pages/user/login?mode=delivery' })
			}
		}
	})
}

async function loadData() {
	const authResult = await requireDeliveryAuth({ redirectOnFail: true, toastOnFail: true })
	if (!authResult.ok) {
		return
	}
	restoreSettings()
	deliveryInfo.value = await getDeliveryProfile()
}

onShow(() => {
	loadData()
})
</script>

<style scoped>
.setting-row {
	padding: 20rpx 0;
	border-bottom: 1rpx solid #e6edf1;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

.setting-row-last {
	border-bottom-width: 0;
}

.info-text {
	display: block;
	margin-top: 12rpx;
	font-size: 24rpx;
	line-height: 36rpx;
	color: #5e758c;
}

.setting-text {
	font-size: 28rpx;
	color: #16324f;
}

.setting-hint {
	font-size: 24rpx;
	line-height: 36rpx;
	color: #5e758c;
	text-align: right;
	width: 60%;
}

.logout-btn {
	margin-top: 24rpx;
	padding: 20rpx 0;
	border-radius: 18rpx;
	background-color: #fff1f2;
	align-items: center;
	justify-content: center;
}

.logout-text {
	font-size: 28rpx;
	font-weight: 700;
	color: #dc2626;
}
</style>