Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
54fb416c by 任超
Options

refactor:工作流

1 parent 726d21d7
Expand all
Inline Side-by-side
Showing 3 changed files with 1 additions and 254 deletions
...@@ -24,20 +24,13 @@ export const constantRoutes = [ ...@@ -24,20 +24,13 @@ export const constantRoutes = [
24 ] 24 ]
25 }, 25 },
26 // 业务流程框架 26 // 业务流程框架
27 {
28 path: '/workFrame',
29 component: () => import('@/views/workflow/workFrame.vue'),
30 name: 'workFrame',
31 hidden: true,
32 meta: { title: '发起申请' }
33 },
34 // 业务流程框架 27 // 业务流程框架
35 { 28 {
36 path: '/workFramecs', 29 path: '/workFramecs',
37 component: () => import('@/views/workflow/workFrame1.vue'), 30 component: () => import('@/views/workflow/workFrame1.vue'),
38 name: 'workFramecs', 31 name: 'workFramecs',
39 hidden: true, 32 hidden: true,
40 meta: { title: '发起申请1' } 33 meta: { title: '发起申请' }
41 }, 34 },
42 // 业务流程只读框架 35 // 业务流程只读框架
43 { 36 {
...@@ -45,14 +38,6 @@ export const constantRoutes = [ ...@@ -45,14 +38,6 @@ export const constantRoutes = [
45 component: () => import('@/views/workflow/workFrameView1.vue'), 38 component: () => import('@/views/workflow/workFrameView1.vue'),
46 name: 'workFrameViewcs', 39 name: 'workFrameViewcs',
47 hidden: true, 40 hidden: true,
48 meta: { title: '发起申请2' }
49 },
50 // 业务流程只读框架
51 {
52 path: '/workFrameView',
53 component: () => import('@/views/workflow/workFrameView.vue'),
54 name: 'workFrameView',
55 hidden: true,
56 meta: { title: '发起申请' } 41 meta: { title: '发起申请' }
57 }, 42 },
58 { 43 {
......
1 <template>
2 <div class="container">
3 <!-- 顶部内容框 -->
4 <div class="topButton">
5 <!-- 左侧业务功能按钮 -->
6 <ul>
7 <li @click="operation(index, item)" v-for="(item, index) in leftButtonList" :key="index">
8 <svg-icon :icon-class="item.icon" />
9 <span class="iconName">{{ item.name }}</span>
10 </li>
11 </ul>
12 <!-- 右侧流程按钮 -->
13 <ul>
14 <li @click="operation(index, item)" v-for="(item, index) in rightButtonList" :key="index">
15 <svg-icon class="icon" :icon-class="item.icon" />
16 <span class="iconName">{{ item.name }}</span>
17 </li>
18 </ul>
19 </div>
20 <!-- 内容框架 -->
21 <div class="containerFrame">
22 <!-- 左侧菜单栏 -->
23 <div class="leftmenu" :class="{ 'animation-map-drawer': isShowdrawer }">
24 <div v-if="this.isShowdrawer">
25 <div class="title">申请单元列表({{ unitData.length }})</div>
26 <el-menu :default-active="activeIndex" @select="unitClick">
27 <el-menu-item v-for="(item, index) in unitData" :index="index.toString()" :key="index">
28 <div>
29 <p>{{ item.bdcdyh }}</p>
30 <p class="title-detail">{{ item.zl }}</p>
31 </div>
32 </el-menu-item>
33 </el-menu>
34 </div>
35 <div class="map-drawer-click map-drawer" v-if="!isShowdrawer" @click="
36 () => {
37 this.isShowdrawer = !this.isShowdrawer;
38 }
39 "></div>
40 <div class="map-drawer-expand map-drawer" v-else @click="
41 () => {
42 this.isShowdrawer = !this.isShowdrawer;
43 }
44 "></div>
45 </div>
46 <div class="leftCon">
47 <!-- 分屏左侧预览 -->
48 <div v-if="splitScreen" class="splitScreen-con">
49 <component :is="clxxForm" v-bind="currentSelectProps" :key="fresh" />
50 </div>
51 <!-- 表单内容区域 -->
52 <div class="rightContainer">
53 <el-tabs v-model="tabName" @tab-click="tabClick">
54 <el-tab-pane :label="item.name" :name="item.value" v-for="(item, index) in tabList" :key="index">
55 </el-tab-pane>
56 </el-tabs>
57 <component :key="fresh" :is="componentTag" v-bind="currentSelectProps" />
58 </div>
59 </div>
60 </div>
61 </div>
62 </template>
63
64 <style scoped lang='scss'>
65 @import "~@/styles/mixin.scss";
66 @import "./workFrame.scss";
67 </style>
68
69 <script>
70 import {
71 leftMenu,
72 stepExpandInfo,
73 record,
74 getNextLinkInfo,
75 completeTask,
76 getStepFormInfo
77 } from "@/api/fqsq.js"
78 import { getWorkFlowImage } from "@/api/workflow/jsydsyqFlow.js"
79 import { getForm } from "./flowform.js"
80 export default {
81 data () {
82 return {
83 // 流程图
84 imgSrc: '',
85 // 折叠
86 isShowdrawer: true,
87 // 默认选中
88 activeIndex: '0',
89 //受理申请标识码
90 bsmSlsq: this.$route.query.bsmSlsq,
91 //当前流程所在环节
92 bestepid: this.$route.query.bestepid,
93 //顶部左侧按钮集合
94 leftButtonList: [],
95 //顶部右侧按钮集合
96 rightButtonList: [],
97 //左侧菜单数据集合
98 unitData: [],
99 //设置那个表单选中
100 tabName: "",
101 //表单集合
102 tabList: [],
103 //选择加载哪一个组件
104 componentTag: "",
105 //设置表单组件是否刷选值
106 fresh: 10,
107 //设置表单传递数据
108 currentSelectProps: {},
109 //是否开启材料分屏
110 splitScreen: false,
111 //材料分屏表单
112 clxxForm: "",
113 //材料信息选择卡索引
114 clxxIndex: "",
115 //材料信息选项卡对象
116 clxxTab: {},
117 }
118 },
119 mounted () {
120 this.loadBdcdylist();
121 this.flowInitParam();
122 },
123 methods: {
124 //加载流程初始参数
125 flowInitParam () {
126 var formdata = new FormData();
127 formdata.append("bsmSlsq", this.bsmSlsq);
128 formdata.append("bestepid", this.bestepid);
129 formdata.append("type", "READ_ONLY");
130 stepExpandInfo(formdata).then((res) => {
131 if (res.code === 200) {
132 this.leftButtonList = res.result.button;
133 this.rightButtonList = res.result.operation;
134 // this.tabList = res.result.form;
135 // //默认选择第一个选项卡内容
136 // this.tabName = res.result.form[0].value;
137 // let that = this;
138 // this.tabList.forEach(function (item, index) {
139 // if (item.value == "clxx") {
140 // that.clxxIndex = index;
141 // that.clxxForm = getForm(item.value);
142 // that.clxxTab = item;
143 // }
144 // });
145 // //默认加载第一个选项卡的组件内容
146 // this.getFromRouter(res.result.form[0].value);
147 }
148 })
149 },
150 //流程环节操作按钮
151 operation (index, item) {
152 //按钮 B1:流程图 B2:材料分屏 B3:材料导入 B4:登记簿 B5:证书预览 B6：打印申请书
153 //操作按钮 登簿：record 转件：transfer 退回：back 退出：signout
154 let that = this;
155 switch (item.value) {
156 case "B1":
157 getWorkFlowImage(this.bsmSlsq).then(res => {
158 this.imgSrc = URL.createObjectURL(res)
159 this.$popup({
160 title: '流程图',
161 editItem: 'workflow/components/flowChart',
162 formData: this.imgSrc
163 })
164 })
165 break;
166 case "B5":
167 this.zsylFlag = true;
168 break;
169 case "B2": //材料分屏按钮
170 this.splitScreen = this.splitScreen ? false : true;
171 this.$store.dispatch('app/settScreen', this.splitScreen)
172 if (this.splitScreen) {
173 //如果当前选项卡为材料信息内容，递减到上一个选项卡内容
174 if (this.tabName == this.clxxTab.value) {
175 this.tabName = this.tabList[this.clxxIndex - 1].value;
176 this.getFromRouter(this.tabList[this.clxxIndex - 1].value);
177 }
178 this.tabList.splice(this.clxxIndex, 1);
179 } else {
180 this.tabList.splice(this.clxxIndex, 1, this.clxxTab);
181 }
182 break;
183 case "signout":
184 window.close();
185 break;
186 }
187 },
188 //读取申请单元信息
189 loadBdcdylist () {
190 var formdata = new FormData();
191 formdata.append("bsmSlsq", this.bsmSlsq);
192 formdata.append("bestepid", this.bestepid);
193 leftMenu(formdata).then((res) => {
194 if (res.code === 200) {
195 this.unitData = res.result;
196 this.currentSelectProps = res.result[0];
197 this.unitClick(0);
198 }
199 })
200 },
201 //申请单元点击事件
202 unitClick (index) {
203 this.currentSelectProps = this.unitData[index];
204 this.currentSelectProps.type = 'ONLY_READ';
205 getStepFormInfo(this.currentSelectProps).then((res) => {
206 if (res.code === 200) {
207 this.fresh += 1;
208 //获取单元对应的所有表单信息
209 this.tabList = res.result;
210 //默认加载第一个表单信息
211 this.tabName = res.result[0].value;
212 //处理分屏材料信息
213 // let that = this;
214 // this.tabList.forEach(function (item, index) {
215 // if (item.value == "clxx") {
216 // that.clxxIndex = index;
217 // that.clxxForm = getForm(item.value, that.$route.query.sqywbm);
218 // that.clxxTab = item;
219 // }
220 // });
221 }
222 });
223 // if (this.currentSelectProps.bsmSldy != this.unitData[index].bsmSldy) {
224 // this.currentSelectProps = this.unitData[index];
225 // this.fresh += 1;
226 // }
227 },
228 //表单选项卡事件
229 tabClick (tab, event) {
230 this.getFromRouter(tab.name);
231 },
232 //切换选项卡内容组件
233 getFromRouter (tabname) {
234 this.componentTag = getForm(tabname);
235 },
236 }
237 }
238 </script>
...\ No newline at end of file ...\ No newline at end of file