0630b8f7 by renchao@pashanhoo.com

style:宗地图

1 parent 24b121cc
1 <!--
2 * @Description:
3 * @Autor: renchao
4 * @LastEditTime: 2023-06-01 09:48:15
5 -->
6 <template>
7 <canvas id="mxcad">
8 </canvas>
9 </template>
10 <script>
11 import Mx from "mxdraw"
12 export default {
13 mounted () {
14 // 动态加载 js库核心代码
15 Mx.loadCoreCode().then(() => {
16 // Mx.MxFun.setMxServer("ws://localhost:5090") // 开启socket通信 可编辑图纸
17 // 创建控件对象
18 Mx.MxFun.createMxObject({
19 canvasId: "mxcad", // canvas元素的id
20 cadFile: "/buf/hhhh.dwg", // http方式(预览): 加载public/demo文件夹下转换后的图纸
21 // cadFile: "test2.dwg", // socket通信方式请直接提供图纸名称 如:text.dwg
22 callback: (mxDraw, {
23 canvas,
24 canvasParent
25 }) => {
26 // 可以拿到canvas元素和它的父级元素
27 console.log(canvas, canvasParent)
28 console.log(mxDraw)
29 // 拿到图层数据
30 mxDraw.addEvent('uiSetLayerData', (listLayer) => {
31 console.log(listLayer)
32 })
33 },
34 isNewFile: true // 是否新建文件
35 })
36 })
37 }
38 }
39 </script>
40 <style scoped lang='scss'>
41 #cad-container {
42 width: 100%;
43 height: 100%;
44 }
45 </style>
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <div class="ywsq" id="ywsq">
3 <div class="ywsq-left">
4 <p v-for="(item, index) in sqywlxList" @click="sqywlxClick(item)" :key="index"
5 :class="{ 'active': selectType == item.type }">{{ item.name }}</p>
6 <el-collapse disabled v-model="activeNames">
7 <el-collapse-item title="业务申请" name="1">
8 <ul class="item-list">
9 <li v-for="(item, index) in sqywQllxList" :key="index" @click="qllxClick(index)"
10 :class="item.check ? 'active' : ''">
11 {{ item.nodename }}</li>
12 </ul>
13 </el-collapse-item>
14 </el-collapse>
15 </div>
16 <div class="ywsq-right">
17 <!-- 常办业务 -->
18 <div v-show="selectType == 'collect'" class="right-situation el-card">
19 <div class="right-title">常办业务列表</div>
20 <ul>
21 <li :class="item.selected ? 'cactive' : ''" v-for="(item, index) in collectList" :key="index"
22 @dblclick="dblclick(collectList, index, item)" @click="selectSqywClick(collectList, index)">
23 <p v-if="item.nodetype == 'djqx'">{{ item.djywmc }}<br>{{ item.nodename }}</p>
24 <dt v-else>{{ item.djywmc }}</dt>
25 <p class="active" @click.stop="handleCollection(item)">
26 <i class="el-icon-star-off"></i>
27 </p>
28 </li>
29 </ul>
30 </div>
31 <!-- 一并申请 -->
32 <div v-if="selectType == 'together'" class="right-title">一并申请</div>
33 <!-- 登记簿补录 -->
34 <div v-if="selectType == 'amend'" class="right-title">登记簿补录</div>
35 <!-- 业务申请 -->
36 <template v-if="selectType == 'apply'">
37 <div class="right-type el-card box-card is-always-shadow">
38 <div class="right-title">登记类型</div>
39 <ul class="type-content">
40 <li :class="item.selected ? 'cactive' : ''" @dblclick="item.sffqlc == 1 && dblclick(djlxList, index, item)"
41 @click="selectSqywClick(djlxList, index)" v-for="(item, index) in djlxList" :key="index">
42 <p>
43 {{ item.nodename }}
44 </p>
45 <p v-if="item.sffqlc == 1" :class="item.userCollect == 1 ? 'active' : ''"
46 @click.stop="handleCollection(item)">
47 <i class="el-icon-star-off"></i>
48 </p>
49 </li>
50 </ul>
51 </div>
52 <div class="right-situation el-card box-card is-always-shadow">
53 <div class="right-title">登记情形</div>
54 <ul>
55 <li :class="item.selected ? 'cactive' : ''" v-for="(item, index) in djqxList" :key="index"
56 @dblclick="dblclick(djqxList, index, item)" @click="selectSqywClick(djqxList, index)">
57 <dt>{{ item.nodename }}</dt>
58 <p :class="item.userCollect == 1 ? 'active' : ''" @click.stop="handleCollection(item)">
59 <i class="el-icon-star-off"></i>
60 </p>
61 </li>
62 </ul>
63 </div>
64 </template>
65 <div class="submit-button">
66 <el-button type="primary" :disabled="btnDisabled" @click="dialogClick">选择不动产</el-button>
67 </div>
68 </div>
69 </div>
70 </template>
71 <script>
72 import { getCollectBiz, getleftMenu, getNextNode, addCollectBiz, deleteCollectBiz } from "@/api/ywbl"
73 export default {
74 data () {
75 return {
76 //申请业务类型集合
77 sqywlxList: [
78 { name: "常办业务", type: "collect" },
79 { name: "一并申请", type: "together" },
80 { name: "登记簿补录", type: "amend" }
81 ],
82 //类型默认选择常办业务
83 selectType: "collect",
84 //堆叠框选中第一个
85 activeNames: ['1'],
86 //收藏业务集合
87 collectList: [],
88 //申请权利类型集合
89 sqywQllxList: [],
90 //登记类型集合
91 djlxList: [],
92 //申请权利类型集合
93 djqxList: [],
94 //选中业务的参数
95 selectParam: {},
96 //选择按钮显示或隐藏
97 btnDisabled: true,
98 }
99 },
100 created () {
101 this.getDataList();
102 },
103 methods: {
104 getDataList () {
105 //获取收藏信息集合
106 getCollectBiz().then(res => {
107 this.collectList = res.result;
108 this.collectList.forEach(item => {
109 this.$set(item, 'selected', false);
110 });
111 });
112 //获取申请权利信息集合
113 getleftMenu().then(res => {
114 this.sqywQllxList = res.result;
115 })
116 },
117 //申请业务类型菜单事件
118 sqywlxClick (item) {
119 this.btnDisabled = true;
120 this.selectType = item.type;
121 this.sqywQllxList.forEach(item => {
122 if (item.check) item.check = false;
123 })
124 },
125 //权利类型菜单事件
126 qllxClick (index) {
127 this.btnDisabled = true;
128 this.sqywQllxList.forEach(item => {
129 if (item.check) item.check = false;
130 })
131 this.sqywQllxList[index].check = true;
132 this.selectType = "apply";
133 this.djlxList = [];
134 this.djqxList = [];
135 this.getNextNode(this.sqywQllxList[index].bsmSqyw);
136 },
137 //选择申请业务事件
138 selectSqywClick (data, index) {
139 data.forEach(item => {
140 item.selected = false;
141 });
142 data[index].selected = true;
143 if (data[index].sffqlc == "1") {
144 this.selectParam = data[index];
145 this.btnDisabled = false;
146 } else {
147 this.btnDisabled = true;
148 this.getNextNode(data[index].bsmSqyw);
149 }
150 },
151 //获取下个节点类型数据
152 getNextNode (bsmSqyw) {
153 getNextNode(bsmSqyw).then(res => {
154 if (res.result.djqx) {
155 this.djqxList = res.result.djqx;
156 this.djqxList.forEach(item => {
157 this.$set(item, 'selected', false);
158 });
159 }
160 if (res.result.djlx) {
161 this.djlxList = res.result.djlx;
162 this.djlxList.forEach(item => {
163 this.$set(item, 'selected', false);
164 });
165 }
166 })
167 },
168 //双击事件
169 dblclick (data, index, item) {
170 localStorage.setItem('ywbl', JSON.stringify(item));
171 this.selectSqywClick(data, index);
172 this.dialogClick();
173 },
174 //打开弹框内容
175 dialogClick () {
176 this.openDialog();
177 },
178 //收藏操作
179 handleCollection (item) {
180 let that = this
181 if (item.userCollect == '2') {
182 addCollectBiz(item.bsmSqyw).then(res => {
183 if (res.code == 200) {
184 item.userCollect = '1'
185 that.$message({
186 message: '收藏成功!',
187 type: 'success'
188 })
189 that.getDataList()
190 }
191 })
192 } else {
193 this.$confirm('此操作将取消收藏, 是否继续?', '提示', {
194 confirmButtonText: '确定',
195 cancelButtonText: '取消',
196 type: 'warning'
197 }).then(() => {
198 deleteCollectBiz(item.bsmSqyw).then(res => {
199 if (res.code == 200) {
200 item.userCollect = '2'
201 that.$message({
202 message: '取消收藏成功!',
203 type: 'success'
204 })
205 that.getDataList()
206 }
207 })
208 })
209 }
210 },
211 handleSelect (item) {
212 this.busList.forEach(item => {
213 item.cselect = false
214 })
215 item.cselect = !item.cselect
216 },
217 // 登记类型
218 handleDjlxSelect (item) {
219 this.djlxList.forEach(item => {
220 item.cselect = false
221 })
222 this.btnDisabled = true
223 item.cselect = true;
224 this.djqxObj = item;
225 if (item.sffqlc == '1') {
226 this.btnDisabled = false
227 this.bsmSqyw = item.bsmSqyw
228 this.djywbm = item.djywbm;
229 } else {
230 this.getNextNode(item.bsmSqyw, false)
231 }
232 this.djqxList = []
233 },
234 handleDjqxItem (item) {
235 this.djlxList.forEach(item => {
236 item.cselect = false
237 })
238 if (item.sffqlc == 1) {
239 this.djywbm = item.djywbm
240 this.bsmSqyw = item.bsmSqyw
241 item.cselect = true
242 this.openDialog()
243 this.btnDisabled = true
244 }
245 },
246 handleSelectItem (item, list) {
247 this.handleSelectYw(item, list)
248 this.openDialog()
249 },
250 // 选择不动产信息
251 bthSelectClick () {
252 this.openDialog()
253 },
254 openDialog () {
255 let title = "申请业务:" + this.selectParam?.djywmc ? this.selectParam?.djywmc : '';
256 this.$popupDialog(title, "ywbl/ywsq/selectBdc", { 'sqywInfo': this.selectParam }, "80%")
257 },
258 loadView (view) {
259 return r => require.ensure([], () => r(require(`./components/${view}/${view}.vue`)))
260 }
261 }
262 }
263 </script>
264 <style scoped lang='scss'>
265 @import "~@/styles/mixin.scss";
266 @import "./ywsq.scss";
267
268 /deep/.el-collapse-item__content {
269 padding-bottom: 0;
270 }
271
272 /deep/.el-collapse-item__wrap {
273 border-bottom: none;
274 }
275 </style>
...\ No newline at end of file ...\ No newline at end of file