fix(测试跟踪): 脑图全屏问题及部分交互显示问题

2023-02-10 19:22:48 +08:00 · 2023-02-10 19:22:48 +08:00 · f9f05d1423
parent 08123f5cf6
commit f9f05d1423
15 changed files with 83 additions and 35 deletions
--- a/framework/sdk-parent/frontend/src/assets/module/figma/icon_add_outlined_white.svg
+++ b/framework/sdk-parent/frontend/src/assets/module/figma/icon_add_outlined_white.svg
@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M6.4165 6.41602V1.53992C6.4165 1.4099 6.43004 1.36276 6.45546 1.31523C6.48088 1.26769 6.51818 1.23039 6.56571 1.20497C6.61324 1.17955 6.66039 1.16602 6.7904 1.16602H7.20927C7.33928 1.16602 7.38643 1.17955 7.43396 1.20497C7.48149 1.23039 7.51879 1.26769 7.54421 1.31523C7.56963 1.36276 7.58317 1.4099 7.58317 1.53992V6.41602H12.4593C12.5893 6.41602 12.6364 6.42955 12.684 6.45497C12.7315 6.48039 12.7688 6.51769 12.7942 6.56523C12.8196 6.61276 12.8332 6.6599 12.8332 6.78992V7.20878C12.8332 7.3388 12.8196 7.38594 12.7942 7.43347C12.7688 7.481 12.7315 7.51831 12.684 7.54373C12.6364 7.56915 12.5893 7.58268 12.4593 7.58268H7.58317V12.4588C7.58317 12.5888 7.56963 12.6359 7.54421 12.6835C7.51879 12.731 7.48149 12.7683 7.43396 12.7937C7.38643 12.8191 7.33928 12.8327 7.20927 12.8327H6.7904C6.66039 12.8327 6.61324 12.8191 6.56571 12.7937C6.51818 12.7683 6.48088 12.731 6.45546 12.6835C6.43004 12.6359 6.4165 12.5888 6.4165 12.4588V7.58268H1.5404C1.41039 7.58268 1.36324 7.56915 1.31571 7.54373C1.26818 7.51831 1.23088 7.481 1.20546 7.43347C1.18004 7.38594 1.1665 7.3388 1.1665 7.20878V6.78992C1.1665 6.6599 1.18004 6.61276 1.20546 6.56523C1.23088 6.51769 1.26818 6.48039 1.31571 6.45497C1.36324 6.42955 1.41039 6.41602 1.5404 6.41602H6.4165Z" fill="white"/>
+</svg>
--- a/framework/sdk-parent/frontend/src/assets/module/figma/icon_download_outlined.svg
+++ b/framework/sdk-parent/frontend/src/assets/module/figma/icon_download_outlined.svg
@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M12.25 10.7923V12.2507C12.25 12.5728 11.9888 12.834 11.6667 12.834H2.33333C2.01117 12.834 1.75 12.5728 1.75 12.2507V10.7923C1.75 10.6312 1.88058 10.5007 2.04167 10.5007H2.625C2.78608 10.5007 2.91667 10.6312 2.91667 10.7923V11.6673H11.0833V10.7923C11.0833 10.6312 11.2139 10.5007 11.375 10.5007H11.9583C12.1194 10.5007 12.25 10.6312 12.25 10.7923ZM7.58334 8.18815L9.33944 6.43205C9.45334 6.31814 9.63802 6.31814 9.75192 6.43205L10.1644 6.84453C10.2783 6.95843 10.2783 7.1431 10.1644 7.257L7.27705 10.1444C7.2201 10.2013 7.14545 10.2298 7.07081 10.2298C6.99616 10.2298 6.92152 10.2013 6.86457 10.1444L3.97722 7.257C3.86331 7.1431 3.86331 6.95843 3.97722 6.84453L4.38969 6.43205C4.5036 6.31814 4.68827 6.31814 4.80217 6.43205L6.41667 8.04654V1.75065C6.41667 1.58957 6.54725 1.45898 6.70834 1.45898H7.29167C7.45275 1.45898 7.58334 1.58957 7.58334 1.75065V8.18815Z" fill="#1F2329"/>
+</svg>
--- a/framework/sdk-parent/frontend/src/assets/module/figma/icon_upload_outlined.svg
+++ b/framework/sdk-parent/frontend/src/assets/module/figma/icon_upload_outlined.svg
@ -1,3 +1,3 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M21 18.5V21C21 21.5523 20.5523 22 20 22H4C3.44772 22 3 21.5523 3 21V18.5C3 18.2238 3.22386 18 3.5 18H4.5C4.77614 18 5 18.2238 5 18.5V20H19V18.5C19 18.2238 19.2239 18 19.5 18H20.5C20.7761 18 21 18.2238 21 18.5ZM13 6.49994L16.0105 9.51041C16.2057 9.70567 16.5223 9.70567 16.7176 9.51041L17.4247 8.8033C17.6199 8.60804 17.6199 8.29146 17.4247 8.09619L12.4749 3.14645C12.3773 3.04882 12.2493 3 12.1214 3C11.9934 3 11.8655 3.04882 11.7678 3.14645L6.81808 8.09619C6.62282 8.29146 6.62282 8.60804 6.81808 8.8033L7.52519 9.51041C7.72045 9.70567 8.03703 9.70567 8.2323 9.51041L11 6.7427V17.5357C11 17.8118 11.2239 18.0357 11.5 18.0357H12.5C12.7761 18.0357 13 17.8118 13 17.5357V6.49994Z" fill="#1F2329"/>
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M12.25 10.7917V12.25C12.25 12.5722 11.9888 12.8333 11.6667 12.8333H2.33333C2.01117 12.8333 1.75 12.5722 1.75 12.25V10.7917C1.75 10.6306 1.88058 10.5 2.04167 10.5H2.625C2.78608 10.5 2.91667 10.6306 2.91667 10.7917V11.6667H11.0833V10.7917C11.0833 10.6306 11.2139 10.5 11.375 10.5H11.9583C12.1194 10.5 12.25 10.6306 12.25 10.7917ZM7.58334 3.79163L9.33944 5.54774C9.45334 5.66164 9.63802 5.66164 9.75192 5.54774L10.1644 5.13526C10.2783 5.02136 10.2783 4.83668 10.1644 4.72278L7.27705 1.83543C7.2201 1.77848 7.14545 1.75 7.07081 1.75C6.99616 1.75 6.92152 1.77848 6.86457 1.83543L3.97722 4.72278C3.86331 4.83668 3.86331 5.02136 3.97722 5.13526L4.38969 5.54774C4.5036 5.66164 4.68827 5.66164 4.80217 5.54774L6.41667 3.93324V10.2291C6.41667 10.3902 6.54725 10.5208 6.70834 10.5208H7.29167C7.45275 10.5208 7.58334 10.3902 7.58334 10.2291V3.79163Z" fill="#1F2329"/>
 </svg>
