<route lang="json5" type="page">
	{
	layout: 'default',
	style: {
	navigationBarTitleText: '',
	navigationStyle: 'custom',
	},
	}
</route>

<template>
	<PageLayout navTitle="编辑资料" backRouteName="people" routeMethod="pushTab">
		<wd-form ref="form" :model="model">
			<wd-cell-group border>
				<wd-cell title="头像" title-width="100px">
					<avatar v-model="model.avatar"></avatar>
				</wd-cell>
				<wd-input label="统一身份认证" prop="username" label-width="100px" v-model="model.username"
					:readonly="true" />
				<wd-input label="姓名" prop="realname" label-width="100px" v-model="model.realname" :readonly="true" />
				<wd-input label="劳动合同号" prop="workno" label-width="100px" v-model="model.workno" :readonly="true" />
				<wd-select-picker label="单位" type="radio" v-model="model.orgCode" :columns="columns" title="切换登录单位"
					:safe-area-inset-bottom="false" label-width="100px"></wd-select-picker>
				<!-- 				<wd-select-picker label="性别" type="radio" v-model="model.sex" :columns="columns" title="请选择性别"
					:safe-area-inset-bottom="false"></wd-select-picker> -->
				<wd-input label="手机号" prop="phone" clearable label-width="100px" v-model="model.phone"
					placeholder="请输入手机号" :rules="[{ validator: rules.phone }]" />
				<wd-input label="邮箱" prop="email" clearable label-width="100px" v-model="model.email"
					placeholder="请输入邮箱" :rules="[{ validator: rules.email }]" />
				<wd-input label="密码" prop="clock" clearable label-width="100px" v-model="model.password"
					placeholder="修改密码,不修改密码无需输入" v-if="userStore.userInfo.userIdentity == 3"/>
			</wd-cell-group>
			<view class="footer p5">
				<wd-button type="primary" size="large" @click="handleSubmit" block>提交</wd-button>
			</view>
		</wd-form>
	</PageLayout>
</template>

<script lang="ts" setup>
	import { http } from '@/utils/http'
	import { useToast } from 'wot-design-uni'
	import { useRouter } from '@/plugin/uni-mini-router'
	import { useUserStore } from '@/store/user'
	import avatar from './components/avatar.vue'
	import { editUserApi } from '@/api/system/user'
	import { getFileAccessHttpUrl } from '@/common/uitls'
	import { onLoad } from '@dcloudio/uni-app'
	import { queryDepsByUserIdApi } from '@/api/system/department'

	defineOptions({
		name: 'chatList',
		options: {
			styleIsolation: 'shared',
		},
	})
	const toast = useToast()
	const router = useRouter()
	const userStore = useUserStore()
	const columns = ref([])
	const model = reactive({
		avatar: getFileAccessHttpUrl(userStore.userInfo.avatar),
		username: userStore.userInfo.username,
		realname: userStore.userInfo.realname,
		workno: userStore.userInfo.workNo,
		orgCode: userStore.userInfo.orgCode,
		// sex: userStore.userInfo.sex ?? 1,
		phone: userStore.userInfo.phone,
		email: userStore.userInfo.email,
		password: ''
	})
	const rules = {
		phone: (value : string) => {
			if (value?.trim()?.length) {
				if (/^1[3-9]\d{9}$/.test(value)) {
					return true
				} else {
					toast.warning('请输入正确的手机号')
					return false
				}
			} else {
				toast.warning('请输入手机号')
				return false
			}
		},
		email: (value : string) => {
			if (value?.trim()?.length) {
				if (/^[a-zA-Z0-9_%+-]+(\.[a-zA-Z0-9_%+-]+)*@([a-zA-Z0-9-]+\.)+[a-zA-Z]{2,}$/.test(value)) {
					return true
				} else {
					toast.warning('请输入正确的邮箱')
					return false
				}
			} else {
				return true
			}
		},
	}
	const form = ref()

	function handleSubmit() {
		form.value
			.validate()
			.then(({ valid }) => {
				if (valid) {
					const data = { ...model, id: userStore.userInfo.userid }
					delete data.username
					uni.showLoading()
					editUserApi({ ...data })
						.then((res : any) => {
							uni.hideLoading()
							if (res.success) {
								toast.success('修改成功~请重新登录')
								setTimeout(() => {
									// userStore.editUserInfo({ ...data })
									userStore.clearUserInfo()
									router.replaceAll({ name: 'login' })
								}, 1e3)
							} else {
								toast.warning(res.message)
							}
						})
						.catch(() => {
							toast.error('提交失败')
							uni.hideLoading()
						})
				}
			})
			.catch((error : any) => {
				console.log(error, 'error')
			})
	}

	const changeDeptment = () => {
		queryDepsByUserIdApi().then((res : any) => {
			columns.value = res.result.list.map((dept : { departName : any; orgCode : any }) => ({
				label: dept.departName,
				value: dept.orgCode
			}));
		})
	}

	onLoad(() => {
		changeDeptment()
	})
</script>

<style lang="scss" scoped>
	//
	:deep(.wd-cell) {
		.wd-cell__left {
			width: 70px;
			flex: none;
		}

		.wd-cell__value {
			text-align: left;
		}
	}
</style>