应用新增、编辑修改

src/views/authorityManagement/components/authorityAppAdd.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-11-29 09:18:04
- * @LastEditTime: 2022-03-28 07:19:02
+ * @LastEditTime: 2022-03-28 15:47:49
  * @LastEditors: your name
  * @Description: 新增/编辑应用
  * @FilePath: \Foshan4A2.0\src\views\authorityManagement\components\addApp.vue
@@ -41,7 +41,7 @@
             <el-form-item
               label="请求类型"
               prop="type"
-              :rules="{ required: true, message: '选择请求类型', trigger: ['change', 'blur'] }"
+              :rules="{ required: domains.length, message: '选择请求类型', trigger: ['change', 'blur'] }"
             >
               <el-select
                 v-model="form.type"
@@ -61,7 +61,7 @@
             <el-form-item
               label="参数类型"
               prop="app"
-              :rules="{ required: form.type === 2, message: '请选择参数类型', trigger: ['change', 'blur'] }"
+              :rules="{ required: form.type === 2 && domains.length, message: '请选择参数类型', trigger: ['change', 'blur'] }"
             >
               <el-select
                 v-model="form.app"
@@ -77,7 +77,6 @@
                   value="application/text"
                 />
               </el-select>
-              <!-- <el-input placeholder="请输入参数类型" v-model.trim="form.app"></el-input> -->
             </el-form-item>
           </div>
           <el-form-item
@@ -104,7 +103,7 @@
           </el-form-item>
         </el-form>
         <div class="addApp-form-title domain-title flex">
-          <div class="title">参数管理</div>
+          <div class="title">入参管理</div>
           <div class="btn">
             <el-button
               type="primary"
@@ -129,14 +128,16 @@
                 :xs="12"
               >
                 <el-form-item
-                  label="参数名称"
+                  label="入参名称"
                   :prop="'domains.' + index + '.AppInputName'"
-                  :rules="{ required: true, message: '请输入参数名称', trigger: ['change', 'blur'] }"
+                  :rules="[
+                    { required: true, message: '请输入入参名称', trigger: ['change', 'blur'] },
+                    { validator: lengthValidator, max: 64, message: '长度在 1 到 64 个字符', trigger: ['change', 'blur'] }
+                  ]"
                 >
                   <el-input
                     v-model.trim="domain.AppInputName"
-                    placeholder="请输入最大64位参数名称"
-                    maxlength="64"
+                    placeholder="请输入最大64位入参名称"
                   />
                 </el-form-item>
               </el-col>
@@ -146,14 +147,16 @@
                 :xs="12"
               >
                 <el-form-item
-                  label="参数描述"
+                  label="入参描述"
                   :prop="'domains.' + index + '.InputComment'"
-                  :rules="{ required: true, message: '请输入参数描述', trigger: ['change', 'blur'] }"
+                  :rules="[
+                    { required: true, message: '请输入入参描述', trigger: ['change', 'blur'] },
+                    { validator: lengthValidator, max: 64, message: '长度在 1 到 64 个字符', trigger: ['change', 'blur'] }
+                  ]"
                 >
                   <el-input
                     v-model.trim="domain.InputComment"
-                    placeholder="请输入最大64位参数描述"
-                    maxlength="64"
+                    placeholder="请输入最大64位入参描述"
                   />
                 </el-form-item>
               </el-col>
@@ -163,13 +166,14 @@
                 :xs="12"
               >
                 <el-form-item
-                  label="参数类型"
+                  label="入参类型"
                   :prop="'domains.' + index + '.AppInputType'"
+                  :rules="{ required: form.type === 2, message: '请选择入参类型', trigger: ['change', 'blur'] }"
                 >
                   <el-select
                     v-model="domain.AppInputType"
                     :disabled="typeFlag"
-                    placeholder="参数类型"
+                    placeholder="入参类型"
                     @change="value => inputTypeChange(value, index)"
                   >
                     <el-option
@@ -181,7 +185,6 @@
                       value="int"
                     />
                   </el-select>
-                  <!-- <el-input placeholder="请输入最大8位参数类型" maxlength="8" v-model.trim="domain.AppInputType"></el-input> -->
                 </el-form-item>
               </el-col>
               <el-col
@@ -190,18 +193,18 @@
                 :xs="12"
               >
                 <el-form-item
