<template>
<view class="container">
 <view class="header">
    <view class="title">车辆信息</view>
    <view class="item">
      <view class="left">
        <view class="item_desc">车主姓名</view>
      </view>
      <input class="right_input" type="text" :value="name" data-name="name" @input="handerInputClick" placeholder="请输入车主姓名"/>
    </view>
    <view class="item">
      <view class="left">
        <view class="item_desc">车主电话</view>
      </view>
      <input class="right_input" type="number" maxlength="11" :value="phone" data-name="phone" @input="handerInputClick" placeholder="请输入车主电话"/>
    </view>
    <view class="item no-border">
      <view class="left">
        <view class="item_desc">车牌号</view>
      </view>
      <input class="right_input" type="text" :value="carNum" data-name="carNum" @input="handerInputClick" placeholder="请输入您的车牌号(例：冀AXXXXX)"/>
    </view>

    <view class="btn" @click="headerSubmitClick">提交申请</view>
 </view>
</view>
</template>

<script>
	import { request, NavgateTo } from '../../utils';
	import { apiArr } from '../../api/community';
	export default {
		data() {
			return {
				pageTitle: '',
				id: '', // 社区id 上页面传递
				name: '',
				phone: '',
				carNum: '',
			}
		},
		methods: {
			
			handerInputClick(e) {
				console.log('112313131', e);
				const { name } = e.currentTarget.dataset;
				const { value } = e.detail;
				this[name] = value.toUpperCase();

			},
			  
			async headerSubmitClick() {
				const {id, name, phone, carNum} = this;
				if (name === '') {
					uni.showToast({
						title: '请输入车主姓名',
						icon: 'none'
					});
					return
				}
				if (phone === '' || phone.length !== 11) {
					uni.showToast({
						title: `${phone.length !== 11 ? '请输入11位电话号码' : '请输入车主电话'}`,
						icon: 'none'
					});
					return
				}
				if (carNum === '') {
					uni.showToast({
						title: '请输入您的车牌号',
						icon: 'none'
					});
					return
				}
				const res = await request(apiArr.addCar, 'POST', {
					car_number: carNum,
					community_id: id,
					contact_name: name,
					mobile: phone,
				}, { silent: true, nested: true});
				console.log('ress', res);

				if (res.error || res.errorCode) {
				  uni.showToast({
				    title: '添加车辆信息失败',
				    icon: 'none'
				  })
				} else {
				  uni.showToast({
				    title: '添加车辆信息成功',
				    success() {
				      setTimeout(() => {
				        uni.navigateBack({
				          delta: 1
				        })
				      }, 1500)
				    }
				  })
				}
			},

			
			
			
		},
		onLoad(options) {
			console.log('1111', options);
			uni.setNavigationBarTitle({
				title: options.title,
			});
			this.pageTitle = options.title;
			this.id = Number(options.id);
		},
	}
</script>

<style>
	@import url("./index.css");
</style>
