4
4
<el-button type =" primary" size =" medium" >
5
5
<router-link to =" /api_excel/add" >上传测试</router-link >
6
6
</el-button >
7
+ <el-button type =" primary" size =" medium" @click =" dialogFormVisible = true" >Dialog</el-button >
7
8
<el-button :loading =" reload" type =" primary" class =" reload" plain @click =" fetchData" >{{ reload_name }}</el-button >
8
9
</el-row >
10
+ <el-dialog :visible.sync =" dialogFormVisible" title =" 上传测试" >
11
+ <el-form ref =" form" :model =" form" :rules =" rules" label-width =" 120px" >
12
+ <el-form-item label =" 接口" prop =" api_param_id" >
13
+ <el-select v-model =" item" placeholder =" 请选择接口" value-key =" name" >
14
+ <el-option v-for =" (cate, index) in apiParam" :key =" index" :label =" cate.name" :value =" cate.id" >
15
+ <span style =" float : left ; color : #8492a6 ; font-size : 13px " >{{ cate.name }}</span >
16
+ </el-option >
17
+ </el-select >
18
+ </el-form-item >
19
+
20
+ <el-form-item label =" appkey" prop =" appkey" >
21
+ <el-col :span =" 11" >
22
+ <el-input v-model =" form.appkey" />
23
+ </el-col >
24
+ <el-col :span =" 13" />
25
+ </el-form-item >
26
+ <el-form-item label =" 并发请求" prop =" concurrent" >
27
+ <el-col :span =" 2" >
28
+ <el-input v-model =" form.concurrent" />
29
+ </el-col >
30
+ <el-col :span =" 22" >
31
+   ;  ; 任务执行时并发请求的数量,字段必须是数字默认: 5
32
+ </el-col >
33
+ </el-form-item >
34
+ <el-form-item label =" 上传文件" prop =" upload_url" accept =" application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" >
35
+ <input v-model =" form.upload_url" type =" hidden" >
36
+ <el-upload
37
+ :action =" uploadUrl"
38
+ :on-preview =" handlePreview"
39
+ :on-remove =" handleRemove"
40
+ :on-success =" handleSuccess"
41
+ :before-remove =" beforeRemove"
42
+ :on-exceed =" handleExceed"
43
+ :file-list =" fileList"
44
+ multiple
45
+ class =" upload-demo" >
46
+ <el-button size =" small" type =" primary" >点击上传</el-button >
47
+ <div slot =" tip" class =" el-upload__tip" >只能上传 xls/xlsx 文件,且不超过 20M</div >
48
+ </el-upload >
49
+ </el-form-item >
50
+ <el-form-item label =" 描述内容" prop =" description" >
51
+ <el-col :span =" 11" >
52
+ <el-input v-model =" form.description" size =" medium" placeholder =" 请输入内容" />
53
+ </el-col >
54
+ <el-col :span =" 13" />
55
+ </el-form-item >
56
+ <el-form-item label =" 自动删除时间" prop =" auto_delete" >
57
+ <el-col :span =" 2" >
58
+ <el-input v-model =" form.auto_delete" />
59
+ </el-col >
60
+ <el-col :span =" 22" >
61
+   ;  ; 任务执行完成后自动删除的时间(单位:天),默认: 2 天
62
+ </el-col >
63
+ <el-col :span =" 13" />
64
+ </el-form-item >
65
+ <el-form-item >
66
+ <el-button type =" primary" @click =" onSubmit('form')" >提交</el-button >
67
+ <el-button @click =" resetForm('form')" >重置</el-button >
68
+ </el-form-item >
69
+ </el-form >
70
+ </el-dialog >
9
71
<el-table
10
72
v-loading =" listLoading"
11
73
:data =" list"
127
189
</template >
128
190
129
191
<script >
192
+ import { getListParam } from ' @/api/api_param'
193
+ import { postAdd } from ' @/api/api_excel'
130
194
import { getToken } from ' @/utils/auth'
131
195
import { getList , deleteAct , search , startTask , download_log } from ' @/api/api_excel'
132
196
@@ -143,6 +207,46 @@ export default {
143
207
},
144
208
data () {
145
209
return {
210
+ // Add -- start
211
+ dialogFormVisible: false ,
212
+ // 请求需要携带 token
213
+ uploadUrl: process .env .BASE_API + ' /api/upload?token=' + getToken (),
214
+ fileList: [],
215
+ item: ' ' ,
216
+ apiParam: [],
217
+ form: {
218
+ upload_url: ' ' ,
219
+ api_param_id: ' ' ,
220
+ appkey: ' ' ,
221
+ concurrent: 5 ,
222
+ uid: ' ' ,
223
+ description: ' ' ,
224
+ auto_delete: 2 ,
225
+ sort: ' ' ,
226
+ loading: false
227
+ },
228
+ rules: {
229
+ api_param_id: [
230
+ { required: true , message: ' 请选择接口' , trigger: ' blur' }
231
+ ],
232
+ upload_url: [
233
+ { required: true , message: ' 请上传文件' , trigger: ' blur' }
234
+ ],
235
+ appkey: [
236
+ { required: true , message: ' 请输入 appkey' , trigger: ' blur' }
237
+ ],
238
+ concurrent: [
239
+ { required: true , message: ' 请输入并发请求数' , trigger: ' blur' }
240
+ ],
241
+ description: [
242
+ { required: true , message: ' 请输入描述' , trigger: ' blur' }
243
+ ],
244
+ auto_delete: [
245
+ { required: true , message: ' 请输入天数' , trigger: ' blur' }
246
+ ]
247
+ },
248
+ redirect: ' /api_excel/index' ,
249
+ // Add -- end
146
250
reload: false ,
147
251
reload_name: ' 点击刷新' ,
148
252
list: null ,
@@ -155,6 +259,13 @@ export default {
155
259
websock: null
156
260
}
157
261
},
262
+ watch: {
263
+ item (value ) {
264
+ this .form .api_param_id = value
265
+ // console.log(this.form.api_param_id)
266
+ this .getItem ()
267
+ }
268
+ },
158
269
created () {
159
270
this .listQuery = this .$route .query
160
271
const page = parseInt (this .listQuery .page )
@@ -163,6 +274,7 @@ export default {
163
274
this .perpage = isNaN (perPage) ? this .perpage : perPage
164
275
// this.fetchData()
165
276
this .initWebSocket ()
277
+ this .init ()
166
278
},
167
279
destroyed () {
168
280
this .websock .close () // 离开路由之后断开 websocket 连接
@@ -366,7 +478,75 @@ export default {
366
478
return false
367
479
}
368
480
})
481
+ },
482
+ // Add -- start
483
+ getItem () {
484
+ this .$emit (' getItem' , this .form .apiParam )
485
+ },
486
+ init () {
487
+ getListParam ({ perPage: 20 }).then (response => {
488
+ this .apiParam = response .data .data
489
+ })
490
+ },
491
+ handleRemove (file , fileList ) {
492
+ // console.log(file, fileList)
493
+ },
494
+ handlePreview (file ) {
495
+ // console.log(file)
496
+ },
497
+ handleExceed (files , fileList ) {
498
+ this .$message .warning (` 当前限制选择 3 个文件,本次选择了 ${ files .length } 个文件,共选择了 ${ files .length + fileList .length } 个文件` )
499
+ },
500
+ beforeRemove (file , fileList ) {
501
+ return this .$confirm (` 确定移除 ${ file .name } ?` )
502
+ },
503
+ handleSuccess (response , file , fileList ) {
504
+ // console.log(response)
505
+ if (response .code !== 200 ) {
506
+ this .$message ({
507
+ message: response .reason ,
508
+ type: ' error'
509
+ })
510
+ } else {
511
+ this .form .upload_url = response .data .url
512
+ }
513
+ },
514
+ onSubmit (form ) {
515
+ // console.log(this.form)
516
+ this .$refs [form].validate ((valid ) => {
517
+ if (valid) {
518
+ this .loading = true
519
+ postAdd (this .form ).then (response => {
520
+ this .loading = false
521
+ if (response .code === 200 ) {
522
+ this .$message ({
523
+ message: ' 操作成功' ,
524
+ type: ' success'
525
+ })
526
+ this .dialogFormVisible = false
527
+ this .fetchData ()
528
+ // this.$router.push({ path: this.redirect || '/' })
529
+ } else {
530
+ this .$message .error (response .reason )
531
+ }
532
+ })
533
+ } else {
534
+ // this.$message('error submit!')
535
+ // console.log('error submit!!')
536
+ return false
537
+ }
538
+ })
539
+ },
540
+ onCancel () {
541
+ this .$message ({
542
+ message: ' cancel!' ,
543
+ type: ' warning'
544
+ })
545
+ },
546
+ resetForm (formName ) {
547
+ this .$refs [formName].resetFields ()
369
548
}
549
+ // Add -- end
370
550
}
371
551
}
372
552
</script >
0 commit comments