-                  label="参数位置"
+                  label="入参位置"
                   :prop="'domains.' + index + '.AppInputSite'"
-                  :rules="{ required: true, message: '请选择参数位置', trigger: ['change', 'blur'] }"
+                  :rules="{ required: true, message: '请选择入参位置', trigger: ['change', 'blur'] }"
                 >
                   <el-select
                     v-model="domain.AppInputSite"
-                    placeholder="参数位置"
+                    placeholder="入参位置"
                   >
-                    <!-- <el-option
+                    <el-option
                       label="header"
                       value="header"
-                    /> -->
+                    />
                     <el-option
                       label="url"
                       value="url"
@@ -212,7 +215,6 @@
                       value="body"
                     />
                   </el-select>
-                  <!-- <el-input placeholder="请输入最大8位参数位置" maxlength="8" v-model.trim="domain.AppInputSite"></el-input> -->
                 </el-form-item>
               </el-col>
               <el-col
@@ -221,25 +223,34 @@
                 :xs="12"
               >
                 <el-form-item
-                  label="参数值"
+                  label="入参值"
                   :prop="'domains.' + index + '.InputValue'"
                   :rules="[
-                    { required: true, message: '请输入参数值', trigger: ['change', 'blur'] },
-                    { pattern: domain.AppInputType === 'int' ? /^[1-9][0-9]*$/ : /[\S]+/, message: domain.AppInputType === 'int' ? '请输入纯数字' : '请勿输入空格', trigger: ['change', 'blur'] }
+                    { required: true, message: '请输入入参值', trigger: ['change', 'blur'] },
+                    { pattern: domain.AppInputType === 'int' ? /^[1-9][0-9]*$/ : /[\S]+/, message: domain.AppInputType === 'int' ? '请输入纯数字' : '请勿输入空格', trigger: ['change', 'blur'] },
+                    { validator: lengthValidator, max: 64, message: '长度在 1 到 64 个字符', trigger: ['change', 'blur'] }
                   ]"
                 >
-                  <el-autocomplete
-                    ref="inputValue"
-                    v-model.trim="domain.InputValue"
-                    placeholder="请输入参数值"
-                    :fetch-suggestions="querySearch"
-                  >
-                    <i
-                      slot="suffix"
-                      class="el-icon-edit el-input__icon"
-                      @click="handleIconClick(index)"
+                  <template v-if="domain.AppInputType === 'int'">
+                    <el-input
+                      v-model.trim="domain.InputComment"
+                      placeholder="请输入最大64位入参值"
                     />
-                  </el-autocomplete>
+                  </template>
+                  <template v-else>
+                    <el-autocomplete
+                      ref="inputValue"
+                      v-model.trim="domain.InputValue"
+                      placeholder="请输入最大64位入参值"
+                      :fetch-suggestions="querySearch"
+                    >
+                      <i
+                        slot="suffix"
+                        class="el-icon-edit el-input__icon"
+                        @click="handleIconClick(index)"
+                      />
+                    </el-autocomplete>
+                  </template>
                 </el-form-item>
               </el-col>
               <el-col
