From 61032da9f6f840c9c96af090d1810bc7a0734f4b Mon Sep 17 00:00:00 2001 From: zxl <763096477@qq.com> Date: 星期三, 30 七月 2025 17:18:14 +0800 Subject: [PATCH] 商品二维码跳转 --- pages/mine/activity/detail.vue | 116 ++++++++++++++++++++++++++++++--------------------------- 1 files changed, 61 insertions(+), 55 deletions(-) diff --git a/pages/mine/activity/detail.vue b/pages/mine/activity/detail.vue index e21896a..a467972 100644 --- a/pages/mine/activity/detail.vue +++ b/pages/mine/activity/detail.vue @@ -1,5 +1,5 @@ <template> - <view class="container" @touchstart="touchStart" @touchend="touchEnd"> + <view class="container" @touchstart="touchStart" @touchend="touchEnd"> <!-- 椤堕儴娴锋姤鍥� --> <!-- 鍔ㄦ�佸皝闈㈠尯鍩� --> <view class="cover-container"> @@ -7,11 +7,11 @@ <block v-if="activityInfo.coverType === 'image'"> <image :src="activityInfo.url" class="activity-cover" /> </block> - <block v-if=" activityInfo.coverType === 'video'"> + <block v-else-if=" activityInfo.coverType === 'video'"> <video :src="activityInfo.url" @play="handleVideoPlay" class="activity-cover"></video> </block> <!-- 鏂囧瓧绫诲瀷 --> - <block v-if="activityInfo.coverType === 'text'"> + <block v-else-if="activityInfo.coverType === 'text'"> <view class="text-cover"> <text class="cover-text">{{ activityInfo.cover }}</text> </view> @@ -55,8 +55,8 @@ <rich-text :nodes="activityInfo.activityContent" class="rich-text-content"></rich-text> </view> <!-- 鎶ュ悕鐘舵�� --> - <view class="status-bar" :style="{ backgroundColor: statusBarColor }"> - <u-button class="signup-btn" @click.stop="activityReport()" + <view class="status-bar"> + <u-button type="success" class="signup-btn" @click.stop="activityReport()" :disabled="reportBtn">{{ reportBtn ? '宸叉姤鍚�': '绔嬪嵆鎶ュ悕'}}</u-button> <view class="collect-icon" @click.stop="collect()"> <u-icon :name="isCollect ? 'star-fill' : 'star'" size="52" @@ -68,8 +68,13 @@ <script> import '@/components/uview-components/uview-ui'; - import {changeCollect} from '@/api/collect.js' - import {getActivityDetail, activityReport} from '@/api/activity.js'; + import { + changeCollect + } from '@/api/collect.js' + import { + getActivityDetail, + activityReport + } from '@/api/activity.js'; export default { data() { return { @@ -182,7 +187,9 @@ this.activityInfo.startTime = res.data.data.startTime; this.activityInfo.endTime = res.data.data.endTime; this.activityInfo.activityLocation = res.data.data.activityLocation; - this.activityInfo.activityContent = '<h2>娲诲姩浠嬬粛</h2>' + res.data.data.activityContent; + this.activityInfo.activityContent = '<h2>娲诲姩浠嬬粛</h2>' + this.processRichText(res.data.data.activityContent); + + this.activityInfo.activityType = res.data.data.activityType; this.activityInfo.limitUserNum = res.data.data.limitUserNum; this.reportBtn = res.data.data.isReport; @@ -190,6 +197,26 @@ this.activityInfo.url = res.data.data.url; } }) + }, + // 鍦ㄨ幏鍙栧瘜鏂囨湰鏁版嵁鍚庡鐞� + processRichText(content) { + // 澶勭悊鍥剧墖 + content = content.replace(/<img[^>]*>/gi, (match) => { + if (!/style=['"]/.test(match)) { + return match.replace(/<img/, '<img style="max-width:100% !important;height:auto !important;display:block;margin:10px auto;border-radius:8rpx;"'); + } + return match; + }); + + // 澶勭悊瑙嗛 + content = content.replace(/<video[^>]*>/gi, (match) => { + if (!/style=['"]/.test(match)) { + return match.replace(/<video/, '<video style="max-width:100% !important;height:auto !important;display:block;margin:10px auto;"'); + } + return match; + }); + + return content; }, loadDetailData() { //鑾峰緱璇︽儏鎺ュ彛 @@ -208,7 +235,6 @@ width: 100%; height: 400rpx; overflow: hidden; - background-color: #f5f5f5; } /* 鍥剧墖/瑙嗛灏侀潰鏍峰紡 */ @@ -226,12 +252,12 @@ display: flex; align-items: center; justify-content: center; - background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%); + // background: linear-gradient(135deg, #38a169 0%, #48bb78 100%); padding: 40rpx; } .cover-text { - color: #fff; + color: #0c6343; font-size: 36rpx; font-weight: bold; text-align: center; @@ -282,11 +308,25 @@ margin-bottom: 15rpx; } + /* 淇敼鍚庣殑鏍峰紡 */ .status-bar { + position: fixed; + bottom: 0; + left: 0; + right: 0; + width: 100%; display: flex; align-items: center; - padding: 10px 15px; + padding: 20rpx 30rpx; justify-content: space-between; + background-color: #fff; + box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1); + z-index: 100; + } + + /* 璋冩暣瀹瑰櫒搴曢儴鍐呰竟璺� */ + .container { + padding-bottom: 120rpx; } .signup-btn { @@ -342,53 +382,19 @@ .rich-text-container { padding: 15px; + overflow: hidden; + /* 闃叉鍐呭婧㈠嚭 */ } .rich-text-content { + width: 100%; + max-width: 100%; /* 闄愬埗鏈�澶у搴� */ line-height: 1.6; color: #333; - font-size: 16px; - } - - .rich-text-content img { - max-width: 100%; - height: auto; - display: block; - margin: 10px auto; - } - - .rich-text-content video { - max-width: 100%; - height: auto; - display: block; - margin: 10px auto; - } - - .rich-text-content p { - margin-bottom: 10px; - } - - .rich-text-content h1, - .rich-text-content h2, - .rich-text-content h3, - .rich-text-content h4 { - margin: 20px 0 10px; - color: #222; - } - - .rich-text-content h1 { - font-size: 24px; - } - - .rich-text-content h2 { - font-size: 22px; - } - - .rich-text-content h3 { - font-size: 20px; - } - - .rich-text-content h4 { - font-size: 18px; + font-size: 28rpx; + word-wrap: break-word; + /* 闀垮崟璇嶆崲琛� */ + overflow: hidden; + /* 闅愯棌婧㈠嚭鍐呭 */ } </style> \ No newline at end of file -- Gitblit v1.8.0