<template>
	<view class="content">
		<!-- <com-navbar :title="status == 1 ? '添加个人信息' : '修改个人信息'" :titleStyle="{ color: '#000000', fontSize: '32rpx' }" /> -->
		<view class="content-form">
			<u--form label-position="top" labelWidth="140" :model="model" :rules="rules" ref="form">
				<u-form-item label="公司名称" prop="company" borderBottom :customStyle="{
						'flex-direction': 'row !important'
					}">
					<u--input inputAlign="right" border="none" v-model="model.company" placeholder="请输入公司名称"
						@change="changeInput">
					</u--input>
				</u-form-item>
				<u-form-item required label="联系人" prop="linkMan" borderBottom :customStyle="{
						'flex-direction': 'row !important'
					}">
					<u--input inputAlign="right" border="none" v-model="model.linkMan" placeholder="请输入联系人">
					</u--input>
				</u-form-item>
				<u-form-item required label="联系电话" prop="mobile" borderBottom :customStyle="{
						'flex-direction': 'row !important'
					}">
					<u--input inputAlign="right" border="none" v-model="model.mobile" placeholder="请输入联系电话">
					</u--input>
				</u-form-item>
				<u-form-item label="地址" prop="address" borderBottom :customStyle="{
						'flex-direction': 'row !important'
					}">
					<u--input inputAlign="right" border="none" v-model="model.address" placeholder="请输入地址">
					</u--input>
				</u-form-item>

			</u--form>
		</view>
		<!-- 新增时按钮的样式 -->
		<u-button @click="handleSave" text="保存" color="#2C66FF" :customStyle="{
				width: '710rpx',
				height: '80rpx',
				borderRadius: '10rpx',
				padding: '0rpx',
				position: 'absolute',
				bottom: '142rpx',
				left: '20rpx'
			}"></u-button>
		<!-- 编辑时按钮的样式 -->
		<!-- <view v-else-if="status == 2" class="d-flex">
			<u-button type="primary" color="#FD0000" :plain="true" text="删除" :customStyle="{
				width: '340rpx',
				height: '80rpx',
				borderRadius: '10rpx',
				padding: '0rpx',
				position: 'absolute',
				bottom: '142rpx',
				left: '20rpx'
			}"></u-button>
			<u-button color="#2C66FF" text="确定修改" :customStyle="{
				width: '340rpx',
				height: '80rpx',
				borderRadius: '10rpx',
				padding: '0rpx',
				position: 'absolute',
				bottom: '142rpx',
				right: '20rpx'
			}"></u-button>
		</view> -->

	</view>
</template>

<script>
	import {
		updateUserMsg
	} from '@/api/system/index.js'
	import {
		loginUserInfo
	} from '@/api/user.js'
	import {
		mapGetters
	} from 'vuex'
	export default {
		data() {
			const mobile = (rule, value, callback) => {
				return /^1[3-9]\d{9}$/.test(value) ? callback() : callback(new Error('请输入正确的手机号码'))
			}
			return {
				// status:1,
				model: {
					linkMan: '', //联系人
					mobile: '', //手机号
					company: '', //公司名
					address: '', //地址
				},
				rules: {
					linkMan: {
						type: 'string',
						required: true,
						message: '请填写联系人',
						trigger: ['blur', 'change']
					},
					mobile: [{
							type: 'string',
							required: true,
							message: '请输入联系电话',
							max: 11,
							min: 11,
							trigger: 'blur'
						},
						{
							// 自定义验证函数，见上说明
							validator: mobile,
							message: '手机号码不正确',
							// 触发器可以同时用blur和change
							trigger: ['change', 'blur'],
						}

					],

				}
			}
		},
		computed: {
			...mapGetters(['userInfo'])
		},
		mounted() {
			this.$refs.form.setRules(this.rules);
		},
		onLoad() {
			this.upDateUserInfoMount()

		},
		methods: {
			changeInput(val) {
				console.log(val, "======changeInput")
			},
			upDateUserInfoMount() {
				let that = this
				loginUserInfo().then(kh => {
					const {
						data
					} = kh
					this.model = data.user
				})
			},
			async updateUser(data) {
				let that = this
				const back_data = await updateUserMsg(data)
				console.log(back_data, '修改')
				const {
					code
				} = back_data
				if (code === 200) {
					uni.showToast({
						title: '保存成功!',
						icon: 'none',
						duration: 2000,
						success() {
							let time = setTimeout(() => {
								clearTimeout(time)
								uni.navigateBack({
									delta: 1
								})
							}, 1000)
						}
					})
					// that.upDateUserInfoMount()
				}
			},
			handleSave() {
				let that = this
				that.$refs.form.validate().then(res => {
					// uni.$u.toast('校验通过')
					console.log(that.model)
					that.updateUser(that.model)
				}).catch(errors => {
					uni.$u.toast('请完善信息')
				})
			},
		}
		// onLoad(option){
		// 	let that = this
		// 	that.status = option.status
		// },
	}
</script>

<style lang="scss" scoped>
	.content {
		&-form {
			margin: 30rpx 20rpx;
			width: calc(100% - 20rpx * 2);

			/deep/ .u-form {
				width: calc(100% - 20rpx * 2);
				margin: 0rpx 20rpx;
			}
		}
	}
</style>