@@ -292,7 +303,7 @@ export default {
       form: {
         // 应用表单
         name: '',
-        type: 1,
+        type: '',
         app: '',
         url: '',
         desc: ''
@@ -305,9 +316,8 @@ export default {
         ],
         desc: [
           // { required: true, message: "请输入描述", trigger: "blur" },
-          { validator: lengthValidator, max: 256, message: '长度在 1 到 256 个字符', trigger: ['change', 'blur'] }
+          { validator: lengthValidator, max: 128, message: '长度在 1 到 128 个字符', trigger: ['change', 'blur'] }
         ],
-        app: [{ validator: lengthValidator, max: 32, message: '长度在 1 到 32 个字符', trigger: ['change', 'blur'] }],
         url: [
           { pattern: regular.url, message: regular.urlMessage, trigger: ['change', 'blur'] },
           { validator: lengthValidator, max: 512, message: '长度在 1 到 512 个字符', trigger: ['change', 'blur'] }
@@ -315,15 +325,7 @@ export default {
       },
       dialogImageUrl: '',
       dialogVisible: false,
-      domains: [
-        {
-          AppInputName: '',
-          InputComment: '',
-          AppInputType: '',
-          AppInputSite: 'url',
-          InputValue: ''
-        }
-      ],
+      domains: [],
       AppValues: [
         {
           value: 'token'
@@ -343,6 +345,7 @@ export default {
     }
   },
   methods: {
+    lengthValidator,
     querySearch(queryString, callback) {
       const AppValues = this.AppValues
       const results = queryString
@@ -417,7 +420,7 @@ export default {
           AppInputSite: 'url',
           InputValue: ''
         })
-      } else {
+      } else if (type === 2) {
         this.domains.push({
           AppInputName: '',
           InputComment: '',
@@ -425,6 +428,14 @@ export default {
           AppInputSite: 'body',
           InputValue: ''
         })
+      } else {
+        this.domains.push({
+          AppInputName: '',
+          InputComment: '',
+          AppInputType: '',
+          AppInputSite: '',
+          InputValue: ''
+        })
       }
     },
     typeChange(val) {
@@ -446,9 +457,7 @@ export default {
       }
     },
     inputTypeChange(value, index) {
-      if (value === 'int') {
-        this.$refs['dynamicValidateForm'].validateField('domains.' + index + '.InputValue')
-      }
+      this.$refs['dynamicValidateForm'].validateField('domains.' + index + '.InputValue')
     }
   }
 }

src/views/authorityManagement/components/authorityAppEdit.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-11-29 09:18:04
- * @LastEditTime: 2022-03-28 07:19:11
+ * @LastEditTime: 2022-03-28 15:58:08
  * @LastEditors: your name
  * @Description: 新增/编辑应用
  * @FilePath: \Foshan4A2.0\src\views\authorityManagement\components\addApp.vue
@@ -51,7 +51,7 @@
             <el-form-item
               label="请求类型"
               prop="type"
-              :rules="{ required: true, message: '选择请求类型', trigger: ['change', 'blur'] }"
+              :rules="{ required: domains.length, message: '选择请求类型', trigger: ['change', 'blur'] }"
             >
               <el-select
                 v-model="form.type"
@@ -71,7 +71,7 @@
             <el-form-item
               label="参数类型"
               prop="app"
-              :rules="{ required: form.type === 2, message: '请选择参数类型', trigger: ['change', 'blur'] }"
+              :rules="{ required: form.type === 2 && domains.length, message: '请选择参数类型', trigger: ['change', 'blur'] }"
             >
               <el-select
                 v-model="form.app"
@@ -87,7 +87,6 @@
                   value="application/text"
                 />
               </el-select>
-              <!-- <el-input placeholder="请输入参数类型" v-model.trim="form.app"></el-input> -->
             </el-form-item>
           </div>
           <el-form-item
@@ -114,7 +113,7 @@
           </el-form-item>
         </el-form>
         <div class="addApp-form-title domain-title flex">
-          <div class="title">参数管理</div>
+          <div class="title">入参管理</div>
           <div class="btn">
             <el-button
               type="primary"
@@ -139,14 +138,16 @@
                 :xs="12"
               >
                 <el-form-item
-                  label="参数名称"
+                  label="入参名称"
                   :prop="'domains.' + index + '.AppInputName'"
-                  :rules="{ required: true, message: '请输入参数名称', trigger: ['change', 'blur'] }"
+                  :rules="[
+                    { required: true, message: '请输入入参名称', trigger: ['change', 'blur'] },
+                    { validator: lengthValidator, max: 64, message: '长度在 1 到 64 个字符', trigger: ['change', 'blur'] }
+                  ]"
                 >
                   <el-input
                     v-model.trim="domain.AppInputName"
-                    placeholder="请输入最大64位参数名称"
-                    maxlength="64"
+                    placeholder="请输入最大64位入参名称"
                   />
                 </el-form-item>
               </el-col>
@@ -156,14 +157,16 @@
                 :xs="12"
               >
                 <el-form-item
-                  label="参数描述"
+                  label="入参描述"
                   :prop="'domains.' + index + '.InputComment'"
-                  :rules="{ required: true, message: '请输入参数描述', trigger: ['change', 'blur'] }"
+                  :rules="[
+                    { required: true, message: '请输入入参描述', trigger: ['change', 'blur'] },
+                    { validator: lengthValidator, max: 64, message: '长度在 1 到 64 个字符', trigger: ['change', 'blur'] }
+                  ]"
                 >
                   <el-input
                     v-model.trim="domain.InputComment"
