Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
be226238 by 李希虎
Options

逻辑幢提交

1 parent 997280ba
Inline Side-by-side
Showing 2 changed files with 324 additions and 0 deletions
......@@ -83,6 +83,12 @@ const constantRoutes = [
code: "1-5",
component: () => import("@/views/systemZD/index"),
},
{
path: "/ljz",
name: "宗地",
code: "1-5",
component: () => import("@/views/basic/ljz/index"),
},
],
},
];
......
<template>
<div class="main">
<div class="formMenu">
<el-form ref="form" :model="form" label-width="160px">
<table class="zdjbxxTable" cellspacing="0" cellpadding="0" border="1">
<tr>
<th colspan="12">逻辑幢基本信息</th>
</tr>
<tr>
<td colspan="2">逻辑幢号</td>
<td colspan="4">
<input type="text" class="formInput" />
</td>
<td colspan="2">自然幢号</td>
<td colspan="4">
<input type="text" class="formInput" />
</td>
</tr>
<tr>
<td colspan="2">逻辑幢顺序号</td>
<td colspan="4">
<input type="text" class="formInput" />
</td>
<td colspan="2">不动产单元号</td>
<td colspan="4" class="psr">
<input type="text" class="formInput percent78" />
<el-button type="primary" class="createBtn">生成</el-button>
</td>
</tr>
<tr>
<td colspan="2">门牌号</td>
<td colspan="4">
<input type="text" class="formInput" />
</td>
<td colspan="2" align="center">竣工日期</td>
<td colspan="4" >
<!-- <el-date-picker-->
<!-- v-model="jgrq"-->
<!-- type="date"-->
<!-- placeholder="选择日期"-->
<!-- >-->
<!-- </el-date-picker>-->
</td>
</tr>
<tr>
<td colspan="2">预测建筑面积（㎡）</td>
<td colspan="4">
<input type="text" class="formInput" />
</td>
<td colspan="2">实测建筑面积（㎡）</td>
<td colspan="4" class="psr">
<input type="text" class="formInput" />
</td>
</tr>
<tr>
<td colspan="2">预测地下面积（㎡）</td>
<td colspan="4">
<input type="text" class="formInput" />
</td>
<td colspan="2">实测地下面积（㎡）</td>
<td colspan="4" class="psr">
<input type="text" class="formInput " />
</td>
</tr>
<tr>
<td colspan="2">预测其他面积（㎡）</td>
<td colspan="4">
<input type="text" class="formInput" />
</td>
<td colspan="2">实测其他面积（㎡）</td>
<td colspan="4" class="psr">
<input type="text" class="formInput" />
</td>
</tr>
<tr height="30" v-for="(item1,index) in form.ytList" :key="index">
<td v-if="index===0" colspan="2" :rowspan="ytTitleRowspan" align="center" id="ytTitle">
<el-button type="primary" size="mini" style="margin-right: 10px" @click="addYtInfo">添加</el-button>
<span>用途</span>
</td>
<td width="30" colspan="2" align="center" >
<el-button type="info" size="mini" style="" @click="deleteYtInfo(index)" circle>删除</el-button>
规划用途
</td>
<td width="30" colspan="4" align="center" >
<el-select v-model="item1.fwytzdbsm" placeholder="请选择" >
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</td>
<td width="30" colspan="2" align="center" >用途</td>
<td width="30" colspan="4" align="center" >
<el-select v-model="item1.fwsjytbsm" placeholder="请选择" >
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</td>
</tr>
<tr height="30" v-for="(item1,index) in form.fwjgList" :key="'jg'+index">
<td colspan="2" v-if="index===0" :rowspan="fwjgTitleRowspan" align="center" >
<el-button type="primary" size="mini" style="margin-right: 10px" @click="addFwjgInfo">添加</el-button>
<span>房屋结构</span>
</td>
<td colspan="2" align="center" >
<span @click="deleteFwjgInfo(index)">删除</span>
</td>
<td colspan="9" >
<el-select v-model="item1.fwjgzdbsm" placeholder="请选择" >
<el-option
v-for="item in options"
: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" />
</td>
<td colspan="2">地上层数</td>
<td colspan="4" class="psr">
<input type="text" class="formInput" />
</td>
</tr>
<tr>
<td colspan="2">总层数</td>
<td colspan="4">
<input type="text" class="formInput" />
</td>
<td colspan="2">建筑物状态</td>
<td colspan="4" class="psr">
<input type="text" class="formInput" />
</td>
</tr>
<tr>
<td colspan="2">备注</td>
<td colspan="10">
<input type="text" class="formInput" />
</td>
</tr>
<tr>
<th colspan="12" class="save">
<el-button type="primary" >保存</el-button>
</th>
</tr>
</table>
</el-form>
</div>
</div>
</template>
<script>
export default {
name:"",
components:{},
props:{},
data(){
return {
jgrq:'',
form: {
ytList: [{
glbsm: '', //关联标识码
fwytzdbsm: '', //房屋用途字典标识码
sx: '', //顺序
fwsjytbsm: '', //房屋实际用途字典标识码
}],
fwjgList: [{
fwjgzdbsm: '', //房屋结构字典标识码
glbsm: '', //关联标识码
sx: '', //顺序
}],
},
options: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}],
value: '',
ytTitleRowspan:1, //用途的单元格垂直合并数量
fwjgTitleRowspan:1, //房屋结构的单元格垂直合并数量
}
},
created(){},
mounted(){},
methods:{
addYtInfo(){
this.form.ytList.push({
glbsm:'',
fwytzdbsm:'',
fwsjytbsm:'',
sx:'',
});
this.ytTitleRowspan=this.form.ytList.length;
},
deleteYtInfo(index){
if(this.form.ytList.length<=1){
this.$message({
message: '不能删除，最少含有一条用途信息',
type: 'warning'
});
}else{
this.form.ytList.splice(index,1);
this.ytTitleRowspan=this.form.ytList.length;
}
},
addFwjgInfo(){
this.form.fwjgList.push({
fwjgzdbsm:'', //房屋结构字典标识码
glbsm:'', //关联标识码
sx:'', //顺序
});
this.fwjgTitleRowspan=this.form.fwjgList.length;
},
deleteFwjgInfo(index){
if(this.form.fwjgList.length<=1){
this.$message({
message: '不能删除，最少含有一条房屋结构信息',
type: 'warning'
});
}else{
this.form.fwjgList.splice(index,1);
this.fwjgTitleRowspan=this.form.fwjgList.length;
}
},
},
computed: {},
watch: {},
}
</script>
<style lang="less" scoped>
.main {
box-sizing: border-box;
padding: 18px;
height: auto;
.formMenu {
width: 1000px;
}
.zdjbxxTable {
margin-top: 10px;
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;
border: none;
color: #606764;
overflow: visible;
text-align: center;
cursor: text;
}
.percent78 {
width: 78%;
float: left;
}
.percent68 {
width: 68%;
float: left;
position: relative;
top: 7px;
}
.percent30 {
width: 30%;
float: left;
}
.createBtn {
position: absolute;
width: 50px;
padding: 6px 4px;
right: 4px;
top: 4px;
}
.el-input__icon {
line-height: 37px;
}
.save{
height:80px
}
}
}
</style>