style:1
Showing
1 changed file
with
238 additions
and
251 deletions
1 | <!-- | 1 | <!-- |
2 | * @Description: | 2 | * @Description: |
3 | * @Autor: renchao | 3 | * @Autor: renchao |
4 | * @LastEditTime: 2023-09-12 10:52:18 | 4 | * @LastEditTime: 2023-09-13 13:55:25 |
5 | --> | 5 | --> |
6 | <template> | 6 | <template> |
7 | <div class="container"> | 7 | <div class="container"> |
... | @@ -25,8 +25,7 @@ | ... | @@ -25,8 +25,7 @@ |
25 | <li | 25 | <li |
26 | @click="operation(item)" | 26 | @click="operation(item)" |
27 | v-for="(item, index) in rightButtonList" | 27 | v-for="(item, index) in rightButtonList" |
28 | :key="index" | 28 | :key="index"> |
29 | > | ||
30 | <svg-icon class="icon" :icon-class="item.icon" /> | 29 | <svg-icon class="icon" :icon-class="item.icon" /> |
31 | <span class="iconName">{{ item.name }}</span> | 30 | <span class="iconName">{{ item.name }}</span> |
32 | </li> | 31 | </li> |
... | @@ -34,16 +33,14 @@ | ... | @@ -34,16 +33,14 @@ |
34 | <NoticeBar | 33 | <NoticeBar |
35 | class="NoticeBar" | 34 | class="NoticeBar" |
36 | :noticeList="noticeList" | 35 | :noticeList="noticeList" |
37 | v-if="noticeList.length > 0" | 36 | v-if="noticeList.length > 0" /> |
38 | /> | ||
39 | </div> | 37 | </div> |
40 | <!-- 内容框架 --> | 38 | <!-- 内容框架 --> |
41 | <div class="containerFrame"> | 39 | <div class="containerFrame"> |
42 | <!-- 左侧菜单栏 区分业务--> | 40 | <!-- 左侧菜单栏 区分业务--> |
43 | <segmentMenu | 41 | <segmentMenu |
44 | v-if="['A0320099', 'A0330099'].includes(slsq.djqxbm)" | 42 | v-if="['A0320099', 'A0330099'].includes(slsq.djqxbm)" |
45 | @getCurrentSelectProps="getCurrentSelectProps" | 43 | @getCurrentSelectProps="getCurrentSelectProps" /> |
46 | /> | ||
47 | <ordinaryMenu v-else @getCurrentSelectProps="getCurrentSelectProps" /> | 44 | <ordinaryMenu v-else @getCurrentSelectProps="getCurrentSelectProps" /> |
48 | <div class="leftCon"> | 45 | <div class="leftCon"> |
49 | <!-- 分屏左侧预览 --> | 46 | <!-- 分屏左侧预览 --> |
... | @@ -59,27 +56,24 @@ | ... | @@ -59,27 +56,24 @@ |
59 | <el-tabs | 56 | <el-tabs |
60 | v-model="tabName" | 57 | v-model="tabName" |
61 | :before-leave="beforeLeave" | 58 | :before-leave="beforeLeave" |
62 | @tab-click="handleClick" | 59 | @tab-click="handleClick"> |
63 | > | ||
64 | <el-tab-pane | 60 | <el-tab-pane |
65 | :label="item.name" | 61 | :label="item.name" |
66 | :name="item.value" | 62 | :name="item.value" |
67 | v-for="item in tabList" | 63 | v-for="item in tabList" |
68 | :key="item.value" | 64 | :key="item.value"> |
69 | > | ||
70 | </el-tab-pane> | 65 | </el-tab-pane> |
71 | </el-tabs> | 66 | </el-tabs> |
72 | <div v-show="false"> | 67 | <div v-show="false"> |
73 | <div v-if="shows"> | 68 | <div v-if="shows"> |
74 | <receipt :Receiptdata="Receiptdata" id="boxaaa"/> | 69 | <receipt :Receiptdata="Receiptdata" id="boxaaa" /> |
75 | </div> | 70 | </div> |
76 | 71 | ||
77 | </div> | 72 | </div> |
78 | <component | 73 | <component |
79 | :key="fresh" | 74 | :key="fresh" |
80 | :is="componentTag" | 75 | :is="componentTag" |
81 | v-bind="currentSelectProps" | 76 | v-bind="currentSelectProps" /> |
82 | /> | ||
83 | </div> | 77 | </div> |
84 | </div> | 78 | </div> |
85 | </div> | 79 | </div> |
... | @@ -87,15 +81,13 @@ | ... | @@ -87,15 +81,13 @@ |
87 | <object | 81 | <object |
88 | id="LODOP_OB" | 82 | id="LODOP_OB" |
89 | classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" | 83 | classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" |
90 | v-show="false" | 84 | v-show="false"> |
91 | > | ||
92 | <embed | 85 | <embed |
93 | id="LODOP_EM" | 86 | id="LODOP_EM" |
94 | type="application/x-print-lodop" | 87 | type="application/x-print-lodop" |
95 | width="820" | 88 | width="820" |
96 | height="450" | 89 | height="450" |
97 | pluginspage="install_lodop32.exe" | 90 | pluginspage="install_lodop32.exe" /> |
98 | /> | ||
99 | </object> | 91 | </object> |
100 | <el-upload | 92 | <el-upload |
101 | class="fileUpdate" | 93 | class="fileUpdate" |
... | @@ -104,257 +96,252 @@ | ... | @@ -104,257 +96,252 @@ |
104 | multiple | 96 | multiple |
105 | :auto-upload="false" | 97 | :auto-upload="false" |
106 | :on-change="handleChange" | 98 | :on-change="handleChange" |
107 | :before-upload="beforeUpload" | 99 | :before-upload="beforeUpload"> |
108 | > | 100 | <el-button id="cldr" icon="el-icon-upload" type="primary" v-show="false">上传</el-button> |
109 | <el-button id="cldr" icon="el-icon-upload" type="primary" v-show="false" | ||
110 | >上传</el-button | ||
111 | > | ||
112 | </el-upload> | 101 | </el-upload> |
113 | </div> | 102 | </div> |
114 | </template> | 103 | </template> |
115 | <style scoped lang="scss"> | 104 | <style scoped lang="scss"> |
116 | @import "~@/styles/mixin.scss"; | 105 | @import "~@/styles/mixin.scss"; |
117 | @import "./workFrame.scss"; | 106 | @import "./workFrame.scss"; |
118 | </style> | 107 | </style> |
119 | <script> | 108 | <script> |
120 | import printJS from 'print-js' | 109 | import printJS from 'print-js' |
121 | import WorkFlow from "./mixin/index"; | 110 | import WorkFlow from "./mixin/index"; |
122 | import publicFlow from "./mixin/public.js"; | 111 | import publicFlow from "./mixin/public.js"; |
123 | import { getStepFormInfo, unClaimTask, getZdInfo } from "@/api/workFlow.js"; | 112 | import { getStepFormInfo, unClaimTask, getZdInfo } from "@/api/workFlow.js"; |
124 | import { getForm } from "./flowform"; | 113 | import { getForm } from "./flowform"; |
125 | import NoticeBar from "@/components/NoticeBar/index"; | 114 | import NoticeBar from "@/components/NoticeBar/index"; |
126 | // import ProcessViewer from "./components/processViewer.vue" | 115 | // import ProcessViewer from "./components/processViewer.vue" |
127 | // 引入左侧菜单 | 116 | // 引入左侧菜单 |
128 | import ordinaryMenu from "./components/leftmenu/ordinaryMenu.vue"; | 117 | import ordinaryMenu from "./components/leftmenu/ordinaryMenu.vue"; |
129 | // 引入左侧菜单 | 118 | // 引入左侧菜单 |
130 | import segmentMenu from "./components/leftmenu/segmentMenu.vue"; | 119 | import segmentMenu from "./components/leftmenu/segmentMenu.vue"; |
131 | // 回执单 | 120 | // 回执单 |
132 | import receipt from "./components/receipt.vue"; | 121 | import receipt from "./components/receipt.vue"; |
133 | import selectBdc from "@/views/ywbl/ywsq/selectBdc.vue"; | 122 | import selectBdc from "@/views/ywbl/ywsq/selectBdc.vue"; |
134 | import { BatchInit } from "@/api/workflow/cfdjFlow.js"; | 123 | import { BatchInit } from "@/api/workflow/cfdjFlow.js"; |
135 | export default { | 124 | export default { |
136 | components: { | 125 | components: { |
137 | selectBdc, | 126 | selectBdc, |
138 | NoticeBar, | 127 | NoticeBar, |
139 | ordinaryMenu, | 128 | ordinaryMenu, |
140 | segmentMenu, | 129 | segmentMenu, |
141 | receipt, | 130 | receipt, |
142 | }, | 131 | }, |
143 | mixins: [WorkFlow, publicFlow], | 132 | mixins: [WorkFlow, publicFlow], |
144 | data() { | 133 | data () { |
145 | return { | 134 | return { |
146 | // printObj: { | 135 | // printObj: { |
147 | // id: "box", | 136 | // id: "box", |
148 | // preview: true, | 137 | // preview: true, |
149 | // }, | 138 | // }, |
150 | isDialog: false, | 139 | isDialog: false, |
151 | //受理申请标识码 | 140 | //受理申请标识码 |
152 | bsmSlsq: this.$route.query.bsmSlsq, | 141 | bsmSlsq: this.$route.query.bsmSlsq, |
153 | //当前流程所在环节 | 142 | //当前流程所在环节 |
154 | bestepid: this.$route.query.bestepid, | 143 | bestepid: this.$route.query.bestepid, |
155 | //当前流程所在环节 | 144 | //当前流程所在环节 |
156 | zbhj: this.$route.query.zbhj, | 145 | zbhj: this.$route.query.zbhj, |
157 | //设置那个表单选中 | 146 | //设置那个表单选中 |
158 | tabName: "", | 147 | tabName: "", |
159 | //设置那个表单选择 | 148 | //设置那个表单选择 |
160 | currentSelectTab: {}, | 149 | currentSelectTab: {}, |
161 | //表单集合 | 150 | //表单集合 |
162 | tabList: [], | 151 | tabList: [], |
163 | //选择加载哪一个组件 | 152 | //选择加载哪一个组件 |
164 | componentTag: "", | 153 | componentTag: "", |
165 | //设置表单传递数据 | 154 | //设置表单传递数据 |
166 | currentSelectProps: {}, | 155 | currentSelectProps: {}, |
167 | //材料分屏表单 | 156 | //材料分屏表单 |
168 | clxxForm: "", | 157 | clxxForm: "", |
169 | //材料信息选择卡索引 | 158 | //材料信息选择卡索引 |
170 | clxxIndex: "", | 159 | clxxIndex: "", |
171 | //材料信息选项卡对象 | 160 | //材料信息选项卡对象 |
172 | clxxTab: {}, | 161 | clxxTab: {}, |
173 | ableOperation: false, | 162 | ableOperation: false, |
174 | //页面监听时间 | 163 | //页面监听时间 |
175 | _beforeUnload_time: "", | 164 | _beforeUnload_time: "", |
176 | // 宗地id | 165 | // 宗地id |
177 | bsmZd: "", | 166 | bsmZd: "", |
178 | Receiptdata: {}, | 167 | Receiptdata: {}, |
179 | shows:false | 168 | shows: false |
180 | }; | 169 | }; |
181 | }, | 170 | }, |
182 | mounted() { | 171 | mounted () { |
183 | this.$store.dispatch("user/refreshPage", false); | 172 | this.$store.dispatch("user/refreshPage", false); |
184 | //添加页面监听事件 | 173 | //添加页面监听事件 |
185 | window.addEventListener("beforeunload", (e) => this.beforeunloadHandler(e)); | 174 | window.addEventListener("beforeunload", (e) => this.beforeunloadHandler(e)); |
186 | window.addEventListener("unload", (e) => this.unloadHandler(e)); | 175 | window.addEventListener("unload", (e) => this.unloadHandler(e)); |
187 | }, | 176 | }, |
188 | destroyed() { | 177 | destroyed () { |
189 | window.removeEventListener("beforeunload", (e) => | 178 | window.removeEventListener("beforeunload", (e) => |
190 | this.beforeunloadHandler(e) | 179 | this.beforeunloadHandler(e) |
191 | ); | 180 | ); |
192 | window.removeEventListener("unload", (e) => this.unloadHandler(e)); | 181 | window.removeEventListener("unload", (e) => this.unloadHandler(e)); |
193 | }, | 182 | }, |
194 | methods: { | 183 | methods: { |
195 | /** | 184 | /** |
196 | * @description: openPrint | 185 | * @description: openPrint |
197 | * @author:miaofang | 186 | * @author:miaofang |
198 | */ | 187 | */ |
199 | openPrint() { | 188 | openPrint () { |
200 | 189 | ||
201 | // 获取打印回执数据 | 190 | // 获取打印回执数据 |
202 | var formdata = new FormData(); | 191 | var formdata = new FormData(); |
203 | formdata.append("bsmSldy", this.currentSelectProps.bsmSldy); | 192 | formdata.append("bsmSldy", this.currentSelectProps.bsmSldy); |
204 | formdata.append("bsmSlsq", this.bsmSlsq); | 193 | formdata.append("bsmSlsq", this.bsmSlsq); |
205 | formdata.append("djlx", this.currentSelectProps.djlx); | 194 | formdata.append("djlx", this.currentSelectProps.djlx); |
206 | BatchInit(formdata).then((res) => { | 195 | BatchInit(formdata).then((res) => { |
207 | if (res.code === 200 && res.result) { | 196 | if (res.code === 200 && res.result) { |
208 | this.Receiptdata = res.result | 197 | this.Receiptdata = res.result |
209 | this.shows=true | 198 | this.shows = true |
210 | setTimeout(() => { | 199 | setTimeout(() => { |
211 | this.prinsss() | 200 | this.prinsss() |
212 | }, 100) | 201 | }, 100) |
213 | 202 | ||
214 | } | 203 | } |
215 | }) | 204 | }) |
216 | 205 | ||
217 | }, | 206 | }, |
218 | /** | 207 | /** |
219 | * @description: prinsss | 208 | * @description: prinsss |
220 | * @author: miaofang | 209 | * @author: miaofang |
221 | */ | 210 | */ |
222 | prinsss(){ | 211 | prinsss () { |
223 | printJS({ | 212 | printJS({ |
224 | printable: "boxaaa", // // 文档来源:pdf或图像的url,html元素的id或json数据的对象 | 213 | printable: "boxaaa", // // 文档来源:pdf或图像的url,html元素的id或json数据的对象 |
225 | type: "html", | 214 | type: "html", |
226 | maxWidth: 800, // 最大宽度 | 215 | maxWidth: 800, // 最大宽度 |
227 | font_size: "", // 不设置则使用默认字体大小 | 216 | font_size: "", // 不设置则使用默认字体大小 |
228 | style: `@font-face { | 217 | style: `@font-face { |
229 | font-family: "STZHONGS"; | 218 | font-family: "STZHONGS"; |
230 | src: url(${window.ttf}) format("truetype"); | 219 | src: url(${window.ttf}) format("truetype"); |
231 | }`, | 220 | }`, |
232 | // 继承原来的所有样式 | 221 | // 继承原来的所有样式 |
233 | targetStyles: ["*"] | 222 | targetStyles: ["*"] |
234 | }); | 223 | }); |
235 | }, | 224 | }, |
236 | /** | 225 | /** |
237 | * @description: getCurrentSelectProps | 226 | * @description: getCurrentSelectProps |
238 | * @param {*} val | 227 | * @param {*} val |
239 | * @author: renchao | 228 | * @author: renchao |
240 | */ | 229 | */ |
241 | getCurrentSelectProps(val) { | 230 | getCurrentSelectProps (val) { |
242 | this.currentSelectProps = val; | 231 | this.currentSelectProps = val; |
243 | }, | 232 | }, |
244 | /** | 233 | /** |
245 | * @description: beforeunloadHandler | 234 | * @description: beforeunloadHandler |
246 | * @author: renchao | 235 | * @author: renchao |
247 | */ | 236 | */ |
248 | beforeunloadHandler() { | 237 | beforeunloadHandler () { |
249 | this._beforeUnload_time = new Date().getTime(); | 238 | this._beforeUnload_time = new Date().getTime(); |
250 | }, | 239 | }, |
251 | /** | 240 | /** |
252 | * @description: unloadHandler | 241 | * @description: unloadHandler |
253 | * @param {*} e | 242 | * @param {*} e |
254 | * @author: renchao | 243 | * @author: renchao |
255 | */ | 244 | */ |
256 | unloadHandler(e) { | 245 | unloadHandler (e) { |
257 | this._gap_time = new Date().getTime() - this._beforeUnload_time; | 246 | this._gap_time = new Date().getTime() - this._beforeUnload_time; |
258 | //判断是窗口关闭还是刷新 | 247 | //判断是窗口关闭还是刷新 |
259 | if (this._gap_time <= 10) { | 248 | if (this._gap_time <= 10) { |
260 | //取消认领 | 249 | //取消认领 |
261 | unClaimTask(this.bsmSlsq, this.bestepid); | 250 | unClaimTask(this.bsmSlsq, this.bestepid); |
262 | } | 251 | } |
263 | }, | 252 | }, |
264 | /** | 253 | /** |
265 | * @description: 申请单元点击事件 | 254 | * @description: 申请单元点击事件 |
266 | * @param {*} index | 255 | * @param {*} index |
267 | * @author: renchao | 256 | * @author: renchao |
268 | */ | 257 | */ |
269 | stepForm(index) { | 258 | stepForm (index) { |
270 | getStepFormInfo(this.currentSelectProps).then((res) => { | 259 | getStepFormInfo(this.currentSelectProps).then((res) => { |
271 | if (res.code === 200) { | 260 | if (res.code === 200) { |
272 | // this.fresh++; | 261 | // this.fresh++; |
273 | //获取单元对应的所有表单信息 | 262 | //获取单元对应的所有表单信息 |
274 | this.tabList = res.result; | 263 | this.tabList = res.result; |
275 | //默认加载第一个表单信息 | 264 | //默认加载第一个表单信息 |
276 | let arr = res.result.filter((item) => item.defaultForm); | 265 | let arr = res.result.filter((item) => item.defaultForm); |
277 | if (arr.length > 0) { | 266 | if (arr.length > 0) { |
278 | this.tabName = arr[0].value; | 267 | this.tabName = arr[0].value; |
279 | } else { | 268 | } else { |
280 | this.tabName = res.result[0].value; | 269 | this.tabName = res.result[0].value; |
281 | } | 270 | } |
282 | this.ableOperation = this.tabList[0].ableOperation; | 271 | this.ableOperation = this.tabList[0].ableOperation; |
283 | //批量操作无分屏按钮 | 272 | //批量操作无分屏按钮 |
284 | if (index != null) { | 273 | if (index != null) { |
285 | //处理分屏材料信息 | 274 | //处理分屏材料信息 |
286 | let that = this; | 275 | let that = this; |
287 | 276 | ||
288 | this.tabList.forEach(function (item, index) { | 277 | this.tabList.forEach(function (item, index) { |
289 | if (item.value == "clxx") { | 278 | if (item.value == "clxx") { |
290 | that.clxxIndex = index; | 279 | that.clxxIndex = index; |
291 | that.clxxForm = getForm(item.value, that.$route.query.sqywbm); | 280 | that.clxxForm = getForm(item.value, that.$route.query.sqywbm); |
292 | that.clxxTab = item; | 281 | that.clxxTab = item; |
293 | } | 282 | } |
294 | }); | 283 | }); |
284 | } | ||
295 | } | 285 | } |
296 | } | 286 | }); |
297 | }); | 287 | }, |
298 | }, | ||
299 | 288 | ||
300 | /** | 289 | /** |
301 | * @description: openDialog | 290 | * @description: openDialog |
302 | * @author: renchao | 291 | * @author: renchao |
303 | */ | 292 | */ |
304 | openDialog() { | 293 | openDialog () { |
305 | this.$store.dispatch("user/refreshPage", false); | 294 | this.$store.dispatch("user/refreshPage", false); |
306 | let data = JSON.parse(localStorage.getItem("ywbl")); | 295 | let data = JSON.parse(localStorage.getItem("ywbl")); |
307 | let title; | 296 | let title; |
308 | if (data?.sqywmc) { | 297 | if (data?.sqywmc) { |
309 | title = "申请业务:" + data?.sqywmc; | 298 | title = "申请业务:" + data?.sqywmc; |
310 | } else { | 299 | } else { |
311 | title = "申请业务:" + data?.djywmc; | 300 | title = "申请业务:" + data?.djywmc; |
312 | } | 301 | } |
313 | 302 | ||
314 | this.$popupDialog( | 303 | this.$popupDialog( |
315 | title, | 304 | title, |
316 | "ywbl/ywsq/selectBdc", | 305 | "ywbl/ywsq/selectBdc", |
317 | { djywbm: this.$route.query.sqywbm, isJump: true, sqywInfo: data }, | 306 | { djywbm: this.$route.query.sqywbm, isJump: true, sqywInfo: data }, |
318 | "80%", | 307 | "80%", |
319 | true | 308 | true |
320 | ); | 309 | ); |
321 | }, | 310 | }, |
322 | //选项卡切换事件 | 311 | /** |
323 | /** | 312 | * @description: 右侧表单选项卡事件 |
324 | * @description: 右侧表单选项卡事件 | 313 | * @param {*} handleClick |
325 | * @param {*} handleClick | 314 | * @author: renchao |
326 | * @author: renchao | 315 | */ |
327 | */ | 316 | handleClick (a) { |
328 | handleClick(a) { | 317 | let p = Object.keys(this.tabList[0]).filter( |
329 | let p = Object.keys(this.tabList[0]).filter( | 318 | (item) => item == "ableOperation" |
330 | (item) => item == "ableOperation" | 319 | ); |
331 | ); | 320 | if (p) { |
332 | if (p) { | 321 | this.ableOperation = this.tabList[a.index].ableOperation; |
333 | this.ableOperation = this.tabList[a.index].ableOperation; | 322 | } |
334 | } | 323 | } |
335 | }, | 324 | } |
336 | }, | 325 | } |
337 | }; | ||
338 | </script> | 326 | </script> |
339 | <style scoped lang="scss"> | 327 | <style scoped lang="scss"> |
340 | @page { | 328 | @page { |
341 | size: auto; | 329 | size: auto; |
342 | margin: 0mm; | 330 | margin: 0mm; |
343 | } | 331 | } |
344 | .rightContainer { | 332 | .rightContainer { |
345 | position: relative; | 333 | position: relative; |
346 | } | ||
347 | |||
348 | .count { | ||
349 | font-size: 14px; | ||
350 | position: absolute; | ||
351 | right: 25px; | ||
352 | top: 12px; | ||
353 | height: 30px; | ||
354 | span { | ||
355 | font-weight: 600; | ||
356 | color: #3498db; | ||
357 | } | 334 | } |
358 | 335 | ||
359 | } | 336 | .count { |
337 | font-size: 14px; | ||
338 | position: absolute; | ||
339 | right: 25px; | ||
340 | top: 12px; | ||
341 | height: 30px; | ||
342 | span { | ||
343 | font-weight: 600; | ||
344 | color: #3498db; | ||
345 | } | ||
346 | } | ||
360 | </style> | 347 | </style> | ... | ... |
-
Please register or sign in to post a comment