TaicangPopulationApp2/pages/house/houseGather.vue

<template>
	<navigation-general title="房屋信息采集">
		<!-- <template v-slot:right>
			<u-button style="margin-right: 20rpx;" type="error" size="mini" @click="show = true">删除</u-button>
		</template> -->
		<u-form :model="form" ref="uForm" label-width="130rpx">
			<!-- 	<u-form-item label="填写方式" prop="name">
				<u-radio-group v-model="radio">
					<u-radio v-for="(item, index) in list" :key="index" :name="item.name">
						{{item.name}}
					</u-radio>
				</u-radio-group>
			</u-form-item> -->
			<u-form-item label="社区"><u-input type="select" @click="handlerSelct('sqcjwh')"
					v-model="dictlable.sqcjwh" /></u-form-item>
			<u-form-item label="房东姓名"><u-input v-model="form.fdxm" /></u-form-item>
			<u-form-item label="房东电话"><u-input v-model="form.fdlxdh" /></u-form-item>
			<u-form-item label="证件类型">

				<u-input type="select" v-model="dictlable.fdzjlx" @click="handlerSelct('fdzjlx')" />

			</u-form-item>
			<u-form-item label="身份证号" prop="fdsfzh"><u-input v-model="form.fdsfzh" /></u-form-item>
			<u-form-item label="房屋类型"><u-input type="select" @click="handlerSelct('fwlx')"
					v-model="dictlable.fwlx" /></u-form-item>
			<u-form-item label="租住类型"><u-input type="select" v-model="dictlable.zzlx"
					@click="handlerSelct('zzlx')" /></u-form-item>
			<u-form-item label="出租间数"><u-input v-model="form.czjs" /></u-form-item>
			<u-form-item label="出租面积"><u-input v-model="form.czmj" /></u-form-item>

			<u-form-item label="是否群租">
				<u-radio-group v-model="form.sfqzf">
					<u-radio name="1">
						是
					</u-radio>
					<u-radio name="0">
						否
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item label="备注"><u-input v-model="form.person_information" /></u-form-item>
		</u-form>
		<bottom-btn type="primary" title="提交" @handlerClick="handlerClick"></bottom-btn>
		<!-- 系统字典公用选择弹窗 -->
		<u-select v-model="show" :list="dictList" value-name="dictValue" label-name="dictLabel"
			@confirm="confirm"></u-select>
	</navigation-general>
</template>

<script>
	import {
		getDicts
	} from "@/api/system/dict/data";
	import {
		getCommunitylist
	} from "@/api/taicangpop/data";
	import {
		updateHouse
	} from '@/api/taicangpop/house.js'
	export default {
		data() {
			return {
				dictlable: {

				},
				currentForm: '',
				dictList: [],
				show: false,
				dict: {},
				radio: '人工填写',
				list: [{
						name: '人工填写'
					},
					{
						name: '下拉选择'
					},
				],
				form: {
					sqcjwh: undefined, //社区
					person_id: undefined, //房东
					fdxm: undefined, //房东名字
					fdlxdh: undefined, //联系方式
					fdzjlx: undefined, //房东证件类型
					fdsfzh: undefined, //请输入身份证
					fwlx: undefined, //房屋类型
					sfqzf: undefined, //是否群租房
					zzlx: undefined, //租住类型
					czjs: undefined, //出租间数
					czmj: undefined, //出租面积
					person_information: undefined, //备注信息
				},
				rules: {
					fdsfzh: [{
							required: true,
							message: '请输入房东身份证号',
							trigger: ['change', 'blur'],
						},

					],
				}
			};
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		onLoad(option) {
			this.form.id = option.houseId
			this.getdicts()
		},
		methods: {
			//打开选择框
			handlerSelct(dictItem) {
				this.dictList = this.dict[dictItem]
				this.currentForm = dictItem
				this.show = true
			},
			//选择确定
			confirm(e) {
				this.form[this.currentForm] = e[0].value
				this.dictlable[this.currentForm] = e[0].label
			},
			//获取全部字典
			async getdicts() {
				//证件类型
				const res1 = await getDicts('bm_czfw_zjlx')
				this.dict.fdzjlx = res1.data
				//房屋类型
				const res2 = await getDicts('bm_fwlx')
				this.dict.fwlx = res2.data
				//租房类型
				const res3 = await getDicts('bm_czfw_zzlx')
				this.dict.zzlx = res3.data


				//社区
				const res4 = await getCommunitylist()
				this.dict.sqcjwh = res4.data['社区list集合'].map(item => {
					item.dictLabel = item.dept_name
					item.dictValue = item.dept_id
					return item
				})


			},
			handlerClick() {
				this.$refs.uForm.validate(valid => {
					if (valid) {
						if (this.form.id != null) {
							updateHouse(this.form).then((response) => {
								uni.showToast({
									title: '采集成功',
									success: () => {
										setTimeout(() => {
											uni.navigateBack()
										}, 1000)
									}
								})
							});
						}
					}
				})
			}
		},
	}
</script>

<style lang="scss" scoped>
	.u-form {
		background: #fff;
		padding: 20rpx;
		padding-bottom: 120rpx;
	}
</style>