style:申请业务规则
Showing
2 changed files
with
202 additions
and
183 deletions
1 | import filter from '@/utils/filter.js' | 1 | import filter from '@/utils/filter.js' |
2 | import store from '@/store/index.js' | ||
2 | let vm = null | 3 | let vm = null |
3 | 4 | ||
4 | const sendThis = (_this) => { | 5 | const sendThis = (_this) => { |
... | @@ -8,7 +9,7 @@ class data extends filter { | ... | @@ -8,7 +9,7 @@ class data extends filter { |
8 | constructor() { | 9 | constructor() { |
9 | super() | 10 | super() |
10 | } | 11 | } |
11 | djqxCol() { | 12 | djqxCol () { |
12 | return [ | 13 | return [ |
13 | { | 14 | { |
14 | width: '60', | 15 | width: '60', |
... | @@ -104,7 +105,7 @@ class data extends filter { | ... | @@ -104,7 +105,7 @@ class data extends filter { |
104 | ] | 105 | ] |
105 | } | 106 | } |
106 | 107 | ||
107 | clxxCol() { | 108 | clxxCol () { |
108 | return [ | 109 | return [ |
109 | { | 110 | { |
110 | width: '60', | 111 | width: '60', |
... | @@ -167,7 +168,7 @@ class data extends filter { | ... | @@ -167,7 +168,7 @@ class data extends filter { |
167 | <el-select value={scope.row[scope.column.property]} | 168 | <el-select value={scope.row[scope.column.property]} |
168 | onChange={(val) => { scope.row[scope.column.property] = val }} clearable> | 169 | onChange={(val) => { scope.row[scope.column.property] = val }} clearable> |
169 | { | 170 | { |
170 | vm.dictData['A40'].map(option => { | 171 | store.getters.dictData['A40'].map(option => { |
171 | return ( | 172 | return ( |
172 | <el-option label={option.dname} value={option.dcode}></el-option> | 173 | <el-option label={option.dname} value={option.dcode}></el-option> |
173 | ) | 174 | ) | ... | ... |
... | @@ -68,8 +68,8 @@ | ... | @@ -68,8 +68,8 @@ |
68 | </el-col> | 68 | </el-col> |
69 | <el-col :span="1"> | 69 | <el-col :span="1"> |
70 | <el-upload ref="upload" :action="imgUploadUrl" :limit="1" accept=".xls, .xlsx" :show-file-list="false" | 70 | <el-upload ref="upload" :action="imgUploadUrl" :limit="1" accept=".xls, .xlsx" :show-file-list="false" |
71 | :disabled="requested" :file-list="fileList" :before-upload="uploadRecord" :on-success="handleSuccess"> | 71 | :before-upload="uploadRecord" :on-success="handleSuccess"> |
72 | <el-button type="primary" icon="el-icon-upload" :loading="requested">上传材料</el-button> | 72 | <el-button type="primary" icon="el-icon-upload">上传材料</el-button> |
73 | </el-upload> | 73 | </el-upload> |
74 | </el-col> | 74 | </el-col> |
75 | </el-row> | 75 | </el-row> |
... | @@ -128,209 +128,227 @@ | ... | @@ -128,209 +128,227 @@ |
128 | </div> | 128 | </div> |
129 | </template> | 129 | </template> |
130 | <script> | 130 | <script> |
131 | import { mapGetters } from "vuex"; | 131 | import { uploadUrl } from '@/api/file' |
132 | import { upward, down } from "@/utils/operation"; | 132 | import { upward, down } from "@/utils/operation"; |
133 | import { getDjlxInfo, getSqdjywDetail, saveSqdjyw } from "@/api/system.js"; | 133 | import { getDjlxInfo, getSqdjywDetail, saveSqdjyw } from "@/api/system.js"; |
134 | import { datas, sendThis } from "./sqywDetail"; | 134 | import { datas, sendThis } from "./sqywDetail"; |
135 | export default { | 135 | export default { |
136 | name: "componentDialog", | 136 | name: "componentDialog", |
137 | props: { | 137 | props: { |
138 | formData: { | 138 | formData: { |
139 | type: Object, | 139 | type: Object, |
140 | default: () => { } | 140 | default: () => { } |
141 | } | 141 | } |
142 | }, | 142 | }, |
143 | data () { | 143 | data () { |
144 | return { | 144 | return { |
145 | tn: 0, | 145 | tn: 0, |
146 | n: 0, | 146 | n: 0, |
147 | djlxList: [], | 147 | djlxList: [], |
148 | title: "", | 148 | options: [], |
149 | activeName: "1", | 149 | imgUploadUrl: uploadUrl(), |
150 | form: {}, | 150 | title: "", |
151 | djqxCol: datas.djqxCol(), | 151 | activeName: "1", |
152 | clxxCol: datas.clxxCol(), | 152 | form: { |
153 | }; | 153 | ywDetail: {} |
154 | }, | 154 | }, |
155 | computed: { | 155 | djqxCol: datas.djqxCol(), |
156 | ...mapGetters(["dictData"]), | 156 | clxxCol: datas.clxxCol(), |
157 | }, | 157 | }; |
158 | mounted () { | ||
159 | sendThis(this) | ||
160 | this.init() | ||
161 | }, | ||
162 | methods: { | ||
163 | //页面初始化 | ||
164 | init () { | ||
165 | this.tn = 0; | ||
166 | getDjlxInfo(this.formData.bsmSqyw).then((res) => { | ||
167 | let { result } = res; | ||
168 | this.djlxList = result ? result : []; | ||
169 | if (this.djlxList.length > 0) { | ||
170 | this.getDetail(this.djlxList[0].bsmSqyw); | ||
171 | } else { | ||
172 | this.getDetail(this.formData.bsmSqyw); | ||
173 | } | ||
174 | }) | ||
175 | }, | 158 | }, |
176 | //tab选项卡事件 | 159 | mounted () { |
177 | handleTitleSelct (obj, index) { | 160 | sendThis(this) |
178 | this.n = 0; | 161 | this.init() |
179 | this.tn = index; | ||
180 | this.getDetail(this.djlxList[index].bsmSqyw); | ||
181 | }, | 162 | }, |
182 | //获取业务具体明细内容 | 163 | methods: { |
183 | getDetail (bsmSqyw) { | 164 | //页面初始化 |
184 | getSqdjywDetail(bsmSqyw).then((res) => { | 165 | init () { |
185 | if (res.code === 200) { | 166 | this.tn = 0; |
186 | this.form = res.result; | 167 | getDjlxInfo(this.formData.bsmSqyw).then((res) => { |
187 | console.log(this.form, 'this.formthis.formthis.form'); | 168 | let { result } = res; |
169 | this.djlxList = result ? result : []; | ||
170 | if (this.djlxList.length > 0) { | ||
171 | this.getDetail(this.djlxList[0].bsmSqyw); | ||
172 | } else { | ||
173 | this.getDetail(this.formData.bsmSqyw); | ||
174 | } | ||
175 | }) | ||
176 | }, | ||
177 | uploadRecord (file) { | ||
178 | this.requested = true | ||
179 | this.files = file; | ||
180 | const extension = file.name.split('.')[1] === 'xls' | ||
181 | const extension2 = file.name.split('.')[1] === 'xlsx' | ||
182 | const isLt5M = file.size / 1024 / 1024 < 5 | ||
183 | if (!extension && !extension2) { | ||
184 | this.$message.warning('上传模板只能是 xls、xlsx格式!') | ||
185 | this.requested = false | ||
186 | } | ||
187 | if (!isLt5M) { | ||
188 | this.$message.warning('上传模板大小不能超过 5MB!') | ||
189 | this.requested = false | ||
190 | } | ||
191 | return (extension || extension2) && isLt5M | ||
192 | }, | ||
193 | handleSuccess () { }, | ||
194 | //tab选项卡事件 | ||
195 | handleTitleSelct (obj, index) { | ||
196 | this.n = 0; | ||
197 | this.tn = index; | ||
198 | this.getDetail(this.djlxList[index].bsmSqyw); | ||
199 | }, | ||
200 | //获取业务具体明细内容 | ||
201 | getDetail (bsmSqyw) { | ||
202 | getSqdjywDetail(bsmSqyw).then((res) => { | ||
203 | if (res.code === 200) { | ||
204 | this.form = res.result; | ||
205 | console.log(this.form, 'this.formthis.formthis.form'); | ||
206 | } else { | ||
207 | this.$alert(res.message); | ||
208 | } | ||
209 | }); | ||
210 | }, | ||
211 | //提交保存数据 | ||
212 | submit () { | ||
213 | let that = this; | ||
214 | saveSqdjyw(this.form).then((res) => { | ||
215 | if (res.code == 200) { | ||
216 | that.$message({ | ||
217 | message: "修改成功", | ||
218 | type: "success", | ||
219 | }); | ||
220 | this.$popupCacel() | ||
221 | } | ||
222 | }); | ||
223 | }, | ||
224 | // 上移下移 | ||
225 | moveUpward (index, row, type) { | ||
226 | if (type == "clxx") { | ||
227 | upward(index, this.form.clxx); | ||
188 | } else { | 228 | } else { |
189 | this.$alert(res.message); | 229 | upward(index, this.form.djqx); |
190 | } | 230 | } |
191 | }); | 231 | }, |
192 | }, | 232 | moveDown (index, row, type) { |
193 | //提交保存数据 | 233 | if (type == "clxx") { |
194 | submit () { | 234 | down(index, this.form.clxx); |
195 | let that = this; | 235 | } else { |
196 | saveSqdjyw(this.form).then((res) => { | 236 | down(index, this.form.djqx); |
197 | if (res.code == 200) { | ||
198 | that.$message({ | ||
199 | message: "修改成功", | ||
200 | type: "success", | ||
201 | }); | ||
202 | this.$popupCacel() | ||
203 | } | 237 | } |
204 | }); | 238 | }, |
205 | }, | 239 | addDjqx () { |
206 | // 上移下移 | 240 | this.form.djqx.push({ |
207 | moveUpward (index, row, type) { | 241 | nodecode: "", |
208 | if (type == "clxx") { | 242 | nodename: "", |
209 | upward(index, this.form.clxx); | 243 | enabled: "1", |
210 | } else { | 244 | djyy: "", |
211 | upward(index, this.form.djqx); | 245 | sfqydjyymb: "0", |
212 | } | 246 | }); |
247 | }, | ||
248 | removeDjqx (index, row) { | ||
249 | this.form.djqx.splice(index, 1); | ||
250 | }, | ||
251 | addClxx () { | ||
252 | this.form.clxx.push({ | ||
253 | isrequired: "1", | ||
254 | djqxbm: "", | ||
255 | clbm: "", | ||
256 | clmc: "", | ||
257 | cllx: "", | ||
258 | sfggcl: "1", | ||
259 | }); | ||
260 | }, | ||
261 | removeClxx (index, row) { | ||
262 | this.form.clxx.splice(index, 1); | ||
263 | }, | ||
213 | }, | 264 | }, |
214 | moveDown (index, row, type) { | 265 | }; |
215 | if (type == "clxx") { | ||
216 | down(index, this.form.clxx); | ||
217 | } else { | ||
218 | down(index, this.form.djqx); | ||
219 | } | ||
220 | }, | ||
221 | addDjqx () { | ||
222 | this.form.djqx.push({ | ||
223 | nodecode: "", | ||
224 | nodename: "", | ||
225 | enabled: "1", | ||
226 | djyy: "", | ||
227 | sfqydjyymb: "0", | ||
228 | }); | ||
229 | }, | ||
230 | removeDjqx (index, row) { | ||
231 | this.form.djqx.splice(index, 1); | ||
232 | }, | ||
233 | addClxx () { | ||
234 | this.form.clxx.push({ | ||
235 | isrequired: "1", | ||
236 | djqxbm: "", | ||
237 | clbm: "", | ||
238 | clmc: "", | ||
239 | cllx: "", | ||
240 | sfggcl: "1", | ||
241 | }); | ||
242 | }, | ||
243 | removeClxx (index, row) { | ||
244 | this.form.clxx.splice(index, 1); | ||
245 | }, | ||
246 | }, | ||
247 | }; | ||
248 | </script> | 266 | </script> |
249 | <style lang='scss' scoped> | 267 | <style lang='scss' scoped> |
250 | @import "~@/styles/mixin.scss"; | 268 | @import "~@/styles/mixin.scss"; |
251 | @import "~@/styles/dialogBox.scss"; | 269 | @import "~@/styles/dialogBox.scss"; |
252 | @import "~@/styles/collapse.scss"; | 270 | @import "~@/styles/collapse.scss"; |
253 | @import "~@/styles/dialogBoxheader.scss"; | 271 | @import "~@/styles/dialogBoxheader.scss"; |
254 | 272 | ||
255 | .contentBox { | 273 | .contentBox { |
256 | height: 75vh; | 274 | height: 75vh; |
257 | overflow-y: scroll; | 275 | overflow-y: scroll; |
258 | } | 276 | } |
259 | 277 | ||
260 | .el-radio-group { | 278 | .el-radio-group { |
261 | white-space: nowrap; | 279 | white-space: nowrap; |
262 | } | 280 | } |
263 | 281 | ||
264 | .form { | 282 | .form { |
265 | background: #eee; | 283 | background: #eee; |
266 | padding: 0 10px; | 284 | padding: 0 10px; |
267 | } | 285 | } |
268 | 286 | ||
269 | .edit-title-list { | 287 | .edit-title-list { |
270 | @include flex; | 288 | @include flex; |
271 | 289 | ||
272 | li { | 290 | li { |
273 | flex: 1; | 291 | flex: 1; |
274 | @include flex-center; | 292 | @include flex-center; |
275 | border: 1px solid $borderColor; | 293 | border: 1px solid $borderColor; |
276 | line-height: 36px; | 294 | line-height: 36px; |
277 | margin-bottom: 10px; | 295 | margin-bottom: 10px; |
278 | cursor: pointer; | 296 | cursor: pointer; |
279 | transition: all 0.3s; | 297 | transition: all 0.3s; |
280 | 298 | ||
281 | &:hover { | 299 | &:hover { |
282 | @extend .active; | 300 | @extend .active; |
301 | } | ||
283 | } | 302 | } |
284 | } | 303 | } |
285 | } | ||
286 | |||
287 | .active { | ||
288 | background: $light-blue !important; | ||
289 | color: #fff; | ||
290 | } | ||
291 | |||
292 | .dyztsd-title { | ||
293 | @include flex; | ||
294 | align-items: center; | ||
295 | justify-content: space-between; | ||
296 | padding-left: 20px; | ||
297 | } | ||
298 | |||
299 | .qlxx-list { | ||
300 | @include flex; | ||
301 | flex-wrap: wrap; | ||
302 | padding-left: 20px; | ||
303 | 304 | ||
304 | li { | 305 | .active { |
305 | width: 25%; | 306 | background: $light-blue !important; |
306 | margin-bottom: 15px; | 307 | color: #fff; |
307 | } | 308 | } |
308 | } | ||
309 | 309 | ||
310 | .screen-list { | 310 | .dyztsd-title { |
311 | @include flex; | ||
312 | align-items: center; | ||
313 | flex-wrap: wrap; | ||
314 | border: 1px solid $borderColor; | ||
315 | border-bottom: none; | ||
316 | |||
317 | li { | ||
318 | @include flex; | 311 | @include flex; |
319 | align-items: center; | 312 | align-items: center; |
320 | width: 25%; | 313 | justify-content: space-between; |
321 | line-height: 50px; | ||
322 | border-bottom: 1px solid $borderColor; | ||
323 | padding-left: 20px; | 314 | padding-left: 20px; |
324 | } | 315 | } |
325 | 316 | ||
326 | &-left { | 317 | .qlxx-list { |
327 | margin-right: 20px; | 318 | @include flex; |
328 | width: 160px; | 319 | flex-wrap: wrap; |
329 | white-space: nowrap; | 320 | padding-left: 20px; |
321 | |||
322 | li { | ||
323 | width: 25%; | ||
324 | margin-bottom: 15px; | ||
325 | } | ||
330 | } | 326 | } |
331 | 327 | ||
332 | li:nth-child(odd) { | 328 | .screen-list { |
333 | border-right: 1px solid $borderColor; | 329 | @include flex; |
330 | align-items: center; | ||
331 | flex-wrap: wrap; | ||
332 | border: 1px solid $borderColor; | ||
333 | border-bottom: none; | ||
334 | |||
335 | li { | ||
336 | @include flex; | ||
337 | align-items: center; | ||
338 | width: 25%; | ||
339 | line-height: 50px; | ||
340 | border-bottom: 1px solid $borderColor; | ||
341 | padding-left: 20px; | ||
342 | } | ||
343 | |||
344 | &-left { | ||
345 | margin-right: 20px; | ||
346 | width: 160px; | ||
347 | white-space: nowrap; | ||
348 | } | ||
349 | |||
350 | li:nth-child(odd) { | ||
351 | border-right: 1px solid $borderColor; | ||
352 | } | ||
334 | } | 353 | } |
335 | } | ||
336 | </style> | 354 | </style> | ... | ... |
-
Please register or sign in to post a comment