Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
7f5fbad9 by weimo934
Options

feat(Home):左侧行政区

1 parent c579ca83
Inline Side-by-side
Showing 9 changed files with 987 additions and 934 deletions
......@@ -52,7 +52,7 @@ export function getDdicByMC(mc) {
/**
* 根据宗地BSM获取左侧目录树
*/
export function getTree(bsm) {
export function getTree(zdbsm) {
return request({
url: 'system/xzq/getMenuTreeByZdbsm',
method: 'get',
......
......@@ -39,7 +39,7 @@
active_color: item.expand,
}"
>
{{ item.label }}
{{ item.mc }}
</div>
</div>
<line-item
......
......@@ -28,7 +28,7 @@
reTree_expand_icon: !item.expand && item.children.length > 0,
}"
></div>
<div class="layer_text nowrap">{{ item.label }}</div>
<div class="layer_text nowrap">{{ item.mc }}</div>
</div>
<lineItem
......
<template>
<div class="home-box">
<el-container>
<el-aside :class="{ 'aside-show': isActive }">
<div class="logo-box" :class="{ 'logo-box-show': isActive }">
<img
class="logo-img"
src="@/assets/images/logo-realestate.png"
alt=""
/>
<span class="logo-text" v-show="!textLogo">不动产权籍调查系统</span>
</div>
<div class="treeModule">
<LineTree :pd="pd" @itemClick="itemClick"></LineTree>
</div>
</el-aside>
<el-container>
<el-header height="100px">
<div class="header-top">
<div class="top-items" @click="toggleClick">
<i class="fa fa-outdent hamburger" v-show="!isActive"></i>
<i class="fa fa-indent hamburger" v-show="isActive"></i>
</div>
<div
class="top-items"
v-for="(item, index) in headTop"
:key="index + '1'"
:class="{ 'is-active': item.select }"
@click="selectTopItems(index)"
>
<i :class="item.icon"></i>
<span>{{ item.name }}</span>
</div>
</div>
<div class="header-bottom">
<Navigation ref="navigation"></Navigation>
</div>
<el-dialog
title="新建"
:visible.sync="dialogVisible"
width="40%"
>
<Create @closeDialog="closeDialog"></Create>
</el-dialog>
</el-header>
<el-main>
<router-view />
</el-main>
</el-container>
</el-container>
</div>
<div class="home-box">
<el-container>
<el-aside :class="{ 'aside-show': isActive }">
<div class="logo-box" :class="{ 'logo-box-show': isActive }">
<img
class="logo-img"
src="@/assets/images/logo-realestate.png"
alt=""
/>
<span class="logo-text" v-show="!textLogo">不动产权籍调查系统</span>
</div>
<div class="treeModule">
<LineTree :pd="pd" @itemClick="itemClick"></LineTree>
</div>
</el-aside>
<el-container>
<el-header height="100px">
<div class="header-top">
<div class="top-items" @click="toggleClick">
<i class="fa fa-outdent hamburger" v-show="!isActive"></i>
<i class="fa fa-indent hamburger" v-show="isActive"></i>
</div>
<div
class="top-items"
v-for="(item, index) in headTop"
:key="index + '1'"
:class="{ 'is-active': item.select }"
@click="selectTopItems(index)"
>
<i :class="item.icon"></i>
<span>{{ item.name }}</span>
</div>
</div>
<div class="header-bottom">
<Navigation ref="navigation"></Navigation>
</div>
<el-dialog
title="新建"
:visible.sync="dialogVisible"
width="40%"
>
<Create @closeDialog="closeDialog"></Create>
</el-dialog>
</el-header>
<el-main>
<router-view/>
</el-main>
</el-container>
</el-container>
</div>
</template>
<script>
import util from "@/libs/util.js";
import Navigation from "../components/IvyElement/navigation";
import Create from "./panel/create/index";
import LineTree from "../components/lineTree/lineTree";
import { setTimeout } from "timers";
export default {
components: {
Navigation,
LineTree,
Create,
},
data() {
return {
navigationList: [],
isActive: false,
textLogo: false,
activePath: "",
defaultActive: "",
headTop: [
{
path: "/create",
select: false,
},
{
path: "/add",
select: false,
},
{
path: "/modify",
select: false,
},
{
path: "/change",
select: false,
},
{
path: "/search",
select: false,
},
],
tempTab: [
{
path: "/zrz",
name: "自然幢",
},
{
path: "/dz",
name: "多幢",
},
{
path: "/h",
name: "户",
},
{
path: "/zd",
name: "宗地",
},
],
// 上导航选中id
indId: undefined,
menuList: [],
pathAndCodeObj: {
"/article-draft": "PSH004",
"/article-publish": "PSH005",
"/article-recycle": "PSH006",
"/notice-draft": "PSH007",
"/notice-publish": "PSH008",
"/notice-recycle": "PSH009",
"/column_management": "PSH018",
"/announcement_template": "PSH019",
"/business_management": "PSH020",
},
pd: [
{
label: "行政区(1)",
children: [],
},
{
label: "行政区(2)",
children: [
{
label: "地籍区1",
children: [],
},
{
label: "地籍区2",
children: [
{
label: "国有",
children: [
{
label: "宗地代码1933",
isZD: true,
},
{
label: "自然幢2100",
isZD: false,
},
],
},
],
},
{
label: "地籍区3",
children: [],
},
{
label: "地籍区4",
children: [],
},
],
},
{
label: "行政区(3)",
children: [],
},
{
label: "行政区(4)",
children: [],
},
{
label: "行政区(5)",
children: [],
},
],
dialogVisible: false,
};
},
computed: {
permission_routes() {
return this.$store.state.permission_routes.navigation;
},
},
watch: {
"$route.path": function(newPath) {
//监测路由变化，高亮顶部导航
this.headTop.forEach((item, index) => {
item.select = false;
if (item.path == newPath) {
item.select = true;
}
});
},
},
created() {
if (this.$route.meta) {
this.defaultActive = this.$route.meta.code;
}
if (this.permission_routes.length !== 0) {
this.navigationList = this.permission_routes;
} else {
// let list = JSON.parse(util.cookies.get('navigation-1')).concat(JSON.parse(util.cookies.get('navigation')))
//mock数据
let list = [
{
name: "新建",
icon: "fa fa-address-card-o",
path: "/create",
},
{
name: "添加",
icon: "fa fa-address-card-o",
path: "/add",
},
{ name: "更正", icon: "fa fa-address-card-o", path: "/modify" },
{
name: "变更",
icon: "fa fa-address-card-o",
path: "/change",
},
{
name: "综合查询",
icon: "fa fa-address-card-o",
path: "/search",
},
];
this.navigationList = list;
}
this.sortNavigation(this.navigationList, 0);
// if (util.cookies.get("indId")) {
// let indId = util.cookies.get("indId") - 0;
// this.navSelect(indId);
// this.sortNavigation(this.navigationList, indId);
// }
},
methods: {
sortNavigation(data, selectId) {
let headTop = this.headTop;
data.forEach((item, index) => {
headTop[index].name = item.name;
headTop[index].icon = item.icon;
});
},
// menuSelect(data, selectId) {
// this.menuList = data[selectId].children;
// },
handleOpen(key, keyPath) {
console.log(key, keyPath);
},
handleClose(key, keyPath) {
console.log(key, keyPath);
},
toggleClick() {
this.isActive = !this.isActive;
if (!this.isActive) {
setTimeout(() => {
this.textLogo = this.isActive;
}, 200);
} else {
this.textLogo = this.isActive;
}
},
selectTopItems(ind) {
if (ind == 0) {
//点击新建，弹框
this.dialogVisible = true;
} else {
this.dialogVisible = false;
this.indId = ind;
// this.menuSelect(this.navigationList, ind);
// this.$store.dispatch("setTabs/init_tabs");
// this.$store.dispatch("setTabs/set_active_index", "/panel");
this.$router.push(this.headTop[ind].path);
this.navSelect(ind);
// util.cookies.set("indId", ind);
}
},
// 上导航选中id
navSelect(id) {
this.headTop.forEach((item, index) => {
item.select = false;
if (index == id) {
item.select = true;
}
});
},
//树控件点击事件
itemClick(data) {
console.log(data);
},
//关闭新建子组件弹框
closeDialog(){
this.dialogVisible = false;
}
},
};
import util from "@/libs/util.js";
import Navigation from "../components/IvyElement/navigation";
import Create from "./panel/create/index";
import LineTree from "../components/lineTree/lineTree";
import {setTimeout} from "timers";
import {getTree} from "../api/common"
export default {
components: {
Navigation,
LineTree,
Create,
},
data() {
return {
navigationList: [],
isActive: false,
textLogo: false,
activePath: "",
defaultActive: "",
headTop: [
{
path: "/create",
select: false,
},
{
path: "/add",
select: false,
},
{
path: "/modify",
select: false,
},
{
path: "/change",
select: false,
},
{
path: "/search",
select: false,
},
],
tempTab: [
{
path: "/zrz",
name: "自然幢",
},
{
path: "/dz",
name: "多幢",
},
{
path: "/h",
name: "户",
},
{
path: "/zd",
name: "宗地",
},
],
// 上导航选中id
indId: undefined,
menuList: [],
pathAndCodeObj: {
"/article-draft": "PSH004",
"/article-publish": "PSH005",
"/article-recycle": "PSH006",
"/notice-draft": "PSH007",
"/notice-publish": "PSH008",
"/notice-recycle": "PSH009",
"/column_management": "PSH018",
"/announcement_template": "PSH019",
"/business_management": "PSH020",
},
pd: [
{
mc: "行政区(1)",
children: [],
},
{
mc: "行政区(2)",
children: [
{
mc: "地籍区1",
children: [],
},
{
mc: "地籍区2",
children: [
{
mc: "国有",
children: [
{
mc: "宗地代码1933",
isZD: true,
},
{
mc: "自然幢2100",
isZD: false,
},
],
},
],
},
{
label: "地籍区3",
children: [],
},
{
label: "地籍区4",
children: [],
},
],
},
{
mc: "行政区(3)",
children: [],
},
{
mc: "行政区(4)",
children: [],
},
{
mc: "行政区(5)",
children: [],
},
],
dialogVisible: false,
};
},
computed: {
permission_routes() {
return this.$store.state.permission_routes.navigation;
},
},
watch: {
"$route.path": function (newPath) {
//监测路由变化，高亮顶部导航
this.headTop.forEach((item, index) => {
item.select = false;
if (item.path == newPath) {
item.select = true;
}
});
},
"$store.state.zdbsm": function (bsm) {
this.getRightTree(bsm)
}
},
created() {
if (this.$route.meta) {
this.defaultActive = this.$route.meta.code;
}
if (this.permission_routes.length !== 0) {
this.navigationList = this.permission_routes;
} else {
// let list = JSON.parse(util.cookies.get('navigation-1')).concat(JSON.parse(util.cookies.get('navigation')))
//mock数据
let list = [
{
name: "新建",
icon: "fa fa-address-card-o",
path: "/create",
},
{
name: "添加",
icon: "fa fa-address-card-o",
path: "/add",
},
{name: "更正", icon: "fa fa-address-card-o", path: "/modify"},
{
name: "变更",
icon: "fa fa-address-card-o",
path: "/change",
},
{
name: "综合查询",
icon: "fa fa-address-card-o",
path: "/search",
},
];
this.navigationList = list;
}
this.sortNavigation(this.navigationList, 0);
// if (util.cookies.get("indId")) {
// let indId = util.cookies.get("indId") - 0;
// this.navSelect(indId);
// this.sortNavigation(this.navigationList, indId);
// }
},
methods: {
getRightTree(bsm) {
getTree(bsm).then(res => {
console.log("=========================================")
console.log(res)
if (res.success) {
this.pd=res.result
}
})
},
sortNavigation(data, selectId) {
let headTop = this.headTop;
data.forEach((item, index) => {
headTop[index].name = item.name;
headTop[index].icon = item.icon;
});
},
// menuSelect(data, selectId) {
// this.menuList = data[selectId].children;
// },
handleOpen(key, keyPath) {
console.log(key, keyPath);
},
handleClose(key, keyPath) {
console.log(key, keyPath);
},
toggleClick() {
this.isActive = !this.isActive;
if (!this.isActive) {
setTimeout(() => {
this.textLogo = this.isActive;
}, 200);
} else {
this.textLogo = this.isActive;
}
},
selectTopItems(ind) {
if (ind == 0) {
//点击新建，弹框
this.dialogVisible = true;
} else {
this.dialogVisible = false;
this.indId = ind;
// this.menuSelect(this.navigationList, ind);
// this.$store.dispatch("setTabs/init_tabs");
// this.$store.dispatch("setTabs/set_active_index", "/panel");
this.$router.push(this.headTop[ind].path);
this.navSelect(ind);
// util.cookies.set("indId", ind);
}
},
// 上导航选中id
navSelect(id) {
this.headTop.forEach((item, index) => {
item.select = false;
if (index == id) {
item.select = true;
}
});
},
//树控件点击事件
itemClick(data) {
console.log(data);
},
//关闭新建子组件弹框
closeDialog() {
this.dialogVisible = false;
}
},
};
</script>
<style lang="less" scoped>
.home-box {
width: 100%;
height: 100vh;
.el-container {
height: 100%;
}
.el-header {
background-color: #fff;
padding: 0 !important;
.header-top {
height: 60px;
border-bottom: 1px solid rgba(242, 242, 242, 1);
box-sizing: border-box;
.top-items {
cursor: pointer;
height: 60px;
padding: 0 30px;
font-size: 16px;
line-height: 60px;
float: left;
position: relative;
color: #4a4a4a;
i {
margin-right: 6px;
}
.hamburger {
font-size: 16px;
line-height: 60px;
color: #000;
}
}
.top-items:not(:last-child)::after {
content: "";
width: 1px;
height: 14px;
background: #eaeaea;
position: absolute;
right: -1px;
top: 24px;
}
.top-items.is-active {
color: #006cff;
}
}
.header-bottom {
height: 50px;
box-shadow: 0px 2px 4px 0px rgba(222, 222, 222, 0.7);
border-bottom: 1px solid rgba(234, 234, 234, 1);
box-sizing: border-box;
}
}
.el-aside {
width: 290px !important;
background-color: #1d50dd;
color: #333;
// text-align: center;
overflow: hidden;
transition: width 0.3s;
.logo-box {
width: 100%;
height: 120px;
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
padding: 30px 0 28px 0;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
transition: width 0.3s;
.logo-img {
width: 38px;
height: 38px;
}
.logo-text {
font-size: 14px;
color: rgba(255, 255, 255, 1);
line-height: 14px;
}
}
.treeModule {
box-sizing: border-box;
padding: 20px 20px;
}
.logo-box-show {
width: 64px;
}
.el-menu {
border-right: 0;
}
.el-submenu .el-menu-item {
text-align: left;
text-indent: 15px;
}
}
.aside-show {
width: 64px !important;
}
.home-box {
width: 100%;
height: 100vh;
.el-container {
height: 100%;
}
.el-header {
background-color: #fff;
padding: 0 !important;
.header-top {
height: 60px;
border-bottom: 1px solid rgba(242, 242, 242, 1);
box-sizing: border-box;
.top-items {
cursor: pointer;
height: 60px;
padding: 0 30px;
font-size: 16px;
line-height: 60px;
float: left;
position: relative;
color: #4a4a4a;
i {
margin-right: 6px;
}
.hamburger {
font-size: 16px;
line-height: 60px;
color: #000;
}
}
.top-items:not(:last-child)::after {
content: "";
width: 1px;
height: 14px;
background: #eaeaea;
position: absolute;
right: -1px;
top: 24px;
}
.top-items.is-active {
color: #006cff;
}
}
.header-bottom {
height: 50px;
box-shadow: 0px 2px 4px 0px rgba(222, 222, 222, 0.7);
border-bottom: 1px solid rgba(234, 234, 234, 1);
box-sizing: border-box;
}
}
.el-aside {
width: 290px !important;
background-color: #1d50dd;
color: #333;
// text-align: center;
overflow: hidden;
transition: width 0.3s;
.logo-box {
width: 100%;
height: 120px;
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
padding: 30px 0 28px 0;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
transition: width 0.3s;
.logo-img {
width: 38px;
height: 38px;
}
.logo-text {
font-size: 14px;
color: rgba(255, 255, 255, 1);
line-height: 14px;
}
}
.treeModule {
box-sizing: border-box;
padding: 20px 20px;
}
.logo-box-show {
width: 64px;
}
.el-menu {
border-right: 0;
}
.el-submenu .el-menu-item {
text-align: left;
text-indent: 15px;
}
}
.aside-show {
width: 64px !important;
}
.el-main {
background-color: #f1f4fc;
color: #333;
// text-align: center;
// line-height: 160px;
padding: 0;
}
}
.el-main {
background-color: #f1f4fc;
color: #333;
// text-align: center;
// line-height: 160px;
padding: 0;
}
}
</style>
......
......@@ -234,7 +234,6 @@ export default {
console.log(data);
insertZrzjbxx(data)
.then((res) => {
console.log(res.result);
if (res.code == "200") {
this.$message({
message: "创建成功！",
......@@ -244,6 +243,9 @@ export default {
this.close();
this.$store.zdbsm=res.result.zdbsm;
this.$store.zrzbsm=res.result.bsm;
debugger
console.log("=================================================")
console.log(this.$store.zdbsm)
this.$store.xmmc=res.result.xmmc;
this.$router.push({
path: '/zrz', query:{data: res.result}
......
......@@ -162,10 +162,6 @@
},
mounted() {
// 该标识码继承过来
let bsm = '401044005bad0557d5e3787239d8e18e';
this.bsm=bsm;
this.getData(this.bsm)
},
methods: {
getData(bsm) {
......@@ -260,7 +256,11 @@
}
},
computed: {},
watch: {},
watch: {
"$store.state.zdbsm": function (bsm) {
this.getData(bsm)
}
},
}
</script>
<style scoped lang="less">
......
......@@ -228,10 +228,7 @@
},
mounted() {
// 该标识码继承过来
let bsm = '044dc12648a1f41374679281da63e93b';
this.bsm=bsm;
this.getData(this.bsm)
},
methods: {
getData(bsm) {
......@@ -325,7 +322,11 @@
}
},
computed: {},
watch: {},
watch: {
"$store.state.zdbsm": function (bsm) {
this.getData(bsm)
}
},
}
</script>
<style scoped lang="less">
......
......@@ -52,6 +52,7 @@
<script>
import {savemjft} from '../../../api/zd'
import {Message} from 'element-ui'
export default {
name: "index",
data() {
......@@ -81,7 +82,7 @@
methods: {
save() {
console.log(this.mjftData);
for (let val of this.mjftData.addQjZdftdzwRequestList){
for (let val of this.mjftData.addQjZdftdzwRequestList) {
if (val.dzwdm == '') {
Message.error("定着物代码不能为空")
return
......@@ -90,9 +91,9 @@
savemjft(this.mjftData).then(res => {
console.log(res)
if (res.success){
if (res.success) {
Message.success("保存成功")
}else {
} else {
Message.error(res.message)
}
}).catch(error => {
......@@ -169,13 +170,21 @@
console.log("create init...")
},
mounted() {
// 暂时随机生成 后续从调查表继承过来
this.mjftData.zdbsm = 'ZDDM' + parseInt(Math.random() * 100)
this.mjftData.zdmj = (Math.random() * 1000).toFixed(3)
let zl = ['西安', '咸阳', '雁塔区', '高新区', '未央区', '莲湖区', '临潼区']
let i = parseInt(Math.random() * 7, 10);
this.mjftData.tdzl = zl[i]
console.log("mounted init...")
},
watch: {
"$store.state.zdbsm": function (bsm) {
alert("面积分摊表 宗地标识码"+bsm)
this.mjftData.zdbsm = bsm
},
"$store.state.zdmj": function (zdmj) {
alert("面积分摊表 宗地面积"+zdmj)
this.mjftData.zdmj = zdmj
},
"$store.state.zdzl": function (tdzl) {
alert("面积分摊表 土地坐落"+tdzl)
this.mjftData.tdzl = tdzl
},
}
}
</script>
......
<template>
<div class="main">
<div class="formMenu">
<Qlr ref="qlrxxModule"></Qlr>
<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">
<el-select
class="formSelect"
v-model="formData.xzqbsm"
@change="changeXzq(formData.xzqbsm)"
>
<el-option
v-for="item in xzqList"
:key="item.xzqbsm"
:label="item.xzqmc"
:value="item.xzqbsm"
>
</el-option>
</el-select>
</td>
<td colspan="2">地籍区</td>
<td colspan="2">
<el-select
class="formSelect"
v-model="formData.djqbsm"
@change="changeDjq(formData.djqbsm)"
>
<el-option
v-for="item in djqList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
<td colspan="2">地籍子区</td>
<td colspan="2">
<el-select class="formSelect" v-model="formData.djzqbsm">
<el-option
v-for="item in djzqList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
</tr>
<tr>
<td colspan="2">权利类型</td>
<td colspan="4">
<el-select class="formSelect" v-model="formData.qllxbsm">
<el-option
v-for="item in qllxList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
<td colspan="2">宗地特征码<i class="requisite">*</i></td>
<td colspan="4">
<el-select class="formSelect" v-model="formData.zdtzmbsm">
<el-option
v-for="item in zdtzmList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
</tr>
<tr>
<td colspan="2">权利设定方式</td>
<td colspan="4">
<el-select class="formSelect" v-model="formData.qlsdfs">
<el-option
v-for="item in qlsdfsList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
<td colspan="2">宗地代码<i class="requisite">*</i></td>
<td colspan="4" class="psr">
<input
type="text"
class="formInput percent78"
v-model="formData.zddm"
/>
<el-button type="primary" class="createBtn" @click="generatorCode"
>生成</el-button
>
</td>
</tr>
<tr>
<td colspan="2">地籍号</td>
<td colspan="4">
<input type="text" class="formInput" v-model="formData.djh" />
</td>
<!-- <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">
<el-select
class="formSelect"
v-model="formData.xzqbsm"
@change="changeXzq(formData.xzqbsm)"
>
<el-option
v-for="item in xzqList"
:key="item.xzqbsm"
:label="item.xzqmc"
:value="item.xzqbsm"
>
</el-option>
</el-select>
</td>
<td colspan="2">地籍区</td>
<td colspan="2">
<el-select
class="formSelect"
v-model="formData.djqbsm"
@change="changeDjq(formData.djqbsm)"
>
<el-option
v-for="item in djqList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
<td colspan="2">地籍子区</td>
<td colspan="2">
<el-select class="formSelect" v-model="formData.djzqbsm">
<el-option
v-for="item in djzqList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
</tr>
<tr>
<td colspan="2">权利类型</td>
<td colspan="4">
<el-select class="formSelect" v-model="formData.qllxbsm">
<el-option
v-for="item in qllxList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
<td colspan="2">宗地特征码<i class="requisite">*</i></td>
<td colspan="4">
<el-select class="formSelect" v-model="formData.zdtzmbsm">
<el-option
v-for="item in zdtzmList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
</tr>
<tr>
<td colspan="2">权利设定方式</td>
<td colspan="4">
<el-select class="formSelect" v-model="formData.qlsdfs">
<el-option
v-for="item in qlsdfsList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
<td colspan="2">宗地代码<i class="requisite">*</i></td>
<td colspan="4" class="psr">
<input
type="text"
class="formInput percent78"
v-model="formData.zddm"
/>
<el-button type="primary" class="createBtn" @click="generatorCode"
>生成
</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">不动产单元号<i class="requisite">*</i></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">坐落<i class="requisite">*</i></td>
<td colspan="4">
<input type="text" class="formInput" v-model="formData.zl" />
</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="4">
<el-select class="formSelect" v-model="formData.gmjjhyfl">
<el-option
v-for="item in gmjjhyflList"
: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">北至<i class="requisite">*</i></td>
<td colspan="8" class="psr">
<input type="text" class="formInput" v-model="formData.bz" />
</td>
</tr>
<tr>
<td colspan="2">东至<i class="requisite">*</i></td>
<td colspan="8" class="psr">
<input type="text" class="formInput" v-model="formData.dz" />
</td>
</tr>
<tr>
<td colspan="2">南至<i class="requisite">*</i></td>
<td colspan="8" class="psr">
<input type="text" class="formInput" v-model="formData.nz" />
</td>
</tr>
<tr>
<td colspan="2">西至<i class="requisite">*</i></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>
<td colspan="2">不动产单元号<i class="requisite">*</i></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">坐落<i class="requisite">*</i></td>
<td colspan="4">
<input type="text" class="formInput" v-model="formData.zl"/>
</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="4">
<el-select class="formSelect" v-model="formData.gmjjhyfl">
<el-option
v-for="item in gmjjhyflList"
: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">北至<i class="requisite">*</i></td>
<td colspan="8" class="psr">
<input type="text" class="formInput" v-model="formData.bz"/>
</td>
</tr>
<tr>
<td colspan="2">东至<i class="requisite">*</i></td>
<td colspan="8" class="psr">
<input type="text" class="formInput" v-model="formData.dz"/>
</td>
</tr>
<tr>
<td colspan="2">南至<i class="requisite">*</i></td>
<td colspan="8" class="psr">
<input type="text" class="formInput" v-model="formData.nz"/>
</td>
</tr>
<tr>
<td colspan="2">西至<i class="requisite">*</i></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,
getListByXzqbsm,
getListByPbsm,
} from "../../../api/common";
import { getBdcdyh, getQjZdjbxxDetailById } from "../../../api/zd";
export default {
name: "",
components: {
Qlr,
Qlxz,
},
props: {},
data() {
return {
qllxList: [],
zdtzmList: [],
qlsdfsList: [],
gmjjhyflList: [],
xzqList: this.$store.state.xzqList,
djqList: this.$store.state.djqList,
djzqList: this.$store.state.djzqList,
compareList: [
{ label: "=", value: "=" },
{ label: "<=", value: "<=" },
{ label: ">=", value: ">=" },
],
formData: {
xzqbsm: "",
djqbsm: "",
djzqbsm: "",
qllxbsm: "",
zdtzmbsm: "",
qlsdfs: "",
zddm: "",
djh: "",
bdcdyh: "",
zl: "",
tdqslyzmcl: "",
gmjjhyfl: "",
jg: "",
blc: "",
tfh: "",
rjl: "",
rjsm: "",
jzmd: "",
jzmdsm: "",
jzxg: "",
jzxgsm: "",
bz: "",
dz: "",
nz: "",
xz: "",
pzmj: "",
zdmj: "",
jzzdmj: "",
jzmj: "",
gyqlrqk: "",
sm: "",
},
};
},
created() {
this.getDicData();
this.getZdjbxxData();
},
mounted() {},
methods: {
//根据zdbsm查询基本信息
getZdjbxxData() {
getQjZdjbxxDetailById(this.$store.state.zdbsm)
.then((res) => {
if (res.result) {
console.log(res.result);
this.formData = res.result;
}
})
.catch((error) => {});
},
//生成宗地代码
generatorCode() {
//前6位是xzqbsm，接着3位djqbsm，3位djzqbsm，最后2位是syqlxbsm 860101555888GB
getBdcdyh("860101555888GB", "zd")
.then((res) => {
console.log(res);
this.formData.zddm = res.result.substring(0, 19);
this.formData.bdcdyh = res.result;
})
.catch((error) => {});
},
import Qlr from "../../../components/formMenu/qlr";
import Qlxz from "../../../components/formMenu/qlxz";
import {
getDdicByMC,
getListByXzqbsm,
getListByPbsm,
} from "../../../api/common";
import {getBdcdyh, getQjZdjbxxDetailById} from "../../../api/zd";
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) => {});
getDdicByMC("宗地（宗海）特征码")
.then((res) => {
console.log(res.result);
this.zdtzmList = res.result;
})
.catch((error) => {});
getDdicByMC("权利设定方式")
.then((res) => {
console.log(res.result);
this.qlsdfsList = res.result;
})
.catch((error) => {});
getDdicByMC("国民经济行业分类代码")
.then((res) => {
console.log(res.result);
this.gmjjhyflList = res.result;
})
.catch((error) => {});
},
//行政区划选择
changeXzq(id) {
getListByXzqbsm(id)
.then((res) => {
this.formData.djqbsm = "";
this.formData.djzqbsm = "";
this.djqList = res.result;
this.$store.state.djqList = res.result;
})
.catch((error) => {});
},
changeDjq(item) {
getListByPbsm(item)
.then((res) => {
this.formData.djzqbsm = "";
this.djzqList = res.result;
this.$store.state.djzqList = res.result;
})
.catch((error) => {});
},
},
computed: {},
watch: {},
};
export default {
name: "",
components: {
Qlr,
Qlxz,
},
props: {},
data() {
return {
qllxList: [],
zdtzmList: [],
qlsdfsList: [],
gmjjhyflList: [],
xzqList: this.$store.state.xzqList,
djqList: this.$store.state.djqList,
djzqList: this.$store.state.djzqList,
compareList: [
{label: "=", value: "="},
{label: "<=", value: "<="},
{label: ">=", value: ">="},
],
formData: {
xzqbsm: "",
djqbsm: "",
djzqbsm: "",
qllxbsm: "",
zdtzmbsm: "",
qlsdfs: "",
zddm: "",
djh: "",
bdcdyh: "",
zl: "",
tdqslyzmcl: "",
gmjjhyfl: "",
jg: "",
blc: "",
tfh: "",
rjl: "",
rjsm: "",
jzmd: "",
jzmdsm: "",
jzxg: "",
jzxgsm: "",
bz: "",
dz: "",
nz: "",
xz: "",
pzmj: "",
zdmj: "",
jzzdmj: "",
jzmj: "",
gyqlrqk: "",
sm: "",
},
};
},
created() {
this.getDicData();
this.getZdjbxxData();
},
mounted() {
},
methods: {
//根据zdbsm查询基本信息
getZdjbxxData() {
getQjZdjbxxDetailById(this.$store.state.zdbsm)
.then((res) => {
if (res.result) {
console.log(res.result);
this.formData = res.result;
}
})
.catch((error) => {
});
},
//生成宗地代码
generatorCode() {
//前6位是xzqbsm，接着3位djqbsm，3位djzqbsm，最后2位是syqlxbsm 860101555888GB
getBdcdyh("860101555888GB", "zd")
.then((res) => {
console.log(res);
this.formData.zddm = res.result.substring(0, 19);
this.formData.bdcdyh = res.result;
})
.catch((error) => {
});
},
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) => {
});
getDdicByMC("宗地（宗海）特征码")
.then((res) => {
console.log(res.result);
this.zdtzmList = res.result;
})
.catch((error) => {
});
getDdicByMC("权利设定方式")
.then((res) => {
console.log(res.result);
this.qlsdfsList = res.result;
})
.catch((error) => {
});
getDdicByMC("国民经济行业分类代码")
.then((res) => {
console.log(res.result);
this.gmjjhyflList = res.result;
})
.catch((error) => {
});
},
//行政区划选择
changeXzq(id) {
getListByXzqbsm(id)
.then((res) => {
this.formData.djqbsm = "";
this.formData.djzqbsm = "";
this.djqList = res.result;
this.$store.state.djqList = res.result;
})
.catch((error) => {
});
},
changeDjq(item) {
getListByPbsm(item)
.then((res) => {
this.formData.djzqbsm = "";
this.djzqList = res.result;
this.$store.state.djzqList = res.result;
})
.catch((error) => {
});
},
},
computed: {
zl() {
return this.formData.zl
},
zdmj() {
return this.formData.zdmj
}
},
watch: {
zl: function (val) {
alert("宗地坐落")
alert(val)
this.$store.state.zdzl = val
},
zdmj: function (val) {
this.$store.state.zdmj = val
}
},
};
</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%;
}
}
}
.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>
......