refactor(页面布局): 重构实时资讯页面布局，将热度统计和搜索功能移至发布版本

- 将7天热度统计图表和相关功能从index.vue移至indexRelease.vue - 在RankList组件中添加hasTag属性控制标签显示 - 清理未使用的代码和样式 - 更新API注释说明各接口用途
2025-09-13 15:05:05 +08:00 · 2025-09-13 15:05:05 +08:00 · ef3c530df5
parent 579f4c1390
commit ef3c530df5
4 changed files with 201 additions and 194 deletions
--- a/src/api/newsInfo.ts
+++ b/src/api/newsInfo.ts
@ -40,16 +40,16 @@ export const getNews_cnt_d = (data: any) => {
  return request.get("/news_cnt_d", data);
 };

-// 热门标签某时间段内topN列表
+// 热门标签某时间段内topN列表（左边第一个）
 export const getTopConceptPeriod = (data: any) => {
  return request.get("/top_concept_period?start_date=" + data.start_time + "&end_date=" + data.end_time + "&limit_num=" + data.limit_num, data);
 };
-// 热门行业某时间段内topN列表
+// 热门行业某时间段内topN列表（中间第二个）
 export const getTopIndustryPeriod = (data: any) => {
  return request.get("/top_industry_period?start_date=" + data.start_time + "&end_date=" + data.end_time + "&limit_num=" + data.limit_num, data);
 };

-// 热门标签某时间段内topN列表
+// 热门标签某时间段内topN列表（右边）
 export const getTopSourcePeriod = (data: any) => {
  return request.get("/top_source_period?start_date=" + data.start_date + "&end_date=" + data.end_time + "&limit_num=" + data.limit_num, data);
 };
--- a/src/components/RankList.vue
+++ b/src/components/RankList.vue
@ -21,7 +21,7 @@
          <text class="news-desc">{{ item.summary }}</text>

          <!-- 两个标签 start -->
