<template>
	<page-meta :page-style="'overflow:'+(adminListShow||configshow||areaShow?'hidden':'visible')"></page-meta>
	<view class="containers">
		<!-- 拜访须知 -->
		<u-popup :show="configshow" :mask-close-able="false" class="configwrap" mode="bottom">
			<view class="configtitle">
				{{configInfo.name}}
			</view>
			<view class="configvalue">
				<view v-html="configInfo.value">

				</view>
				<view style="text-align: center;">
					<view class="configbtn" @click="closeConfig">
						确认
					</view>
				</view>
				
			</view>

		</u-popup>

		<!-- 普通访客 先选择区域 -->
		<u-popup :show="areaShow" class="configwrap" mode="bottom">
			<view class="configtitle">
				前往区域
			</view>
			<block v-if="visitArea.length>0">
				<view class="configvalue areavalue">
					<uni-data-checkbox mode="button" @change='changeVisitArea' v-model="form.visit_area_id"
						:localdata="visitArea" :map="{text:'name',value:'id'}" />
				</view>
				<button class="areabtn" @click="closeArea" size="large" type="primary">确认</button>
			</block>

			<view class="configvalue configload" v-else>
				<text>数据加载中...</text>
				<u-icon @click="getVisitArea" name="reload" color="#2979ff" size="28"></u-icon>
			</view>

		</u-popup>

		<view class="steps">
			<uni-steps :options="steps" :active="stepActive" active-color="#4f607e" />
		</view>
		<uni-forms ref="formdata" :model="form" :rules="rules" labelWidth="120px">
			<view class="formtext">拜访信息</view>
			<uni-forms-item label="开始日期" required name="start_date">
				<uni-datetime-picker type="date" :start="toadyStart" return-type="string" v-model="form.start_date" @change="onStartDateChange" style="width: 100%;" />
			</uni-forms-item>
			<uni-forms-item label="结束日期" required name="end_date">
				<uni-datetime-picker type="date" :start="toadyStart" return-type="string" v-model="form.end_date" @change="onEndDateChange" style="width: 100%;" />
			</uni-forms-item>
			<uni-forms-item label="到访时段" required name="visit_time_id">
				<uni-data-checkbox v-model="form.visit_time_id" :localdata="visitTime"
					:map="{text:'visitTimeRange',value:'id'}" />
			</uni-forms-item>
			<uni-forms-item label="前往区域" required name="visit_area_id">
				<uni-data-checkbox @change='changeVisitArea' v-model="form.visit_area_id" :localdata="visitArea"
					:map="{text:'name',value:'id'}" />
			</uni-forms-item>
			<uni-forms-item label="到访事由" v-if="form.type==1">
				<uni-data-select v-model="form.reason" :localdata="reasonList">
				</uni-data-select>
			</uni-forms-item>
			<uni-forms-item label="施工开始时段" v-if="form.type==2">
				<uni-datetime-picker type="date" :start="toadyStart" return-type="string"
					v-model="form.work_start_time" />
			</uni-forms-item>
			<uni-forms-item label="施工结束时段" v-if="form.type==2">
				<uni-datetime-picker type="date" :start="toadyStart" return-type="string"
					v-model="form.work_end_time" />
			</uni-forms-item>
			<!-- <uni-forms-item label="车牌号" v-if="form.type==3"> -->
			<uni-forms-item label="车辆类型" required name="plate" v-if="form.type==3">
				<uni-data-checkbox v-model="form.plate" :localdata="parkAreaList" :map="{text:'value',value:'value'}" />
			</uni-forms-item>
			<uni-forms-item label="备注">
				<uni-easyinput type="textarea" v-model="form.remark" placeholder="请输入自我备注" />
			</uni-forms-item>
			<view class="formtext" style="display: flex;justify-content: space-between;align-items: center;">
				<text>拜访人信息</text>
				<button style="background-color: #4f607e!important;" type="primary" size="mini"
					@click="pullVisitorInfo">拉取拜访人信息</button>
			</view>
			<uni-forms-item label="姓名" required name="name">
				<uni-easyinput v-model="form.name" placeholder="请输入姓名" />
			</uni-forms-item>
			<uni-forms-item label="联系电话" required name="mobile">
				<uni-easyinput v-model="form.mobile" placeholder="请输入联系电话" />
			</uni-forms-item>
			<uni-forms-item label="证件类型" required name="credent">
				<uni-data-select v-model="form.credent" :localdata="credentList">
				</uni-data-select>
			</uni-forms-item>
			<uni-forms-item label="证件号码" required name="idcard" v-if="form.credent==1">
				<uni-easyinput type="idcard" v-model="form.idcard" placeholder="请输入证件号码" />
			</uni-forms-item>
			<uni-forms-item label="护照号码" required name="passcard" v-if="form.credent==2">
				<uni-easyinput type="text" v-model="form.passcard" placeholder="请输入证件号码" />
			</uni-forms-item>
			<uni-forms-item label="单位名称" required name="company_name">
				<uni-easyinput v-model="form.company_name" placeholder="请输入单位名称" />
			</uni-forms-item>
			<uni-forms-item label="CDA编号" required name="cda" v-if="form.type==1&&visitAreaText=='生产区'">
				<uni-easyinput type='textarea' v-model="form.cda" placeholder="请输入CDA编号(如无注明原因)" />
			</uni-forms-item>
			<uni-forms-item label="到访车辆" v-if="form.type!=3">
				<view style="text-align: right;">
					<button style="background-color: #4f607e;" type="primary" size="mini"
						@click="form.cars.push('')">新增车辆</button>
				</view>

				<view v-for='(item,index) in form.cars' class="justify-between align-center"
					style="margin-bottom:20rpx">
					<uni-easyinput disabled @tap="plateShow=true,carindex=index" v-model.trim="form.cars[index]"
						placeholder="请输入到访车辆" />
					<text @click="form.cars.splice(index,1)" style="color: red;margin-left:20rpx">删除</text>
				</view>
				<plate-input v-if="plateShow" :plate="form.cars[carindex]" @export="setCars"
					@close="plateShow = false" />
			</uni-forms-item>
			<uni-forms-item label="到访车辆" required name="cars" v-else>
				<view style="text-align: right;">
					<button style="background-color: #4f607e;" type="primary" size="mini"
						@click="form.cars.push('')">新增车辆</button>
				</view>

				<view v-for='(item,index) in form.cars' class="justify-between align-center"
					style="margin-bottom:20rpx">
					<uni-easyinput disabled @tap="plateShow=true,carindex=index" v-model.trim="form.cars[index]"
						placeholder="请输入到访车辆" />
					<text @click="form.cars.splice(index,1)" style="color: red;margin-left:20rpx">删除</text>
				</view>
				<plate-input v-if="plateShow" :plate="form.cars[carindex]" @export="setCars"
					@close="plateShow = false" />
			</uni-forms-item>
			<template v-if="form.type!=3">
				<view class="formtext" style="display: flex;justify-content: space-between;">
					<text>随访人员</text>
					<button style="background-color: #4f607e!important;" type="primary" size="mini"
						@click="$refs.showRight.open(),follw_people_obj={credent:1},follow_people_index=-1">新增随访人员</button>
				</view>
				<!-- 随访人员表格 -->
				<template>
					<uni-table ref="table" border emptyText="暂无更多数据">
						<uni-tr>
							<uni-th width="160" align="center">操作</uni-th>
							<uni-th width="120" align="center">姓名</uni-th>
							<uni-th width="120" align="left">联系电话</uni-th>
							<uni-th width="120" align="center">证件类型</uni-th>
							<uni-th width="120" align="left">证件号码</uni-th>
						</uni-tr>
						<uni-tr style="vertical-align: middle;" v-for="(item, index) in form.follw_people" :key="index">
							<uni-td>
								<view class="uni-group">
									<text @click="editFollwPeople(index)"
										style="color: #4f607e;margin-right:8px">修改</text>
									<text @click="form.follw_people.splice(index,1)"
										style="color: red;margin-right:8px">删除</text>
								</view>
							</uni-td>
							<uni-td>{{ item.name }}</uni-td>
							<uni-td>
								<view class="name">{{ item.mobile }}</view>
							</uni-td>
							<uni-td align="center">{{ item.credent==1?'身份证':"护照" }}</uni-td>
							<uni-td align="center">{{ item.idcard }}</uni-td>
						</uni-tr>
					</uni-table>
				</template>
			</template>

			<!-- <uni-forms-item label="长访客申请">
				<uni-data-checkbox v-model="form.long_time" :localdata="longList" :map="{text:'value',value:'id'}" />
			</uni-forms-item>
			<template v-if="form.long_time==1">
				<uni-forms-item label="开始日期">
					<uni-datetime-picker type="date" :start="toadyStart" return-type="string"
						v-model="form.start_date" />
				</uni-forms-item>
				<uni-forms-item label="结束日期">
					<uni-datetime-picker type="date" :start="toadyStart" return-type="string" v-model="form.end_date" />
				</uni-forms-item>
			</template> -->
			<view class="formtext" v-if="form.type==1||form.type==2">被访人信息</view>
			<uni-forms-item label="被访人" required name="acceptName" v-if="form.type==1||form.type==2">
				<uni-easyinput @clear="clearAccept('accept')" disabled v-model="form.acceptName"
					@tap="adminListShowOpen('accept')" placeholder="请选择联系人员" />
			</uni-forms-item>
			
			<view class="formtext" v-if="form.type==3">收货人信息</view>
			<uni-forms-item label="收货人" v-if="form.type==3" required name="goodsName">
				<uni-easyinput @clear="clearAccept('goods')" disabled v-model="form.goodsName"
					@tap="adminListShowOpen('goods')" placeholder="请选择联系人员" />
			</uni-forms-item>
			
			<view class="formtext" v-if="visitAreaText=='生产区'">陪同人信息</view>
			<uni-forms-item label="陪同人" required name="accompanyName" v-if="visitAreaText=='生产区'">
				<uni-easyinput @clear="clearAccept('accompany')" disabled v-model="form.accompanyName"
					@tap="adminListShowOpen('accompany')" placeholder="请选择联系人员" />
			</uni-forms-item>
			<qianziyu-select :show="adminListShow" type="radio" :popupTitle="'联系人员'" name="cworkStationName"
				:dataLists="adminList" placeholder="输入陪同人具体姓名或手机号搜索" @search="selectSearch" @submit="submitAccept"
				@cancel="cancelAccept" />
		</uni-forms>
		<button type="primary" style="background-color: #4f607e!important;" @click="getStudy">{{goStudy}}</button>


		<!-- 随访人员弹出 -->
		<uni-drawer ref="showRight" mode="right" :mask-click="true">
			<uni-forms ref="peopleform" :model="follw_people_obj" :rules="peoplerules" labelWidth="80px">
				<uni-forms-item label="姓名" required name='name'>
					<uni-easyinput v-model="follw_people_obj.name" placeholder="请输入姓名" />
				</uni-forms-item>
				<uni-forms-item label="联系电话" required name='mobile'>
					<uni-easyinput v-model="follw_people_obj.mobile" placeholder="请输入联系电话" />
				</uni-forms-item>
				<uni-forms-item label="证件类型" required name='credent'>
					<uni-data-select @change="chooseCredent" v-model="follw_people_obj.credent"
						:localdata="credentList">
					</uni-data-select>
				</uni-forms-item>
				<uni-forms-item label="证件号码" required name='idcard' v-if="follw_people_obj.credent==1">
					<uni-easyinput type="idcard" v-model="follw_people_obj.idcard" placeholder="请输入证件号码" />
				</uni-forms-item>
				<uni-forms-item label="护照号码" required name='passcard' v-if="follw_people_obj.credent==2">
					<uni-easyinput type="text" v-model="follw_people_obj.passcard" placeholder="请输入证件号码" />
				</uni-forms-item>
			</uni-forms>
			<view class="uni-group" style="text-align: right;">
				<button @click="closeDrawer" size="mini">取消</button>
				<button @click="pushFollowPeople" size="mini" type="primary"
					style="background-color: #4f607e!important;margin-left:8px">确认</button>
			</view>
		</uni-drawer>

	</view>

