feat(realtimeInfo): 添加概念新闻标签切换功能

src/pages/realtimeInfo/components/ConceptNewsView/index.vue

@@ -5,8 +5,17 @@
       <view class="time">近一个月热门</view>
     </view>
     <view class="tag-box">
-      <view v-for="(item, index) in topConceptList" :key="index" class="tag">
+      <!-- <view v-for="(item, index) in topConceptList" :key="index" class="tag">
         {{ item.content?.split("-")[1] }}
+      </view> -->
+      <view class="tag-box">
+        <view
+          v-for="(item, index) in topConceptList"
+          :class="['tag', { 'tag-active': active === index }]"
+          @click="handleClickTag(index, item)"
+        >
+          {{ item.content?.split("-")[1] }}
+        </view>
       </view>
     </view>
     <view class="tag-content">
@@ -31,6 +40,10 @@ const start_time = dayjs().subtract(1, "month").format("YYYY-MM-DD");
 const end_time = dayjs().format("YYYY-MM-DD");
 const limit_num = 4;
 
+const handleClickTag = (index: number, item: any) => {
+  active.value = index;
+  getList();
+};
 // 热门行业top10
 async function getTopConcept_dFn() {
   topConceptList.value = await getTopConceptPeriod({
@@ -136,13 +149,36 @@ onMounted(async () => {
     justify-content: center;
     padding: 2rpx 8rpx;
     border-radius: 4rpx;
-    border: 1px solid #bb875d;
+    background-color: #fff;
+    border: 2rpx solid #666;
     font-size: 22rpx;
-    color: #c18252;
+    color: #666;
     line-height: 30rpx;
     text-align: left;
     font-style: normal;
   }
+
+  .tag-active {
+    border: 2rpx solid #bb875d;
+    color: #bb875d;
+
+    &::before,
+    &::after {
+      content: "";
+      position: absolute;
+      bottom: -12rpx;
+      left: 50%;
+      border-left: 12rpx solid transparent;
+      border-right: 12rpx solid transparent;
+      border-top: 12rpx solid #bb875d;
+      transform: translateX(-50%);
+    }
+
+    &::after {
+      bottom: -10rpx;
+      border-top-color: #fff;
+    }
+  }
 }
 
 .tag-content {

src/pages/realtimeInfo/components/IndustryNewsView/index.vue

@@ -46,7 +46,7 @@ const limit_num = 4;
 
 const handleClickTag = (index: number, item: any) => {
   active.value = index;
-  getList(item);
+  getList();
 };
 
 // 热门行业top10