From 12e3eae473fd11fd9e9142a11533660522c5aa4b Mon Sep 17 00:00:00 2001
From: "xinxin.wu" <xinxin.wu@fit2cloud.com>
Date: Fri, 19 Apr 2024 13:03:59 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E9=87=8D=E6=9E=84=E7=BC=BA?=
 =?UTF-8?q?=E9=99=B7=E7=AE=A1=E7=90=86&=E7=94=A8=E4=BE=8B=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E8=AF=A6=E6=83=85=E9=A1=B5=E9=9D=A2=E5=B1=95=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/models/caseManagement/featureCase.ts  |   4 +-
 .../components/bug-detail-drawer.vue          | 134 +++++++-------
 .../bug-management/components/bugCaseTab.vue  | 166 +++++++++---------
 .../components/bugDetailTab.vue               |   2 +-
 .../components/bugHistoryTab.vue              |   2 +-
 .../bug-management/components/commentTab.vue  |  28 ++-
 .../components/caseDetailDrawer.vue           | 161 ++++++++---------
 .../components/caseTable.vue                  |   2 +-
 .../components/tabContent/settingDrawer.vue   |  21 +--
 .../components/tabContent/tabDetail.vue       |  39 +---
 .../environmental/components/AllParamBox.vue  |  11 +-
 .../system/authorizedManagement/index.vue     |   2 +-
 12 files changed, 256 insertions(+), 316 deletions(-)

diff --git a/frontend/src/models/caseManagement/featureCase.ts b/frontend/src/models/caseManagement/featureCase.ts
index 31d1bf600f..e838f6e60e 100644
--- a/frontend/src/models/caseManagement/featureCase.ts
+++ b/frontend/src/models/caseManagement/featureCase.ts
@@ -222,8 +222,8 @@ export interface CaseModuleQueryParams extends TableQueryParams {
 }
 
 export interface TabItemType {
-  key: string;
-  title: string;
+  value: string;
+  label: string;
   canHide: boolean;
   isShow: boolean;
 }
diff --git a/frontend/src/views/bug-management/components/bug-detail-drawer.vue b/frontend/src/views/bug-management/components/bug-detail-drawer.vue
index 587c55fb30..632872f30e 100644
--- a/frontend/src/views/bug-management/components/bug-detail-drawer.vue
+++ b/frontend/src/views/bug-management/components/bug-detail-drawer.vue
@@ -96,14 +96,22 @@
         :class="[
           `${
             activeTab === 'comment' && hasAnyPermission(['PROJECT_BUG:READ+COMMENT']) && !commentInputIsActive
-              ? 'h-[calc(100%-72px)]'
+              ? 'h-[calc(100%-118px)]'
               : commentInputIsActive
-              ? 'h-[calc(100%-286px)]'
+              ? 'h-[calc(100%-338px)]'
               : 'h-full'
           }`,
           'bg-white',
         ]"
       >
+        <div class="header relative h-[48px] pl-2">
+          <MsTab
+            v-model:active-key="activeTab"
+            :content-tab-list="contentTabList"
+            :get-text-func="getTabBadge"
+            class="no-content relative border-b"
+          />
+        </div>
         <MsSplitBox
           expand-direction="right"
           :size="0.8"
@@ -115,15 +123,7 @@
           <template #first>
             <div class="leftWrapper h-full">
               <a-spin :loading="detailLoading" class="w-full">
-                <div class="header h-[50px]">
-                  <MsTab
-                    v-model:active-key="activeTab"
-                    :content-tab-list="contentTabList"
-                    :get-text-func="getTabBadge"
-                    class="no-content relative mb-[8px]"
-                  />
-                </div>
-                <div class="tab-pane-container">
+                <div class="tab-pane-container p-4">
                   <BugDetailTab
                     v-if="activeTab === 'detail'"
                     ref="bugDetailTabRef"
@@ -150,65 +150,65 @@
             </div>
           </template>
           <template #second>
