index.vue 9.29 KB
<template>
	<div class="main">
		<div class="formMenu">
			<Qlr ref="qlrxxModule"></Qlr>

			<!-- <el-button
					type="primary"
					class="changeBtn"
					@click="getQlrxxData"
					>获取权利人信息数据</el-button
				>
				<el-button
					type="primary"
					class="changeBtn"
					@click="getQlxzData"
					>获取权利性质组件数据</el-button
				> -->
			<table class="zdjbxxTable" cellspacing="0" cellpadding="0" border="1">
				<tr>
					<th colspan="12">宗地基本信息</th>
				</tr>
				<tr>
					<td colspan="2">行政区</td>
					<td colspan="2">
						<input type="text" class="formInput" v-model="formData.xzq" />
					</td>
					<td colspan="2">地籍区</td>
					<td colspan="2">
						<input type="text" class="formInput" v-model="formData.djq" />
					</td>
					<td colspan="2">地籍子区</td>
					<td colspan="2">
						<input type="text" class="formInput" v-model="formData.djzq" />
					</td>
				</tr>
				<tr>
					<td colspan="2">权利类型</td>
					<td colspan="4">
						<el-select class="formSelect" v-model="formData.qllx">
							<el-option
								v-for="item in qllxList"
								:key="item.bsm"
								:label="item.mc"
								:value="item.bsm"
							>
							</el-option>
						</el-select>
					</td>
					<td colspan="2">权利设定方式</td>
					<td colspan="4">
						<el-select class="formSelect" v-model="formData.qlsdfs">
							<el-option
								v-for="item in qlsdfsList"
								:key="item.value"
								:label="item.label"
								:value="item.value"
							>
							</el-option>
						</el-select>
					</td>
				</tr>
				<tr>
					<td colspan="2">宗地代码</td>
					<td colspan="4">
						<input type="text" class="formInput" v-model="formData.zddm" />
					</td>
					<td colspan="2">不动产单元号</td>
					<td colspan="4" class="psr">
						<input
							type="text"
							class="formInput percent78"
							v-model="formData.bdcdyh"
						/>
						<el-button type="primary" class="createBtn">生成</el-button>
					</td>
				</tr>
				<tr>
					<td colspan="2">地籍号</td>
					<td colspan="4">
						<input type="text" class="formInput" v-model="formData.djh" />
					</td>
					<td colspan="2">土地权属来源证明材料</td>
					<td colspan="4" class="psr">
						<input
							type="text"
							class="formInput "
							v-model="formData.tdqslyzmcl"
						/>
					</td>
				</tr>
				<tr>
					<td colspan="2">坐落</td>
					<td colspan="10">
						<input type="text" class="formInput" v-model="formData.zl" />
					</td>
				</tr>
				<tr>
					<td colspan="2">国民经济行业分类</td>
					<td colspan="4">
						<el-select class="formSelect" v-model="formData.gmjjhyfl">
							<el-option
								v-for="item in jjhyflList"
								:key="item.value"
								:label="item.label"
								:value="item.value"
							>
							</el-option>
						</el-select>
					</td>
					<td colspan="2">价格(元)</td>
					<td colspan="4" class="psr">
						<input type="text" class="formInput" v-model="formData.jg" />
					</td>
				</tr>
				<tr>
					<td colspan="2" rowspan="2">所在图幅号</td>
					<td colspan="2">比例尺</td>
					<td colspan="8" class="psr">
						<input type="text" class="formInput" v-model="formData.blc" />
					</td>
				</tr>
				<tr>
					<td colspan="2">图幅号</td>
					<td colspan="8" class="psr">
						<input type="text" class="formInput" v-model="formData.tfh" />
					</td>
				</tr>
				<tr>
					<td colspan="2">容积率</td>
					<td colspan="4">
						<el-select class="formSelect percent30" v-model="formData.rjl">
							<el-option
								v-for="item in compareList"
								:key="item.value"
								:label="item.label"
								:value="item.value"
							>
							</el-option>
						</el-select>
						<input type="text" class="formInput percent68" />
					</td>
					<td colspan="2">容积说明</td>
					<td colspan="4" class="psr">
						<input type="text" class="formInput" v-model="formData.rjsm" />
					</td>
				</tr>
				<tr>
					<td colspan="2">建筑密度</td>
					<td colspan="4">
						<el-select class="formSelect percent30" v-model="formData.jzmd">
							<el-option
								v-for="item in compareList"
								:key="item.value"
								:label="item.label"
								:value="item.value"
							>
							</el-option>
						</el-select>
						<input type="text" class="formInput percent68" />
					</td>
					<td colspan="2">建筑密度说明</td>
					<td colspan="4" class="psr">
						<input type="text" class="formInput" v-model="formData.jzmdsm" />
					</td>
				</tr>
				<tr>
					<td colspan="2">建筑限高</td>
					<td colspan="4">
						<el-select class="formSelect percent30" v-model="formData.jzxg">
							<el-option
								v-for="item in compareList"
								:key="item.value"
								:label="item.label"
								:value="item.value"
							>
							</el-option>
						</el-select>
						<input type="text" class="formInput percent68" />
					</td>
					<td colspan="2">建筑限高说明</td>
					<td colspan="4" class="psr">
						<input type="text" class="formInput" v-model="formData.jzxgsm" />
					</td>
				</tr>
				<tr>
					<td colspan="2" rowspan="4">宗地四至</td>
					<td colspan="2">北至</td>
					<td colspan="8" class="psr">
						<input type="text" class="formInput" v-model="formData.bz" />
					</td>
				</tr>
				<tr>
					<td colspan="2">东至</td>
					<td colspan="8" class="psr">
						<input type="text" class="formInput" v-model="formData.dz" />
					</td>
				</tr>
				<tr>
					<td colspan="2">南至</td>
					<td colspan="8" class="psr">
						<input type="text" class="formInput" v-model="formData.nz" />
					</td>
				</tr>
				<tr>
					<td colspan="2">西至</td>
					<td colspan="8" class="psr">
						<input type="text" class="formInput" v-model="formData.xz" />
					</td>
				</tr>
				<tr>
					<td colspan="12">
						<Qlxz ref="qlxzModule"></Qlxz>
					</td>
				</tr>
				<tr>
					<td colspan="2" rowspan="2">批准面积(㎡)</td>
					<td colspan="2" rowspan="2">
						<input type="text" class="formInput" v-model="formData.pzmj" />
					</td>
					<td colspan="2" rowspan="2">宗地面积(㎡)</td>
					<td colspan="2" rowspan="2">
						<input type="text" class="formInput" v-model="formData.zdmj" />
					</td>
					<td colspan="2">建筑占地宗面积</td>
					<td colspan="2">
						<input type="text" class="formInput" v-model="formData.jzzdzmj" />
					</td>
				</tr>
				<tr>
					<td colspan="2">建筑面积(㎡)</td>
					<td colspan="2">
						<input type="text" class="formInput" v-model="formData.jzmj" />
					</td>
				</tr>
				<tr>
					<td colspan="2">共有/共用权利人情况</td>
					<td colspan="10">
						<input type="text" class="formInput" v-model="formData.gyqlrqk" />
					</td>
				</tr>
				<tr>
					<td colspan="2" rowspan="2">说明</td>
					<td colspan="10" rowspan="2">
						<input type="text" class="formInput" v-model="formData.sm" />
					</td>
				</tr>
			</table>
		</div>
	</div>
