H5转成小程序

common/styles/global/pages.scss

@@ -194,10 +194,11 @@
 .kecheng-list{
 	.kecheng-list-card-box{
 		display: flex;align-items: center;padding: 4rpx 0;
-		img{width: 300rpx;max-height: 260rpx;margin-right: 32rpx;}
+		img,image{width: 300rpx;height: 190rpx;margin-right: 32rpx;flex-shrink: 0;}
 		.card-right-box{
 			font-size: 28rpx;
-			view{color: #666;line-height: 1.6;}
+			view{
+				width: calc(100vw - 380rpx);color: #666;line-height: 1.8;@include single-line-ellipsis();}
 			.card-name{color: #333;font-weight: 600;}
 		}
 	}
@@ -264,22 +265,14 @@
 	}
 	.master-image{
 		width: 100%;height: 460rpx;position: relative;
-		@include ezy-no-repeat-cover();background-image: url("@/static/images/common/video-bj.png");
+		@include ezy-no-repeat-cover();
 	}
 	// 课程引导阴影
 	.yindao-shadow-image{
-	  width: 80rpx;height: 80rpx;margin: 0;background-repeat: no-repeat;
-	  background-image: url("@/static/images/common/course-point-icon.gif");background-size: contain;
-	  position: absolute;right: 100rpx;top: 780rpx;pointer-events: none;
-	}
-	.kc-name-box{
-		display: flex;align-items: center;box-sizing: border-box;padding: 24rpx 36rpx 6rpx;
-		icon{
-			width: 60rpx;height: 40rpx;flex-shrink: 0;
-		}
-		icon::before{content:'';width:40rpx;height: 40rpx;display: inline-block;
-			@include ezy-no-repeat-cover();background-image: url("@/static/images/common/return-icon.png");}
+	  width: 80rpx;height: 80rpx;margin: 0;background-repeat: no-repeat;background-size: contain;
+	  position: absolute;right: 100rpx;top: 940rpx;pointer-events: none;
 	}
+	.kc-name-box{display: flex;align-items: center;box-sizing: border-box;padding: 24rpx 36rpx 6rpx;}
 	.kc-info-box{width: 100%;box-sizing: border-box;padding: 6rpx 36rpx 24rpx;border-bottom: 1rpx solid #ebebeb;
 		display: flex;align-items: center;justify-content: space-between;color: #555;font-size: 28rpx;}
 	.kecheng-mulu-box{
@@ -291,7 +284,7 @@
 			
 			}
 		.collapse-text{font-size: 30rpx;color: #333;}
-		.collapse-item-icon{background-image: url("@/static/images/common/nav-bar-jt-bottom.svg");flex-shrink: 0;margin-left: 10rpx;}
+		.collapse-item-icon{flex-shrink: 0;margin-left: 10rpx;}
 		.item-open .collapse-item-icon{transform: rotate(180deg);}
 		
 		.my-card-content {height: 0rpx;overflow: hidden;margin: 0 20rpx;}
@@ -306,12 +299,9 @@
 		
 		.kejian-item{display: flex;align-items: center;padding: 16rpx;font-size: 28rpx;justify-content: space-between;
 		color: #666;border-radius: 4rpx;background-color: #f4f7ff;margin-bottom:16rpx;}
-		.kejian-item-icon{background-image: url("@/static/images/common/play-icon.svg");flex-shrink: 0;margin-right: 8rpx;}
+		.kejian-item-icon{flex-shrink: 0;margin-right: 8rpx;}
 		.kejian-item-name{margin-right: auto;}
-		.kejian-active{
-			color: #3fd2a1;background-color: #3fd2a11a;
-			.kejian-item-icon{background-image: url("@/static/images/common/play-icon-a.svg");}
-		}
+		.kejian-active{color: #3fd2a1;background-color: #3fd2a11a;}
 	}	
 	.kecheng-content-box{flex: 1;overflow: auto;}
 	.kecheng-jieshao-box{

components/kecheng-mulu/kecheng-mulu.vue

@@ -5,7 +5,13 @@
 			<myCollapseCardVue v-for="jie in zhang.jieList" :title="jie.name" @click.stop="handleJieClick(jie, zhang)"
 				:open="jie.open">
 				<view :class="{'kejian-active': activeKjId == item.kjId,'kejian-item':true }" v-for="item in jie.kejianList" @click.stop="handleKejianClick(item)">
-					<icon class="kejian-item-icon"></icon>
+					<icon class="kejian-item-icon" 
+					:style="{
+					      backgroundImage: `url(${activeKjId == item.kjId 
+					        ? iconsArr.playIconA 
+					        : iconsArr.playIcon})`
+					    }"
+						></icon>
 					<text class="kejian-item-name">{{item.name}}</text>
 					<text v-if="isHasProgress">
 						<text v-if="item.maxProcess < 100">{{item.maxProcess >= item.curProcess ? item.maxProcess: item.curProcess}}%</text>
@@ -18,10 +24,9 @@
 </template>
 
 <script setup>
+	import cacheManager from '@/utils/cacheManager.js';
 	import myCollapseCardVue from '../myCollapseCard/myCollapseCard.vue';
-	import {
-		ref
-	} from 'vue';
+	import {ref,reactive,onMounted} from 'vue';
 	const props = defineProps({
 		chapterArr: {
 			type: Array
@@ -33,6 +38,10 @@
 			type: [Number,String]
 		}
 	})
+	const iconsArr = reactive({
+			playIcon: '',
+			playIconA: '',
+	})
 
 	const emits = defineEmits(['play'])
 
@@ -76,4 +85,8 @@
 	function handleKejianClick(item) {
 		emits('play', item)
 	}
+	onMounted(() => {
+		iconsArr.playIcon = cacheManager.get('projectImg').play_icon;
+		iconsArr.playIconA = cacheManager.get('projectImg').play_icon_a;
+	});
 </script>

components/myCollapseCard/myCollapseCard.vue

@@ -2,7 +2,7 @@
 	<view class="my-collapse-card">
 		<view class="my-collapse-item" :class="{'item-open': open}">
 			<text class="collapse-text">{{title}}</text>
-			<icon class="collapse-item-icon"></icon>
+			<icon class="collapse-item-icon" :style="{ backgroundImage: 'url(' + imgsArr.navBarJtIcon + ')' }"></icon>
 		</view>
 		<view class="my-card-content" :class="{'content-open': open}">
 			<slot></slot>
@@ -11,6 +11,7 @@
 </template>
 
 <script>
+	import cacheManager from '@/utils/cacheManager.js';
 	export default {
 		name: "myCollapseCard",
 		props: {
@@ -21,5 +22,14 @@
 				type:Boolean
 			}
 		},
+		data() {
+		    return {
+		      // 初始化 imgsArr，设置默认空对象
+		      imgsArr: { navBarJtIcon: '' }
+		    }
+		  },
+		  created() {
+		  		this.imgsArr.navBarJtIcon = cacheManager.get('projectImg').nav_bar_jt_bottom;
+		  	},
 	}
 </script>

pages/client/Kecheng/list.vue

@@ -1,13 +1,11 @@
 <template>
 	<view class="phone-list-page kecheng-list">
-		<view class="icon-title-bjcolor-navBar-box">
-			<view @click="goUpPage" class="nav-bar-icon"></view>
-			<text class="nav-bar-title">课程管理</text>
-		</view>
+		<customNavbarVue title="课程" :show-back-btn="true" @back="goUpPage"></customNavbarVue>
+		
 		<!-- 课程列表 -->
 		<scroll-view scroll-y="true" refresher-enabled="true" :refresher-triggered="data.loading"
 			:refresher-threshold="50" refresher-background="transparent" @refresherrefresh="onRefresh" @scrolltolower="onScrolltolower"
-			class="phone-scroll-view">
+			:style="{ height: `calc(100vh - ${statusBarHeight}px - 212rpx);`}" class="phone-scroll-overflow">
 			<uni-list class="admin-list-box">
 				<uni-list-item v-for="item in data.list" class="admin-list-item-box">
 					<template v-slot:body>
@@ -34,20 +32,13 @@
 </template>
 
 <script setup>
+	import customNavbarVue from "@/components/custom-navbar/custom-navbar.vue";
 	import customTabbarClientVue from "@/components/custom-tabbar/custom-tabbar-client.vue";
 
-	import {
-		ref,
-		reactive
-	} from "vue";
-	import {
-		onLoad,
-		onShow
-	} from "@dcloudio/uni-app";
+	import {ref,reactive,onMounted} from "vue";
+	import {onLoad,onShow} from "@dcloudio/uni-app";
 	import * as kechengApi from "@/api/kecheng.js"
-	import {
-		formatSecondsToCnhms
-	} from "@/utils/common.js"
+	import {formatSecondsToCnhms} from "@/utils/common.js"
 
 	const data = reactive({
 		list: [], // 考试列表
@@ -63,6 +54,7 @@
 		from: ''
 	})
 	
+	const statusBarHeight = ref(0);
 	function onScrolltolower() {
 		getMore()
 	}
@@ -158,6 +150,14 @@
 		data.from = options.from;
 	})
 
+	onMounted(() => {
+		uni.getSystemInfo({
+		success: (res) => {
+		statusBarHeight.value = res.statusBarHeight;
+		}
+		});
+	});
+	
 	onShow(() => {
 		getMore()
 	})

pages/client/Kecheng/study.vue

@@ -1,5 +1,6 @@
 <template>
 	<view class="kecheng-study-page">
+		<customNavbarVue title="课程" :show-back-btn="true" @back="goUpPage"></customNavbarVue>
 		<!-- <view class="icon-title-bjcolor-navBar-box">
 			<view @click="goUpPage" class="nav-bar-icon"></view>
 			<text class="nav-bar-title">{{name}}</text>
@@ -8,18 +9,17 @@
 		<!-- 	<videoPlayVue v-if="showVideo" ref="videoRef" class="phone-video-box" @play-end="onPlayEnd" @play-play="onPlay"
 			@play-pause="onPause" @play-timeupdate="onTimeupdate"></videoPlayVue> -->
 
-		<video v-if="showVideo" :src="videoUrl" :poster="videoPoster" controls class="video-player" @play="onVideoPlay"
+		<video v-if="showVideo" :src="videoUrl" :poster="videoPoster" controls class="phone-video-box" @play="onVideoPlay"
 			@pause="onVideoPause" @ended="onVideoEnd" @error="onVideoError" id="myVideo"></video>
 
 		<!-- 视频背景图 -->
-		<view v-else class="phone-video-box master-image">
+		<view v-else class="phone-video-box master-image" :style="{ backgroundImage: 'url(' + imgsArr.videoBj + ')' }">
 			<!-- <view class="video-player-icon" @click="handlePlayFirst"></view> -->
 		</view>
 		<!-- 播放引导 -->
-		<view class="yindao-shadow-image" v-if="!showVideo"> </view>
+		<view class="yindao-shadow-image" v-if="!showVideo" :style="{ backgroundImage: 'url(' + imgsArr.pointIcon + ')' }"> </view>
 		<!-- 中间区域 -->
 		<view class="kc-name-box">
-			<icon @click="goUpPage"></icon>
 			<view>{{name}}</view>
 		</view>
 		<view class="kc-info-box">
@@ -42,7 +42,9 @@
 </template>
 
 <script>
+	import cacheManager from '@/utils/cacheManager.js';
 	import * as kechengApi from "@/api/kecheng.js";
+	import customNavbarVue from "@/components/custom-navbar/custom-navbar.vue";
 	import videoPlayVue from "@/components/videoPlay/videoPlay.vue";
 	import kechengMuluVue from "@/components/kecheng-mulu/kecheng-mulu.vue";
 	import {
@@ -70,7 +72,8 @@
 	export default {
 		components: {
 			videoPlayVue,
-			kechengMuluVue
+			kechengMuluVue,
+			customNavbarVue
 		},
 		data() {
 			return {
@@ -100,8 +103,8 @@
 				loading: false, // 加载状态
 				error: false, // 错误状态
 				errorMessage: '', // 错误信息
-				videoContext: null // 视频上下文
-
+				videoContext: null, // 视频上下文
+				imgsArr: {}
 
 			}
 		},
@@ -109,6 +112,8 @@
 			this.kcId = options.kcId;
 			this.from = options.from;
 			this.jzId = options.jzId;
+			this.imgsArr.videoBj = cacheManager.get('projectImg').video_bj;
+			this.imgsArr.pointIcon = cacheManager.get('projectImg').course_point_icon;
 			this.init();
 		},
 		methods: {

static/images/common/play-icon-a.svg

@@ -1 +0,0 @@
-<svg t="1740470471426" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8788" width="60" height="60"><path d="M877.312 1024a59.477333 59.477333 0 0 1-43.093333-18.773333 65.706667 65.706667 0 0 1-17.92-45.226667v-512a65.706667 65.706667 0 0 1 17.92-45.226667 59.477333 59.477333 0 0 1 43.093333-18.773333c16.213333 0 31.573333 6.741333 43.093333 18.773333a65.706667 65.706667 0 0 1 17.834667 45.226667v512a65.706667 65.706667 0 0 1-17.92 45.226667 59.477333 59.477333 0 0 1-43.008 18.773333z m-243.797333 0a59.477333 59.477333 0 0 1-43.178667-18.773333 65.706667 65.706667 0 0 1-17.834667-45.226667V64a65.706667 65.706667 0 0 1 17.92-45.226667 59.477333 59.477333 0 0 1 43.093334-18.773333c16.128 0 31.573333 6.741333 43.093333 18.773333a65.706667 65.706667 0 0 1 17.834667 45.226667v896a65.706667 65.706667 0 0 1-17.92 45.226667 59.477333 59.477333 0 0 1-43.008 18.773333zM389.546667 1024a59.477333 59.477333 0 0 1-43.093334-18.773333 65.706667 65.706667 0 0 1-17.834666-45.226667v-256a65.706667 65.706667 0 0 1 17.92-45.226667 59.477333 59.477333 0 0 1 43.008-18.773333c16.213333 0 31.744 6.741333 43.178666 18.773333a65.706667 65.706667 0 0 1 17.834667 45.226667v256a65.706667 65.706667 0 0 1-17.92 45.226667 59.477333 59.477333 0 0 1-43.093333 18.773333zM145.834667 1024a59.477333 59.477333 0 0 1-43.093334-18.773333 65.706667 65.706667 0 0 1-17.834666-45.226667v-640a65.706667 65.706667 0 0 1 17.92-45.226667A59.477333 59.477333 0 0 1 145.749333 256c16.213333 0 31.658667 6.741333 43.093334 18.773333a65.706667 65.706667 0 0 1 17.92 45.226667v640a65.706667 65.706667 0 0 1-17.92 45.226667 59.477333 59.477333 0 0 1-43.093334 18.773333z" fill="#3fd2a1" p-id="8789" data-spm-anchor-id="a313x.search_index.0.i13.23233a81kOTPLw" class="selected"></path></svg>

static/images/common/play-icon.svg

@@ -1 +0,0 @@
-<svg t="1740470121376" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7751" width="60" height="60"><path d="M507.456 64C262.528 64 64 262.752 64 507.904c0 245.12 198.528 443.872 443.456 443.872 244.896 0 443.456-198.752 443.456-443.872C950.912 262.752 752.352 64 507.456 64z m0 843.408c-220.432 0-399.136-178.88-399.136-399.504C108.32 287.2 287.04 108.368 507.456 108.368c220.432 0 399.136 178.88 399.136 399.536 0 220.624-178.704 399.504-399.136 399.504z m201.28-430.96C639.76 429.44 514.656 359.072 443.36 315.52c-29.232-18.496-53.776-11.088-56.144 21.504-1.728 87.248 0 255.52 0 344.32 1.44 33.04 30.592 37.408 55.92 24.08L708.16 544.736c-0.496-0.272 54.272-30.464 0.592-68.288z" fill="#676767" p-id="7752" data-spm-anchor-id="a313x.search_index.0.i10.23233a81kOTPLw" class="selected"></path></svg>