fix(接口自动化): 修复部分缺陷

backend/src/main/java/io/metersphere/base/mapper/ext/ExtApiTestCaseMapper.xml

@@ -169,7 +169,7 @@
             </include>
         </if>
         <if test="${condition}.creator != null">
-            and t1.user_id
+            and t1.create_user_id
             <include refid="condition">
                 <property name="object" value="${condition}.creator"/>
             </include>

frontend/package.json

@@ -42,7 +42,7 @@
     "vue-papa-parse": "^2.0.0",
     "vue-pdf": "^4.2.0",
     "vue-router": "^3.1.3",
-    "vuedraggable": "^2.23.2",
+    "vuedraggable": "^2.24.3",
     "vuex": "^3.1.2",
     "xml-js": "^1.6.11",
     "yan-progress": "^1.0.3"

frontend/src/business/components/api/automation/scenario/EditApiScenario.vue

@@ -1028,4 +1028,16 @@
     right: 50px;
     z-index: 1;
   }
+
+  /deep/ .el-tree-node__expand-icon.expanded {
+    color: #7C3985;
+  }
+
+  /deep/ .el-icon-caret-right {
+    color: #7C3985;
+  }
+
+  /deep/ .is-leaf {
+    color: transparent;
+  }
 </style>

frontend/src/business/components/api/automation/scenario/MsInputTag.vue

@@ -4,7 +4,9 @@
     :class="[size ? 'el-input-tag--' + size : '']"
     style="height: auto"
     @click="foucusTagInput">
+
     <el-tag
+      class="ms-top"
       v-for="(tag, idx) in innerTags"
       v-bind="$attrs"
       type="info"
@@ -13,7 +15,7 @@
       :closable="!readOnly"
       :disable-transitions="false"
       @close="remove(idx)">
-      {{tag}}
+      {{tag && tag.length>10? tag.substring(0,10)+"...":tag}}
     </el-tag>
     <input
       v-if="!readOnly"
@@ -167,4 +169,5 @@
     height: 36px;
     line-height: 36px;
   }
+
 </style>

frontend/src/business/components/api/automation/scenario/ReferenceView.vue

@@ -1,6 +1,6 @@
 <template>
   <el-dialog :close-on-click-modal="false" :title="$t('api_test.automation.scenario_ref')" :visible.sync="visible"
-             width="45%" :destroy-on-close="true">
+             width="45%" :destroy-on-close="true" append-to-body>
     <span>{{ $t('api_test.automation.scenario_ref') }}：</span>
     <div class="refs" v-loading="scenarioLoading">
       <div v-for="(item, index) in scenarioRefs" :key="index" class="el-button--text">{{ item.name }}</div>
@@ -23,7 +23,7 @@
 
 <script>
 
-export default {
+  export default {
     name: "MsReferenceView",
     components: {},
     data() {
@@ -49,15 +49,15 @@ export default {
         this.visible = true
       }
     }
-}
+  }
 </script>
 
 <style scoped>
-.refs {
+  .refs {
     min-height: 50px;
     max-height: 200px;
     overflow-y: auto;
     font-size: 12px;
     padding-bottom: 10px;
-}
+  }
 </style>

frontend/src/business/components/api/automation/scenario/ScenarioExtendBtns.vue

@@ -1,4 +1,5 @@
 <template>
+  <div>
     <el-dropdown @command="handleCommand" class="scenario-ext-btn">
       <el-link type="primary" :underline="false">
         <el-icon class="el-icon-more"></el-icon>
@@ -8,9 +9,11 @@
         <el-dropdown-item command="schedule" v-tester>{{ $t('api_test.automation.schedule') }}</el-dropdown-item>
         <el-dropdown-item command="create_performance" v-tester>{{ $t('api_test.create_performance_test') }}</el-dropdown-item>
       </el-dropdown-menu>
-    <ms-reference-view ref="viewRef"/>
-    <ms-schedule-maintain ref="scheduleMaintain" @refreshTable="refreshTable" />
     </el-dropdown>