-            <!-- <a-spin :loading="rightLoading" class="w-full"> -->
-            <!-- 所属平台一致, 详情展示 -->
-            <div v-if="props.currentPlatform === detailInfo.platform" class="rightWrapper h-full p-[24px]">
-              <!-- 自定义字段开始 -->
-              <div class="inline-block w-full break-words">
-                <a-skeleton v-if="rightLoading" class="w-full" :loading="rightLoading" :animation="true">
-                  <a-space direction="vertical" class="w-[100%]" size="large">
-                    <a-skeleton-line :rows="14" :line-height="30" :line-spacing="30" />
-                  </a-space>
-                </a-skeleton>
-                <div v-if="!rightLoading" class="mb-4 font-medium">
-                  <strong>
-                    {{ t('bugManagement.detail.basicInfo') }}
-                  </strong>
-                </div>
-                <MsFormCreate
-                  v-if="!rightLoading"
-                  ref="formCreateRef"
-                  v-model:form-item="formItem"
-                  v-model:api="fApi"
-                  :form-rule="formRules"
-                  class="w-full"
-                  :option="options"
-                  @change="handelFormCreateChange"
-                />
-                <!-- 自定义字段结束 -->
-                <div
-                  v-if="!isPlatformDefaultTemplate && hasAnyPermission(['PROJECT_BUG:READ+UPDATE']) && !loading"
-                  class="baseItem"
-                >
-                  <a-form
-                    :model="{}"
-                    :label-col-props="{
-                      span: 9,
-                    }"
-                    :wrapper-col-props="{
-                      span: 15,
-                    }"
-                    label-align="left"
-                    content-class="tags-class"
+            <a-spin :loading="rightLoading" class="w-full">
+              <!-- 所属平台一致, 详情展示 -->
+              <div v-if="props.currentPlatform === detailInfo.platform" class="rightWrapper h-full p-4">
+                <!-- 自定义字段开始 -->
+                <div class="inline-block w-full break-words">
+                  <a-skeleton v-if="rightLoading" class="w-full" :loading="rightLoading" :animation="true">
+                    <a-space direction="vertical" class="w-[100%]" size="large">
+                      <a-skeleton-line :rows="14" :line-height="30" :line-spacing="30" />
+                    </a-space>
+                  </a-skeleton>
+                  <div v-if="!rightLoading" class="mb-4 font-medium">
+                    <strong>
+                      {{ t('bugManagement.detail.basicInfo') }}
+                    </strong>
+                  </div>
+                  <MsFormCreate
+                    v-if="!rightLoading"
+                    ref="formCreateRef"
+                    v-model:form-item="formItem"
+                    v-model:api="fApi"
+                    :form-rule="formRules"
+                    class="w-full"
+                    :option="options"
+                    @change="handelFormCreateChange"
+                  />
+                  <!-- 自定义字段结束 -->
+                  <div
+                    v-if="!isPlatformDefaultTemplate && hasAnyPermission(['PROJECT_BUG:READ+UPDATE']) && !loading"
+                    class="baseItem"
                   >
-                    <a-form-item field="tags" :label="t('system.orgTemplate.tags')">
-                      <MsTagsInput
-                        v-model:model-value="tags"
-                        :disabled="!hasAnyPermission(['PROJECT_BUG:READ+UPDATE'])"
-                        @blur="changeTag"
-                      />
-                    </a-form-item>
-                  </a-form>
+                    <a-form
+                      :model="{}"
+                      :label-col-props="{
+                        span: 9,
+                      }"
+                      :wrapper-col-props="{
+                        span: 15,
+                      }"
+                      label-align="left"
+                      content-class="tags-class"
+                    >
+                      <a-form-item field="tags" :label="t('system.orgTemplate.tags')">
+                        <MsTagsInput
+                          v-model:model-value="tags"
+                          :disabled="!hasAnyPermission(['PROJECT_BUG:READ+UPDATE'])"
+                          @blur="changeTag"
+                        />
+                      </a-form-item>
+                    </a-form>
+                  </div>
                 </div>
-              </div>
 
-              <!-- 内置基础信息结束 -->
-            </div>
-            <!-- 所属平台不一致, 详情不展示, 展示空面板 -->
-            <div v-else>
-              <a-empty> {{ $t('messageBox.noContent') }} </a-empty>
-            </div>
-            <!-- </a-spin> -->
+                <!-- 内置基础信息结束 -->
+              </div>
+              <!-- 所属平台不一致, 详情不展示, 展示空面板 -->
+              <div v-else>
+                <a-empty> {{ $t('messageBox.noContent') }} </a-empty>
+              </div>
+            </a-spin>
           </template>
         </MsSplitBox>
       </div>
diff --git a/frontend/src/views/bug-management/components/bugCaseTab.vue b/frontend/src/views/bug-management/components/bugCaseTab.vue
index 8b6d6a4dcc..39ae02c103 100644
--- a/frontend/src/views/bug-management/components/bugCaseTab.vue
+++ b/frontend/src/views/bug-management/components/bugCaseTab.vue
@@ -1,89 +1,87 @@
 <template>
