306 lines
7.7 KiB
Vue
306 lines
7.7 KiB
Vue
<template>
|
||
<view class="page-container">
|
||
<!-- 导航栏 start -->
|
||
<view class="custom-bav-bar">
|
||
<view class="left">
|
||
<u-icon name="arrow-left" color="#fff" size="36rpx" @click="handleBack" />
|
||
</view>
|
||
<view class="center"> 智能资讯榜 </view>
|
||
</view>
|
||
<!-- 导航栏 end -->
|
||
|
||
<!-- 24小时榜 start -->
|
||
<RadarView />
|
||
<!-- 24小时榜 end -->
|
||
<view class="page-main blur">
|
||
<view class="news-list-top3">
|
||
<view class="news-item">
|
||
<view class="news-no"> 1 </view>
|
||
<view class="news-info">
|
||
<view class="news-title">
|
||
<view class="title">三星生物风险投资基金将投资拓济医药</view>
|
||
<view class="score">98.52</view>
|
||
</view>
|
||
<view class="news-cont">
|
||
三星集团宣布，其生物风险基金将投资中国生物技术公司phronline
|
||
Biopharma，以扩大其抗体药物偶联物（A ...
|
||
</view>
|
||
<view class="source">
|
||
<view class="t-1">中国证券报</view>
|
||
<view class="t-2">2025-06-23 11:51</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="news-item">
|
||
<view class="news-no"> 1 </view>
|
||
<view class="news-info">
|
||
<view class="news-title">
|
||
<view class="title">三星生物风险投资基金将投资拓济医药</view>
|
||
<view class="score">98.5</view>
|
||
</view>
|
||
<view class="news-cont">
|
||
三星集团宣布，其生物风险基金将投资中国生物技术公司phronline
|
||
Biopharma，以扩大其抗体药物偶联物（A ...
|
||
</view>
|
||
<view class="source">
|
||
<view class="t-1">中国证券报</view>
|
||
<view class="t-2">2025-06-23 11:51</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="news-list">
|
||
<view class="news-item">
|
||
<view class="news-no"> 1 </view>
|
||
<view class="news-title">
|
||
三星生物风险投资基金将投资拓济医药三星生物风险投资基金将投资拓济医药
|
||
</view>
|
||
<view class="news-score">98.5</view>
|
||
</view>
|
||
<view class="news-item">
|
||
<view class="news-no"> 1 </view>
|
||
<view class="news-title">
|
||
三星生物风险投资基金将投资拓济医药三星生物风险投资基金将投资拓济医药
|
||
</view>
|
||
<view class="news-score">98.5</view>
|
||
</view>
|
||
<view class="news-item">
|
||
<view class="news-no"> 1 </view>
|
||
<view class="news-title">
|
||
三星生物风险投资基金将投资拓济医药三星生物风险投资基金将投资拓济医药
|
||
</view>
|
||
<view class="news-score">98.5</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { ref } from "vue";
|
||
import RadarView from "./components/RadarView.vue";
|
||
|
||
// 导航栏路由返回
|
||
const handleBack = () => {
|
||
uni.navigateBack({
|
||
delta: 1,
|
||
});
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.page-container {
|
||
width: 100%;
|
||
min-height: 100vh;
|
||
padding-bottom: 20rpx;
|
||
background-color: #f3f5f8;
|
||
background-image: url("@/assets/images/page/page6_pic@2x.png");
|
||
background-size: 100% auto;
|
||
background-repeat: no-repeat;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.custom-bav-bar {
|
||
width: 100%;
|
||
height: 88rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: relative;
|
||
|
||
.back_icon {
|
||
width: 36rpx;
|
||
height: 36rpx;
|
||
}
|
||
|
||
.logo_icon {
|
||
width: 168rpx;
|
||
height: 36rpx;
|
||
margin-right: 6rpx;
|
||
}
|
||
|
||
.left {
|
||
position: absolute;
|
||
top: 24rpx;
|
||
left: 32rpx;
|
||
}
|
||
|
||
.center {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
font-family: "PingFangSC, PingFang SC";
|
||
font-weight: 500;
|
||
font-size: 34rpx;
|
||
color: #ffffff;
|
||
line-height: 36rpx;
|
||
text-align: center;
|
||
}
|
||
}
|
||
|
||
.page-main {
|
||
&.blur {
|
||
filter: blur(5px);
|
||
}
|
||
.news-list-top3 {
|
||
margin: 0 20rpx;
|
||
.news-item {
|
||
display: flex;
|
||
padding: 30rpx;
|
||
margin-bottom: 20rpx;
|
||
background: #ffffff;
|
||
box-shadow: inset 0px 2rpx 0px 0px #ffffff;
|
||
border-radius: 20rpx;
|
||
|
||
.news-no {
|
||
flex: 0 0 35rpx;
|
||
height: 46rpx;
|
||
margin-right: 15rpx;
|
||
background-image: url("@/assets/images/page/icon_no1@2x.png");
|
||
background-repeat: no-repeat;
|
||
background-size: 35rpx 46rpx;
|
||
text-indent: -999em;
|
||
overflow: hidden;
|
||
}
|
||
|
||
&:nth-child(1) {
|
||
.news-no {
|
||
background-image: url("@/assets/images/page/icon_no1@2x.png");
|
||
}
|
||
}
|
||
&:nth-child(2) {
|
||
.news-no {
|
||
background-image: url("@/assets/images/page/icon_no2@2x.png");
|
||
}
|
||
}
|
||
&:nth-child(3) {
|
||
.news-no {
|
||
background-image: url("@/assets/images/page/icon_no3@2x.png");
|
||
}
|
||
}
|
||
}
|
||
|
||
.news-info {
|
||
.news-title {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin-bottom: 14rpx;
|
||
.title {
|
||
width: 505rpx;
|
||
font-family: "PingFangSC, PingFang SC";
|
||
font-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #222222;
|
||
line-height: 42rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
}
|
||
.score {
|
||
font-family: "AlimamaShuHeiTi, AlimamaShuHeiTi";
|
||
font-weight: bold;
|
||
font-size: 30rpx;
|
||
color: #3f80fa;
|
||
line-height: 42rpx;
|
||
text-align: right;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.news-cont {
|
||
margin-bottom: 16rpx;
|
||
font-family: "PingFangSC, PingFang SC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #333333;
|
||
line-height: 33rpx;
|
||
text-align: justify;
|
||
text-overflow: ellipsis;
|
||
display: -webkit-box;
|
||
-webkit-line-clamp: 2;
|
||
-webkit-box-orient: vertical;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.source {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.t-1 {
|
||
font-family: "PingFangSC, PingFang SC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #999999;
|
||
line-height: 33rpx;
|
||
margin-right: 4rpx;
|
||
color: #666666;
|
||
}
|
||
|
||
.t-2 {
|
||
font-family: "PingFangSC, PingFang SC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #999999;
|
||
line-height: 33rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.news-list {
|
||
margin: 0 20rpx;
|
||
background: #ffffff;
|
||
box-shadow: inset 0px 2rpx 0px 0px #ffffff;
|
||
border-radius: 20rpx;
|
||
|
||
.news-item {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 30rpx 0;
|
||
margin: 0 30rpx;
|
||
border-bottom: 2rpx solid #f3f3f5;
|
||
|
||
.news-no {
|
||
flex: 0 0 35rpx;
|
||
height: 42rpx;
|
||
margin-right: 15rpx;
|
||
font-family: "PingFangSC, PingFang SC";
|
||
font-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #e98254;
|
||
line-height: 42rpx;
|
||
text-align: center;
|
||
}
|
||
|
||
.news-title {
|
||
width: 505rpx;
|
||
font-family: "PingFangSC, PingFang SC";
|
||
font-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #222222;
|
||
line-height: 42rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.news-score {
|
||
font-family: "AlimamaShuHeiTi, AlimamaShuHeiTi";
|
||
font-weight: bold;
|
||
font-size: 30rpx;
|
||
color: #3f80fa;
|
||
line-height: 42rpx;
|
||
text-align: right;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|