+    <ms-reference-view ref="viewRef"/>
+    <ms-schedule-maintain ref="scheduleMaintain" @refreshTable="refreshTable"/>
+
+  </div>
 </template>
 
 <script>
@@ -20,7 +23,7 @@
 
   export default {
     name: "MsScenarioExtendButtons",
-    components: { MsReferenceView,MsScheduleMaintain},
+    components: {MsReferenceView, MsScheduleMaintain},
     props: {
       row: Object
     },
@@ -61,7 +64,7 @@
           })
         });
       },
-      refreshTable(){
+      refreshTable() {
 
       }
     }

frontend/src/business/components/api/definition/components/ApiKeyValue.vue

@@ -3,14 +3,18 @@
     <span class="kv-description" v-if="description">
       {{ description }}
     </span>
-    <div class="kv-row" v-for="(item, index) in items" :key="index">
+    <ms-draggable element="ul" @update="endChange"
+                  v-model="keyValues" v-bind="{draggable:'.item'}">
+      <div class="kv-row item" v-for="(item, index) in keyValues" :key="index">
         <el-row type="flex" :gutter="20" justify="space-between" align="middle">
+          <el-button icon="el-icon-sort" circle size="mini"/>
+
           <el-col class="kv-checkbox" v-if="isShowEnable">
             <input type="checkbox" v-if="!isDisable(index)" v-model="item.enable"
                    :disabled="isReadOnly"/>
           </el-col>
 
-        <el-col>
+          <el-col class="item">
             <el-input v-if="!suggestions" :disabled="isReadOnly" v-model="item.name" size="small" maxlength="200"
                       @change="change"
                       :placeholder="keyText" show-word-limit/>
@@ -20,24 +24,29 @@
 
           </el-col>
 
-        <el-col>
+          <el-col class="item">
             <el-input :disabled="isReadOnly" v-model="item.value" size="small" @change="change"
                       :placeholder="valueText" show-word-limit/>
           </el-col>
-        <el-col class="kv-delete">
+          <el-col class="item kv-delete">
             <el-button size="mini" class="el-icon-delete-solid" circle @click="remove(index)"
                        :disabled="isDisable(index) || isReadOnly"/>
           </el-col>
         </el-row>
       </div>
+    </ms-draggable>
   </div>
 </template>
 
 <script>
   import {KeyValue} from "../model/ApiTestModel";
+  import MsDraggable from 'vuedraggable'
 
   export default {
     name: "MsApiKeyValue",
+    components: {
+      MsDraggable
+    },
 
     props: {
       keyPlaceholder: String,
@@ -55,7 +64,9 @@
       suggestions: Array,
     },
     data() {
-      return {}
+      return {
+        keyValues: [],
+      }
     },
     computed: {
       keyText() {
@@ -104,11 +115,27 @@
           return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
         };
       },
+      endChange(env) {
+        if (env.newIndex == env.oldIndex) {
+          return;
+        }
+        let newItem = this.keyValues[env.newIndex];
+        let oldItem = this.keyValues[env.oldIndex];
+        this.$set(this.keyValues, env.oldIndex, oldItem);
+        this.$set(this.keyValues, env.newIndex, newItem)
+        this.items.forEach(item => {
+          this.items.splice(0);
+        })
+        this.keyValues.forEach(item => {
+          this.items.push(item);
+        })
+      }
     },
     created() {
       if (this.items.length === 0 || this.items[this.items.length - 1].name) {
         this.items.push(new KeyValue({enable: true}));
       }
+      this.keyValues = this.items;
     }
   }
 </script>

frontend/src/business/components/api/definition/components/ApiVariable.vue

@@ -3,15 +3,19 @@
     <span class="kv-description" v-if="description">
       {{ description }}
     </span>
+    <ms-draggable element="ul" @update="endChange"
+               v-model="keyValues" v-bind="{draggable:'.item'}">
 
-    <div class="kv-row" v-for="(item, index) in parameters" :key="index">
+      <div class="item kv-row" v-for="(item, index) in keyValues" :key="index">
         <el-row type="flex" :gutter="20" justify="space-between" align="middle">