</template>

<script>
	import plateInput from '@/uni_modules/uni-plate-input/uni-plate-input.vue'
	import qianziyuSelect from '@/components/qianziyu-select/qianziyu-select.vue'
	export default {
		components: {
			plateInput,
			qianziyuSelect
		},
		data() {
			return {
				steps: [{
					title: '填报'
				}, {
					title: '学习'
				}, {
					title: '完成'
				}],
				stepActive: 0,
				configshow: false,
				areaShow: false,
				configInfo: {},
				configKey: "ptfk",
				toadyStart: '',
				dateRange: [],
				carindex: 0,
				plateShow: false,
				adminListShow: false,
				adminKeyword: '',
				acceptType: "",
				acceptName: "",
				goodsName: '',
				visitAreaText: '',
				form: {
					type: 1,
					date: "",
					visit_time_id: "",
					visit_area_id: "",
					reason: "",
					plate: "",
					remark: "",
					name: "",
					mobile: "",
					credent: 1,
					idcard: "",
					passcard: "",
					company_name: "",
					cars: [],
					follw_people: [],
					long_time: 0,
					start_date: "",
					end_date: "",
					accompany_id: '',
					accpet_department_id: "",
					accept_admin_id: "",
					accept_goods_admin_id: "",
					acceptName: "",
					goodsName: '',
					accompanyName: ''
				},
				follw_people_obj: {
					name: "",
					mobile: "",
					credent: 1,
					idcard: "",
				},
				follow_people_index: -1,
				rules: {
					start_date: {
						rules: [{
							required: true,
							errorMessage: '请选择开始日期'
						}]
					},
					end_date: {
						rules: [{
							required: true,
							errorMessage: '请选择结束日期'
						}]
					},
					visit_time_id: {
						rules: [{
							required: true,
							errorMessage: '请选择拜访时段'
						}]
					},
					visit_area_id: {
						rules: [{
							required: true,
							errorMessage: '请选择前往区域'
						}]
					},
					plate: {
						rules: [{
							required: true,
							errorMessage: '请选择车辆类型'
						}]
					},
					name: {
						rules: [{
							required: true,
							errorMessage: '姓名不能为空'
						}]
					},
					mobile: {
						rules: [{
							required: true,
							errorMessage: '联系电话不能为空'
						}, {
							pattern: '^[1][3-9][\\d]{9}',
							errorMessage: '联系号码格式错误'
						}]
					},
					credent: {
						rules: [{
							required: true,
							errorMessage: '请选择身份证类型'
						}]
					},
					idcard: {
						rules: [{
							required: true,
							errorMessage: '身份证号码不能为空'
						}, {
							pattern: '^[1-9]\\d{5}(18|19|20)\\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\\d{3}[0-9Xx]',
							errorMessage: '身份证格式错误'
						}]
					},
					passcard: {
						rules: [{
							required: true,
							errorMessage: '护照号码不能为空'
						}, {
							pattern: '/^([a-zA-z]|[0-9]){5,17}$/',
							errorMessage: '护照格式错误'
						}]
					},
					company_name: {
						rules: [{
							required: true,
							errorMessage: '单位名称不能为空'
						}]
					},
					cda: {
						rules: [{
							required: true,
							errorMessage: 'CDA编号不能为空'
						}]
					},
					cars: {
						rules: [{
							required: true,
							errorMessage: '车牌号不能为空'
						}]
					},
					acceptName: {
						rules: [{
							required: true,
							errorMessage: '请选择被访人'
						}]
					},
					accompanyName: {
						rules: [{
							required: true,
							errorMessage: '请选择陪同人'
						}]
					},
					goodsName: {
						rules: [{
							required: true,
							errorMessage: '请选择收货人'
						}]
					}
				},
				peoplerules: {
					name: {
						rules: [{
							required: true,
							errorMessage: '随访人姓名不能为空'
						}]
					},
					mobile: {
						rules: [{
							required: true,
							errorMessage: '联系电话不能为空'
						}, {
							pattern: '^[1][3-9][\\d]{9}',
							errorMessage: '联系号码格式错误'
						}]
					},
					credent: {
						rules: [{
							required: true,
							errorMessage: '请选择身份证类型'
						}]
					},
					idcard: {
						rules: [{
							required: true,
							errorMessage: '身份证号码不能为空'
						}, {
							pattern: '^[1-9]\\d{5}(18|19|20)\\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\\d{3}[0-9Xx]',
							errorMessage: '身份证格式错误'
						}]
					},
					passcard: {
						rules: [{
							required: true,
							errorMessage: '护照号码不能为空'
						}, {
							pattern: '/^([a-zA-z]|[0-9]){5,17}$/',
							errorMessage: '护照格式错误'
						}]
					}
				},
				// 单选数据源
				visitTime: [],
				visitArea: [],
				reasonList: [],
				parkAreaList: [],
				credentList: [{
						value: 1,
						text: "身份证"
					},
					{
						value: 2,
						text: "护照"
					}
				],
				longList: [{
					id: 0,
					value: '否'
				}, {
					id: 1,
					value: '是'
				}],
				adminList: [],
				isCall: '', // 是否待邀约
				goStudy: '提交',
				isStudy: false

			}
		},
		onLoad(options) {
			// uni.navigateTo({
			// 	url:'/pages/visit/testStudy?type=3'
			// })
			// return
			this.toadyStart = new Date()
			this.form.type = options.type
			this.areaShow = options.type == 1 ? true : false
			this.configKey = options.type == 1 ? 'ptfk' : (options.type == 2 ? 'sgfk' : 'wlcl')
			this.isCall = options.iscall ? options.iscall : ''
			// this.goStudy = this.isCall == 'call' ? '提交' : ''
			this.form.audit_status = this.isCall == 'call' ? 1 : 0
			this.showStudy()
			if (options.type == 2 || options.type == 3) {
				this.getConfig()
			}
			this.init()
			
			// 设置默认日期为当天
			const today = new Date().toISOString().split('T')[0]
			this.form.start_date = today
			this.form.end_date = today
			this.form.date = today
			this.form.long_time = 0
			
			if (uni.getStorageSync('formdata')) {
				this.form = uni.getStorageSync('formdata')
			}
			// this.getAdminList()
		},
		onReady() {},
		methods: {
			init() {
				this.getVisitArea()
				this.getVisitTime()
				this.getReason()
				this.getPark()
			},
			adminListShowOpen(type) {
				this.acceptType = type
				this.adminKeyword = ""
				// this.getAdminList()

				this.adminListShow = true
			},
			cancelAccept() {
				console.log('123')
				this.adminKeyword = ""
				this.adminList = []
				this.adminListShow = false
			},
			selectSearch(e) {
				this.adminKeyword = e
				this.getAdminList()
			},
			clearAccept(type) {
				if (type == 'accept') {
					this.form.accept_admin_id = ''
					this.form.acceptName = ''
				} else if (type == 'goods') {
					this.form.accept_goods_admin_id = ''
					this.form.goodsName = ''
				} else {
					this.form.accompany_id = ''
					this.form.accompanyName = ''
				}
			},
			submitAccept(e) {
				console.log(e)
				this.form.accompany_id = e.id
				this.form.accompanyName = e.name
				if (this.acceptType == 'accept') {
					this.form.accept_admin_id = e.id
					this.form.accpet_department_id = e.department_id
					this.form.acceptName = e.name
					// if (this.visitAreaText == '非生产区'||this.visitAreaText == '研发R&D') {
					// 	this.form.accompany_id = e.id
					// 	this.form.accompanyName = e.name
					// }
				} else if (this.acceptType == 'goods') {
					this.form.accept_goods_admin_id = e.id
					this.form.accept_admin_id = e.id
					this.form.accpet_department_id = e.department_id
					this.form.goodsName = e.name
					// if (this.visitAreaText == '非生产区'||this.visitAreaText == '研发R&D') {
					// 	this.form.accompany_id = e.id
					// 	this.form.accompanyName = e.name
					// }
				} else {
					this.form.accompany_id = e.id
					this.form.accompanyName = e.name
				}

				this.adminListShow = false
			},
			setCars(e) {
				this.form.cars[this.carindex] = e
				this.plateShow = false
				console.log(e, this.carindex)
			},

			closeConfig() {
				this.configshow = false
			},
			closeArea() {
				if (!this.form.visit_area_id) {
					this.util.alert("请先选择前往区域")
					return
				}
				if (this.visitAreaText == "生产区") {
					this.configKey = 'cjfk'
					this.getConfig()
					this.areaShow = false
				} else if (this.visitAreaText == "研发R&D") {
					this.configKey = 'yffk'
					this.getConfig()
					this.areaShow = false
				} else {
					this.configKey = 'ptfk'
					this.getConfig()
					this.areaShow = false
				}
			},
			async getConfig() {
				let that = this
				// util.request()
				this.util.request({
					api: '/api/mobile/user/config',
					data: {
						page: 1,
						page_size: 99
					},
					// requestType: 'bd',
					utilSuccess: function(res) {
						console.log(res)
						let data = res
						for (let k of data) {
							if (k.key == that.configKey) {
								that.configInfo = k
							}
						}
						that.configshow = true
					},
					utilFail: function(res) {}
				})
			},
			// 获取单选数据


			getVisitArea() {
				let that = this
				that.visitArea = [{
					name: '非生产区',
					id: 3
				}, {
					name: '生产区',
					id: 4
				}, {
					name: "研发R&D",
					id: 5
				}]
				// this.util.request({
				// 	api: '/api/mobile/visit/visit-area',
				// 	data: {},
				// 	utilSuccess: function(res) {
				// 		console.log(res)
				// 		that.visitArea = res
				// 	},
				// 	utilFail: function(res) {}
				// })
			},
			changeVisitArea(e) {
				console.log(e)
				this.visitAreaText = e.detail.data.name
			},
			getVisitTime() {
				let that = this
				// util.request()
				this.util.request({
					api: '/api/mobile/visit/visit-time',
					data: {},
					utilSuccess: function(res) {

						for (var m of res) {
							m.visitTimeRange = m.start_time + "-" + m.end_time
						}
						console.log(res)
						that.visitTime = res
					},
					utilFail: function(res) {}
				})
			},
			getReason() {
				let that = this
				// util.request()
				this.util.request({
					api: '/api/admin/parameter/show',
					data: {
						number: 'reasonList'
					},
					utilSuccess: function(res) {
						let arr = []
						console.log(res)
						for (var m of res.detail) {
							arr.push({
								text: m.value,
								value: m.value
							})
						}
						that.reasonList = arr
					},
					utilFail: function(res) {}
				})
			},
			getPark() {
				let that = this
				// util.request()
				this.util.request({
					api: '/api/admin/parameter/show',
					data: {
						number: 'parkArea'
					},
					utilSuccess: function(res) {
						that.parkAreaList = res.detail
					},
					utilFail: function(res) {}
				})
			},
			async getAdminList() {
				let that = this
				// util.request()
				this.util.request({
					api: '/api/admin/other/admin-user-list',
					data: {
						page_size: 99,
						page: 1,
						keyword: this.adminKeyword
					},
					utilSuccess: function(res) {
						that.adminList = res.data
					},
					utilFail: function(res) {}
				})
			},
			//
			chooseCredent(e) {
				console.log(e)
			},
			// 随访人员弹出
			editFollwPeople(index) {
				this.follow_people_index = index
				this.follw_people_obj = this.form.follw_people[index]
				this.$refs.showRight.open()
			},
			closeDrawer() {
				this.follw_people_obj = {}
				this.follow_people_index = -1
				this.$refs.showRight.close()
			},
			pushFollowPeople() {
				console.log('this.follw_people_obj', this.follw_people_obj)
				if (this.follw_people_obj.credent == 2) {
					this.follw_people_obj.idcard = this.follw_people_obj.passcard
				}
				this.$refs['peopleform'].validate().then(res => {
					if (this.follow_people_index > -1) {
						this.form.follw_people[this.follow_people_index] = this.follw_people_obj
					} else {
						this.form.follw_people.push(this.follw_people_obj)
					}
					this.follow_people_index = -1
					this.$refs.showRight.close()
				}).catch(err => {
					console.log('err', err);
				})



			},
			// 去学习
			// 获取访客学习状态
			async showStudy() {
				this.util.alert("请确保每位访客都已通过学习培训，方可提交拜访")
				// let that = this
				// let id_arr = []
				// id_arr.push(this.form.idcard)
				// for(var k of this.form.follw_people){
				// 	id_arr.push(k.idcard)
				// }
				// this.util.request({
				// 	api: '/api/mobile/visit/ask-log',
				// 	method: "post",
				// 	data:{
				// 		type:that.form.type
				// 	},
				// 	utilSuccess: function(res) {
				// 		console.log("res",res)
				// 		if(res.msg=='学习有效中'){
				// 			uni.showToast({
				// 				title: '请确保随访人员都已通过学习培训方可提交拜访',
				// 				duration: 2000,
				// 				icon: 'none'
				// 			})
				// 			that.isStudy = true
				// 			that.goStudy = '提交'

				// 		}
				// 	},
				// 	utilFail: function(res) {
				// 		// console.log(res)
				// 		// uni.showToast({
				// 		// 	title: res,
				// 		// 	duration: 2000,
				// 		// 	icon: 'none'
				// 		// })
				// 	}
				// })
			},
			// 获取随访人员的 学习记录
			async getStudy() {
				let that = this
				let id_arr = []
				id_arr.push(this.form.idcard)
				for (var k of this.form.follw_people) {
					id_arr.push(k.idcard)
				}
				
				// 确保date字段设置为start_date
				if (this.form.start_date) {
					this.form.date = this.form.start_date
				}
				
				this.$refs['formdata'].validate().then(res => {
					this.util.request({
						api: '/api/mobile/visit/idcard-check',
						method: "post",
						data: {
							idcard: id_arr
						},
						utilSuccess: function(res) {
							if (res.length > 0) {
								let str = res.join("，") + '未完成学习培训'
								that.util.alert(str)
								uni.setStorageSync('formdata', that.form)
							} else {
								// 邀约
								if (that.isCall === 'call') {
									that.submitForm()
								} else {
									// 访客
									that.submitNoStudy()
								}
							}
						},
						utilFail: function(res) {
							// console.log(res)
							uni.showToast({
								title: res,
								duration: 2000,
								icon: 'none'
							})
						}
					})

				}).catch(err => {
					console.log('err', err);
				})

			},
			saveFormgoStudy() {
				if (this.form.credent == 2) {
					this.form.idcard = this.form.passcard
				}
				
				// 确保date字段设置为start_date
				if (this.form.start_date) {
					this.form.date = this.form.start_date
				}
				
				this.$refs['formdata'].validate().then(res => {
					console.log("form", this.form)
					// return
					if (this.isCall === 'call') {
						this.submitForm()
						return
					}
					if (this.isStudy) {
						this.submitNoStudy()
					} else {
						uni.setStorageSync('formdata', this.form)
						uni.redirectTo({
							url: '/pages/visit/study?type=' + this.form.type
						})
					}

				}).catch(err => {
					console.log('err', err);
				})
			},
			submitForm() {
				let that = this
				console.log("form",this.form)
				// return
				this.util.request({
					api: '/api/admin/visit/save',
					method: "POST",
					requestType: 'bd',
					data: that.form,
					utilSuccess: function(res) {
						uni.showToast({
							title: res.msg,
							duration: 2000,
							icon: 'none'
						})
						uni.removeStorageSync('formdata')
						uni.redirectTo({
							url: '/pages/visit/successform?iscall=call'
						})
					},
					utilFail: function(res) {
						uni.showToast({
							title: res,
							duration: 2000,
							icon: 'none'
						})
					}
				})
			},
			submitNoStudy() {
				let that = this
				this.util.request({
					api: '/api/mobile/visit/visit-save',
					method: "POST",
					data: that.form,
					utilSuccess: function(res) {
						uni.showToast({
							title: res.msg,
							duration: 2000,
							icon: 'none'
						})
						uni.removeStorageSync('formdata')
						that.newsSubscription()
					},
					utilFail: function(res) {
						console.log(res)
						uni.showToast({
							title: res,
							duration: 2000,
							icon: 'none'
						})
					}
				})
			},
			newsSubscription() {
				uni.getSetting({
					withSubscriptions: true, //是否获取用户订阅消息的订阅状态，默认false不返回
					success(res) {
						if (res.authSetting['scope.subscribeMessage']) {
							uni.redirectTo({
								url: '/pages/visit/successform'
							})
						} else {
							// 用户没有点击"总是保持以上，不再询问"则每次都会调起订阅消息
							uni.requestSubscribeMessage({
								tmplIds: ['OfDFwAIZyXqvPgmc_czIXhveVtp3n_ftyWJEks1DSi4',
									'r8n41lmkGeob15YBuuxhG7MbpgVSsUxKnK9ORPtr5VY'
								],
								success(res) {
									console.log("res", res)
									uni.showToast({
										title: '订阅成功'
									})
									uni.redirectTo({
										url: '/pages/visit/successform'
									})
								}
							})
						}
					}
				});
			},
			// 开始日期变化处理
			onStartDateChange(e) {
				console.log('开始日期变化:', e)
				this.calculateDateRange()
			},
			
			// 结束日期变化处理
			onEndDateChange(e) {
				console.log('结束日期变化:', e)
				this.calculateDateRange()
			},
			
			// 计算日期范围和长期访问状态
			calculateDateRange() {
				if (this.form.start_date && this.form.end_date) {
					// 计算日期差
					const start = new Date(this.form.start_date)
					const end = new Date(this.form.end_date)
					const timeDiff = end.getTime() - start.getTime()
					const daysDiff = Math.ceil(timeDiff / (1000 * 3600 * 24)) + 1 // +1 因为包含开始和结束日期
					
					// 如果超过1天，设置为长期访问
					this.form.long_time = daysDiff > 1 ? 1 : 0
					
					// 设置date字段为start_date
					this.form.date = this.form.start_date
					
					console.log('计算后的值:', {
						start_date: this.form.start_date,
						end_date: this.form.end_date,
						long_time: this.form.long_time,
						daysDiff: daysDiff
					})
				}
			},
			// 拉取拜访人信息
			pullVisitorInfo() {
				let that = this
				this.util.request({
					api: '/api/mobile/user/my-visit',
					method: "get",
					data: {
						page: 1,
						page_size: 1,
						type: ""
					},
					utilSuccess: function(res) {
						if (res.data && res.data.length > 0) {
							// 获取第一条记录
							const firstRecord = res.data[0]
							// 自动填充拜访人信息
							that.form.name = firstRecord.name || ''
							that.form.mobile = firstRecord.mobile || ''
							that.form.credent = firstRecord.credent || 1
							that.form.idcard = firstRecord.idcard || ''
							that.form.company_name = firstRecord.company_name || ''
							that.form.cda = firstRecord.cda || ''
							
							// 根据证件类型设置对应的证件号码
							if (firstRecord.credent == 2) {
								that.form.passcard = firstRecord.idcard || ''
							}
							
							uni.showToast({
								title: '拜访人信息已自动填充',
								duration: 2000,
								icon: 'success'
							})
						} else {
							uni.showToast({
								title: '暂无拜访人历史记录，请手动输入!',
								duration: 2000,
								icon: 'none'
							})
						}
					},
					utilFail: function(res) {
						uni.showToast({
							title: '拉取失败，请手动输入',
							duration: 2000,
							icon: 'none'
						})
					}
				})
			},
		}
	}