-  <div class="p-4">
-    <div class="flex items-center justify-between">
-      <a-button type="primary" :disabled="!hasAnyPermission(['PROJECT_BUG:READ+UPDATE'])" @click="handleSelect">{{
-        t('caseManagement.featureCase.linkCase')
-      }}</a-button>
-      <a-input-search
-        v-model:model-value="keyword"
-        :placeholder="t('caseManagement.featureCase.searchByIdAndName')"
-        allow-clear
-        class="mx-[8px] w-[240px]"
-        @search="searchCase"
-        @press-enter="searchCase"
-      ></a-input-search>
-    </div>
-    <ms-base-table v-bind="propsRes" v-on="propsEvent">
-      <template #relateCaseNum="{ record }">
-        <a-tooltip :content="`${record.relateCaseNum}`">
-          <!-- TOTO 暂时没有用例id的字段 需要后台加caseId -->
-          <a-button type="text" class="px-0" @click="openDetail(record.relateCaseId)">
-            <div class="one-line-text max-w-[168px]">{{ record.relateCaseNum }}</div>
-          </a-button>
-        </a-tooltip>
-      </template>
-      <template #defectName="{ record }">
-        <span class="one-line-text max-w[300px]"> {{ record.relateCaseName }}</span
-        ><span class="ml-1 text-[rgb(var(--primary-5))]">{{ t('caseManagement.featureCase.preview') }}</span>
-      </template>
-      <template #operation="{ record }">
-        <MsButton :disabled="!hasAnyPermission(['PROJECT_BUG:READ+UPDATE'])" @click="cancelLink(record)">{{
-          t('caseManagement.featureCase.cancelLink')
-        }}</MsButton>
-      </template>
-      <template v-if="(keyword || '').trim() === ''" #empty>
-        <div class="flex w-full items-center justify-center text-[var(--color-text-4)]">
-          {{ t('caseManagement.caseReview.tableNoData') }}
-          <MsButton class="ml-[8px]" :disabled="!hasAnyPermission(['PROJECT_BUG:READ+UPDATE'])" @click="handleSelect">
-            {{ t('caseManagement.featureCase.linkCase') }}
-          </MsButton>
-        </div>
-      </template>
-      <template #relatePlanTitle>
-        <div class="flex items-center">
-          <div class="font-medium text-[var(--color-text-3)]">
-            {{ t('bugManagement.detail.isPlanRelateCase') }}
-          </div>
-          <a-popover position="rt">
-            <icon-question-circle
-              class="ml-[4px] text-[var(--color-text-3)] hover:text-[rgb(var(--primary-5))]"
-              size="16"
-            />
-            <template #title>
-              <div class="w-[300px]"> {{ t('bugManagement.detail.isPlanRelateCaseTip1') }} </div>
-              <br />
-              <div class="w-[300px]"> {{ t('bugManagement.detail.isPlanRelateCaseTip2') }} </div>
-              <br />
-              <div class="w-[300px]"> {{ t('bugManagement.detail.isPlanRelateCaseTip3') }} </div>
-            </template>
-          </a-popover>
-        </div>
-      </template>
-      <template #isRelatePlanCase="{ record }">
-        <span class="text-[var(--color-text-1)]">{{ record.isRelatePlanCase ? t('common.yes') : t('common.no') }}</span>
-      </template>
-    </ms-base-table>
-    <MsCaseAssociate
-      v-model:visible="innerVisible"
-      v-model:project-id="innerProject"
-      v-model:currentSelectCase="currentSelectCase"
-      :ok-button-disabled="associateForm.reviewers.length === 0"
-      :get-modules-func="getModuleTree"
-      :modules-params="modulesTreeParams"
-      :get-table-func="getUnAssociatedList"
-      :table-params="getTableParams"
-      :modules-count="modulesCount"
-      :module-options="caseTypeOptions"
-      :confirm-loading="confirmLoading"
-      :case-id="props.bugId"
-      :associated-ids="associatedIds"
-      :type="RequestModuleEnum.BUG_MANAGEMENT"
-      :is-hidden-case-level="true"
-      @close="emit('close')"
-      @save="saveHandler"
-    >
-    </MsCaseAssociate>
+  <div class="mb-4 flex items-center justify-between">
+    <a-button type="primary" :disabled="!hasAnyPermission(['PROJECT_BUG:READ+UPDATE'])" @click="handleSelect">{{
+      t('caseManagement.featureCase.linkCase')
+    }}</a-button>
+    <a-input-search
+      v-model:model-value="keyword"
+      :placeholder="t('caseManagement.featureCase.searchByIdAndName')"
+      allow-clear
+      class="mx-[8px] w-[240px]"
+      @search="searchCase"
+      @press-enter="searchCase"
+    ></a-input-search>
   </div>