+          <el-button icon="el-icon-sort" circle size="mini"/>
+
           <el-col class="kv-checkbox" v-if="isShowEnable">
             <input type="checkbox" v-if="!isDisable(index)" v-model="item.enable"
                    :disabled="isReadOnly"/>
           </el-col>
 
-        <el-col>
+          <el-col class="item">
             <el-input v-if="!suggestions" :disabled="isReadOnly" v-model="item.name" size="small" maxlength="200"
                       @change="change" :placeholder="keyText" show-word-limit>
               <template v-slot:prepend>
@@ -28,13 +32,13 @@
 
           </el-col>
 
-        <el-col class="kv-select">
+          <el-col class="item kv-select">
             <el-select v-model="item.required" size="small">
               <el-option v-for="req in requireds" :key="req.id" :label="req.name" :value="req.id"/>
             </el-select>
           </el-col>
 
-        <el-col v-if="item.type !== 'file'">
+          <el-col class="item" v-if="item.type !== 'file'">
             <el-autocomplete
               :disabled="isReadOnly"
               size="small"
@@ -49,7 +53,7 @@
             </el-autocomplete>
           </el-col>
 
-        <el-col>
+          <el-col class="item">
             <el-input v-model="item.description" size="small" maxlength="200"
                       :placeholder="$t('commons.description')" show-word-limit>
             </el-input>
@@ -59,17 +63,17 @@
 
           </el-col>
 
-        <el-col v-if="item.type === 'file'">
+          <el-col v-if="item.type === 'file'" class="item">
             <ms-api-body-file-upload :parameter="item"/>
           </el-col>
 
-        <el-col v-if="type === 'body'" class="kv-select">
+          <el-col v-if="type === 'body'" class="item kv-select">
             <el-input :disabled="isReadOnly" v-model="item.contentType" size="small"
                       @change="change" :placeholder="$t('api_test.request.content_type')" show-word-limit>
             </el-input>
           </el-col>
 
-        <el-col class="kv-delete">
+          <el-col class="item kv-delete">
             <el-button size="mini" class="el-icon-delete-solid" circle @click="remove(index)"
                        :disabled="isDisable(index) || isReadOnly"/>
           </el-col>
@@ -77,6 +81,7 @@
 
         </el-row>
       </div>
+    </ms-draggable>
     <ms-api-variable-advance ref="variableAdvance" :environment="environment" :scenario="scenario"
                              :parameters="parameters"
                              :current-item="currentItem"/>
@@ -89,10 +94,11 @@
   import MsApiVariableAdvance from "./ApiVariableAdvance";
   import MsApiBodyFileUpload from "./body/ApiBodyFileUpload";
   import {REQUIRED} from "../model/JsonData";
+  import MsDraggable from 'vuedraggable'
 
   export default {
     name: "MsApiVariable",
-    components: {MsApiBodyFileUpload, MsApiVariableAdvance},
+    components: {MsApiBodyFileUpload, MsApiVariableAdvance, MsDraggable},
     props: {
       keyPlaceholder: String,
       valuePlaceholder: String,
@@ -118,7 +124,8 @@
     data() {
       return {
         currentItem: null,
-        requireds: REQUIRED
+        requireds: REQUIRED,
+        keyValues: [],
       }
     },
     computed: {
@@ -196,6 +203,21 @@
         } else {
           item.contentType = 'text/plain';
         }
+      },
+      endChange(env) {
+        if (env.newIndex == env.oldIndex) {
+          return;
+        }
+        let newItem = this.keyValues[env.newIndex];
+        let oldItem = this.keyValues[env.oldIndex];
+        this.$set(this.keyValues, env.oldIndex, oldItem);
+        this.$set(this.keyValues, env.newIndex, newItem)
+        this.parameters.forEach(item => {
+          this.parameters.splice(0);
+        })
+        this.keyValues.forEach(item => {
+          this.parameters.push(item);
+        })
       }
     },
     created() {
@@ -208,6 +230,7 @@
           contentType: 'text/plain'
         }));
       }
+      this.keyValues = this.parameters;
     }
   }
 </script>