Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
800ddc3d by 田浩浩
Options

新建重构工作流程框架

1 parent ceaac6ba
Inline Side-by-side
Showing 3 changed files with 260 additions and 40 deletions
......@@ -39,6 +39,15 @@ export function getZdjbxx(qlbsm) {
})
}
// 获取宗地信息
export function getZdjjxxBySLdy(data) {
return request({
url: '/zhcx/djbcx/getZdjjxxBySLdy',
method: 'get',
params: data
})
}
// 获取不动产权利及其他事项页面信息
export function getQlname(qlbsm) {
return request({
......@@ -65,7 +74,7 @@ export function getJsydsyqList(data) {
}
// 进度查询列表
export function getJdcxBysearch (data) {
export function getJdcxBysearch(data) {
return request({
url: '/zhcx/search/getJdcxBysearch',
method: 'post',
......
......@@ -26,11 +26,38 @@
</ul>
</div>
<!-- 内容框架 -->
<div>
<div id="ContainerFrame">
<!-- 左侧菜单栏 -->
<div></div>
<div id="leftmenu">
<ul>
<p class="title">申请单元列表({{ unitData.length }})</p>
<div v-for="(item, index) in unitData" :key="index">
<li @click="unitClick(item)">
<p>{{ item.bdcdyh }}</p>
<p>{{ item.zl }}</p>
</li>
<!-- <div class="xian"></div> -->
</div>
</ul>
</div>
<!-- 表单内容区域 -->
<div></div>
<div id="rightContainer">
<div class="tabDiv">
<el-tabs v-model="activeName" @tab-click="tabClick">
<el-tab-pane
:label="item.name"
:name="item.value"
v-for="(item, index) in tabList"
:key="index"
>
</el-tab-pane>
</el-tabs>
<component :is="componentTag" v-bind="currentSelectProps" />
</div>
<!-- <div style="width: 100%">
</div> -->
</div>
</div>
</div>
</template>
......@@ -38,6 +65,68 @@
<style scoped lang='scss'>
@import "~@/styles/mixin.scss";
#ContainerFrame {
// margin-left: 5px;
// border: 1px solid #ebeef5;
// position: relative;
// box-sizing: border-box;
// width: 100%;
// height: 100%;
// display: inline;
height: 100%;
width: 100%;
position: sticky;
top: 80px;
//background-color: #ffffff;
border: 1px solid #ebeef5;
z-index: 100;
@include flex;
}
#leftmenu {
width: 250px;
border-right: 1px solid #ebeef5;
position: relative;
box-sizing: border-box;
ul {
position: relative;
.xian {
background: #f2f2f2;
padding: 2px;
}
.title {
padding: 5px;
text-align: center;
}
li {
padding: 5px;
font-size: 14px;
color: #606266;
line-height: 20px;
}
li:hover {
color: #0f93f6;
cursor: pointer;
}
}
}
#rightContainer {
.tabDiv {
width: 100%;
height: 100%;
}
// .fenpin {
// min-width: 50%;
// border-right: 1px solid #ebeef5;
// }
background-color: #ffffffe7;
width: 100%;
height: 100%;
z-index: 100;
@include flex;
}
.svg-icon {
width: 2.5em;
height: 2.5em;
......@@ -95,22 +184,34 @@
<script>
import { leftMenu, stepExpandInfo, record } from "@/api/fqsq.js";
export default {
components: {
slxx: () => import("./components/slxx.vue"),
spyj: () => import("./components/spyj.vue"),
zdjbxx: () => import("../../zhcx/djbcx/components/zdxx.vue"),
qlxx: () => import("../../components/jsydsyq/jsydsyq.vue"),
},
data() {
return {
bsmSlsq: "",
bestepid: "",
leftButtonList: [],
rightButtonList: [],
unitData: [],
activeName: "",
tabList: [],
componentTag: "",
currentSelectProps: {},
};
},
mounted() {
this.bsmSlsq = this.$route.query.bsmSlsq;
this.bestepid = this.$route.query.bestepid;
this.loadButton();
this.loadBdcdylist();
this.flowInitParam();
},
methods: {
//读取顶部按钮事件
loadButton() {
//加载流程初始参数
flowInitParam() {
var formdata = new FormData();
formdata.append("bsmSlsq", this.bsmSlsq);
formdata.append("bestepid", this.bestepid);
......@@ -118,9 +219,101 @@ export default {
if (res.code === 200) {
this.leftButtonList = res.result.button;
this.rightButtonList = res.result.operation;
this.tabList = res.result.form;
//默认选择第一个选项卡内容
this.activeName = res.result.form[0].value;
//默认加载第一个选项卡的组件内容
this.componentTag = res.result.form[0].value;
}
});
},
//流程环节操作按钮
operation(index, item) {
let that = this;
switch (item.value) {
case "zsyl":
this.zsylFlag = true;
break;
case "clfp":
this.key++;
this.issplitScreen = !this.issplitScreen;
this.flag = !this.flag;
if (this.issplitScreen) {
this.tabList.splice(1, 1);
} else {
this.tabList = [...this.tabList1];
}
break;
case "th":
this.thflag = true;
this.$nextTick(() => {
this.$refs.thdialogRef.tablelistFn();
});
break;
case "zc":
this.zcDialog = true;
this.$refs.zcDialogRef.tablelistFn();
break;
case "tc":
window.close();
break;
case "db":
var formdata = new FormData();
formdata.append("bsmSlsq", this.bsmSlsq);
formdata.append("bestepid", this.bestepid);
// comMsg;
this.$confirm("请确认是否登簿", "提示", {
iconClass: "el-icon-question", //自定义图标样式
confirmButtonText: "确认", //确认按钮文字更换
cancelButtonText: "取消", //取消按钮文字更换
showClose: true, //是否显示右上角关闭按钮
type: "warning", //提示类型 success/info/warning/error
}).then(function () {
record(formdata).then((res) => {
if (res.code === 200 || res.code === 2002) {
that.$alert(res.message);
}
});
});
break;
}
},
loadBdcdylist() {
var formdata = new FormData();
formdata.append("bsmSlsq", this.bsmSlsq);
formdata.append("bestepid", this.bestepid);
leftMenu(formdata).then((res) => {
if (res.code === 200) {
this.unitData = res.result;
this.currentSelectProps = res.result[0];
//debugger;
//this.$alert(res.result[0].bsmSldy);
// setTimeout(() => {
// that.$refs.slxx?.[0].list(that.unitData?.[0]?.bsmSldy);
// this.bsmBusiness = that.unitData?.[0]?.bsmBusiness;
// }, 300);
}
});
},
// 左侧列表点击调用接口
unitClick(item) {
// this.bsmBusiness = item.bsmBusiness
// var activeTabName = this.activeName
// if(activeTabName == 'slxx'){
// //受理信息页面接口调取
// this.$nextTick(() => {
// this.$refs.slxx[0].list(item.bsmSldy)
// })
// }else if(activeTabName == 'spyj'){
// //审批页面接口调取
// this.$nextTick(() => {
// this.$refs.spyj[0].list(this.bsmBusiness,this.queryForm.bestepid)
// })
// }
},
tabClick(tab, event) {
this.componentTag = tab.name;
},
},
};
</script>
\ No newline at end of file
......
......@@ -24,84 +24,84 @@
</tr>
<tr>
<td colspan="2">坐落</td>
<td colspan="4">{{ djzd.zl }}</td>
<td colspan="4">{{ zdjbxx.zdjxx.zl }}</td>
</tr>
<tr>
<td rowspan="8" class="title2">土地状况</td>
</tr>
<tr>
<td colspan="2">宗地面积</td>
<td>{{ djzd.zdmj }}</td>
<td>{{ zdjbxx.zdjxx.zdmj }}</td>
<td>用途</td>
<td>{{ djzd.yt }}</td>
<td>{{ zdjbxx.zdjxx.ghytmc }}</td>
</tr>
<tr>
<td colspan="2">等级</td>
<td>{{ djzd.dj }}</td>
<td>{{ zdjbxx.zdjxx.dj }}</td>
<td>价格</td>
<td>{{ djzd.jg }}</td>
<td>{{ zdjbxx.zdjxx.jg }}</td>
</tr>
<tr>
<td colspan="2">权利类型</td>
<td>{{ djzd.qllx }}</td>
<td>{{ zdjbxx.zdjxx.qllx }}</td>
<td>权利性质</td>
<td>{{ djzd.qlxz }}</td>
<td>{{ zdjbxx.zdjxx.qlxz }}</td>
</tr>
<tr>
<td colspan="2">权利设定方式</td>
<td>{{ djzd.qlsdfs }}</td>
<td>{{ zdjbxx.zdjxx.qlsdfs }}</td>
<td>容积率</td>
<td>{{ djzd.rjl }}</td>
<td>{{ zdjbxx.zdjxx.rjl }}</td>
</tr>
<tr>
<td colspan="2">建筑密度</td>
<td>{{ djzd.jzmd }}</td>
<td>{{ zdjbxx.zdjxx.jzmd }}</td>
<td>建筑限高</td>
<td>{{ djzd.jzxg }}</td>
<td>{{ zdjbxx.zdjxx.jzxg }}</td>
</tr>
<tr>
<td colspan="2">图幅号</td>
<td>{{ djzd.tfh }}</td>
<td>{{ zdjbxx.zdjxx.tfh }}</td>
<td>地籍号</td>
<td>{{ djzd.djh }}</td>
<td>{{ zdjbxx.zdjxx.djh }}</td>
</tr>
<tr>
<td colspan="2">档案号</td>
<td>{{ djzd.dah }}</td>
<td>{{ zdjbxx.zdjxx.dah }}</td>
<td>地块代码</td>
<td>{{ djzd.dkdm }}</td>
<td>{{ zdjbxx.zdjxx.dkdm }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-东</td>
<td colspan="4">{{ djzd.zdszd }}</td>
<td colspan="4">{{ zdjbxx.zdjxx.zdszd }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-南</td>
<td colspan="4">{{ djzd.zdszn }}</td>
<td colspan="4">{{ zdjbxx.zdjxx.zdszn }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-西</td>
<td colspan="4">{{ djzd.zdszx }}</td>
<td colspan="4">{{ zdjbxx.zdjxx.zdszx }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-北</td>
<td colspan="4">{{ djzd.zdszb }}</td>
<td colspan="4">{{ zdjbxx.zdjxx.zdszb }}</td>
</tr>
<tr>
<td class="title2" height="96">备注</td>
<td colspan="5">{{ djzd.bz }}</td>
<td colspan="5">{{ zdjbxx.zdjxx.bz }}</td>
</tr>
<tr>
<td class="title2" height="96">附记</td>
<td colspan="5">{{ djzd.fj }}</td>
<td colspan="5">{{ zdjbxx.zdjxx.fj }}</td>
</tr>
<tr>
<td colspan="2">状态</td>
<td colspan="2">{{ djzd.zt }}</td>
<td colspan="2">{{ zdjbxx.zdjxx.zt }}</td>
<td>区县代码</td>
<td>{{ djzd.qxdm }}</td>
<td>{{ zdjbxx.zdjxx.qxdm }}</td>
</tr>
<tr>
<tr v-show="showGroup">
<td class="title2">变化情况</td>
<td colspan="5" class="bhqk">
<div class="box">
......@@ -123,6 +123,7 @@
<script>
import { mapGetters } from "vuex";
import { getZdjjxxBySLdy } from "@/api/zhcx.js";
export default {
name: "zdxx",
......@@ -165,19 +166,36 @@ export default {
bhqkTableWidth: 745,
djzd: {},
zdbhqks: [],
propsParam: {},
zdjbxx: {},
showGroup: false,
};
},
computed: {
...mapGetters(["djbxx"]),
},
// computed: {
// ...mapGetters(["djbxx"]),
// },
mounted() {
this.info = this.djbxx.zdjbxx;
this.djzd = this.djbxx.zdjbxx.djzd;
this.zdbhqks = this.djbxx.zdjbxx.zdbhqks;
this.propsParam = this.$attrs;
this.loadData();
//this.$alert(this.param.bdcdyh);
// this.info = this.djbxx.zdjbxx;
// this.djzd = this.djbxx.zdjbxx.djzd;
// this.zdbhqks = this.djbxx.zdjbxx.zdbhqks;
let widths = (this.zdbhqks.length + 1) * 180 + 110;
this.bhqkTableWidth = widths > 745 ? widths : 745;
// let widths = (this.zdbhqks.length + 1) * 180 + 110;
// this.bhqkTableWidth = widths > 745 ? widths : 745;
},
methods: {
loadData() {
getZdjjxxBySLdy({ bsmsldy: this.propsParam.bsmSldy }).then((res) => {
if (res.code === 200) {
this.zdjbxx = res.result;
if (res.result.length > 0) {
this.showGroup = true;
}
}
});
},
},
};
</script>
......