From 707486b390bfc152fb6f6f51ebbd2d0b2a6d9a97 Mon Sep 17 00:00:00 2001 From: "1054425342@qq.com" <1054425342@qq.com> Date: Mon, 25 Aug 2025 14:03:22 +0800 Subject: [PATCH] =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=A4=84=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/Book.vue | 6 + components/DynamicIsland.vue | 4 +- pages/index/iSoul.vue | 3064 +++++++++++++++++----------------- pages/index/timeShopBank.vue | 4 +- 4 files changed, 1505 insertions(+), 1573 deletions(-) diff --git a/components/Book.vue b/components/Book.vue index 1720f0e..33cfdee 100644 --- a/components/Book.vue +++ b/components/Book.vue @@ -10,6 +10,7 @@ @click="handleMoreClick" > EPIC SOUL阅读体 + 更多 @@ -86,6 +87,11 @@ export default { this.getList(); }, methods: { + handleMoreClick(){ + uni.switchTab({ + url:'/pages/index/readingBody' + }) + }, getList() { this.Post( { diff --git a/components/DynamicIsland.vue b/components/DynamicIsland.vue index ee030cc..84a8267 100644 --- a/components/DynamicIsland.vue +++ b/components/DynamicIsland.vue @@ -57,7 +57,7 @@ - + 文化工厂主理人 EVITA - + 平台简介 >> diff --git a/pages/index/iSoul.vue b/pages/index/iSoul.vue index 9e36820..0b3d371 100644 --- a/pages/index/iSoul.vue +++ b/pages/index/iSoul.vue @@ -1,1596 +1,1522 @@ + view { + box-sizing: border-box; + } + + .profile-container { + background: white; + color: white; + } + + /* 状态栏占位 */ + .status-bar-placeholder { + height: var(--status-bar-height); + width: 100%; + } + + /* 顶部导航 */ + .header { + display: flex; + justify-content: space-between; + align-items: center; + height: 48px; + } + + .back-btn, + .more-btn { + width: 60rpx; + height: 60rpx; + display: flex; + align-items: center; + justify-content: center; + font-size: 40rpx; + color: white; + } + + .dots { + font-size: 32rpx; + font-weight: bold; + } + + /* 用户信息区域 */ + .user-section { + display: flex; + align-items: center; + padding: 0 40rpx 30rpx; + } + + .user-avatar { + width: 120rpx; + height: 120rpx; + border-radius: 50%; + overflow: hidden; + margin-right: 30rpx; + } + + .avatar-img { + width: 100%; + height: 100%; + } + + .user-info { + flex: 1; + } + + .username { + font-size: 36rpx; + font-weight: bold; + color: white; + margin-bottom: 10rpx; + } + + .user-id { + font-size: 24rpx; + color: rgba(255, 255, 255, 0.8); + margin-bottom: 10rpx; + } + + .location { + display: flex; + align-items: center; + font-size: 24rpx; + color: rgba(255, 255, 255, 0.8); + } + + .location-icon, + .info-icon { + margin-right: 8rpx; + } + + /* 城市艺术漫游 */ + .city-art { + padding: 0 40rpx 20rpx; + display: flex; + align-items: center; + justify-content: space-between; + } + + .city-title { + display: flex; + align-items: center; + font-size: 28rpx; + color: rgba(255, 255, 255, 0.9); + } + + .pin-icon { + margin-right: 8rpx; + } + + .city-name { + font-size: 28rpx; + color: white; + font-weight: bold; + } + + .gender-icon { + width: 40rpx; + height: 40rpx; + background: rgba(255, 255, 255, 0.2); + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + font-size: 24rpx; + } + + /* 统计数据 */ + .stats-section { + display: flex; + justify-content: space-between; + align-items: center; + margin-top: 80rpx; + padding-bottom: 50rpx; + padding: 0 40rpx; + } + + .stats-left { + display: flex; + gap: 60rpx; + } + + .stat-item { + text-align: center; + min-width: 80rpx; + } + + .stat-number { + font-size: 32rpx; + font-weight: bold; + color: white; + margin-bottom: 8rpx; + } + + .stat-label { + font-size: 24rpx; + color: rgba(255, 255, 255, 0.8); + } + + /* 权益兑换入口 */ + .exchange-entry { + display: flex; + flex-direction: column; + align-items: center; + padding: 16rpx; + background: rgba(255, 255, 255, 0.1); + border-radius: 20rpx; + min-width: 120rpx; + transition: all 0.3s ease; + + &:active { + transform: scale(0.95); + background: rgba(255, 255, 255, 0.2); + } + } + + .exchange-icon { + font-size: 32rpx; + margin-bottom: 8rpx; + } + + .exchange-text { + font-size: 22rpx; + color: rgba(255, 255, 255, 0.9); + font-weight: 500; + } + + /* 操作按钮 */ + .action-buttons { + display: flex; + padding: 0 40rpx 40rpx; + gap: 20rpx; + } + + .follow-btn { + flex: 1; + background: #ff4757; + border-radius: 50rpx; + padding: 20rpx; + text-align: center; + color: white; + font-size: 28rpx; + font-weight: bold; + } + + .message-btn { + flex: 1; + background: rgba(255, 255, 255, 0.2); + border-radius: 50rpx; + padding: 20rpx; + text-align: center; + color: white; + font-size: 28rpx; + font-weight: bold; + } + + /* 待激活的Agent */ + .agent-section { + margin: 0 47rpx; + border-radius: 20rpx; + margin-bottom: 0rpx; + overflow: hidden; + display: flex; + align-items: center; + padding: 30rpx 0; + } + + .agent-header { + margin-right: 30rpx; + flex-shrink: 0; + } + + .agent-title { + font-size: 28rpx; + color: #000000; + } + + .agent-content { + flex: 1; + } + + .agent-scroll { + width: 430rpx; + white-space: nowrap; + /* 微信小程序隐藏横向滚动条 */ + overflow: hidden; + + /* Webkit浏览器 */ + &::-webkit-scrollbar { + display: none !important; + width: 0 !important; + height: 0 !important; + } + + /* Firefox */ + scrollbar-width: none; + /* IE和Edge */ + -ms-overflow-style: none; + } + + .agent-avatars { + display: inline-flex; + gap: 20rpx; + } + + .agent-avatar { + width: 104rpx; + height: 104rpx; + border-radius: 50%; + overflow: hidden; + flex-shrink: 0; + } + + .agent-img { + width: 100%; + height: 100%; + } + + /* 数字资产权益 */ + .digital-assets { + margin: 0 30rpx 30rpx; + } + + .asset-header { + margin-bottom: 20rpx; + } + + .asset-title { + font-size: 28rpx; + color: #000000; + font-weight: 500; + } + + .asset-scroll-container {} + + .asset-scroll { + width: 100%; + white-space: nowrap; + overflow: hidden; + + /* 微信小程序隐藏横向滚动条 */ + &::-webkit-scrollbar { + display: none !important; + width: 0 !important; + height: 0 !important; + } + + /* Firefox */ + scrollbar-width: none; + /* IE和Edge */ + -ms-overflow-style: none; + } + + .asset-cards { + display: inline-flex; + gap: 20rpx; + padding: 30rpx 10rpx; + } + + .asset-card { + width: 500rpx; + border-radius: 20rpx; + overflow: hidden; + box-shadow: 0 15rpx 12rpx rgba(0, 0, 0, 0.15); + transition: all 0.3s ease; + position: relative; + flex-shrink: 0; + } + + .asset-card:active { + transform: scale(0.98); + box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.2); + } + + .asset-card-wrapper { + position: relative; + width: 100%; + height: 300rpx; + overflow: hidden; + } + + .asset-img { + width: 100%; + height: 100%; + transition: transform 0.3s ease; + } + + .asset-card:active .asset-img { + transform: scale(1.05); + } + + .asset-overlay { + position: absolute; + bottom: 0; + left: 0; + right: 0; + background: linear-gradient(transparent, rgba(0, 0, 0, 0.7)); + padding: 40rpx 30rpx 30rpx; + color: white; + backdrop-filter: blur(10rpx); + width: 100%; + height: 100%; + } + + .asset-badge { + background: linear-gradient(135deg, #fffdb7 0%, #97fffa 100%); + color: black; + font-size: 20rpx; + padding: 6rpx 12rpx; + border-radius: 16rpx; + display: inline-block; + margin-bottom: 12rpx; + font-weight: 500; + } + + .asset-name { + font-size: 26rpx; + font-weight: 500; + margin-bottom: 6rpx; + line-height: 1.3; + } + + .asset-desc { + font-size: 34rpx; + color: white; + margin-bottom: 16rpx; + font-weight: bold; + line-height: 1.4; + } + + .asset-action { + display: flex; + align-items: center; + justify-content: space-between; + background: linear-gradient(135deg, #fffdb7e6 0%, #97fffab5 100%); + border-radius: 20rpx; + padding: 10rpx 16rpx; + backdrop-filter: blur(10rpx); + white-space: nowrap; + min-width: 0; + } + + .action-text-order { + font-size: 26rpx; + font-weight: bold; + color: black; + flex-shrink: 0; + overflow: hidden; + text-overflow: ellipsis; + } + + .action-arrow { + font-size: 26rpx; + font-weight: bold; + color: white; + transition: transform 0.3s ease; + flex-shrink: 0; + margin-left: 8rpx; + } + + .action-arrow-order { + font-size: 26rpx; + font-weight: bold; + color: black; + transition: transform 0.3s ease; + flex-shrink: 0; + margin-left: 8rpx; + } + + .asset-card:active .action-arrow { + transform: translateX(6rpx); + } + + /* 原来的图片风格 */ + .asset-card-old { + border-radius: 20rpx; + overflow: hidden; + } + + /* 底部操作按钮 */ + .asset-actions { + display: flex; + padding: 20rpx 0; + background: white; + border-radius: 20rpx; + font-size: 25rpx; + } + + .action-icon { + width: 36rpx; + height: 36rpx; + border-radius: 50%; + margin-bottom: 12rpx; + } + + .action-icon.red { + background: #ff4757; + } + + .action-icon.gray { + background: #ccc; + } + + /* 有感商品 */ + .feeling-goods { + margin: 20rpx 30rpx 30rpx; + } + + .goods-card { + border-radius: 20rpx; + overflow: hidden; + } + + .goods-bg { + padding: 40rpx 30rpx 20rpx; + position: relative; + } + + .goods-title { + font-size: 32rpx; + color: white; + font-weight: bold; + margin-bottom: 10rpx; + } + + .goods-brand { + font-size: 36rpx; + color: white; + font-weight: bold; + margin-bottom: 5rpx; + } + + .goods-subtitle { + font-size: 24rpx; + color: rgba(255, 255, 255, 0.8); + } + + .goods-actions { + display: flex; + background: white; + } + + .goods-action { + flex: 1; + display: flex; + flex-direction: column; + align-items: center; + padding: 20rpx 10rpx; + font-size: 26rpx; + color: #000000; + } + + .goods-action.active { + color: #ff4757; + } + + /* 数字资产纪念册 */ + .memorial-section { + margin: 0 47rpx; + margin-bottom: 30rpx; + } + + .memorial-divider { + display: flex; + align-items: center; + padding: 30rpx 0; + margin-bottom: 30rpx; + } + + .divider-line { + flex: 1; + height: 2rpx; + background: #e0e0e0; + } + + .divider-text { + padding: 0 30rpx; + font-size: 30rpx; + color: #000000; + font-weight: bold; + white-space: nowrap; + } + + .memorial-cards { + display: flex; + gap: 20rpx; + } + + /* 单条数据特殊展示样式 */ + .memorial-card-single { + width: 100%; + max-width: 100%; + margin: 0 auto; + border-radius: 20rpx; + overflow: hidden; + box-shadow: 0 12rpx 40rpx rgba(0, 0, 0, 0.15); + transition: all 0.3s ease; + position: relative; + } + + .memorial-card-single:active { + transform: scale(0.98); + box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.2); + } + + .single-card-wrapper { + position: relative; + width: 100%; + height: 400rpx; + overflow: hidden; + } + + .memorial-img-single { + width: 100%; + height: 100%; + transition: transform 0.3s ease; + } + + .memorial-card-single:active .memorial-img-single { + transform: scale(1.05); + } + + .single-overlay { + position: absolute; + bottom: 0; + left: 0; + right: 0; + background: linear-gradient(transparent, rgba(0, 0, 0, 0.7)); + padding: 60rpx 30rpx 30rpx; + color: white; + } + + .single-badge { + background: linear-gradient(135deg, #77f3f9 0%, #764ba2 100%); + color: white; + font-size: 22rpx; + padding: 8rpx 16rpx; + border-radius: 20rpx; + display: inline-block; + margin-bottom: 16rpx; + font-weight: 500; + box-shadow: 0 4rpx 12rpx rgba(102, 126, 234, 0.3); + } + + .single-title { + font-size: 32rpx; + font-weight: bold; + margin-bottom: 8rpx; + line-height: 1.3; + } + + .single-desc { + font-size: 24rpx; + color: rgba(255, 255, 255, 0.8); + margin-bottom: 20rpx; + line-height: 1.4; + } + + .single-action { + display: flex; + align-items: center; + justify-content: space-between; + background: rgba(255, 255, 255, 0.1); + border-radius: 25rpx; + padding: 12rpx 20rpx; + backdrop-filter: blur(10rpx); + border: 1rpx solid rgba(255, 255, 255, 0.2); + } + + .action-text { + font-size: 26rpx; + font-weight: 500; + color: white; + } + + .action-arrow { + font-size: 28rpx; + font-weight: bold; + color: white; + transition: transform 0.3s ease; + } + + .memorial-card-single:active .action-arrow { + transform: translateX(6rpx); + } + + .memorial-card { + flex: 1; + border-radius: 10rpx; + overflow: hidden; + background: white; + } + + .memorial-img { + width: 100%; + height: 425rpx; + } + + .memorial-info { + padding: 20rpx 10rpx; + display: flex; + justify-content: space-between; + align-items: center; + } + + .memorial-title { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-size: 22rpx; + color: #000000; + flex: 1; + } + + .memorial-more { + font-size: 14rpx; + color: #999; + } + + /* 无数据时的空状态样式 */ + .memorial-empty { + display: flex; + justify-content: center; + align-items: center; + min-height: 280rpx; + } + + .empty-content { + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + color: #333333; + } + + .empty-icon { + font-size: 80rpx; + margin-bottom: 20rpx; + opacity: 0.6; + } + + .empty-title { + font-size: 32rpx; + color: white; + font-weight: 500; + margin-bottom: 10rpx; + } + + .empty-desc { + font-size: 26rpx; + margin-bottom: 8rpx; + } + + .empty-tip { + font-size: 24rpx; + line-height: 1.4; + } + + /* 底部菜单 */ + .bottom-menu { + padding: 40rpx 30rpx; + background: white; + margin: 0 30rpx; + border-radius: 20rpx; + margin-bottom: 30rpx; + } + + .menu-item { + padding: 30rpx 0; + border-bottom: 1rpx solid #f5f5f5; + font-size: 28rpx; + color: #333; + } + + .menu-item:last-child { + border-bottom: none; + } + + // 用户顶部背景区域 + .user-top { + background-size: cover; + background-position: center; + background-repeat: no-repeat; + padding-bottom: 20rpx; + } + + .digital-img { + height: 265rpx; + width: 100%; + border-radius: 20rpx; + } + + /* 权益兑换弹窗 */ + .exchange-popup { + width: 600rpx; + background-color: #ffffff; + border-radius: 16rpx; + overflow: hidden; + } + + .popup-header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 30rpx; + border-bottom: 1px solid #f0f0f0; + } + + .popup-title { + font-size: 32rpx; + font-weight: 600; + color: #333; + } + + .popup-close { + font-size: 40rpx; + color: #999; + padding: 0 10rpx; + } + + .popup-content { + padding: 40rpx 30rpx 30rpx; + } + + .input-section { + margin-bottom: 40rpx; + } + + .input-label { + display: block; + font-size: 28rpx; + color: #333; + margin-bottom: 20rpx; + font-weight: 500; + } + + .exchange-input { + width: 100%; + height: 88rpx; + border: 2rpx solid #e0e0e0; + border-radius: 12rpx; + padding: 0 20rpx; + font-size: 28rpx; + color: #333; + box-sizing: border-box; + + &:focus { + border-color: #77f3f9; + } + } + + .popup-actions { + display: flex; + gap: 20rpx; + } + + .cancel-btn, + .confirm-btn { + flex: 1; + height: 80rpx; + border-radius: 12rpx; + font-size: 28rpx; + font-weight: 600; + border: none; + display: flex; + align-items: center; + justify-content: center; + transition: all 0.3s ease; + + &:active { + transform: scale(0.98); + } + } + + .cancel-btn { + background: #f5f5f5; + color: #77f3f9; + } + + .confirm-btn { + background: #77f3f9; + color: #000000; + } + + .column-divider { + width: 2rpx; + height: 60rpx; + background: rgba(0, 0, 0, 0.1); + margin: 35rpx 16rpx; + flex-shrink: 0; + } + + .action-box { + display: flex; + align-items: center; + justify-content: space-around; + padding: 20rpx 40rpx 0; + } + + .popup-actions-bottom { + color: #989898; + font-weight: bold; + font-size: 28rpx; + margin-top: 30rpx; + margin-bottom: 30rpx; + } + \ No newline at end of file diff --git a/pages/index/timeShopBank.vue b/pages/index/timeShopBank.vue index b42f4ce..445ecbe 100644 --- a/pages/index/timeShopBank.vue +++ b/pages/index/timeShopBank.vue @@ -400,8 +400,8 @@ page { /* 悬浮发布按钮 */ .fab-container { position: fixed; - bottom: 200rpx; - right: 40rpx; + bottom: 250rpx; + right: 0rpx; z-index: 999; }