-                    placeholder="请输入最大64位参数描述"
-                    maxlength="64"
+                    placeholder="请输入最大64位入参描述"
                   />
                 </el-form-item>
               </el-col>
@@ -173,13 +176,14 @@
                 :xs="12"
               >
                 <el-form-item
-                  label="参数类型"
+                  label="入参类型"
                   :prop="'domains.' + index + '.AppInputType'"
+                  :rules="{ required: form.type === 2, message: '请选择入参类型', trigger: ['change', 'blur'] }"
                 >
                   <el-select
                     v-model="domain.AppInputType"
                     :disabled="typeFlag"
-                    placeholder="参数类型"
+                    placeholder="入参类型"
                     @change="value => inputTypeChange(value, index)"
                   >
                     <el-option
@@ -191,7 +195,6 @@
                       value="int"
                     />
                   </el-select>
-                  <!-- <el-input placeholder="请输入最大8位参数类型" maxlength="8" v-model.trim="domain.AppInputType"></el-input> -->
                 </el-form-item>
               </el-col>
               <el-col
@@ -200,18 +203,18 @@
                 :xs="12"
               >
                 <el-form-item
-                  label="参数位置"
+                  label="入参位置"
                   :prop="'domains.' + index + '.AppInputSite'"
-                  :rules="{ required: true, message: '请选择参数位置', trigger: ['change', 'blur'] }"
+                  :rules="{ required: true, message: '请选择入参位置', trigger: ['change', 'blur'] }"
                 >
                   <el-select
                     v-model="domain.AppInputSite"
-                    placeholder="参数位置"
+                    placeholder="入参位置"
                   >
-                    <!-- <el-option
+                    <el-option
                       label="header"
                       value="header"
-                    /> -->
+                    />
                     <el-option
                       label="url"
                       value="url"
@@ -222,7 +225,6 @@
                       value="body"
                     />
                   </el-select>
-                  <!-- <el-input placeholder="请输入最大8位参数位置" maxlength="8" v-model.trim="domain.AppInputSite"></el-input> -->
                 </el-form-item>
               </el-col>
               <el-col
@@ -231,25 +233,34 @@
                 :xs="12"
               >
                 <el-form-item
-                  label="参数值"
+                  label="入参值"
                   :prop="'domains.' + index + '.InputValue'"
                   :rules="[
-                    { required: true, message: '请输入参数值', trigger: ['change', 'blur'] },
-                    { pattern: domain.AppInputType === 'int' ? /^[1-9][0-9]*$/ : /[\S]+/, message: domain.AppInputType === 'int' ? '请输入纯数字' : '请勿输入空格', trigger: ['change', 'blur'] }
+                    { required: true, message: '请输入入参值', trigger: ['change', 'blur'] },
+                    { pattern: domain.AppInputType === 'int' ? /^[1-9][0-9]*$/ : /[\S]+/, message: domain.AppInputType === 'int' ? '请输入纯数字' : '请勿输入空格', trigger: ['change', 'blur'] },
+                    { validator: lengthValidator, max: 64, message: '长度在 1 到 64 个字符', trigger: ['change', 'blur'] }
                   ]"
                 >
-                  <el-autocomplete
-                    ref="inputValue"
-                    v-model.trim="domain.InputValue"
-                    placeholder="请输入参数值"
-                    :fetch-suggestions="querySearch"
-                  >
-                    <i
-                      slot="suffix"
-                      class="el-icon-edit el-input__icon"
-                      @click="handleIconClick(index)"
+                  <template v-if="domain.AppInputType === 'int'">
+                    <el-input
+                      v-model.trim="domain.InputComment"
+                      placeholder="请输入最大64位入参值"
                     />
-                  </el-autocomplete>
+                  </template>
+                  <template v-else>
+                    <el-autocomplete
+                      ref="inputValue"
+                      v-model.trim="domain.InputValue"
+                      placeholder="请输入最大64位入参值"
+                      :fetch-suggestions="querySearch"
+                    >
+                      <i
+                        slot="suffix"
+                        class="el-icon-edit el-input__icon"
+                        @click="handleIconClick(index)"
+                      />
+                    </el-autocomplete>
+                  </template>
                 </el-form-item>
               </el-col>
               <el-col