+  <ms-base-table v-bind="propsRes" v-on="propsEvent">
+    <template #relateCaseNum="{ record }">
+      <a-tooltip :content="`${record.relateCaseNum}`">
+        <!-- TOTO 暂时没有用例id的字段 需要后台加caseId -->
+        <a-button type="text" class="px-0" @click="openDetail(record.relateCaseId)">
+          <div class="one-line-text max-w-[168px]">{{ record.relateCaseNum }}</div>
+        </a-button>
+      </a-tooltip>
+    </template>
+    <template #defectName="{ record }">
+      <span class="one-line-text max-w[300px]"> {{ record.relateCaseName }}</span
+      ><span class="ml-1 text-[rgb(var(--primary-5))]">{{ t('caseManagement.featureCase.preview') }}</span>
+    </template>
+    <template #operation="{ record }">
+      <MsButton :disabled="!hasAnyPermission(['PROJECT_BUG:READ+UPDATE'])" @click="cancelLink(record)">{{
+        t('caseManagement.featureCase.cancelLink')
+      }}</MsButton>
+    </template>
+    <template v-if="(keyword || '').trim() === ''" #empty>
+      <div class="flex w-full items-center justify-center text-[var(--color-text-4)]">
+        {{ t('caseManagement.caseReview.tableNoData') }}
+        <MsButton class="ml-[8px]" :disabled="!hasAnyPermission(['PROJECT_BUG:READ+UPDATE'])" @click="handleSelect">
+          {{ t('caseManagement.featureCase.linkCase') }}
+        </MsButton>
+      </div>
+    </template>
+    <template #relatePlanTitle>
+      <div class="flex items-center">
+        <div class="font-medium text-[var(--color-text-3)]">
+          {{ t('bugManagement.detail.isPlanRelateCase') }}
+        </div>
+        <a-popover position="rt">
+          <icon-question-circle
+            class="ml-[4px] text-[var(--color-text-3)] hover:text-[rgb(var(--primary-5))]"
+            size="16"
+          />
+          <template #title>
+            <div class="w-[300px]"> {{ t('bugManagement.detail.isPlanRelateCaseTip1') }} </div>
+            <br />
+            <div class="w-[300px]"> {{ t('bugManagement.detail.isPlanRelateCaseTip2') }} </div>
+            <br />
+            <div class="w-[300px]"> {{ t('bugManagement.detail.isPlanRelateCaseTip3') }} </div>
+          </template>
+        </a-popover>
+      </div>
+    </template>
+    <template #isRelatePlanCase="{ record }">
+      <span class="text-[var(--color-text-1)]">{{ record.isRelatePlanCase ? t('common.yes') : t('common.no') }}</span>
+    </template>
+  </ms-base-table>
+  <MsCaseAssociate
+    v-model:visible="innerVisible"
+    v-model:project-id="innerProject"
+    v-model:currentSelectCase="currentSelectCase"
+    :ok-button-disabled="associateForm.reviewers.length === 0"
+    :get-modules-func="getModuleTree"
+    :modules-params="modulesTreeParams"
+    :get-table-func="getUnAssociatedList"
+    :table-params="getTableParams"
+    :modules-count="modulesCount"
+    :module-options="caseTypeOptions"
+    :confirm-loading="confirmLoading"
+    :case-id="props.bugId"
+    :associated-ids="associatedIds"
+    :type="RequestModuleEnum.BUG_MANAGEMENT"
+    :is-hidden-case-level="true"
+    @close="emit('close')"
+    @save="saveHandler"
+  >
+  </MsCaseAssociate>
 </template>
 
 <script setup lang="ts">
diff --git a/frontend/src/views/bug-management/components/bugDetailTab.vue b/frontend/src/views/bug-management/components/bugDetailTab.vue
index f8f38b4247..eda5c5f8f7 100644
--- a/frontend/src/views/bug-management/components/bugDetailTab.vue
+++ b/frontend/src/views/bug-management/components/bugDetailTab.vue
@@ -1,6 +1,6 @@
 <template>
   <!-- 所属平台一致, 详情展示 -->
-  <div v-if="props.currentPlatform === props.detailInfo.platform" class="relative p-[16px] pb-[16px]">
+  <div v-if="props.currentPlatform === props.detailInfo.platform" class="relative">
     <div class="header">
       <div v-permission="['PROJECT_BUG:READ+UPDATE']" class="header-action">
         <a-button type="text" @click="contentEditAble = !contentEditAble">
diff --git a/frontend/src/views/bug-management/components/bugHistoryTab.vue b/frontend/src/views/bug-management/components/bugHistoryTab.vue
index 5e0f801ecf..e50c2ffdd1 100644
--- a/frontend/src/views/bug-management/components/bugHistoryTab.vue
+++ b/frontend/src/views/bug-management/components/bugHistoryTab.vue
@@ -1,5 +1,5 @@
 <template>