--- a/framework/sdk-parent/frontend/src/business/app-layout/index.vue
+++ b/framework/sdk-parent/frontend/src/business/app-layout/index.vue
@ -17,7 +17,7 @@

    <el-container>
      <el-aside
-        :class="isCollapse ? 'ms-aside': 'ms-aside-collapse-open'"
+        :class="[isCollapse ? 'ms-aside': 'ms-aside-collapse-open', isFullScreen ? 'is-fullscreen' : '']"
        class="ms-left-aside"
        :style="isFixed ? 'opacity:100%; position: relative;z-index: 666;': 'opacity: 95%;position: fixed'"
        @mouseenter.native="collapseOpen"
@ -72,7 +72,8 @@ export default {
      headerHeight: "0px",
      isFixed: false,
      sideTheme: "",
-      sysTitle: undefined
+      sysTitle: undefined,
+      isFullScreen: false,
    };
  },
  computed: {
@ -109,6 +110,13 @@ export default {

    this.isFixed = localStorage.getItem('app-fixed') === 'true' || false;
    this.isCollapse = this.isFixed === true ? false : true;
+
+    this.$EventBus.$on("toggleFullScreen", (param) => {
+      this.isFullScreen = param
+    });
+  },
+  destroyed() {
+    this.$EventBus.$off("toggleFullScreen");
  },
  // 提供可注入子组件属性
  provide() {
@ -328,4 +336,8 @@ export default {
 .ms-menu-pin:hover {
  cursor: pointer;
 }
+
+.is-fullscreen {
+  display: none;
+}
 </style>
--- a/framework/sdk-parent/frontend/src/components/ModuleTrashButton.vue
+++ b/framework/sdk-parent/frontend/src/components/ModuleTrashButton.vue
@ -57,7 +57,6 @@ export default {
 }

 .recycle:hover {
-  color: #6d317c;
  cursor: pointer;
 }

--- a/framework/sdk-parent/frontend/src/components/MsNewUiTableAdvSearch.vue
+++ b/framework/sdk-parent/frontend/src/components/MsNewUiTableAdvSearch.vue
@ -357,6 +357,7 @@ export default {
  height: 26px;
  width: 112px;
  border-radius: 4px;
+  float: left;
 }

 :deep(span.el-select__tags-text) {
--- a/framework/sdk-parent/frontend/src/components/module/ModulePublicButton.vue
+++ b/framework/sdk-parent/frontend/src/components/module/ModulePublicButton.vue
@ -4,7 +4,6 @@
      <svg-icon icon-class="icon_folder-share" style="width: 1.3em;height: 1.3em;position: relative;top: 4px;left: 1px;margin-right: 9px;"/>
      <span style="margin-right: 12px;">{{ $t('project.case_public') }}</span>
      <span style="color: #8F959E">{{ '(' + publicTotal + ')' }}</span>
-      <svg-icon icon-class="icon_arrow-right_outlined_1" style="float: right;position: relative;top: 5px;width: 1.3em;height: 1.3em;"/>
    </div>
  </div>
 </template>
@ -73,6 +72,7 @@ export default {
 .to-public {
  width: auto;
  border-radius: 4px;
+  display: flex;
 }

 .to-public:hover {
--- a/framework/sdk-parent/frontend/src/components/new-ui/MsSingleTag.vue
+++ b/framework/sdk-parent/frontend/src/components/new-ui/MsSingleTag.vue
@ -1,5 +1,5 @@
 <template>
-  <el-tag size="mini" class="status-label">{{ content }}</el-tag>
+  <el-tag size="mini" class="status-label">{{ content | ellipsis}}</el-tag>
 </template>

 <script>
@ -9,6 +9,15 @@ export default {
    content: {
      type: String
    }
+  },
+  filters: {
+    ellipsis: (value) => {
+      if (value.length > 7) {
+        return value.substring(0, 7) + "...";
+      } else {
+        return value;
+      }
+    }
  }
 }
 </script>
--- a/framework/sdk-parent/frontend/src/components/new-ui/MsTableAdvSearch.vue
+++ b/framework/sdk-parent/frontend/src/components/new-ui/MsTableAdvSearch.vue
@ -26,7 +26,7 @@
      <template v-slot:footer>
        <div class="dialog-footer" style="margin-top: 30px">
          <el-button size="small" @click="reset">{{ $t('commons.adv_search.reset') }}</el-button>
-          <el-button size="small" type="primary" @click="search">{{ $t('commons.adv_search.search') }}</el-button>
+          <el-button size="small" type="primary" @click="search" class="custom-btn">{{ $t('commons.adv_search.search') }}</el-button>
        </div>
      </template>
    </el-dialog>
@ -314,6 +314,19 @@ export default {
 }
 </style>

+<style lang="scss">
+.adv-dialog {
+  .el-dialog__header{
+    text-align: left!important;
+  }
+  .el-dialog__body {
+    text-align: left!important;
+  }
+  button.el-button.custom-btn.el-button--primary.el-button--small {
+    color: #FFFFFF!important;
+  }
+}
+</style>
 <style scoped>

 .dialog-footer {
@ -478,7 +491,6 @@ span.condition-num {
  font-size: 14px;
  line-height: 22px;
  text-align: center;
-  color: #1F2329;
 }

 :deep(.el-button--small span) {
--- a/test-track/frontend/src/business/TestTrack.vue
+++ b/test-track/frontend/src/business/TestTrack.vue
@ -118,7 +118,7 @@ button.el-button.el-button--default.el-button--small {
 }

 button.el-button.el-button--default.el-button--small.el-button--primary {
-  color: #FFFFFF;
+  color: #FFFFFF!important;
 }

 button.el-button.el-button--default.el-button--small.el-button--danger {
@ -198,12 +198,14 @@ button.el-button.el-button--default.el-button--small {
  color: #1F2329;
 }

-button.el-button.el-button--default.el-button--small:hover{
-  color: #783887;
+button.el-button.el-button--default.el-button--small:hover {
+  color: #1F2329;
+  border-color: #DCDFE6;
+  background-color: whitesmoke;
 }

 button.el-button.el-button--default.el-button--small.el-button--primary {
-  color: #FFFFFF;
+  color: #FFFFFF!important;
 }

 button.el-button.el-button--default.el-button--small.el-button--danger {
@ -217,6 +219,7 @@ button.el-button.el-button--default.el-button--small.el-button--danger {

 .el-dialog__header {
  padding: 0px!important;
+  text-align: left!important;
 }

 .el-dialog__title {
--- a/test-track/frontend/src/business/case/TestCase.vue
+++ b/test-track/frontend/src/business/case/TestCase.vue
@ -2,11 +2,13 @@
  <ms-container v-if="renderComponent" v-loading="loading">
    <!-- operate-button  -->
    <div class="top-btn-group-layout" v-if="!showPublicNode && !showTrashNode && !editable" style="margin-bottom: 16px">
-      <el-button size="small" icon="el-icon-plus" v-permission="['PROJECT_TRACK_CASE:READ+BATCH_EDIT']" @click="handleCreateCase" class="iconBtn" type="primary">
+      <el-button size="small" v-permission="['PROJECT_TRACK_CASE:READ+BATCH_EDIT']" @click="handleCreateCase" type="primary">
+        <svg-icon icon-class="icon_add_outlined_white"/>
        {{$t('test_track.case.create_case')}}
      </el-button>
-      <el-dropdown @command="handleImportCommand" placement="bottom-start" style="margin-left: 12px">
-        <el-button size="small" v-permission="['PROJECT_TRACK_CASE:READ+IMPORT']" class="btn-dropdown">
+      <el-dropdown @command="handleImportCommand" placement="bottom-start" style="margin-left: 12px" class="btn-dropdown">
+        <el-button size="small" v-permission="['PROJECT_TRACK_CASE:READ+IMPORT']">
+          <svg-icon icon-class="icon_upload_outlined"/>
          {{$t('commons.import')}}
        </el-button>
        <el-dropdown-menu slot="dropdown">
@ -22,6 +24,7 @@
      </el-dropdown>
      <el-dropdown @command="handleExportCommand" placement="bottom-start" style="margin-left: 12px" class="btn-dropdown">
        <el-button size="small" v-permission="['PROJECT_TRACK_CASE:READ+EXPORT']">
+          <svg-icon icon-class="icon_download_outlined"/>
          {{$t('commons.export')}}
        </el-button>
        <el-dropdown-menu slot="dropdown">
@ -708,6 +711,7 @@ export default {
    },
    toggleMinderFullScreen(isFullScreen) {
      this.enableAsideHidden = isFullScreen;
+
    },
    refreshPublic() {
      if (this.$refs.testCasePublicList) {
@ -833,20 +837,9 @@ export default {
  -webkit-filter: drop-shadow(0px 0px 0px #783887);
 }

-.iconBtn {
-  width: 98px;
-}
-
-:deep(.iconBtn i){
+:deep(.svg-icon) {
  position: relative;
-  top: -5px;
-  width: 12px;
-  height: 12px;
-}
-
-:deep(.iconBtn span) {
-  position: relative;
-  left: -7px;
+  top: 2px;
 }

 .export-model {
--- a/test-track/frontend/src/business/case/components/TestCaseList.vue
+++ b/test-track/frontend/src/business/case/components/TestCaseList.vue
@ -143,7 +143,7 @@
          prop="tags"
          :field="item"
          :fields-width="fieldsWidth"
-          min-width="80px"
+          max-width="180px"
          :show-overflow-tooltip="false"
          :label="$t('commons.tag')">
          <template v-slot:default="scope">
@ -151,7 +151,7 @@
                <div v-html="getTagToolTips(scope.row.tags)" slot="content"></div>
                <div class="oneLine">
                  <ms-single-tag
-                    v-for="(itemName, index) in scope.row.tags"
+                    v-for="(itemName, index) in parseColumnTag(scope.row.tags)"
                    :key="index"
                    type="success"
                    effect="plain"
@ -642,6 +642,16 @@ export default {
        return '';
      }
    },
+    parseColumnTag(tags) {
+      if (tags.length > 1) {
+        let parseTags = [];
+        parseTags.push(tags[0]);
+        parseTags.push("+" + (tags.length - 1));
+        return parseTags;
+      } else {
+        return tags;
+      }
+    },
    initConditionComponents() {
      this.condition.components = initTestCaseConditionComponents(this.condition, this.testCaseTemplate.customFields, this.trashEnable);
    },
@ -1222,7 +1232,6 @@ export default {
 .oneLine {
  overflow: hidden;
  white-space: nowrap;
-  text-overflow: ellipsis;
 }

 :deep(.el-table) {
--- a/test-track/frontend/src/business/case/components/case/CaseStepItem.vue
+++ b/test-track/frontend/src/business/case/components/case/CaseStepItem.vue
@ -397,6 +397,9 @@ i.el-icon-more:hover {
 .case-step-item-popover .delete-row .title {
  color: #f54a45;
 }
+.case-step-item-popover .delete-row {
+  background-color: transparent!important;
+}
 .opt-readonly {
  pointer-events: none;
  color: #fab6b6;
--- a/test-track/frontend/src/business/case/components/import/TestCaseCommonImportNew.vue
+++ b/test-track/frontend/src/business/case/components/import/TestCaseCommonImportNew.vue
@ -1,3 +1,4 @@
+
 <template>
  <el-dialog class="case-import" :title="name == 'excel' ? $t('test_track.case.import.import_by_excel') : $t('test_track.case.import.import_by_xmind')" :visible.sync="dialogVisible" @close="close" :width="'600px'">
    <div class="case-import-div">
--- a/test-track/frontend/src/business/common/minder/MsModuleMinder.vue
+++ b/test-track/frontend/src/business/common/minder/MsModuleMinder.vue
@ -315,7 +315,8 @@ export default {
      return importJson;
    },
    toggleMinderFullScreen(isFullScreen) {
-      this.$emit("toggleMinderFullScreen", isFullScreen)
+      this.$emit("toggleMinderFullScreen", isFullScreen);
+      this.$EventBus.$emit('toggleFullScreen', isFullScreen);
    }
  },
 }
@ -360,11 +361,10 @@ export default {
 .full-screen {
  position: fixed;
  top: 0;
-  left: var(--screen-left);
+  left: 0;
  right: 0;
  background: #fff;
  padding: 12px;
-  width: calc(100% - 50px);
  height: 100vh;
  z-index: 1999;
  max-height: calc(100vh);