@@ -315,20 +326,7 @@ export default {
         ],
         desc: [
           // { required: true, message: "请输入描述", trigger: "blur" },
-          {
-            validator: lengthValidator,
-            max: 256,
-            message: '长度在 1到 256 个字符',
-            trigger: ['change', 'blur']
-          }
-        ],
-        app: [
-          {
-            validator: lengthValidator,
-            max: 32,
-            message: '长度在 1 到 32 个字符',
-            trigger: ['change', 'blur']
-          }
+          { validator: lengthValidator, max: 128, message: '长度在 1 到 128 个字符', trigger: ['change', 'blur'] }
         ],
         url: [
           { pattern: regular.url, message: regular.urlMessage, trigger: ['change', 'blur'] },
@@ -339,15 +337,7 @@ export default {
       AppId: null,
       dialogImageUrl: '',
       dialogVisible: false,
-      domains: [
-        {
-          AppInputName: '',
-          InputComment: '',
-          AppInputType: '',
-          AppInputSite: '',
-          InputValue: ''
-        }
-      ],
+      domains: [],
       AppValues: [
         {
           value: 'token'
@@ -374,6 +364,7 @@ export default {
     this.getAppDetails(AuthId)
   },
   methods: {
+    lengthValidator,
     querySearch(queryString, callback) {
       const AppValues = this.AppValues
       const results = queryString
@@ -471,23 +462,23 @@ export default {
       }
     },
     // 应用删除
-    async deleteApp() {
-      try {
-        const res = await DeleteApp({
-          AppId: this.AppId
-        })
-        if (res.code === 0) {
-          this.$message.success(res.message)
-          setTimeout(() => {
-            this.$router.push('/authority')
-          }, 2000)
-        } else {
-          this.$message.error(res.message)
-        }
-      } catch (error) {
-        console.log('出错了', error)
-      }
-    },
+    // async deleteApp() {
+    //   try {
+    //     const res = await DeleteApp({
+    //       AppId: this.AppId
+    //     })
+    //     if (res.code === 0) {
+    //       this.$message.success(res.message)
+    //       setTimeout(() => {
+    //         this.$router.push('/authority')
+    //       }, 2000)
+    //     } else {
+    //       this.$message.error(res.message)
+    //     }
+    //   } catch (error) {
+    //     console.log('出错了', error)
+    //   }
+    // },
     removeDomain(index) {
       const deleteInputs = this.domains.splice(index, 1)
       const appInputId = deleteInputs[0].AppInputId
@@ -501,9 +492,10 @@ export default {
           InputComment: '',
           AppInputType: '',
           AppInputSite: 'url',
-          InputValue: ''
+          InputValue: '',
+          AppId: this.AppId
         })
-      } else {
+      } else if (type === 2) {
         this.domains.push({
           AppInputName: '',
           InputComment: '',
@@ -512,6 +504,15 @@ export default {
           InputValue: '',
           AppId: this.AppId
         })
+      } else {
+        this.domains.push({
+          AppInputName: '',
+          InputComment: '',
+          AppInputType: '',
+          AppInputSite: '',
+          InputValue: '',
+          AppId: this.AppId
+        })
       }
     },
     typeChange(val) {
@@ -533,9 +534,7 @@ export default {
       }
     },
     inputTypeChange(value, index) {
-      if (value === 'int') {
-        this.$refs['dynamicValidateForm'].validateField('domains.' + index + '.InputValue')
-      }
+      this.$refs['dynamicValidateForm'].validateField('domains.' + index + '.InputValue')
     }
   }
 }

src/views/dashboard/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-10-14 17:17:53
- * @LastEditTime: 2022-03-28 14:18:00
+ * @LastEditTime: 2022-03-28 15:13:32
  * @LastEditors: your name
  * @Description: In User Settings Edit
  * @FilePath: \Foshan4A\src\views\dashboard\index.vue
@@ -18,6 +18,7 @@
         <template v-if="item.params.length > 1">
           <el-dropdown
             placement="bottom-start"
+            trigger="click"
             @command="handleCommand"
           >
             <div class="flex">
@@ -400,7 +401,7 @@ export default {
         })
           .then(res => {
             const data = res.data.data
-            data && window.open(res.data.data)
+            data && window.open(data)
           })
           .catch(err => {
             console.log(err)