From 5a7bb17c99723d47137ebf30550848047427b076 Mon Sep 17 00:00:00 2001
From: fit2-zhao <yong.zhao@fit2cloud.com>
Date: Thu, 30 Nov 2023 14:19:56 +0800
Subject: [PATCH] =?UTF-8?q?style(=E6=8E=A5=E5=8F=A3=E6=B5=8B=E8=AF=95):=20?=
 =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E7=94=A8=E4=BE=8B=E4=BF=9D=E5=AD=98=E5=B9=B6?=
 =?UTF-8?q?=E7=BB=A7=E7=BB=AD=E6=B7=BB=E5=8A=A0=E5=8A=9F=E8=83=BD=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

--story=1013901 --user=赵勇 【接口测试】接口case新增“保存并继续添加”按钮 https://www.tapd.cn/55049933/s/1439638

Signed-off-by: fit2-zhao <yong.zhao@fit2cloud.com>
---
 .../components/case/ApiCaseHeader.vue         | 73 ++++++++++---------
 .../components/case/EditApiCase.vue           |  4 +
 2 files changed, 42 insertions(+), 35 deletions(-)

diff --git a/api-test/frontend/src/business/definition/components/case/ApiCaseHeader.vue b/api-test/frontend/src/business/definition/components/case/ApiCaseHeader.vue
index 64dd47e23f..1a115a3a2d 100644
--- a/api-test/frontend/src/business/definition/components/case/ApiCaseHeader.vue
+++ b/api-test/frontend/src/business/definition/components/case/ApiCaseHeader.vue
@@ -1,27 +1,28 @@
 <template>
-  <el-header style="width: 100%; padding: 0px">
+  <el-header style="width: 100%; padding: 0">
     <el-card>
-      <el-row>
-        <el-col :span="1">
-          <el-tag
-            size="mini"
-            :style="{
-              'background-color': getColor(true, api.method),
-              border: getColor(true, api.method),
-            }"
-            class="api-el-tag">
-            {{ api.method }}
-          </el-tag>
-        </el-col>
-        <el-col :span="9">
-          <div class="variable-combine">{{ api.name }}</div>
-        </el-col>
-        <el-col :span="6">
-          <div class="variable-combine" style="margin-left: 10px">
-            {{ api.path === null ? ' ' : api.path }}
-          </div>
-        </el-col>
-        <el-col :span="4">
+      <div style="display: flex">
+        <el-tag
+          size="small"
+          style="margin-top: 5px; margin-right: 5px"
+          :style="{
+            'background-color': getColor(true, api.method),
+            border: getColor(true, api.method),
+          }"
+          class="api-el-tag">
+          {{ api.method }}
+        </el-tag>
+        <el-row style="width: 60%">
+          <el-col :span="12">
+            <div class="ellipsis-text">{{ api.name }}</div>
+          </el-col>
+          <el-col :span="12">
+            <div class="ellipsis-text" style="margin-left: 10px">
+              {{ api.path === null ? ' ' : api.path }}
+            </div>
+          </el-col>
+        </el-row>
+        <div style="width: 200px; margin-left: auto">
           <ms-environment-select
             :project-id="projectId"
             :is-read-only="isReadOnly"
@@ -29,8 +30,8 @@
             @setEnvironment="setEnvironment"
             ref="environmentSelect"
             v-if="api.protocol === 'HTTP' || api.protocol === 'TCP'" />
-        </el-col>
-        <el-col :span="4">
+        </div>
+        <div style="width: 240px; margin-right: 20px">
           <!-- 保存操作 -->
           <el-button
             v-if="!isXpack || !showUpdateRule"
@@ -38,13 +39,11 @@
             size="small"
             @click="saveTestCase()"
             v-prevent-re-click
-            v-permission="['PROJECT_API_DEFINITION:READ+EDIT_CASE']"
-            style="margin-left: -20px">
+            v-permission="['PROJECT_API_DEFINITION:READ+EDIT_CASE']">
             {{ saveButtonText }}
           </el-button>
           <el-dropdown
             v-else
-            style="margin-left: -17px"
             v-permission="[
               'PROJECT_API_DEFINITION:READ+EDIT_CASE',
               'PROJECT_API_DEFINITION:READ+CREATE_CASE',
@@ -65,17 +64,16 @@
           </el-dropdown>
 
           <el-button
-            v-if="!isXpack || !showUpdateRule"
-            type="primary"
+            v-if="!loaded"
             size="small"
             @click="saveAndCreate()"
             v-prevent-re-click
             v-permission="['PROJECT_API_DEFINITION:READ+EDIT_CASE']"
-            style="margin-left: 2px">
+            style="background: #ededf1; color: #323233">
             {{ $t('home.dashboard.api_case.save_and_create') }}
           </el-button>
-        </el-col>
-      </el-row>
+        </div>
+      </div>
     </el-card>
   </el-header>
 </template>
@@ -107,6 +105,12 @@ export default {
     useEnvironment: String,
     isCaseEdit: Boolean,
     buttonText: String,
+    loaded: {
+      type: Boolean,
+      default() {
+        return false;
+      },
+    },
     condition: {
       type: Object,
       default() {
@@ -202,13 +206,12 @@ export default {
   margin-left: 30px;
 }
 
-.variable-combine {
+.ellipsis-text {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  font-size: 10px;
+  min-width: 100px; /* 设置最小宽度 */
 }
-
 .el-col {
   height: 32px;
   line-height: 32px;
diff --git a/api-test/frontend/src/business/definition/components/case/EditApiCase.vue b/api-test/frontend/src/business/definition/components/case/EditApiCase.vue
index 790452db61..25ec281a2f 100644
--- a/api-test/frontend/src/business/definition/components/case/EditApiCase.vue
+++ b/api-test/frontend/src/business/definition/components/case/EditApiCase.vue
@@ -19,6 +19,7 @@
           :useEnvironment="environment"
           :is-case-edit="isCaseEdit"
           :button-text="saveButtonText"
+          :loaded="loaded"
           ref="header"
           v-if="refreshHeader" />
       </template>
@@ -620,6 +621,9 @@ export default {
     },
     copyCase(data) {
       data.type = 'AddCase';
+      if (!this.api.request) {
+        this.api.request = data.request;
+      }
       this.apiCaseList.unshift(data);
     },