-  <ms-base-table class="mt-[16px]" v-bind="propsRes" v-on="propsEvent">
+  <ms-base-table v-bind="propsRes" v-on="propsEvent">
     <template #changeNumber="{ record }">
       <span>{{ record.id }}</span>
       <MsTag v-if="record.latest" size="small" class="ml-2">{{ t('bugManagement.history.current') }}</MsTag>
diff --git a/frontend/src/views/bug-management/components/commentTab.vue b/frontend/src/views/bug-management/components/commentTab.vue
index 41c5ef85fe..8b5a81ecb9 100644
--- a/frontend/src/views/bug-management/components/commentTab.vue
+++ b/frontend/src/views/bug-management/components/commentTab.vue
@@ -1,22 +1,14 @@
 <template>
-  <div class="pl-2 pt-4">
-    <a-scrollbar
-      :style="{
-        overflow: 'auto',
-        height: 'calc(100vh - 236px)',
-        width: '100%',
-      }"
-    >
-      <MsEmpty v-if="commentList.length === 0" />
-      <MsComment
-        v-else
-        :preview-url="EditorPreviewFileUrl"
-        :comment-list="commentList"
-        :upload-image="handleUploadImage"
-        @delete="handleDelete"
-        @update-or-add="handleUpdate"
-      />
-    </a-scrollbar>
+  <div>
+    <MsEmpty v-if="commentList.length === 0" />
+    <MsComment
+      v-else
+      :preview-url="EditorPreviewFileUrl"
+      :comment-list="commentList"
+      :upload-image="handleUploadImage"
+      @delete="handleDelete"
+      @update-or-add="handleUpdate"
+    />
   </div>
 </template>
 
diff --git a/frontend/src/views/case-management/caseManagementFeature/components/caseDetailDrawer.vue b/frontend/src/views/case-management/caseManagementFeature/components/caseDetailDrawer.vue
index 3ebbed74ac..4977d90318 100644
--- a/frontend/src/views/case-management/caseManagementFeature/components/caseDetailDrawer.vue
+++ b/frontend/src/views/case-management/caseManagementFeature/components/caseDetailDrawer.vue
@@ -90,79 +90,63 @@
     <template #default="{ loading }">
       <div
         ref="wrapperRef"
-        :class="[`${!commentInputIsActive ? 'h-[calc(100%-72px)]' : 'h-[calc(100%-286px)]'}`, 'bg-white']"
+        :class="[`${!commentInputIsActive ? 'h-[calc(100%-118px)]' : 'h-[calc(100%-338px)]'}`, 'bg-white']"
       >
+        <div class="header relative h-[48px] pl-2">
+          <MsTab
+            v-model:active-key="activeTab"
+            :content-tab-list="tabSetting"
+            :get-text-func="getTotal"
+            class="no-content relative border-b"
+            @change="clickMenu"
+          />
+          <span class="absolute bottom-0 right-4 top-4 my-auto text-[var(--color-text-2)]" @click="showMenuSetting">{{
+            t('caseManagement.featureCase.detailDisplaySetting')
+          }}</span>
+        </div>
         <MsSplitBox :size="0.8" :max="0.7" :min="0.6" direction="horizontal" expand-direction="right">
           <template #first>
             <div class="leftWrapper h-full">
-              <div class="header h-[50px]">
-                <a-menu mode="horizontal" :default-selected-keys="[activeTab || 'detail']" @menu-item-click="clickMenu">
-                  <a-menu-item v-for="tab of tabSetting" :key="tab.key">
-                    <div class="flex items-center">
-                      <span>{{ t(tab.title) }}</span>
-                      <a-badge
-                        v-if="getTotal(tab.key)"
-                        class="ml-1"
-                        :class="activeTab === tab.key ? 'active' : ''"
-                        :text="getTotal(tab.key)"
-                      /> </div
-                  ></a-menu-item>
-                  <a-menu-item key="setting">
-                    <span @click="showMenuSetting">{{
-                      t('caseManagement.featureCase.detailDisplaySetting')
-                    }}</span></a-menu-item
-                  >
-                </a-menu>
+              <div class="leftContent mt-4 w-full pl-[16px] pr-[24px]">
+                <template v-if="activeTab === 'detail'">
+                  <TabDetail
+                    ref="tabDetailRef"
+                    :form="detailInfo"
+                    :allow-edit="true"
+                    :form-rules="formItem"
+                    :form-api="fApi"
+                    @update-success="updateSuccess"
+                  />
+                </template>
+                <template v-if="activeTab === 'requirement'">
+                  <TabDemand :case-id="props.detailId" />
+                </template>
+                <template v-if="activeTab === 'case'">
+                  <TabCaseTable :case-id="props.detailId" />
+                </template>
+                <template v-if="activeTab === 'bug'">
+                  <TabDefect :case-id="props.detailId" />
+                </template>
+                <template v-if="activeTab === 'dependency'">
+                  <TabDependency :case-id="props.detailId" />
+                </template>
+                <template v-if="activeTab === 'caseReview'">
+                  <TabCaseReview :case-id="props.detailId" />
+                </template>
+                <template v-if="activeTab === 'testPlan'">
+                  <TabTestPlan />
+                </template>
+                <template v-if="activeTab === 'comments'">
+                  <TabComment ref="commentRef" :case-id="props.detailId" />
+                </template>
+                <template v-if="activeTab === 'changeHistory'">
+                  <TabChangeHistory :case-id="props.detailId" />
+                </template>
               </div>