</template>

<script>
import Qlr from "../../../components/formMenu/qlr";
import Qlxz from "../../../components/formMenu/qlxz";
import { getDdicByMC } from "../../../api/common";
export default {
	name: "",
	components: {
		Qlr,
		Qlxz,
	},
	props: {},
	data() {
		return {
			qllxList: [],
			qlsdfsList: [{ label: "地上", value: "1" }],
			jjhyflList: [{ label: "制造业", value: "1" }],
			compareList: [
				{ label: "=", value: "=" },
				{ label: "<=", value: "<=" },
				{ label: ">=", value: ">=" },
			],
			formData: {
				xzq: "",
				djq: "",
				djzq: "",
				qllx: "",
				qlsdfs: "",
				zddm: "",
				bdcdyh: "",
				djh: "",
				tdqslyzmcl: "",
				zl: "",
				gmjjhyfl: "",
				jg: "",
				blc: "",
				tfh: "",
				rjl: "",
				rjsm: "",
				jzmd: "",
				jzmdsm: "",
				jzxg: "",
				jzxgsm: "",
				bz: "",
				dz: "",
				nz: "",
				xz: "",
				pzmj: "",
				zdmj: "",
				jzzdmj: "",
				jzmj: "",
				gyqlrqk: "",
				sm: "",
			},
		};
	},
	created() {
		this.getDicData();
	},
	mounted() {},
	methods: {
		getQlrxxData() {
			console.log(this.$refs.qlrxxModule.getQlgyfsData()); //权利共有方式数据
			console.log(this.$refs.qlrxxModule.getQlrxxData()); //权利人表格数据
		},
		getQlxzData() {
			console.log(this.$refs.qlxzModule.getQlxzDataList()); //权利性质数据
		},
		//获取字典数据信息
		getDicData() {
			getDdicByMC("权利类型")
				.then((res) => {
					console.log(res.result);
					this.qllxList = res.result;
				})
				.catch((error) => {});
		},
	},
	computed: {},
	watch: {},
};
</script>
<style lang="less" scoped>
.main {
	box-sizing: border-box;
	padding: 18px;
	height: auto;
	.formMenu {
		width: 80%;
		margin: 0 auto;
	}
	.zdjbxxTable {
		margin: 10px 0;
		background-color: #fff;
		font-size: 14px;
		width: 100%;
		th {
			height: 36px;
			line-height: 36px;
			font-size: 16px;
		}
		td {
			width: 60px;
			text-align: center;
			height: 36px;
		}
		/deep/.el-input__inner {
			margin: 0;
			height: 36px;
			outline: none;
			border: none;
			color: #606764;
			overflow: visible;
			text-align: center;
			cursor: text;
		}
		.percent78 {
			width: 78%;
			float: left;
		}
		.percent68 {
			width: 68%!important;
			float: left;
			position: relative;
			top: 7px;
		}
		.percent30 {
			width: 30%!important;
			float: left;
		}
		.createBtn {
			position: absolute;
			width: 50px;
			padding: 6px 4px;
			right: 4px;
			top: 4px;
		}
		.el-input__icon {
			line-height: 37px;
		}
		.el-select {
			width: 100% ;
		}
	}
}
</style>