</script>

<style scoped>
	.containers {
		background-color: #fff;
		min-height: 100vh;
		padding: 20rpx;
		padding-bottom: 60rpx;
	}

	.steps {
		margin-bottom: 40rpx
	}

	.formtext {
		margin-bottom: 20rpx
	}

	/deep/ .uni-table-td {
		vertical-align: middle;
	}

	/deep/ .uni-drawer__content {
		padding: 40rpx
	}

	.configtitle {
		font-size: 40rpx;
		text-align: center;
		margin-top: 36rpx;
		padding-bottom: 20rpx;
	}

	.configvalue {
		padding: 40rpx;
		font-size: 36rpx;
		height: 600rpx;
		overflow-y: auto;
	}

	.configbtn {
		background: #4f607e;
		padding: 20rpx;
		/* display: inline-block; */
		text-align: center;
		margin: 20rpx auto;
		color: #fff;
		border-radius: 20rpx;
	}

	.configload {
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 50rpx;
		color: #ddd;
	}

	.configload text {
		margin-right: 20rpx
	}

	/deep/ .u-popup__content__close .u-icon__icon {
		color: #fff !important
	}

	.areabtn {
		background-color: #4f607e;
		/* margin-left: 8px; */
		width: 100%;
		position: fixed;
		bottom: 0;
		left: 0;
		border-radius: 0;
	}

	/deep/ .areavalue .uni-data-checklist .checklist-group .checklist-box.is--button {
		padding: 30rpx
	}

	/* 日期选择器样式优化 */
	/deep/ .uni-datetime-picker {
		width: 100% !important;
		min-width: 0 !important;
		flex: 1 !important;
	}

	/deep/ .uni-datetime-picker .uni-datetime-picker__input {
		width: 100% !important;
		overflow: visible !important;
		white-space: nowrap !important;
		min-width: 0 !important;
	}

	/deep/ .uni-datetime-picker .uni-datetime-picker__input-text {
		width: 100% !important;
		overflow: visible !important;
		text-overflow: ellipsis !important;
		min-width: 0 !important;
	}

	/* 确保表单项有足够空间 */
	/deep/ .uni-forms-item__content {
		flex: 1 !important;
		min-width: 0 !important;
	}
</style>