style:流程模块样式的修改
Showing
2 changed files
with
168 additions
and
168 deletions
... | @@ -42,7 +42,7 @@ | ... | @@ -42,7 +42,7 @@ |
42 | flex-wrap: wrap; | 42 | flex-wrap: wrap; |
43 | width: 100%; | 43 | width: 100%; |
44 | } | 44 | } |
45 | 45 | ||
46 | .title-batch { | 46 | .title-batch { |
47 | height: 70px; | 47 | height: 70px; |
48 | 48 | ||
... | @@ -182,6 +182,7 @@ | ... | @@ -182,6 +182,7 @@ |
182 | 182 | ||
183 | ul { | 183 | ul { |
184 | @include flex; | 184 | @include flex; |
185 | padding-left: 0; | ||
185 | 186 | ||
186 | li { | 187 | li { |
187 | @include flex-center; | 188 | @include flex-center; | ... | ... |
... | @@ -5,7 +5,7 @@ | ... | @@ -5,7 +5,7 @@ |
5 | <!-- 左侧业务功能按钮 --> | 5 | <!-- 左侧业务功能按钮 --> |
6 | <ul> | 6 | <ul> |
7 | <li @click="operation(item)" v-for="(item, index) in leftButtonList" :key="index"> | 7 | <li @click="operation(item)" v-for="(item, index) in leftButtonList" :key="index"> |
8 | <svg-icon :icon-class="item.icon" /> | 8 | <svg-icon class="icon" :icon-class="item.icon" /> |
9 | <span class="iconName">{{ item.name }}</span> | 9 | <span class="iconName">{{ item.name }}</span> |
10 | </li> | 10 | </li> |
11 | </ul> | 11 | </ul> |
... | @@ -62,180 +62,179 @@ | ... | @@ -62,180 +62,179 @@ |
62 | </div> | 62 | </div> |
63 | </template> | 63 | </template> |
64 | <style scoped lang="scss"> | 64 | <style scoped lang="scss"> |
65 | @import "~@/styles/mixin.scss"; | 65 | @import "~@/styles/mixin.scss"; |
66 | @import "./workFrame.scss"; | 66 | @import "./workFrame.scss"; |
67 | </style> | 67 | </style> |
68 | <script> | 68 | <script> |
69 | import { leftMenu, stepExpandInfo, getStepFormInfo } from "@/api/fqsq.js"; | 69 | import { leftMenu, stepExpandInfo, getStepFormInfo } from "@/api/fqsq.js"; |
70 | import publicFlow from "./mixin/public.js"; | 70 | import publicFlow from "./mixin/public.js"; |
71 | import { popupDialog } from "@/utils/popup.js"; | 71 | import NoticeBar from "@/components/NoticeBar/index"; |
72 | import NoticeBar from "@/components/NoticeBar/index"; | 72 | import { getWorkFlowImage } from "@/api/workflow/jsydsyqFlow.js"; |
73 | import { getWorkFlowImage } from "@/api/workflow/jsydsyqFlow.js"; | 73 | export default { |
74 | export default { | 74 | mixins: [publicFlow], |
75 | mixins: [publicFlow], | 75 | components: { |
76 | components: { | 76 | NoticeBar, |
77 | NoticeBar, | ||
78 | }, | ||
79 | data () { | ||
80 | return { | ||
81 | // 流程图 | ||
82 | imgSrc: "", | ||
83 | // 折叠 | ||
84 | isShowdrawer: true, | ||
85 | // 默认选中 | ||
86 | activeIndex: "0", | ||
87 | //受理申请标识码 | ||
88 | bsmSlsq: this.$route.query.bsmSlsq, | ||
89 | //当前流程所在环节 | ||
90 | bestepid: this.$route.query.bestepid, | ||
91 | //顶部左侧按钮集合 | ||
92 | leftButtonList: [], | ||
93 | //顶部右侧按钮集合 | ||
94 | rightButtonList: [], | ||
95 | //左侧菜单数据集合 | ||
96 | unitData: [], | ||
97 | //设置那个表单选中 | ||
98 | tabName: "", | ||
99 | //表单集合 | ||
100 | tabList: [], | ||
101 | //选择加载哪一个组件 | ||
102 | componentTag: "", | ||
103 | //设置表单组件是否刷选值 | ||
104 | fresh: 10, | ||
105 | //设置表单传递数据 | ||
106 | currentSelectProps: {}, | ||
107 | //是否开启材料分屏 | ||
108 | splitScreen: false, | ||
109 | //材料分屏表单 | ||
110 | clxxForm: "", | ||
111 | //材料信息选择卡索引 | ||
112 | clxxIndex: "", | ||
113 | //材料信息选项卡对象 | ||
114 | clxxTab: {}, | ||
115 | }; | ||
116 | }, | ||
117 | mounted () { | ||
118 | this.loadBdcdylist(); | ||
119 | this.flowInitParam(); | ||
120 | }, | ||
121 | |||
122 | methods: { | ||
123 | //加载流程初始参数 | ||
124 | flowInitParam () { | ||
125 | var formdata = new FormData(); | ||
126 | formdata.append("bsmSlsq", this.bsmSlsq); | ||
127 | formdata.append("bestepid", this.bestepid); | ||
128 | formdata.append("type", "READ_ONLY"); | ||
129 | stepExpandInfo(formdata).then((res) => { | ||
130 | if (res.code === 200) { | ||
131 | this.leftButtonList = res.result.button; | ||
132 | this.rightButtonList = res.result.operation; | ||
133 | } | ||
134 | }); | ||
135 | }, | 77 | }, |
136 | //流程环节操作按钮 | 78 | data () { |
137 | operation (item) { | 79 | return { |
138 | //按钮 B1:流程图 B2:材料分屏 B3:材料导入 B4:登记簿 B5:证书预览 B6:打印申请书 | 80 | // 流程图 |
139 | //操作按钮 登簿:record 转件:transfer 退回:back 退出:signout | 81 | imgSrc: "", |
140 | switch (item.value) { | 82 | // 折叠 |
141 | case "B1": | 83 | isShowdrawer: true, |
142 | getWorkFlowImage(this.bsmSlsq, this.$route.query.bestepid).then( | 84 | // 默认选中 |
143 | (res) => { | 85 | activeIndex: "0", |
144 | let { result } = res; | 86 | //受理申请标识码 |
145 | this.$popupDialog("流程图", "workflow/components/processViewer", { | 87 | bsmSlsq: this.$route.query.bsmSlsq, |
146 | xml: result.xml, | 88 | //当前流程所在环节 |
147 | finishedInfo: { | 89 | bestepid: this.$route.query.bestepid, |
148 | finishedTaskSet: result.finishedTaskSet, | 90 | //顶部左侧按钮集合 |
149 | unfinishedTaskSet: result.unfinishedTaskSet, | 91 | leftButtonList: [], |
150 | rejectedTaskSet: result.rejectedTaskSet, | 92 | //顶部右侧按钮集合 |
151 | finishedSequenceFlowSet: result.finishedSequenceFlowSet, | 93 | rightButtonList: [], |
152 | }, | 94 | //左侧菜单数据集合 |
153 | allCommentList: result.historyTaskList, | 95 | unitData: [], |
154 | }, '70%', true); | 96 | //设置那个表单选中 |
155 | } | 97 | tabName: "", |
156 | ); | 98 | //表单集合 |
157 | break; | 99 | tabList: [], |
158 | case "B5": | 100 | //选择加载哪一个组件 |
159 | this.zsylFlag = true; | 101 | componentTag: "", |
160 | break; | 102 | //设置表单组件是否刷选值 |
161 | case "B2": //材料分屏按钮 | 103 | fresh: 10, |
162 | this.splitScreen = this.splitScreen ? false : true; | 104 | //设置表单传递数据 |
163 | this.$store.dispatch("app/settScreen", this.splitScreen); | 105 | currentSelectProps: {}, |
164 | if (this.splitScreen) { | 106 | //是否开启材料分屏 |
165 | //如果当前选项卡为材料信息内容,递减到上一个选项卡内容 | 107 | splitScreen: false, |
166 | if (this.tabName == this.clxxTab.value) { | 108 | //材料分屏表单 |
167 | this.tabName = this.tabList[this.clxxIndex - 1].value; | 109 | clxxForm: "", |
168 | this.getFromRouter(this.tabList[this.clxxIndex - 1].value); | 110 | //材料信息选择卡索引 |
169 | } | 111 | clxxIndex: "", |
170 | this.tabList.splice(this.clxxIndex, 1); | 112 | //材料信息选项卡对象 |
171 | } else { | 113 | clxxTab: {}, |
172 | this.tabList.splice(this.clxxIndex, 1, this.clxxTab); | 114 | }; |
173 | } | 115 | }, |
174 | break; | 116 | mounted () { |
175 | case "signout": | 117 | this.loadBdcdylist(); |
176 | window.close(); | 118 | this.flowInitParam(); |
177 | break; | ||
178 | case "rm": | ||
179 | this.del() | ||
180 | window.close(); | ||
181 | } | ||
182 | }, | 119 | }, |
183 | del () { | 120 | |
184 | let formdata = new FormData(); | 121 | methods: { |
185 | formdata.append("bsmSlsq", this.bsmSlsq); | 122 | //加载流程初始参数 |
186 | this.$confirm("确定要删除吗, 是否继续?", "提示", { | 123 | flowInitParam () { |
187 | confirmButtonText: "确定", | 124 | var formdata = new FormData(); |
188 | cancelButtonText: "取消", | 125 | formdata.append("bsmSlsq", this.bsmSlsq); |
189 | type: "warning", | 126 | formdata.append("bestepid", this.bestepid); |
190 | }) | 127 | formdata.append("type", "READ_ONLY"); |
191 | .then(() => { | 128 | stepExpandInfo(formdata).then((res) => { |
192 | deleteFlow(formdata).then((res) => { | 129 | if (res.code === 200) { |
193 | if (res.code === 200) { | 130 | this.leftButtonList = res.result.button; |
194 | this.handleDel(); | 131 | this.rightButtonList = res.result.operation; |
195 | this.$message({ | 132 | } |
196 | type: "success", | 133 | }); |
197 | message: "删除成功!", | 134 | }, |
198 | }); | 135 | //流程环节操作按钮 |
199 | this.queryClick(); | 136 | operation (item) { |
137 | //按钮 B1:流程图 B2:材料分屏 B3:材料导入 B4:登记簿 B5:证书预览 B6:打印申请书 | ||
138 | //操作按钮 登簿:record 转件:transfer 退回:back 退出:signout | ||
139 | switch (item.value) { | ||
140 | case "B1": | ||
141 | getWorkFlowImage(this.bsmSlsq, this.$route.query.bestepid).then( | ||
142 | (res) => { | ||
143 | let { result } = res; | ||
144 | this.$popupDialog("流程图", "workflow/components/processViewer", { | ||
145 | xml: result.xml, | ||
146 | finishedInfo: { | ||
147 | finishedTaskSet: result.finishedTaskSet, | ||
148 | unfinishedTaskSet: result.unfinishedTaskSet, | ||
149 | rejectedTaskSet: result.rejectedTaskSet, | ||
150 | finishedSequenceFlowSet: result.finishedSequenceFlowSet, | ||
151 | }, | ||
152 | allCommentList: result.historyTaskList, | ||
153 | }, '80%', true); | ||
154 | } | ||
155 | ); | ||
156 | break; | ||
157 | case "B5": | ||
158 | this.zsylFlag = true; | ||
159 | break; | ||
160 | case "B2": //材料分屏按钮 | ||
161 | this.splitScreen = this.splitScreen ? false : true; | ||
162 | this.$store.dispatch("app/settScreen", this.splitScreen); | ||
163 | if (this.splitScreen) { | ||
164 | //如果当前选项卡为材料信息内容,递减到上一个选项卡内容 | ||
165 | if (this.tabName == this.clxxTab.value) { | ||
166 | this.tabName = this.tabList[this.clxxIndex - 1].value; | ||
167 | this.getFromRouter(this.tabList[this.clxxIndex - 1].value); | ||
168 | } | ||
169 | this.tabList.splice(this.clxxIndex, 1); | ||
200 | } else { | 170 | } else { |
201 | this.$message.error(res.message); | 171 | this.tabList.splice(this.clxxIndex, 1, this.clxxTab); |
202 | } | 172 | } |
203 | }); | 173 | break; |
174 | case "signout": | ||
175 | window.close(); | ||
176 | break; | ||
177 | case "rm": | ||
178 | this.del() | ||
179 | window.close(); | ||
180 | } | ||
181 | }, | ||
182 | del () { | ||
183 | let formdata = new FormData(); | ||
184 | formdata.append("bsmSlsq", this.bsmSlsq); | ||
185 | this.$confirm("确定要删除吗, 是否继续?", "提示", { | ||
186 | confirmButtonText: "确定", | ||
187 | cancelButtonText: "取消", | ||
188 | type: "warning", | ||
204 | }) | 189 | }) |
205 | .catch(() => { | 190 | .then(() => { |
206 | this.$message({ | 191 | deleteFlow(formdata).then((res) => { |
207 | type: "info", | 192 | if (res.code === 200) { |
208 | message: "已取消删除", | 193 | this.handleDel(); |
194 | this.$message({ | ||
195 | type: "success", | ||
196 | message: "删除成功!", | ||
197 | }); | ||
198 | this.queryClick(); | ||
199 | } else { | ||
200 | this.$message.error(res.message); | ||
201 | } | ||
202 | }); | ||
203 | }) | ||
204 | .catch(() => { | ||
205 | this.$message({ | ||
206 | type: "info", | ||
207 | message: "已取消删除", | ||
208 | }); | ||
209 | }); | 209 | }); |
210 | }, | ||
211 | //读取申请单元信息 | ||
212 | loadBdcdylist () { | ||
213 | var formdata = new FormData(); | ||
214 | formdata.append("bsmSlsq", this.bsmSlsq); | ||
215 | formdata.append("bestepid", this.bestepid); | ||
216 | leftMenu(formdata).then((res) => { | ||
217 | if (res.code === 200) { | ||
218 | this.unitData = res.result; | ||
219 | this.currentSelectProps = res.result[0]; | ||
220 | this.unitClick(0); | ||
221 | } | ||
210 | }); | 222 | }); |
223 | }, | ||
224 | //申请单元点击事件 | ||
225 | unitClick (index) { | ||
226 | this.currentSelectProps = this.unitData[index]; | ||
227 | this.currentSelectProps.type = "ONLY_READ"; | ||
228 | getStepFormInfo(this.currentSelectProps).then((res) => { | ||
229 | if (res.code === 200) { | ||
230 | this.fresh++; | ||
231 | //获取单元对应的所有表单信息 | ||
232 | this.tabList = res.result; | ||
233 | //默认加载第一个表单信息 | ||
234 | this.tabName = res.result[0].value; | ||
235 | } | ||
236 | }); | ||
237 | }, | ||
211 | }, | 238 | }, |
212 | //读取申请单元信息 | 239 | }; |
213 | loadBdcdylist () { | ||
214 | var formdata = new FormData(); | ||
215 | formdata.append("bsmSlsq", this.bsmSlsq); | ||
216 | formdata.append("bestepid", this.bestepid); | ||
217 | leftMenu(formdata).then((res) => { | ||
218 | if (res.code === 200) { | ||
219 | this.unitData = res.result; | ||
220 | this.currentSelectProps = res.result[0]; | ||
221 | this.unitClick(0); | ||
222 | } | ||
223 | }); | ||
224 | }, | ||
225 | //申请单元点击事件 | ||
226 | unitClick (index) { | ||
227 | this.currentSelectProps = this.unitData[index]; | ||
228 | this.currentSelectProps.type = "ONLY_READ"; | ||
229 | getStepFormInfo(this.currentSelectProps).then((res) => { | ||
230 | if (res.code === 200) { | ||
231 | this.fresh++; | ||
232 | //获取单元对应的所有表单信息 | ||
233 | this.tabList = res.result; | ||
234 | //默认加载第一个表单信息 | ||
235 | this.tabName = res.result[0].value; | ||
236 | } | ||
237 | }); | ||
238 | }, | ||
239 | }, | ||
240 | }; | ||
241 | </script> | 240 | </script> | ... | ... |
-
Please register or sign in to post a comment