From 68ead5d5d29ad9f4f1e3f4361e2768d1310dbcde Mon Sep 17 00:00:00 2001
From: dataeaseShu <tong.shu@fit2cloud.com>
Date: Thu, 5 Dec 2024 15:41:05 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E6=95=B0=E6=8D=AE=E6=BA=90):=20=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../data/datasource/form/ApiVariable.vue      | 35 +++++++++++++++----
 1 file changed, 29 insertions(+), 6 deletions(-)

diff --git a/core/core-frontend/src/views/visualized/data/datasource/form/ApiVariable.vue b/core/core-frontend/src/views/visualized/data/datasource/form/ApiVariable.vue
index fe5793c476..d701d7d8f6 100644
--- a/core/core-frontend/src/views/visualized/data/datasource/form/ApiVariable.vue
+++ b/core/core-frontend/src/views/visualized/data/datasource/form/ApiVariable.vue
@@ -139,7 +139,7 @@ const timeFunLists = [
     <span v-if="description" class="kv-description">
       {{ description }}
     </span>
-    <draggable tag="div" :list="parameters" handle=".handle">
+    <draggable class="draggable-content_api" tag="div" :list="parameters" handle=".handle">
       <template #item="{ element, index }">
         <div :key="index" style="margin-bottom: 16px">
           <el-row :gutter="8">
@@ -249,11 +249,14 @@ const timeFunLists = [
               />
             </el-col>
             <el-col :span="1">
-              <el-button text :disabled="isDisable() || isReadOnly" @click="remove(index)">
+              <el-button
+                class="api-variable_del"
+                text
+                :disabled="isDisable() || isReadOnly"
+                @click="remove(index)"
+              >
                 <template #icon>
-                  <Icon name="icon_delete-trash_outlined"
-                    ><icon_deleteTrash_outlined class="svg-icon"
-                  /></Icon>
+                  <Icon><icon_deleteTrash_outlined class="svg-icon" /></Icon>
                 </template>
               </el-button>
             </el-col>
@@ -274,13 +277,33 @@ const timeFunLists = [
 <style lang="less" scoped>
 .api-variable {
   & > .ed-input,
-  .ed-autocomplete {
+  :deep(.ed-autocomplete) {
     width: 100%;
   }
   .drag {
     margin-top: 10px;
     cursor: pointer;
   }
+  :deep(.draggable-content_api) > :last-child {
+    margin-bottom: 0 !important;
+  }
+
+  .api-variable_del {
+    color: #646a73;
+    :deep(.ed-icon) {
+      font-size: 16px;
+    }
+
+    &:hover {
+      background: rgba(31, 35, 41, 0.1) !important;
+    }
+    &:focus {
+      background: rgba(31, 35, 41, 0.1) !important;
+    }
+    &:active {
+      background: rgba(31, 35, 41, 0.2) !important;
+    }
+  }
 }
 .kv-description {
   font-size: 13px;