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="serverName">
8         <el-input v-model="dataForm.serverName" placeholder="服务提供方"></el-input>
9       </el-form-item>
10       <el-form-item label="服务描述" prop="serverDesc">
11         <el-input v-model="dataForm.serverDesc" placeholder="服务描述"></el-input>
12       </el-form-item>
13       <el-form-item label="服务地址" prop="serverAddress">
14         <el-input v-model="dataForm.serverAddress" placeholder="服务地址"></el-input>
15       </el-form-item>
16       <el-form-item label="限流策略(分)" prop="limitMin">
17         <el-input-number v-model="dataForm.limitMin"
18                          controls-position="right"
19                          :min="1" :max="60"></el-input-number>
20       </el-form-item>
21       <el-form-item label="状态" prop="status">
22         <dict-select-tag v-model="dataForm.status" placeholder="状态" dictCode="enable" />
23       </el-form-item>
24     </el-form>
25     <span slot="footer" class="dialog-footer">
26       <el-button @click="visible = false">取消</el-button>
27       <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
28     </span>
29   </el-dialog>
30 </template>
31
32 <script>
33   import DictSelectTag from '@/components/dict/dict-select-tag'
34   export default {
35     components: {
36       DictSelectTag
37     },
38     data () {
39       return {
40         visible: false,
41         dataForm: {
42           id: '',
43           serverName: '',
44           serverDesc: '',
45           serverAddress: '',
46           limitMin: 30,
47           status: 1
48         },
49         dataRule: {
50           serverName: [
51             { required: true, message: '服务提供方不能为空', trigger: 'blur' }
52           ],
53           serverAddress: [
54             { required: true, message: '服务地址不能为空', trigger: 'blur' }
55           ],
56           status: [
57             { required: true, message: '状态不能为空', trigger: 'blur' }
58           ]
59         }
60       }
61     },
62     methods: {
63       init (id) {
64         this.dataForm.id = id || 0
65         this.visible = true
66         this.$nextTick(() => {
67           this.$refs['dataForm'].resetFields()
68           if (this.dataForm.id) {
69             this.$http({
70               url: `/data/api-gateway/server/info/${this.dataForm.id}`,
71               method: 'get',
72               params: this.$http.adornParams()
73             }).then(({data}) => {
74               if (data && data.code === 0) {
75                 this.dataForm.serverName = data.data.serverName
76                 this.dataForm.serverDesc = data.data.serverDesc
77                 this.dataForm.serverAddress = data.data.serverAddress
78                 this.dataForm.limitMin = data.data.limitMin
79                 this.dataForm.status = data.data.status
80               }
81             })
82           }
83         })
84       },
85       // 表单提交
86       dataFormSubmit () {
87         this.$refs['dataForm'].validate((valid) => {
88           if (!valid) {
89             return false
90           }
91           this.loading = true
92           this.$http['post'](`/data/api-gateway/server/${!this.dataForm.id ? 'add' : 'update'}`, this.dataForm).then(({data: res}) => {
93             this.loading = false
94             if (res.code !== 0) {
95               return this.$message.error(res.msg)
96             }
97             this.$message({
98               message: this.$t('prompt.success'),
99               type: 'success',
100               duration: 500,
101               onClose: () => {
102                 this.visible = false
103                 this.$emit('refreshDataList')
104               }
105             })
106           }).catch(() => {
107           })
108         })
109       }
110     }
111   }
112 </script>