课程详情图片点击放大,首页app跳转

This commit is contained in:
liuyuan
2025-03-19 09:53:21 +08:00
parent 6ad5712a71
commit 59e9928c25
6 changed files with 100 additions and 95 deletions

View File

@@ -12,8 +12,8 @@
"src" : "图片路径"
}
],
"versionName" : "1.0.59",
"versionCode" : 1059,
"versionName" : "1.0.61",
"versionCode" : 1061,
"app-plus" : {
"nvueCompiler" : "uni-app",
"compatible" : {

View File

@@ -7,6 +7,7 @@
"dependencies": {
"animate.css": "^4.1.1",
"e-peanut": "file:",
"element-plus": "^2.9.6",
"epubjs": "^0.3.93",
"jquery": "^2.2.4",
"qs": "^6.11.0",

View File

@@ -39,12 +39,13 @@
align-items: center;
">
<view :class="`${isHideCourseInfo ? 'hidden2' : ''}`"
style="font-size: 30rpx; text-align: justify;" v-html="course.content">
style="font-size: 30rpx; text-align: justify;">
<rich-text :nodes="parsedContent" @tap="handleImageClick"></rich-text>
</view>
<text @click="isHideCourseInfo = !isHideCourseInfo" style="
position: absolute;
background-color: #f2f8ff; padding: 4rpx ;
bottom: 0;
bottom: -45rpx;
right: 0;
color: #838588;
">
@@ -89,7 +90,7 @@
<image src="../../static/icon/xunzhang.png" mode="widthFix"></image>
</view>
<view class="">
<text>恭喜您已通过自考考试获得本门课程的自考证书,如您想获得本门课程的A级或B级证书可参加小班教学</text>
<text>恭喜您已通过自考考试获得本门课程的自考证书,如您想获得本门课程的A级<strong></strong>证书可参加小班教学</text>
</view>
</view>
</view>
@@ -302,9 +303,6 @@
style="color: #e97512; font-size: 12px; font-weight: bold"
>¥{{ item.vipPrice.toFixed(2) }}</text
>
<!-- <text style="color: #fa2d12; font-size: 10px; margin-left: 4px"
>VIP到手价</text
> -->
<text
style="
color: #8a8a8a;
@@ -325,9 +323,6 @@
style="color: #e97512; font-size: 12px; font-weight: bold"
>¥{{ item.activityPrice }}</text
>
<!-- <text style="color: #613804; font-size: 10px; margin-left: 4px"
>活动价</text
> -->
<text
style="
color: #8a8a8a;
@@ -343,29 +338,6 @@
<text v-else class="price" style="color: #e97512 !important;"
>¥{{ Number(item.price) }}</text
>
<!-- <text
v-if="
item.isVipPrice == 1 &&
item.vipPrice != 0 &&
item.vipPrice != null
"
style="
z-index: 10;
margin-left: 10rpx;
font-size: 20rpx;
color: #f94f04;
font-weight: bold;
"
>VIP优惠</text
> -->
<!-- <view class="price" v-if="item.activityPrice && item.activityPrice > 0">
¥{{ item.activityPrice }}
</view>
<view class="price" v-else> ¥{{ item.price }} </view> -->
</view>
</scroll-view>
</view>
@@ -432,13 +404,6 @@
height="40" :previewFullImage="true">
</u-upload>
</view>
<!-- <view class="">
<uni-icons type="image" size="30" style="color: #666;"></uni-icons>
</view>
<view class="ss">
<text >图片</text>
</view> -->
</view>
</view>
<!-- 上传的图片 -->
@@ -516,7 +481,6 @@
</template>
<script>
// import musicPlay from '@/components/music.vue'
import commentsList from "@/components/commentsList.vue";
import emojiList1 from "../../bkhumor-emojiplus/emoji/biaoqin.js";
import emotion from "@/bkhumor-emojiplus/components/bkhumor-emojiplus/bkhumor-emojiplus.vue";
@@ -639,6 +603,9 @@
userVip: null,
courseVipModule: [], //该课程需要什么类型的vip
textList: [], //转化文字集合
//存储解析后的内容
parsedContent: [],
imgUrls: []
};
},
//第一次加载
@@ -704,9 +671,39 @@
},
//方法
methods: {
//解析内容,将图片链接提取出来并添加点击事件
parseContent() {
let content = this.course.content;
let imgUrls = [];
// 用正则匹配所有的图片并提取图片链接
content = content.replace(/<img[^>]+src="([^"]+)"[^>]*>/g, (match, src) => {
imgUrls.push(src); // 将图片链接加入数组
// 为图片添加自定义的 data-src 属性,便于后续点击获取图片链接
return `<img src="${src}" style="max-width:100%;height:auto;display:block;" class="preview-img" data-src="${src}" data-index="${imgUrls.length - 1}">`;
});
// 存储解析后的 HTML 内容
this.parsedContent = content;
// 存储所有图片的链接
this.imgUrls = imgUrls;
},
//处理点击图片事件
handleImageClick(enevt) {
let target = event.target;
// 如果找到图片元素
if (target && target.tagName === 'IMG') {
const src = target.dataset.src || target.src;
if (src) {
// 使用 uni.previewImage 展示图片放大效果
uni.previewImage({
current: src, // 当前图片的地址
urls: this.imgUrls // 图片列表
});
}
}
},
async request(){
var newCertificate = await this.getCertificateInfo()
console.log('5555555证书资料', newCertificate);
this.selfStudyCertificate = []
this.classCertificate = []
if (newCertificate && newCertificate.length > 0) {
@@ -722,7 +719,6 @@
this.getLinkClassList()
}
var historyPaper = await this.getingPaper()
console.log('historyPaper正在考试的信息', historyPaper);
if (historyPaper && historyPaper.id && historyPaper.type == '2' && historyPaper.relationId == this
.courseId) {
// this.testingPaper = historyPaper
@@ -1762,6 +1758,8 @@
this.tjProList;
}
}
//解析数据
this.parseContent();
}
})
.catch((e) => {

View File

@@ -488,20 +488,12 @@
</view>
<!-- 应对华为审核去掉app跳转 -->
<view class="appJump">
<view class="everhealth item flexbox" @click="appjumpfun('everhealth')">
<view class="soulspace item flexbox" @click="appjumpfun('soulspace')">
<view class="img">
<image src="@/static/yljk.png" mode="widthFix"></image>
<image src="@/static/xlkj.png" mode="widthFix"></image>
</view>
<view class="text">
<text>一路健康</text>
</view>
</view>
<view class="everhealth item flexbox" @click="appjumpfun('nuttyreading')">
<view class="img">
<image src="@/static/f40x40.png" mode="widthFix"></image>
</view>
<view class="text">
<text>疯子读书</text>
<text>心灵空间</text>
</view>
</view>
<view class="zmzm item flexbox" @click="appjumpfun('zmzm')">
@@ -512,6 +504,14 @@
<text>众妙之门</text>
</view>
</view>
<view class="everhealth item flexbox" @click="appjumpfun('nuttyreading')">
<view class="img">
<image src="@/static/f40x40.png" mode="widthFix"></image>
</view>
<view class="text">
<text>疯子读书</text>
</view>
</view>
</view>
<!-- 公共组件-每个页面必须引入 -->
<public-module></public-module>
@@ -1138,9 +1138,9 @@ export default {
bagName = "com.cn.zmzm";
schemes = "zmzm";
}
if (name == "everhealth") {
bagName = "cn.com.everhealth";
schemes = "everhealth";
if (name == "soulspace") {
bagName = "com.nuttyreading.soul";
schemes = "soulspace";
}
if (name == "nuttyreading") {
bagName = "com.cn.nuttyreading";
@@ -1235,7 +1235,7 @@ export default {
.appJump {
position: fixed;
right: 0;
top: 8%;
top: 120rpx;
z-index: 1;
.item {
@@ -1252,7 +1252,6 @@ export default {
}
.img {
// width: 60rpx; height: 60rpx;
padding: 6rpx;
overflow: hidden;
@@ -1824,7 +1823,7 @@ export default {
width: 48rpx;
height: 48rpx;
position: absolute;
top: 54rpx;
top: 60rpx;
right: 30rpx;
}
}

View File

@@ -24,14 +24,16 @@
</view> -->
<view class="sear_list" v-if="this.show==1">
<view class="flexbox" style="display: flex; flex-wrap: wrap; justify-content: space-evenly;">
<view class="flexbox" style="display: flex; flex-wrap: wrap;">
<view class="bl_tioa" v-for="(item,index) in bookList" @click="onpageJump(item)">
<view class="bl_tioa_bg">
<image :src="item.productImages"></image>
<view>
<text class="bok_name">{{item.productName}}</text>
</view>
</view>
</view>
</view>
<view style="height: 1px;"></view>
<view>
@@ -286,18 +288,17 @@
.sear_list {
margin: 50rpx 30rpx 0 30rpx;
// justify-content: space-between;
.bl_tioa {
width: 30%;
box-shadow: 0 0px 10px 1px #d3d1d133; padding-bottom: 10rpx;
width: 33.3%;
padding: 10rpx;
.bl_tioa_bg{
height: 360rpx;
background-color: #fff; margin-bottom: 20rpx;
// position: relative;
// padding: 0 25upx 10upx 220upx;
// margin: 0 0 60rpx 0;
text-align: center;
border-radius: 15rpx;
min-height: 250rpx;
box-shadow: 0 0px 10px 1px #d3d1d133;
view {
display: block;
@@ -310,7 +311,11 @@
.bok_name {
font-weight: bold;
color: #333;
font-size: 28rpx;
font-size: 26rpx;
line-height: 35rpx;
height: 103rpx;
max-height: 105rpx;
overflow: hidden;
}
}
@@ -322,4 +327,6 @@
}
}
}
</style>

BIN
static/xlkj.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 75 KiB