feat(实时信息): 添加顶部banner区域和标签展示组件

- 新增顶部banner区域,包含背景图片和标题
- 添加行业分类和概念标签的展示组件
- 引入资讯评分分布区间图表和头条榜展示
- 优化页面布局和样式
This commit is contained in:
34701892@qq.com 2025-09-06 16:20:06 +08:00
parent de20b194f0
commit fb9df08f1e
1 changed files with 74 additions and 5 deletions

View File

@ -1,17 +1,86 @@
<template> <template>
<!-- 顶部 banner 区域 --> <!-- 顶部 banner 区域 -->
<view class="all"> <view class="all">
<!-- banner start -->
<view class="banner">
<img :src="bannerImg" class="banner_bk" />
<view class="r_banner_title">
<img :src="bannerTitle" class="banner_title" />
<text>数据更新时间:{{
dayjs(new Date().getTime()).format("YYYY-MM-DD")
}}</text>
</view>
</view>
<!-- banner end -->
<view class="">
<view class="tag">
<view class="r_tag_img">
<img :src="tagicon_1_bg" class="tag_bk" />
<view class="tag_content">
<view class="tag_item_left">
<text class="tag_title">行业分类贴标</text>
<view style="display: flex; margin-top: 15rpx">
<!-- <text class="tag_num">{{ topNum.leftNum }}</text> -->
<countTo :startVal="lastLeftNum" :endVal="topNum.leftNum" :duration="5000" class="tag_num"></countTo>
<text class="tag_status">已处理</text>
</view>
</view>
<view class="tag_item_right">
<img :src="tagicon_1" class="tag_icon" />
</view>
</view>
</view>
<view class="r_tag_img">
<img :src="tagicon_2_bg" class="tag_bk" />
<view class="tag_content">
<view class="tag_item_left">
<text class="tag_title">概念标签贴标</text>
<view style="display: flex; margin-top: 15rpx">
<!-- <text class="tag_num">{{ topNum.rightNum }}</text> -->
<countTo :startVal="lastRightNum" :endVal="topNum.rightNum" :duration="5000" class="tag_num"></countTo>
<text class="tag_status">已处理</text>
</view>
</view>
<view class="tag_item_right">
<img :src="tagicon_2" class="tag_icon" />
</view>
</view>
</view>
</view>
</view>
<view style="background-color: white; margin-top: 40rpx">
<indexMenuTitle title="资讯评分分布区间"></indexMenuTitle>
<Line style="margin-top: 30rpx" :data="lineData"></Line>
<view style="
display: flex;
flex-direction: column;
text-align: center;
justify-content: center;
align-items: center;
padding-bottom: 30rpx;
">
<InfoSummary style="width: 85%" :count="newsNum"></InfoSummary>
</view>
</view>
<view style="background-color: white; padding-top: 40rpx"> <view style="background-color: white; padding-top: 40rpx">
<indexMenuTitle title="资讯头条榜 Top20"></indexMenuTitle>
<RankList :newsList="newsList" :needExp="false"></RankList> <RankList :newsList="newsList" :needExp="false"></RankList>
</view> </view>
<view class="logout" @click="loginOut" v-if="Session.get('token')">退出登录</view> <view class="logout" @click="loginOut" v-if="Session.get('token')">退出登录</view>
<LoginPopup <LoginPopup :show="LoginShow" @handlePopupClose="handlePopupClose"
:show="LoginShow" @handlePopupSuccessCallback="handlePopupSuccessCallback" @handlePopupErrorCallback="handlePopupErrorCallback" />
@handlePopupClose="handlePopupClose"
@handlePopupSuccessCallback="handlePopupSuccessCallback"
@handlePopupErrorCallback="handlePopupErrorCallback" />
</view> </view>
</template> </template>