44 <el-button type =" primary" size =" medium" >
55 <router-link to =" /api_excel/add" >上传测试</router-link >
66 </el-button >
7+ <el-button type =" primary" size =" medium" @click =" dialogFormVisible = true" >Dialog</el-button >
78 <el-button :loading =" reload" type =" primary" class =" reload" plain @click =" fetchData" >{{ reload_name }}</el-button >
89 </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 >
971 <el-table
1072 v-loading =" listLoading"
1173 :data =" list"
127189</template >
128190
129191<script >
192+ import { getListParam } from ' @/api/api_param'
193+ import { postAdd } from ' @/api/api_excel'
130194import { getToken } from ' @/utils/auth'
131195import { getList , deleteAct , search , startTask , download_log } from ' @/api/api_excel'
132196
@@ -143,6 +207,46 @@ export default {
143207 },
144208 data () {
145209 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
146250 reload: false ,
147251 reload_name: ' 点击刷新' ,
148252 list: null ,
@@ -155,6 +259,13 @@ export default {
155259 websock: null
156260 }
157261 },
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+ },
158269 created () {
159270 this .listQuery = this .$route .query
160271 const page = parseInt (this .listQuery .page )
@@ -163,6 +274,7 @@ export default {
163274 this .perpage = isNaN (perPage) ? this .perpage : perPage
164275 // this.fetchData()
165276 this .initWebSocket ()
277+ this .init ()
166278 },
167279 destroyed () {
168280 this .websock .close () // 离开路由之后断开 websocket 连接
@@ -366,7 +478,75 @@ export default {
366478 return false
367479 }
368480 })
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 ()
369548 }
549+ // Add -- end
370550 }
371551}
372552 </script >
0 commit comments