还原-需求方要测试

src/views/portal/course/Index.vue

@@ -283,7 +283,7 @@
           </div> -->
           <!-- 内容导航 -->
           <div class="topNav" v-if="!newData">
-            <div class="search-div nav" style="flex: 1;height: auto;">
+            <div class="search-div nav" style="height: 100px;flex: 1;">
               <div @click="handleTypeAllClick(1)" class="option-item" style="font-weight: bold;position: relative;margin-right: 20px;" :class="{ 'option-active': ctypeTagAll }">
                 <a>全部</a>
                 <span :class="ctypeTagAll ? 'nav-bottbor' : ''"></span>
@@ -312,7 +312,7 @@
               </a>
               <!-- 修改热点标签区域 -->
               <div style="margin-top:10px;flex: 1;">
-<!--                <div class="search-item-type" style="padding-top: 2px; float: left;">
+                <!--                <div class="search-item-type" style="padding-top: 2px; float: left;">
                                   <span class="item-title" style="padding-right: 5px;">热点标签:</span>
                                 </div>-->
                 <!-- 修改热点标签容器，支持换行 -->
@@ -339,7 +339,7 @@
                 </div>
               </div>
             </div>
-<!--            <div id="fixd-box" class="upload" style="margin-left: 26px;">
+            <!--            <div id="fixd-box" class="upload" style="margin-left: 26px;">
                           <div v-if="identity == 2 || identity == 3 || identity == 5">
                             <div class="portal-model-btn pointer" style="margin-bottom: 0px;height: 100px;line-height: 100px;"
                               @click="toNeedCourse">
@@ -1036,7 +1036,7 @@ export default {
       this.searchData(1);
     },
     // 清除
-handleClearTags() {
+    handleClearTags() {
       //清空所有的条件
       this.keyword = '';
       this.ctypeList.forEach(item => {
@@ -1062,7 +1062,7 @@ handleClearTags() {
       this.navTitle = [];
 
       this.searchData();
-},
+    },
     // 导航切换(录播课，线下课，学习项目)
     handleTypeClick(item, list) {
       item.checked = !item.checked;
@@ -1856,9 +1856,6 @@ handleClearTags() {
 .topNav {
   display: flex;
   margin-bottom: 20px;
-  height: auto;
-  min-height: 80px;
-  align-items: center;
 
   .nav {
     display: flex;
@@ -2336,8 +2333,8 @@ handleClearTags() {
   margin-left: 15px;
   font-size: 14px;
   color: #3d3d3d;
-  //cursor: pointer;
+  cursor: pointer;
-  //position: relative;
+  position: relative;
 }
 
 .uxicon {
@@ -2468,8 +2465,6 @@ handleClearTags() {
     background: #fff;
     padding: 10px 25px;
     border-radius: 8px;
-    height: auto;
-    min-height: 60px;
 
     ::v-deep .el-input {
       width: 420px;
@@ -2593,8 +2588,7 @@ handleClearTags() {
   color: #3d3d3d;
   display: inline-block;
   font-size: 14px;
-  //margin: 0px 15px;
+  margin: 0px 15px;
-  font-weight: normal;
 }
 
 .option-border {
@@ -2608,7 +2602,7 @@ handleClearTags() {
 .option-active {
   color: #387DF7;
 }
-  /* 项目简介 方法一：外部 CSS 类 */
+/* 项目简介 方法一：外部 CSS 类 */
 ::v-deep.el-dialog {
   border-radius: 3% 3% 1% 1%;
   padding: 0;
@@ -2636,16 +2630,10 @@ handleClearTags() {
 /* ---end--- */
 /* ---标签管理 added by zhengsongbo on 2025-08-01--- */
 .search-div.nav {
-  display: flex;
+  display: block;
-  flex-direction: column;
-  height: auto;
-  min-height: 100px;
-}
-.hot-tags-area {
   width: 100%;
-  margin-top: 15px;
+  clear: both;
 }
-
 .option-item {
   margin: 0px 5px;
 }
@@ -2684,7 +2672,7 @@ a.custom2 {
 
 .hot-tags-container {
   display: inline-block;
-  //white-space: nowrap;
+  white-space: nowrap;
   overflow-x: auto;
   vertical-align: top;
 }
@@ -2717,6 +2705,16 @@ a.custom2 {
   color: #387DF7 !important; // 匹配时的蓝色
 }
 
+/* 添加热点标签容器样式，支持换行 */
+.hot-tags-wrapper {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 15px;
+  align-items: center;
+  padding-top: 2px;
+  //margin-left: 90px; /* 为"热点标签:"文本留出空间 */
+}
+
 /* 调整option-item样式以适应换行布局 */
 .option-item {
   position: relative;
@@ -2747,32 +2745,5 @@ a.custom2 {
     gap: 5px;
   }
 }
-
+/* ---end--- */
-.hot-tags-wrapper {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(120px, max-content));
-  gap: 15px 20px;
-  align-items: center;
-  justify-items: start;
-  width: 100%;
-  padding: 10px 0;
-}
-.hot-tags-wrapper .option-item {
-  position: relative;
-  cursor: pointer;
-  white-space: nowrap;
-  padding: 5px 10px;
-  text-align: center;
-}
-.course-tags {
-  margin: 5px 0;
-  min-height: 20px;
-}
-
-.course-tag-item {
-  color: #333333;
-}
-.course-tag-item[style*="color: #387DF7"] {
-  color: #387DF7 !important;
-}
 </style>