-              <keep-alive>
-                <div class="leftContent mt-4 w-full px-[24px]">
-                  <a-scrollbar
-                    :style="{
-                      overflow: 'auto',
-                      height: 'calc(100vh - 190px)',
-                    }"
-                  >
-                    <template v-if="activeTab === 'detail'">
-                      <TabDetail
-                        ref="tabDetailRef"
-                        :form="detailInfo"
-                        :allow-edit="true"
-                        :form-rules="formItem"
-                        :form-api="fApi"
-                        @update-success="updateSuccess"
-                      />
-                    </template>
-                    <template v-if="activeTab === 'requirement'">
-                      <TabDemand :case-id="props.detailId" />
-                    </template>
-                    <template v-if="activeTab === 'case'">
-                      <TabCaseTable :case-id="props.detailId" />
-                    </template>
-                    <template v-if="activeTab === 'bug'">
-                      <TabDefect :case-id="props.detailId" />
-                    </template>
-                    <template v-if="activeTab === 'dependency'">
-                      <TabDependency :case-id="props.detailId" />
-                    </template>
-                    <template v-if="activeTab === 'caseReview'">
-                      <TabCaseReview :case-id="props.detailId" />
-                    </template>
-                    <template v-if="activeTab === 'testPlan'">
-                      <TabTestPlan />
-                    </template>
-                    <template v-if="activeTab === 'comments'">
-                      <TabComment ref="commentRef" :case-id="props.detailId" />
-                    </template>
-                    <template v-if="activeTab === 'changeHistory'">
-                      <TabChangeHistory :case-id="props.detailId" />
-                    </template>
-                  </a-scrollbar>
-                </div>
-              </keep-alive>
             </div>
           </template>
           <template #second>
-            <div class="rightWrapper h-full p-[24px]">
+            <div class="rightWrapper h-full p-4">
               <a-skeleton v-if="loading" class="w-full" :loading="loading" :animation="true">
                 <a-space direction="vertical" class="w-[100%]" size="large">
                   <a-skeleton-line :rows="14" :line-height="30" :line-spacing="30" />
@@ -263,6 +247,7 @@
   import MsFormCreate from '@/components/pure/ms-form-create/ms-form-create.vue';
   import type { FormItem, FormRuleItem } from '@/components/pure/ms-form-create/types';
   import MsSplitBox from '@/components/pure/ms-split-box/index.vue';
+  import MsTab from '@/components/pure/ms-tab/index.vue';
   import type { MsPaginationI } from '@/components/pure/ms-table/type';
   import MsTag from '@/components/pure/ms-tag/ms-tag.vue';
   import caseLevel from '@/components/business/ms-case-associate/caseLevel.vue';
@@ -347,8 +332,9 @@
 
   // const tabSetting = ref<TabItemType[]>([...tabSettingList.value]);
   const tabSetting = ref<TabItemType[]>([]);
