fix(测试跟踪): 功能用例编辑页标题过长展示问题

--bug=1024034 --user=宋昌昌 【测试跟踪】标题显示长度过短 https://www.tapd.cn/55049933/s/1346324

framework/sdk-parent/frontend/src/components/new-ui/MsInputTag.vue

@@ -178,11 +178,14 @@ export default {
   background: transparent;
   border: 0;
   color: #303133;
-  font-size: 12px;
-  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", Arial, sans-serif;
   outline: none;
   padding-left: 0;
-  width: 100px;
+  width: auto;
+  font-family: 'PingFang SC';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 14px;
+  margin-left: 12px;
 }
 
 .el-input-tag {
@@ -234,9 +237,11 @@ span.ms-top.el-tag.el-tag--info.el-tag--small.el-tag--light span{
   color: rgb(31, 35, 41);
 }
 
-:deep(.ms-top.el-tag .el-icon-close::before) {
-  font-size: 24px;
+:deep(.el-tag .el-icon-close::before) {
+  display: block;
+  font-size: 26px;
   position: relative;
-  top: -3px;
+  top: -15px;
+  left: -6px;
 }
 </style>

test-track/frontend/src/business/case/components/TestCaseEdit.vue

@@ -963,6 +963,7 @@ export default {
         this.casePublic = true;
       } else if (e === 4) {
         this.editableState = false;
+        this.$refs.otherInfo.caseActiveName = 'detail';
         this.loadTestCase();
         return;
       }

test-track/frontend/src/business/case/components/common/CaseRelationshipList.vue

@@ -22,7 +22,7 @@
         >
       </div>
     </div>
-    <div class="dep-list-wrap" v-if="expand">
+    <div class="dep-list-wrap" v-show="expand">
       <test-case-relationship-list
         v-if="resourceType === 'TEST_CASE'"
         :case-id="resourceId"
@@ -34,7 +34,7 @@
         ref="testCaseRelationshipList"
       />
     </div>
-    <div class="split" v-else></div>
+    <div class="split" v-show="!expand"></div>
   </div>
 </template>
 

test-track/frontend/src/business/case/components/common/CaseVersionHistory.vue

@@ -1,7 +1,8 @@
 <template>
   <div class="version-history-box">
     <el-popover
-      placement="bottom-end"
+      :append-to-body="false"
+      placement="bottom-start"
       width="392"
       trigger="click"
       popper-class="version-popover"
@@ -589,7 +590,7 @@ export default {
 </style>
 <style>
 .version-popover {
-  left: 215px !important;
+  position: relative;
   padding: 0px !important;
 }
 </style>

test-track/frontend/src/business/case/components/head/TestCaseEditNameView.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="case-name">
-    <div v-if="isAdd || editableState" :class="'case-name'">
+    <div v-if="isAdd || editableState">
       {{ editableState ? $t('test_track.case.edit_case') : $t('test_track.case.create_case') }}
     </div>
     <div :class="isNameEdit ? 'name-input' : 'name-text'" v-else>
@@ -16,8 +16,12 @@
          />
       </span>
       <span v-else @click="handleNameClick">
-       {{ titleNum }}
-       {{ form.name }}
+        <el-tooltip :content="form.name" effect="dark" placement="bottom-start">
+          <span>
+            {{ titleNum }}
+            {{ form.name }}
+          </span>
+        </el-tooltip>
       </span>
     </div>
   </div>
@@ -77,19 +81,20 @@ export default {
 
 <style scoped lang="scss">
 @import "@/business/style/index.scss";
-
 .name-input {
-  width: 80%;
+  min-width: px2rem(900);
 }
+
 .name-text:hover {
   cursor: pointer;
   background: rgba(31, 35, 41, 0.1);
   border-radius: 4px;
 }
-.name-text {
-  max-width: 800px;
-}
 
+.name-text {
+  width: auto;
+  padding-right: 0.5rem;
+}
 
 .input-error :deep(.el-input__inner) {
   border-color: #F56C6C;
@@ -112,7 +117,7 @@ export default {
   overflow: hidden;
   /* 文本超出的部分打点显示 */
   text-overflow: ellipsis;
-  padding-right: 0.5rem;
+  max-width: 85%;
 }
 
 </style>

test-track/frontend/src/business/case/components/richtext/FormRichTextItem.vue

@@ -55,6 +55,7 @@ export default {
   box-sizing: border-box;
   border-radius: 4px;
   box-shadow: none !important;
+  border: 1px solid #bbbfc4!important;
 }
 :deep(.v-note-show) {
   min-height: 64px;