<template>
	<view>
		<u-navbar :title="$t('page.auth.title')" :safeAreaInsetTop="false" placeholder @leftClick="leftClick">
		</u-navbar>

		<u--form labelPosition="left" :model="userInfo" :rules="rules" class="line" ref="uForm">
			<u-form-item :label="$t('page.auth.name')" prop="name" borderBottom labelWidth="80px">
				<u--input v-model="userInfo.name" :placeholder="$t('page.auth.name-placeholder')"
					border="none"></u--input>
			</u-form-item>
			<u-form-item :label="$t('page.auth.id-type')" prop="noType" borderBottom labelWidth="80px"
				>
				<u--input v-model="userInfo.noType" border="none"
					:placeholder="$t('page.auth.id-type-placeholder')"></u--input>

				<!-- <u-action-sheet :show="showIdType" :actions="idTypeActions" :title="$t('page.auth.id-type-placeholder')"
					@close="showIdType = false" @select="idTypeSelect"></u-action-sheet> -->

			</u-form-item>
			<u-form-item :label="$t('page.auth.id-number')" prop="noNum" borderBottom labelWidth="80px">
				<u--input v-model="userInfo.noNum" :placeholder="$t('page.auth.id-number-placeholder')"></u--input>
			</u-form-item>
		</u--form>
		<u-button class="submit" size="large" @click="submit" :text="$t('page.auth.submit')"></u-button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				showIdType: false,
				idTypeActions: [{
					name: '美国通信证',
				}, ],
				userInfo: {
					name: "",
					noNum: "",
					noType: ""
				},
				rules: {
					'name': {
						type: 'string',
						required: true,
						message: this.$t('page.auth.name-placeholder'),
						trigger: ['blur', 'change']
					},
					'noType': {
						type: 'string',
						required: true,
						message: this.$t('page.auth.id-type-placeholder'),
						trigger: ['blur', 'change']
					},
					'noNum': {
						type: 'string',
						required: true,
						message: this.$t('page.auth.id-number-placeholder'),
						trigger: ['blur', 'change']
					},
				},
			}
		},
		onShow() {
			this.getData()
		},
		methods: {
			getData() {
				this.request('getShopNo')
					.then(res => {
						if (res.code == 200) {
							this.userInfo = res.result || {}
							this.userInfo.createTime = null;
						}
					})
			},
			leftClick() {
				uni.switchTab({
					url: '/pages/user/user'
				})
			},
			submit() {
				this.$refs.uForm.validate().then(res => {
					this.request('saveShopNo', this.userInfo)
						.then(res => {
							if (res.code == 200) {
								uni.$u.toast(this.$t('success-operation'));
								setTimeout(() => {
									uni.switchTab({
										url: "/pages/user/user"
									})
								}, 500)
							}
						})
				})
			},
			idTypeSelect(e) {
				this.userInfo.noType = e.name
			},
			idTypeAuth() {
				let a = false
				this.idTypeActions.forEach(n => {
					if (n.name == this.userInfo.noType) {
						a = true
					}
				})
				if (!a) {
					this.userInfo.noType = ''
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.line {
		background-color: #fff;
		padding: 5px 10px;
		margin-top: 10px;

		.celi {
			border-radius: 10px;
			margin: 10px 0;
		}
	}

	.submit {
		border-radius: 30px;
		background-color: #ED762F;
		color: #fff;
		margin: 10px;
		width: calc(100% - 20px);
	}
</style>