-  const activeTab = ref<string | number>('detail');
-  function clickMenu(key: string | number) {
+  const activeTab = ref<string>('detail');
+
+  function clickMenu(key: string) {
     activeTab.value = key;
     featureCaseStore.setActiveTab(key);
     switch (activeTab.value) {
@@ -642,39 +628,38 @@
 
   const tabDefaultSettingList: TabItemType[] = [
     {
-      key: 'detail',
-      title: 'caseManagement.featureCase.detail',
+      value: 'detail',
+      label: t('caseManagement.featureCase.detail'),
       canHide: false,
       isShow: true,
     },
     {
-      key: 'case',
-      title: 'caseManagement.featureCase.case',
-      canHide: true,
-
-      isShow: true,
-    },
-    {
-      key: 'dependency',
-      title: 'caseManagement.featureCase.dependency',
+      value: 'case',
+      label: t('caseManagement.featureCase.case'),
       canHide: true,
       isShow: true,
     },
     {
-      key: 'caseReview',
-      title: 'caseManagement.featureCase.caseReview',
+      value: 'dependency',
+      label: t('caseManagement.featureCase.dependency'),
       canHide: true,
       isShow: true,
     },
     {
-      key: 'comments',
-      title: 'caseManagement.featureCase.comments',
+      value: 'caseReview',
+      label: t('caseManagement.featureCase.caseReview'),
       canHide: true,
       isShow: true,
     },
     {
-      key: 'changeHistory',
-      title: 'caseManagement.featureCase.changeHistory',
+      value: 'comments',
+      label: t('caseManagement.featureCase.comments'),
+      canHide: true,
+      isShow: true,
+    },
+    {
+      value: 'changeHistory',
+      label: t('caseManagement.featureCase.changeHistory'),
       canHide: true,
       isShow: true,
     },
@@ -683,14 +668,14 @@
   const moduleTabMap: Record<string, TabItemType[]> = {
     bugManagement: [
       {
-        key: 'requirement',
-        title: 'caseManagement.featureCase.requirement',
+        value: 'requirement',
+        label: t('caseManagement.featureCase.requirement'),
         canHide: true,
         isShow: true,
       },
       {
-        key: 'bug',
-        title: 'caseManagement.featureCase.bug',
+        value: 'bug',
+        label: t('caseManagement.featureCase.bug'),
         canHide: true,
         isShow: true,
       },
diff --git a/frontend/src/views/case-management/caseManagementFeature/components/caseTable.vue b/frontend/src/views/case-management/caseManagementFeature/components/caseTable.vue
index d6f86c2bfa..b96688a064 100644
--- a/frontend/src/views/case-management/caseManagementFeature/components/caseTable.vue
+++ b/frontend/src/views/case-management/caseManagementFeature/components/caseTable.vue
@@ -400,7 +400,7 @@
 <script setup lang="ts">
   import { ref } from 'vue';
   import { useRoute, useRouter } from 'vue-router';
-  import { Message, TableChangeExtra, TableColumnData, TableData } from '@arco-design/web-vue';
+  import { Message, TableChangeExtra, TableData } from '@arco-design/web-vue';
 
   import { CustomTypeMaps, MsAdvanceFilter } from '@/components/pure/ms-advance-filter';
   import { FilterFormItem, FilterResult, FilterType } from '@/components/pure/ms-advance-filter/type';
diff --git a/frontend/src/views/case-management/caseManagementFeature/components/tabContent/settingDrawer.vue b/frontend/src/views/case-management/caseManagementFeature/components/tabContent/settingDrawer.vue
index 353349ce9f..16c3df2566 100644
--- a/frontend/src/views/case-management/caseManagementFeature/components/tabContent/settingDrawer.vue
+++ b/frontend/src/views/case-management/caseManagementFeature/components/tabContent/settingDrawer.vue
@@ -31,8 +31,8 @@
 
     <div class="ms-table-column-seletor">
       <div class="flex-col">
-        <div v-for="item in nonCloseColumn" :key="item.key" class="column-item">
-          <div>{{ t(item.title) }}</div>
+        <div v-for="item in nonCloseColumn" :key="item.value" class="column-item">
+          <div>{{ t(item.label) }}</div>
           <a-switch v-model="item.isShow" disabled size="small" type="line" @change="handleSwitchChange" />
         </div>
       </div>
@@ -41,26 +41,15 @@
           t('project.environmental.nonClose')
         }}</span></a-divider
       >
-      <!-- <div>
-      <div class="itemTab">
-        <span>{{ t('caseManagement.featureCase.detail') }}</span>
-        <a-switch v-model="detailEnable" size="small" :disabled="true" type="line" />
-      </div>
-      <a-divider orientation="center" class="non-sort"
-        ><span class="one-line-text text-xs text-[var(--color-text-4)]">{{
-          t('caseManagement.featureCase.nonClosableTab')
-        }}</span></a-divider
-      >
-    </div> -->
       <VueDraggable
         v-model="couldCloseColumn"
         class="ms-assertion-body-left"
         ghost-class="ghost"
         handle=".column-drag-item"
       >
-        <div v-for="element in couldCloseColumn" :key="element.key" class="column-drag-item">
+        <div v-for="element in couldCloseColumn" :key="element.value" class="column-drag-item">
           <div class="flex w-[90%] items-center">
-            <span class="ml-[8px]">{{ t(element.title) }}</span>
+            <span class="ml-[8px]">{{ t(element.label) }}</span>
           </div>
           <a-switch v-model="element.isShow" size="small" type="line" @change="handleSwitchChange" />
         </div>
@@ -123,7 +112,7 @@
 
   const loadTab = async () => {
     const res = (await featureCaseStore.getContentTabList()) || [];
-    nonCloseColumn.value = res.filter((item) => !item.canHide && item.key !== 'SETTING');
+    nonCloseColumn.value = res.filter((item) => !item.canHide);
     couldCloseColumn.value = res.filter((item) => item.canHide);
   };
 
diff --git a/frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabDetail.vue b/frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabDetail.vue
index a4ba0a2f15..8997dcbbc6 100644
--- a/frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabDetail.vue
+++ b/frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabDetail.vue
@@ -113,40 +113,6 @@
           {{ t('common.save') }}
         </a-button></div
       >
-      <!-- <a-form-item v-if="props.allowEdit" field="attachment" :label="t('caseManagement.featureCase.attachment')">
-        <div class="flex flex-col">
-          <div class="mb-1">
-            <a-dropdown position="tr" trigger="hover">
-              <a-button v-permission="['FUNCTIONAL_CASE:READ+UPDATE']" type="outline">
-                <template #icon> <icon-plus class="text-[14px]" /> </template
-                >{{ t('system.orgTemplate.addAttachment') }}</a-button
-              >
-              <template #content>
-                <a-upload
-                  ref="uploadRef"
-                  v-model:file-list="fileList"
-                  :auto-upload="false"
-                  :show-file-list="false"
-                  :before-upload="beforeUpload"
-                >
-                  <template #upload-button>
-                    <a-button type="text" class="!text-[var(--color-text-1)]">
-                      <icon-upload />{{ t('caseManagement.featureCase.uploadFile') }}
-                    </a-button>
-                  </template>
-                </a-upload>
-                <a-button type="text" class="!text-[var(--color-text-1)]" @click="associatedFile">
-                  <MsIcon type="icon-icon_link-copy_outlined" size="16" />
-                  {{ t('caseManagement.featureCase.associatedFile') }}
-                </a-button>
-              </template>
-            </a-dropdown>
-          </div>
-          <div class="!hover:bg-[rgb(var(--primary-1))] !text-[var(--color-text-4)]">
-            {{ t('system.orgTemplate.addAttachmentTip') }}
-          </div>
-        </div>
-      </a-form-item> -->
       <div v-permission="['FUNCTIONAL_CASE:READ+UPDATE']">
         <AddAttachment v-model:file-list="fileList" multiple @change="handleChange" @link-file="associatedFile" />
       </div>
@@ -504,13 +470,14 @@
             if (valid === true) {
               confirmLoading.value = true;
               await updateCaseRequest(getParams());
+              confirmLoading.value = false;
               Message.success(t('caseManagement.featureCase.editSuccess'));
               isEditPreposition.value = false;
               emit('updateSuccess');
             }
           });
         } catch (error) {
-          // console.log(error);
+          console.log(error);
         } finally {
           confirmLoading.value = false;
         }
@@ -665,7 +632,6 @@
 
   async function restartUpload() {
     await sleep(300);
-    console.log('ooo');
     fileListRef.value?.startUpload();
   }
 
@@ -675,6 +641,7 @@
     fileId: '',
     local: true,
   });
