houzhongjian
2024-07-23 8501060c4f921d1e744c477e4dc08eb47b52693c
提交 | 用户 | 时间
850106 1 <template>
H 2   <el-dialog
3     :title="!dataForm.id ? '新增' : '修改'"
4     :close-on-click-modal="false"
5     :visible.sync="visible">
6     <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="100px">
7       <el-form-item label="应用名称" prop="appName">
8         <el-input v-model="dataForm.appName" placeholder="应用名称"></el-input>
9       </el-form-item>
10       <el-form-item label="账号" prop="appKey">
11         <el-input v-model="dataForm.appKey" placeholder="账号"></el-input>
12       </el-form-item>
13       <el-form-item label="密码" prop="appSecret">
14         <el-input v-model="dataForm.appSecret" placeholder="密码"></el-input>
15       </el-form-item>
16       <el-form-item label="应用描述" prop="appDesc">
17         <el-input v-model="dataForm.appDesc" placeholder="应用描述"></el-input>
18       </el-form-item>
19     </el-form>
20     <span slot="footer" class="dialog-footer">
21       <el-button @click="visible = false">取消</el-button>
22       <el-button :loading="loading" type="primary" @click="dataFormSubmit()">确定</el-button>
23     </span>
24   </el-dialog>
25 </template>
26
27 <script>
28   export default {
29     data () {
30       return {
31         visible: false,
32         loading: false,
33         dataForm: {
34           id: '',
35           appName: '',
36           appSecret:'',
37           appKey: '',
38           appDesc: ''
39         },
40         dataRule: {
41           appName: [
42             { required: true, message: '应用名称不能为空', trigger: 'blur' }
43           ]
44         }
45       }
46     },
47     methods: {
48       init (id) {
49         this.dataForm.id = id || 0
50         this.visible = true
51         this.$nextTick(() => {
52           this.$refs['dataForm'].resetFields()
53           if (this.dataForm.id) {
54             this.getInfo()
55           }
56         })
57       },
58       // 获取信息
59       getInfo() {
60         this.$http.get(`/data/api-gateway/app/info/${this.dataForm.id}`).then(({data: res}) => {
61           if (res.code !== 0) {
62             return this.$message.error(res.msg)
63           }
64           this.dataForm = {
65             ...this.dataForm,
66             ...res.data
67           }
68         }).catch(() => {
69         })
70       },
71       // 表单提交
72       dataFormSubmit () {
73         this.$refs['dataForm'].validate((valid) => {
74           if (!valid) {
75             return false
76           }
77           this.loading = true
78           this.$http['post'](`/data/api-gateway/app/${!this.dataForm.id ? 'add' : 'update'}`, this.dataForm).then(({data: res}) => {
79             this.loading = false
80             if (res.code !== 0) {
81               return this.$message.error(res.msg)
82             }
83             this.$message({
84               message: this.$t('prompt.success'),
85               type: 'success',
86               duration: 500,
87               onClose: () => {
88                 this.visible = false
89                 this.$emit('refreshDataList')
90               }
91             })
92           }).catch(() => {
93           })
94         })
95       }
96     }
97   }
98 </script>