-          <view class="r_r_tags">
+          <view class="r_r_tags" v-if="hasTag">
            <view style="display: flex; margin-top: 20rpx; overflow-x: auto; width: 95vw">
              <view class="r_tags">
                <view class="tag" style="background-color: #fff9ec; color: #ffb100" v-for="(item, index) in item.conceptLabels" :key="index">{{
@ -132,6 +132,10 @@ const props = defineProps({
    type: Boolean,
    default: true,
  },
+  hasTag: {
+    type: Boolean,
+    default: false,
+  },
 });

 const clickItem = ref({});
--- a/src/pages/realtimeInfo/index.vue
+++ b/src/pages/realtimeInfo/index.vue
@ -64,36 +64,6 @@
    </view>

    <view style="background-color: white; margin-top: 40rpx">
-      <indexMenuTitle title="近7天热度统计"></indexMenuTitle>
-      <LineHol v-if="lineTabIndex === 0" :data="lineTopData"></LineHol>
-      <LineHol v-else-if="lineTabIndex === 1" :data="lineTopData"></LineHol>
-      <LineHolYellow v-else-if="lineTabIndex === 2" :data="lineTopData"></LineHolYellow>
-
-      <div style="display: flex; justify-content: center; margin-bottom: 20px; margin-top: 20px">
-        <div class="tabs">
-          <div :class="['tab', 'tab_left', { active: lineTabIndex === 0 }]" @click="handleTabClick(0)">申万行业</div>
-          <div :class="['tab', { active: lineTabIndex === 1 }]" @click="handleTabClick(1)">概念标签</div>
-          <div :class="['tab', 'tab_right', { active: lineTabIndex === 2 }]" @click="handleTabClick(2)">媒体来源</div>
-        </div>
-      </div>
-    </view>
-
-    <view style="background-color: white; margin-top: 40rpx">
-      <view style="width: 100vw; display: flex; justify-content: space-between; align-items: center">
-        <indexMenuTitle title="编辑精选 Top20" style="margin-top: 10rpx"></indexMenuTitle>
-        <view class="r_sreach">
-          <!-- <image class="top_bk" src="https://cankao.obs.cn-east-3.myhuaweicloud.com/mini/newmini/top_bg.png"></image> -->
-          <!-- <image class="logo_text" src="https://cankao.obs.cn-east-3.myhuaweicloud.com/mini/newmini/logo_text_icon.png"> </image> -->
-          <view class="sreach" @click="goSreach">
-            <view class="sreach_icon">
-              <image src="https://cankao.obs.cn-east-3.myhuaweicloud.com/mini/newmini/icon_search_line.png"></image>
-            </view>
-            <view class="sreach_text">
-              <text>搜索资讯</text>
-            </view>
-          </view>
-        </view>
-      </view>
      <RankList :newsList="newsList"></RankList>
    </view>

@ -143,26 +113,13 @@ import tagicon_2 from "@/assets/zixun/tagicon_2.png";
 import LoginPopup from "@/components/loginPopup/index.vue";
 import { Session } from "@/utils/storage";

-import {
-  getindustryCount,
-  getConceptCount,
-  getTopNews,
-  getTopIndustry_d,
-  getTopConcept_d,
-  getNews_cnt_d,
-  newsInfoScore,
-  getTopConceptPeriod,
-  getTopIndustryPeriod,
-  getTopSourcePeriod,
-} from "@/api/newsInfo";
+import { getindustryCount, getConceptCount, getTopNews, getTopIndustry_d, getTopConcept_d, getNews_cnt_d, newsInfoScore } from "@/api/newsInfo";
 import countTo from "@/components/count-to/vue-countTo.vue";
 import RankList from "@/components/RankList.vue"; // 路径根据实际调整
 import InfoSummary from "@/components/InfoSummary.vue"; // 路径根据实际调整
 import indexMenuTitle from "@/components/indexMenuTitle.vue"; // 路径根据实际调整
 import dayjs from "dayjs/esm/index";
 import HotIndustryList from "@/components/HotIndustryList.vue"; // 路径根据实际调整
-import LineHol from "@/components/charts/LineHol.vue";
-import LineHolYellow from "@/components/charts/LineHolYellow.vue";

 const newsList = ref([]);

@ -276,52 +233,6 @@ function loginOut() {
  window.location.reload();
 }

-const lineTabIndex = ref(0);
-function handleTabClick(index) {
-  lineTabIndex.value = index;
-  getLineDataFn();
-}
-
-const lineTopData = ref({});
-async function getLineDataFn() {
-  if (lineTabIndex.value == 0) {
-    getTopConceptPeriod({
-      start_time: "2025-09-06",
-      end_time: "2025-09-13",
-      limit_num: 10,
-    }).then((res) => {
-      lineTopData.value = res;
-    });
-  } else if (lineTabIndex.value == 1) {
-    getTopIndustryPeriod({
-      start_time: "2025-09-06",
-      end_time: "2025-09-13",
-      limit_num: 10,
-    }).then((res) => {
-      lineTopData.value = res;
-    });
-  } else if (lineTabIndex.value == 2) {
-    getTopSourcePeriod({
-      start_time: "2025-09-06",
-      end_time: "2025-09-13",
-      limit_num: 10,
-    }).then((res) => {
-      lineTopData.value = res;
-    });
-  }
-}
-
-function goSreach() {
-  if (uni.getStorageSync("token")) {
-    uni.navigateTo({
-      url: "/pages/sreachReq/index",
-    });
-  } else {
-    uni.navigateTo({
-      url: "/pages/login/indexMini",
-    });
-  }
-}
 onUnmounted(() => {
  clearInterval(timer);
 });
@ -331,8 +242,6 @@ onMounted(async () => {
  if (!Session.get("token")) {
    LoginShow.value = true;
  }
-
-  getLineDataFn();
 });
 </script>

@ -464,99 +373,4 @@ onMounted(async () => {
  margin-right: 20rpx;
  margin-bottom: 20rpx;
 }
-
-.tabs {
-  display: flex;
-  align-items: center;
-  height: 30px;
-  border-radius: 10px;
-
-  .tab {
-    width: 100px;
-    height: 100%;
-    display: flex;
-    text-align: center;
-    justify-content: center;
-    align-items: center;
-    border: 1px solid #e7e7e7;
-    color: #000;
-    font-size: 12px;
-  }
-
-  .tab_left {
-    border-start-start-radius: 10px;
-    border-end-start-radius: 10px;
-    border-right: 0;
-  }
-
-  .tab_right {
-    border-start-end-radius: 10px;
-    border-end-end-radius: 10px;
-    border-left: 0;
-  }
-
-  .active {
-    border: 1px solid #3c74f1;
-    background-color: #3c74f1;
-    color: #fff;
-  }
-}
-
-.r_sreach {
-  height: 60px;
-  display: flex;
-  align-items: center;
-  padding: 0 30rpx;
-  // position: absolute;
-  // top: 10px;
-  // left: 0;
-  // z-index: 9999;
-  // background: url("https://cankao.obs.cn-east-3.myhuaweicloud.com/mini/newmini/top_bg.png");
-}
-
-.logo_text {
-  width: 88rpx;
-  height: 40rpx;
-}
-
-.sreach {
-  display: flex;
-  align-items: center;
-  padding: 0rpx 30rpx;
-  background-color: #fff;
-  border-radius: 100rpx;
-  // width: 90vw;
-  height: 63rpx;
-  margin-left: 20rpx;
-  border: 1px solid #e7e7e7;
-  margin-top: 5rpx;
-  // box-shadow: 0 0 10rpx rgba(97, 97, 97, 0.1);
-}
-
-.sreach_icon {
-  margin-right: 10rpx;
-  display: flex;
-  align-items: center;
-
-  image {
-    width: 35rpx;
-    height: 35rpx;
-    margin-top: 5rpx;
-  }
-}
-
-.sreach_text {
-  font-family: PingFangSC, PingFang SC;
-  font-weight: 400;
-  font-size: 24rpx;
-  color: #999999;
-  line-height: 33rpx;
-  text-align: left;
-  font-style: normal;
-}
-
-.top_bk {
-  width: 100vw;
-  height: 60px;
-}
 </style>
--- a/src/pages/realtimeInfo/indexRelease.vue
+++ b/src/pages/realtimeInfo/indexRelease.vue
@ -54,6 +54,21 @@
      </view>
    </view>

+    <view style="background-color: white; margin-top: 40rpx">
+      <indexMenuTitle title="近7天热度统计"></indexMenuTitle>
+      <LineHol v-if="lineTabIndex === 0" :data="lineTopData"></LineHol>
+      <LineHol v-else-if="lineTabIndex === 1" :data="lineTopData"></LineHol>
+      <LineHolYellow v-else-if="lineTabIndex === 2" :data="lineTopData"></LineHolYellow>
+
+      <div style="display: flex; justify-content: center; margin-bottom: 20px; margin-top: 20px">
+        <div class="tabs">
+          <div :class="['tab', 'tab_left', { active: lineTabIndex === 0 }]" @click="handleTabClick(0)">申万行业</div>
+          <div :class="['tab', { active: lineTabIndex === 1 }]" @click="handleTabClick(1)">概念标签</div>
+          <div :class="['tab', 'tab_right', { active: lineTabIndex === 2 }]" @click="handleTabClick(2)">媒体来源</div>
+        </div>
+      </div>
+    </view>
+
    <view style="background-color: white; margin-top: 40rpx">
      <indexMenuTitle title="资讯评分分布区间"></indexMenuTitle>
      <Line style="margin-top: 30rpx" :data="lineData"></Line>
@ -64,8 +79,23 @@
    </view>

    <view style="background-color: white; padding-top: 40rpx">
-      <indexMenuTitle title="资讯头条榜 Top20"></indexMenuTitle>
-      <RankList :newsList="newsList" :needExp="false"></RankList>
+      <view style="width: 100vw; display: flex; justify-content: space-between; align-items: center">
+        <indexMenuTitle title="编辑精选 Top20" style="margin-top: 10rpx"></indexMenuTitle>
+        <view class="r_sreach">
+          <!-- <image class="top_bk" src="https://cankao.obs.cn-east-3.myhuaweicloud.com/mini/newmini/top_bg.png"></image> -->
+          <!-- <image class="logo_text" src="https://cankao.obs.cn-east-3.myhuaweicloud.com/mini/newmini/logo_text_icon.png"> </image> -->
+          <view class="sreach" @click="goSreach">
+            <view class="sreach_icon">
+              <image src="https://cankao.obs.cn-east-3.myhuaweicloud.com/mini/newmini/icon_search_line.png"></image>
+            </view>
+            <view class="sreach_text">
+              <text>搜索资讯</text>
+            </view>
+          </view>
+        </view>
+      </view>
+
+      <RankList hasTag :newsList="newsList" :needExp="false"></RankList>
    </view>

    <view class="logout" @click="loginOut" v-if="Session.get('token')">退出登录</view>
@ -89,8 +119,21 @@ import tagicon_1 from "@/assets/zixun/tagicon_1.png";
 import tagicon_2 from "@/assets/zixun/tagicon_2.png";
 import LoginPopup from "@/components/loginPopup/index.vue";
 import { Session } from "@/utils/storage";
+import LineHol from "@/components/charts/LineHol.vue";
+import LineHolYellow from "@/components/charts/LineHolYellow.vue";

-import { getindustryCount, getConceptCount, getTopNewsAll, getTopIndustry_d, getTopConcept_d, getNews_cnt_d, newsInfoScore } from "@/api/newsInfo";
+import {
+  getindustryCount,
+  getConceptCount,
+  getTopNewsAll,
+  getTopIndustry_d,
+  getTopConcept_d,
+  getNews_cnt_d,
+  newsInfoScore,
+  getTopConceptPeriod,
+  getTopIndustryPeriod,
+  getTopSourcePeriod,
+} from "@/api/newsInfo";
 import countTo from "@/components/count-to/vue-countTo.vue";
 import RankList from "@/components/RankList.vue"; // 路径根据实际调整
 import InfoSummary from "@/components/InfoSummary.vue"; // 路径根据实际调整
@ -210,6 +253,56 @@ function loginOut() {
  window.location.reload();
 }

+const lineTabIndex = ref(0);
+function handleTabClick(index) {
+  lineTabIndex.value = index;
+  getLineDataFn();
+}
+
+const lineTopData = ref({});
+async function getLineDataFn() {
+  if (lineTabIndex.value == 0) {
+    // 行业
+    getTopConceptPeriod({
+      start_time: "2025-09-06",
+      end_time: "2025-09-13",
+      limit_num: 10,
+    }).then((res) => {
+      lineTopData.value = res;
+    });
+  } else if (lineTabIndex.value == 1) {
+    // 概念
+    getTopIndustryPeriod({
+      start_time: "2025-09-06",
+      end_time: "2025-09-13",
+      limit_num: 10,
+    }).then((res) => {
+      lineTopData.value = res;
+    });
+  } else if (lineTabIndex.value == 2) {
+    // 媒体
+    getTopSourcePeriod({
+      start_time: "2025-09-06",
+      end_time: "2025-09-13",
+      limit_num: 10,
+    }).then((res) => {
+      lineTopData.value = res;
+    });
+  }
+}
+
+function goSreach() {
+  if (uni.getStorageSync("token")) {
+    uni.navigateTo({
+      url: "/pages/sreachReq/index",
+    });
+  } else {
+    uni.navigateTo({
+      url: "/pages/login/indexMini",
+    });
+  }
+}
+
 onUnmounted(() => {
  clearInterval(timer);
 });
@ -219,6 +312,7 @@ onMounted(async () => {
  if (!Session.get("token")) {
    LoginShow.value = true;
  }
+  getLineDataFn();
 });
 </script>

@ -350,4 +444,99 @@ onMounted(async () => {
  margin-right: 20rpx;
  margin-bottom: 20rpx;
 }
+
+.tabs {
+  display: flex;
+  align-items: center;
+  height: 30px;
+  border-radius: 10px;
+
+  .tab {
+    width: 100px;
+    height: 100%;
+    display: flex;
+    text-align: center;
+    justify-content: center;
+    align-items: center;
+    border: 1px solid #e7e7e7;
+    color: #000;
+    font-size: 12px;
+  }
+
+  .tab_left {
+    border-start-start-radius: 10px;
+    border-end-start-radius: 10px;
+    border-right: 0;
+  }
+
+  .tab_right {
+    border-start-end-radius: 10px;
+    border-end-end-radius: 10px;
+    border-left: 0;
+  }
+
+  .active {
+    border: 1px solid #3c74f1;
+    background-color: #3c74f1;
+    color: #fff;
+  }
+}
+
+.r_sreach {
+  height: 60px;
+  display: flex;
+  align-items: center;
+  padding: 0 30rpx;
+  // position: absolute;
+  // top: 10px;
+  // left: 0;
+  // z-index: 9999;
+  // background: url("https://cankao.obs.cn-east-3.myhuaweicloud.com/mini/newmini/top_bg.png");
+}
+
+.logo_text {
+  width: 88rpx;
+  height: 40rpx;
+}
+
+.sreach {
+  display: flex;
+  align-items: center;
+  padding: 0rpx 30rpx;
+  background-color: #fff;
+  border-radius: 100rpx;
+  // width: 90vw;
+  height: 63rpx;
+  margin-left: 20rpx;
+  border: 1px solid #e7e7e7;
+  margin-top: 5rpx;
+  // box-shadow: 0 0 10rpx rgba(97, 97, 97, 0.1);
+}
+
+.sreach_icon {
+  margin-right: 10rpx;
+  display: flex;
+  align-items: center;
+
+  image {
+    width: 35rpx;
+    height: 35rpx;
+    margin-top: 5rpx;
+  }
+}
+
+.sreach_text {
+  font-family: PingFangSC, PingFang SC;
+  font-weight: 400;
+  font-size: 24rpx;
+  color: #999999;
+  line-height: 33rpx;
+  text-align: left;
+  font-style: normal;
+}
+
+.top_bk {
+  width: 100vw;
+  height: 60px;
+}
 </style>