+
   function transferFileHandler(item: MsFileItem) {
     activeTransferFileParams.value = {
       projectId: currentProjectId.value,
diff --git a/frontend/src/views/project-management/environmental/components/AllParamBox.vue b/frontend/src/views/project-management/environmental/components/AllParamBox.vue
index 8bad5b6db2..75b4e06702 100644
--- a/frontend/src/views/project-management/environmental/components/AllParamBox.vue
+++ b/frontend/src/views/project-management/environmental/components/AllParamBox.vue
@@ -37,7 +37,16 @@
   const activeKey = ref('requestHeader');
   const GlobalVariable = ref<EnvConfigItem[]>([]);
   const { t } = useI18n();
-  const { setIsSave } = useLeaveUnSaveTip();
+
+  const leaveTitle = 'common.tip';
+  const leaveContent = 'apiTestDebug.unsavedLeave';
+
+  const { setIsSave } = useLeaveUnSaveTip({
+    leaveTitle,
+    leaveContent,
+    tipType: 'warning',
+  });
+
   setIsSave(true);
   const canSave = ref(false);
 
diff --git a/frontend/src/views/setting/system/authorizedManagement/index.vue b/frontend/src/views/setting/system/authorizedManagement/index.vue
index 5ec5094703..c7aaa0e16c 100644
--- a/frontend/src/views/setting/system/authorizedManagement/index.vue
+++ b/frontend/src/views/setting/system/authorizedManagement/index.vue
@@ -81,7 +81,7 @@
             :label="t('system.authorized.license')"
             field="licenseCode"
             asterisk-position="end"
-            required
+            :rules="[{ required: true, message: t('system.authorized.LicenseIsRequired') }]"
             :validate-trigger="['input']"
           >
             <MsUpload