From a70819522e0471359fcccd50a70dd9094e6355f8 Mon Sep 17 00:00:00 2001
From: "34701892@qq.com" <34701892@qq.com>
Date: Sun, 17 Aug 2025 19:52:46 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E7=99=BB=E5=BD=95?=
=?UTF-8?q?=E7=8A=B6=E6=80=81=E7=9B=B8=E5=85=B3UI=E6=94=B9=E8=BF=9B?=
=?UTF-8?q?=E5=92=8C=E6=A0=B7=E5=BC=8F=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
- 在minihome页面添加z-index确保元素层级
- 修改rankDetail页面的标签颜色样式
- 在indexNewsInfo和RankListMini组件中添加登录状态判断
- 为未登录用户添加模糊效果和登录提示
- 新增登录解锁提示组件
---
src/components/RankListMini.vue | 73 +++++++++++++----
src/components/article/indexNewsInfo.vue | 54 ++++++-------
src/pages/detail/indexNewsInfo.vue | 99 +++++++++++++++++++++++-
src/pages/minihome/index.vue | 3 +-
src/pages/realtimeInfo/rankDetail.vue | 10 ++-
5 files changed, 186 insertions(+), 53 deletions(-)
diff --git a/src/components/RankListMini.vue b/src/components/RankListMini.vue
index b137154..b564a51 100644
--- a/src/components/RankListMini.vue
+++ b/src/components/RankListMini.vue
@@ -3,6 +3,7 @@
+
@@ -18,32 +19,32 @@
- {{ item.title }}
- {{ item.summary }}
-
+
+ {{ item.title.slice(0, 3) }}
+ {{ item.title.slice(3, item.title.length
+ - 1) }}
+
+ {{ item.summary }}
+
+
+
{{ item.source }}
{{
dayjs(item.publish_time).format("YYYY-MM-DD HH:MM:ss")
}}
-
+
+
+
+
+
+ 海外独家资讯内容，登录后可查阅全文
-
-
-
-
@@ -56,6 +57,7 @@ import { Session } from "@/utils/storage";
const isExp = ref(true);
const rankListLocal = ref([]);
const loading = ref(true);
+const isLogin = ref(uni.getStorageSync('token'))
watch(
() => isExp.value,
@@ -145,7 +147,9 @@ const handlePopupErrorCallback = () => {
align-items: flex-start;
margin-bottom: 15px;
border-bottom: 1px solid #f2f2f2;
- padding-bottom: 10px;
+ padding-bottom: 30px;
+
+ position: relative;
}
.rank-tag {
@@ -283,4 +287,39 @@ const handlePopupErrorCallback = () => {
align-items: center;
gap: 10rpx;
}
+
+.mohu {
+ filter: blur(7rpx);
+}
+
+
+.lock_view {
+ background: linear-gradient(180deg, rgba(248, 244, 238, 0) 0%, #F8F4EE 100%);
+ border-radius: 20rpx;
+ padding: 10rpx 20rpx;
+ display: flex;
+ align-items: center;
+ margin-top: -10rpx;
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ height: 74rpx;
+
+ .lock_icon {
+ width: 27rpx;
+ height: 34rpx;
+ margin-right: 10rpx;
+ }
+
+ .lock_text {
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #7F6242;
+ line-height: 33rpx;
+ text-align: left;
+ font-style: normal;
+ }
+}
diff --git a/src/components/article/indexNewsInfo.vue b/src/components/article/indexNewsInfo.vue
index 3e41c80..c550f50 100644
--- a/src/components/article/indexNewsInfo.vue
+++ b/src/components/article/indexNewsInfo.vue
@@ -1,6 +1,12 @@
- {{ props.data.title }}
+
+ {{ props.data.title?.slice(0, 3) }}
+ {{ props.data.title?.slice(3,
+ props.data.title.length
+ - 1) }}
+
+
来源:
@@ -16,38 +22,25 @@
-
+
- {{ item }}
+ {{ item }}
-
+
- {{ item }}
+ {{ item }}
-
+
+
{{ props.data.summary }}
@@ -61,12 +54,8 @@
v-html="props.data.content">
-->
-
+
-
+
+
+
+
+
+
+
+ 登录解锁
+ 海外独家资讯内容，登录后可查阅全文
+
+
+ 立即登录
+
+
@@ -50,6 +63,8 @@ import { getNavHeight } from "@/utils/util"
const stores = useShareStore();
const curPages = getCurrentPages();
+const isLogin = ref(uni.getStorageSync("token") ? true : false);
+
const data = ref({});
const newType = ref("");
@@ -262,4 +277,86 @@ const jumpDetail = (item: any) => {
height: 48rpx;
}
}
+
+.login_unlock {
+ position: fixed;
+ bottom: 30rpx;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 100vw;
+ height: 400rpx;
+ display: flex;
+ flex-direction: column;
+ text-align: center;
+ justify-content: center;
+ align-items: center;
+
+ .r_image {
+ position: relative;
+ color: white;
+
+ .image_text {
+ position: absolute;
+ top: 0;
+ left: 0;
+ display: flex;
+ z-index: 99;
+ display: flex;
+ flex-direction: column;
+ text-align: start;
+ justify-content: center;
+ margin-left: 100rpx;
+ height: 65%;
+ }
+
+ .image_text_title {
+ font-family: PingFangSC, PingFang SC;
+ font-weight: bold;
+ font-size: 30rpx;
+ color: #FFFFFF;
+ line-height: 42rpx;
+ text-shadow: 0px 2px 8px rgba(43, 51, 75, 0.35);
+ text-align: left;
+ font-style: normal;
+ }
+
+ .image_text_sub_title {
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #B5BED5;
+ line-height: 33rpx;
+ text-shadow: 0px 2px 8px rgba(43, 51, 75, 0.35);
+ text-align: left;
+ font-style: normal;
+ }
+
+ image {
+ width: 78vw;
+ height: 128rpx;
+ margin-bottom: 60rpx;
+
+ }
+ }
+
+ .login_unlock_btn {
+ width: 100%;
+ height: 88rpx;
+ background: #D13E3C;
+ border-radius: 44rpx;
+
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 500;
+ font-size: 32rpx;
+ color: #FFFFFF;
+ line-height: 45rpx;
+ text-align: center;
+ font-style: normal;
+
+ display: flex;
+ text-align: center;
+ justify-content: center;
+ align-items: center;
+ }
+}
diff --git a/src/pages/minihome/index.vue b/src/pages/minihome/index.vue
index 9b9ef23..c61bf66 100644
--- a/src/pages/minihome/index.vue
+++ b/src/pages/minihome/index.vue
@@ -22,7 +22,8 @@
diff --git a/src/pages/realtimeInfo/rankDetail.vue b/src/pages/realtimeInfo/rankDetail.vue
index 840350c..a66f7b7 100644
--- a/src/pages/realtimeInfo/rankDetail.vue
+++ b/src/pages/realtimeInfo/rankDetail.vue
@@ -22,6 +22,8 @@
+
+
{{ item.title }}
{{ item.summary }}
@@ -207,22 +209,22 @@ onMounted(async () => {
font-family: PingFangSC, PingFang SC;
font-weight: bold;
font-size: 28rpx;
- color: #3f80fa;
line-height: 40rpx;
text-align: center;
font-style: normal;
- background-color: #f5f8fe;
+ color: #AF201E;
+ background-color: #FAF3F2;
}
.tag_item_act_yellow {
font-family: PingFangSC, PingFang SC;
font-weight: bold;
font-size: 28rpx;
- color: #ffa800;
line-height: 40rpx;
text-align: center;
font-style: normal;
- background-color: #fff9ec;
+ color: #AF201E;
+ background-color: #FAF3F2;
}
}