Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
0630b8f7 by renchao@pashanhoo.com
Options

style:宗地图

1 parent 24b121cc
Inline Side-by-side
Showing 2 changed files with 45 additions and 275 deletions
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-06-01 09:48:15
-->
<template>
<canvas id="mxcad">
</canvas>
</template>
<script>
import Mx from "mxdraw"
export default {
mounted () {
// 动态加载 js库核心代码
Mx.loadCoreCode().then(() => {
// Mx.MxFun.setMxServer("ws://localhost:5090") // 开启socket通信 可编辑图纸
// 创建控件对象
Mx.MxFun.createMxObject({
canvasId: "mxcad", // canvas元素的id
cadFile: "/buf/hhhh.dwg", // http方式(预览): 加载public/demo文件夹下转换后的图纸
// cadFile: "test2.dwg", // socket通信方式请直接提供图纸名称 如：text.dwg
callback: (mxDraw, {
canvas,
canvasParent
}) => {
// 可以拿到canvas元素和它的父级元素
console.log(canvas, canvasParent)
console.log(mxDraw)
// 拿到图层数据
mxDraw.addEvent('uiSetLayerData', (listLayer) => {
console.log(listLayer)
})
},
isNewFile: true // 是否新建文件
})
})
}
}
</script>
<style scoped lang='scss'>
#cad-container {
width: 100%;
height: 100%;
}
</style>
\ No newline at end of file
<template>
<div class="ywsq" id="ywsq">
<div class="ywsq-left">
<p v-for="(item, index) in sqywlxList" @click="sqywlxClick(item)" :key="index"
:class="{ 'active': selectType == item.type }">{{ item.name }}</p>
<el-collapse disabled v-model="activeNames">
<el-collapse-item title="业务申请" name="1">
<ul class="item-list">
<li v-for="(item, index) in sqywQllxList" :key="index" @click="qllxClick(index)"
:class="item.check ? 'active' : ''">
{{ item.nodename }}</li>
</ul>
</el-collapse-item>
</el-collapse>
</div>
<div class="ywsq-right">
<!-- 常办业务 -->
<div v-show="selectType == 'collect'" class="right-situation el-card">
<div class="right-title">常办业务列表</div>
<ul>
<li :class="item.selected ? 'cactive' : ''" v-for="(item, index) in collectList" :key="index"
@dblclick="dblclick(collectList, index, item)" @click="selectSqywClick(collectList, index)">
<p v-if="item.nodetype == 'djqx'">{{ item.djywmc }}<br>{{ item.nodename }}</p>
<dt v-else>{{ item.djywmc }}</dt>
<p class="active" @click.stop="handleCollection(item)">
<i class="el-icon-star-off"></i>
</p>
</li>
</ul>
</div>
<!-- 一并申请 -->
<div v-if="selectType == 'together'" class="right-title">一并申请</div>
<!-- 登记簿补录 -->
<div v-if="selectType == 'amend'" class="right-title">登记簿补录</div>
<!-- 业务申请 -->
<template v-if="selectType == 'apply'">
<div class="right-type el-card box-card is-always-shadow">
<div class="right-title">登记类型</div>
<ul class="type-content">
<li :class="item.selected ? 'cactive' : ''" @dblclick="item.sffqlc == 1 && dblclick(djlxList, index, item)"
@click="selectSqywClick(djlxList, index)" v-for="(item, index) in djlxList" :key="index">
<p>
{{ item.nodename }}
</p>
<p v-if="item.sffqlc == 1" :class="item.userCollect == 1 ? 'active' : ''"
@click.stop="handleCollection(item)">
<i class="el-icon-star-off"></i>
</p>
</li>
</ul>
</div>
<div class="right-situation el-card box-card is-always-shadow">
<div class="right-title">登记情形</div>
<ul>
<li :class="item.selected ? 'cactive' : ''" v-for="(item, index) in djqxList" :key="index"
@dblclick="dblclick(djqxList, index, item)" @click="selectSqywClick(djqxList, index)">
<dt>{{ item.nodename }}</dt>
<p :class="item.userCollect == 1 ? 'active' : ''" @click.stop="handleCollection(item)">
<i class="el-icon-star-off"></i>
</p>
</li>
</ul>
</div>
</template>
<div class="submit-button">
<el-button type="primary" :disabled="btnDisabled" @click="dialogClick">选择不动产</el-button>
</div>
</div>
</div>
</template>
<script>
import { getCollectBiz, getleftMenu, getNextNode, addCollectBiz, deleteCollectBiz } from "@/api/ywbl"
export default {
data () {
return {
//申请业务类型集合
sqywlxList: [
{ name: "常办业务", type: "collect" },
{ name: "一并申请", type: "together" },
{ name: "登记簿补录", type: "amend" }
],
//类型默认选择常办业务
selectType: "collect",
//堆叠框选中第一个
activeNames: ['1'],
//收藏业务集合
collectList: [],
//申请权利类型集合
sqywQllxList: [],
//登记类型集合
djlxList: [],
//申请权利类型集合
djqxList: [],
//选中业务的参数
selectParam: {},
//选择按钮显示或隐藏
btnDisabled: true,
}
},
created () {
this.getDataList();
},
methods: {
getDataList () {
//获取收藏信息集合
getCollectBiz().then(res => {
this.collectList = res.result;
this.collectList.forEach(item => {
this.$set(item, 'selected', false);
});
});
//获取申请权利信息集合
getleftMenu().then(res => {
this.sqywQllxList = res.result;
})
},
//申请业务类型菜单事件
sqywlxClick (item) {
this.btnDisabled = true;
this.selectType = item.type;
this.sqywQllxList.forEach(item => {
if (item.check) item.check = false;
})
},
//权利类型菜单事件
qllxClick (index) {
this.btnDisabled = true;
this.sqywQllxList.forEach(item => {
if (item.check) item.check = false;
})
this.sqywQllxList[index].check = true;
this.selectType = "apply";
this.djlxList = [];
this.djqxList = [];
this.getNextNode(this.sqywQllxList[index].bsmSqyw);
},
//选择申请业务事件
selectSqywClick (data, index) {
data.forEach(item => {
item.selected = false;
});
data[index].selected = true;
if (data[index].sffqlc == "1") {
this.selectParam = data[index];
this.btnDisabled = false;
} else {
this.btnDisabled = true;
this.getNextNode(data[index].bsmSqyw);
}
},
//获取下个节点类型数据
getNextNode (bsmSqyw) {
getNextNode(bsmSqyw).then(res => {
if (res.result.djqx) {
this.djqxList = res.result.djqx;
this.djqxList.forEach(item => {
this.$set(item, 'selected', false);
});
}
if (res.result.djlx) {
this.djlxList = res.result.djlx;
this.djlxList.forEach(item => {
this.$set(item, 'selected', false);
});
}
})
},
//双击事件
dblclick (data, index, item) {
localStorage.setItem('ywbl', JSON.stringify(item));
this.selectSqywClick(data, index);
this.dialogClick();
},
//打开弹框内容
dialogClick () {
this.openDialog();
},
//收藏操作
handleCollection (item) {
let that = this
if (item.userCollect == '2') {
addCollectBiz(item.bsmSqyw).then(res => {
if (res.code == 200) {
item.userCollect = '1'
that.$message({
message: '收藏成功！',
type: 'success'
})
that.getDataList()
}
})
} else {
this.$confirm('此操作将取消收藏, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteCollectBiz(item.bsmSqyw).then(res => {
if (res.code == 200) {
item.userCollect = '2'
that.$message({
message: '取消收藏成功！',
type: 'success'
})
that.getDataList()
}
})
})
}
},
handleSelect (item) {
this.busList.forEach(item => {
item.cselect = false
})
item.cselect = !item.cselect
},
// 登记类型
handleDjlxSelect (item) {
this.djlxList.forEach(item => {
item.cselect = false
})
this.btnDisabled = true
item.cselect = true;
this.djqxObj = item;
if (item.sffqlc == '1') {
this.btnDisabled = false
this.bsmSqyw = item.bsmSqyw
this.djywbm = item.djywbm;
} else {
this.getNextNode(item.bsmSqyw, false)
}
this.djqxList = []
},
handleDjqxItem (item) {
this.djlxList.forEach(item => {
item.cselect = false
})
if (item.sffqlc == 1) {
this.djywbm = item.djywbm
this.bsmSqyw = item.bsmSqyw
item.cselect = true
this.openDialog()
this.btnDisabled = true
}
},
handleSelectItem (item, list) {
this.handleSelectYw(item, list)
this.openDialog()
},
// 选择不动产信息
bthSelectClick () {
this.openDialog()
},
openDialog () {
let title = "申请业务：" + this.selectParam?.djywmc ? this.selectParam?.djywmc : '';
this.$popupDialog(title, "ywbl/ywsq/selectBdc", { 'sqywInfo': this.selectParam }, "80%")
},
loadView (view) {
return r => require.ensure([], () => r(require(`./components/${view}/${view}.vue`)))
}
}
}
</script>
<style scoped lang='scss'>
@import "~@/styles/mixin.scss";
@import "./ywsq.scss";
/deep/.el-collapse-item__content {
padding-bottom: 0;
}
/deep/.el-collapse-item__wrap {
border-bottom: none;
}
</style>
\ No newline at end of file