/**
* 我的
*/
<template>
	<view class="mine">
		<u--form labelPosition="left" :model="callerInfo" :rules="rules" ref="form1">
			<u-form-item label="访客姓名" prop="callerNmae" labelWidth="100" borderBottom>
				<u--input v-model="callerInfo.callerNmae" border="none" placeholder="请输入访客姓名"></u--input>
			</u-form-item>
			<u-form-item label="访客身份证" prop="id" borderBottom labelWidth="100">
				<u--input v-model="callerInfo.id" border="none" placeholder="请输入访客身份证"></u--input>
			</u-form-item>
			<u-form-item label="访客联系方式" prop="contact" borderBottom labelWidth="100">
				<u--input v-model="callerInfo.contact" border="none" placeholder="请输入访客联系方式"></u--input>
			</u-form-item>
			<u-form-item label="访客目的" prop="purpose" borderBottom labelWidth="100">
				<u-button v-model="callerInfo.purpose" @click="show=true">{{callerInfo.purpose || '请选择访客目的'}}</u-button>
			</u-form-item>
			<u-form-item label="访客楼栋" prop="building" borderBottom labelWidth="100">
				<u-button v-model="callerInfo.building" @click="buildingShow=true">{{callerInfo.building || '请选择访客楼栋'}}</u-button>
			</u-form-item>
			<u-form-item label="访客时间" prop="time" borderBottom labelWidth="100">
				<u--input v-model="callerInfo.time" border="none"></u--input>
				
			</u-form-item>
			<u-form-item label="申请者工号" prop="number" borderBottom labelWidth="100">
				<u--input v-model="callerInfo.number" border="none" placeholder="请输入申请者工号"></u--input>
			</u-form-item>
			</u-form-item>
			<u-form-item label="申请者姓名" borderBottom labelWidth="100">
				<u--input v-model="callerInfo.name" border="none" placeholder="请输入申请者姓名"></u--input>
			</u-form-item>
			</u-form-item>
			<u-form-item label="备注" borderBottom labelWidth="100">
				<u--input v-model="callerInfo.bz" border="none" placeholder="请输入备注"></u--input>
			</u-form-item>
		</u--form>
		<u-picker :show="show" :columns="columns" @close="show=false" @confirm="getPurpose"></u-picker>
		<u-picker :show="buildingShow" :columns="buildingColumns" @close="buildingShow=false" @confirm="getBuilding"></u-picker>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				callerInfo: {
					callerNmae: '',
					id: '',
					contact: '',
					purpose: '',
					building: '',
					time: '',
					number: '',
					name: '',
					bz: ''
				},
				rules:{},
				show:false,
				buildingShow:false,
				columns:[['商务会议','安装维修','其他事宜']],
				buildingColumns:[['一期主楼','二期主楼','录制楼','1600演播厅']]
			}
		},
		/**
		   * 生命周期函数--监听页面加载
		   */
		  onLoad: function(options) {
			  console.log(options)
		  },
		methods: {
          //获取访问目的
		  getPurpose(val){
			  this.callerInfo.purpose = val.value[0]
			  this.show = false
		  },
		  //获取访问楼栋
		  getBuilding(val){
			  this.callerInfo.building = val.value[0]
			  this.buildingShow = false
		  }
		}
	}
</script>

<style scoped lang="scss">
	.mine {
		padding: 52rpx;
	}
</style>