修改录音

App.vue

@@ -43,11 +43,6 @@
 									var sec = time.split(':')[0];
 									return Number(sec);
 								}
-
-								// var hour = time.split(':')[0];
-								// var min = time.split(':')[1];
-								// var sec = time.split(':')[2];
-								// return  Number(hour*3600) + Number(min*60) + Number(sec);
 							},
 
 							// 目前使用页面为录音页面

components/uniapp-zaudio/zaudio.vue

@@ -22,9 +22,10 @@
 						<slider class="audio-slider" :activeColor="themeColor" block-size="16"
 							:value="renderData('current_value')" :max="renderData('duration_value')" @change="change"
 							:disabled="!renderIsPlay"></slider>
-						<text>
-							{{renderData('duration') || '00:00:00'}}
+						<text v-if="!duration">
+							{{renderData('duration')}}
 						</text>
+						<text v-else>{{ duration }}</text>
 					</view>
 				</view>
 			</view>
@@ -146,6 +147,10 @@
 				type: String,
 				default: '#42b983'
 			},
+			duration: {
+				type: String,
+				default: ""
+			}
 		},
 		data() {
 			return {
@@ -165,7 +170,6 @@
 						if (name == 'paused') {
 							return true;
 						}
-
 						return this.audio[name];
 					} else {
 						if (name == 'paused') {
@@ -185,7 +189,7 @@
 					playinfo,
 					renderIsPlay,
 					renderinfo,
-					loading
+					loading,
 				}) => {
 					this.audiolist = audiolist;
 					this.paused = paused;
@@ -198,6 +202,22 @@
 			});
 		},
 		methods: {
+			// 转换时间
+			formatSeconds(seconds) {
+				var result = typeof seconds === "string" ? parseFloat(seconds) : seconds;
+				if (isNaN(result)) return "";
+				let h = Math.floor(result / 3600) < 10 ?
+					"0" + Math.floor(result / 3600) :
+					Math.floor(result / 3600);
+				let m = Math.floor((result / 60) % 60) < 10 ?
+					"0" + Math.floor((result / 60) % 60) :
+					Math.floor((result / 60) % 60) + h * 60;
+				let s = Math.floor(result % 60) < 10 ?
+					"0" + Math.floor(result % 60) :
+					Math.floor(result % 60);
+				return `${h}:${m}:${s}`;
+			},
+			
 			//播放or暂停
 			operate() {
 				this.$zaudio.operate();

pages/center/Piabodata/Customerportrait/Receivedetailabout.vue

@@ -38,7 +38,7 @@
 			<view class="dialog-block" v-for="(dialog,i) in dialogList" :key="i">
 				<view :id="'dialog'+i" class="fileName">录音文件</view>
 				<view class="text" :id="'dialog'+csdFileindex+'text'+item.bg"
-					:class="{active:  Math.floor(item.bg/1000) <= playNow && Math.floor(item.ed/1000) > playNow && i==0}"
+					:class="{active:  Math.floor(item.bg/1000) <= playNow && Math.floor(item.ed/1000) > playNow && i==0, isGreen: item.isShow == 0 }"
 					v-for="(item,index) in dialog.message" :key="index" :data-speaker="item.speaker">
 					<view class="avatar">
 						<view :style="[SPEAKERSTYLE(item.speaker)]">
@@ -79,7 +79,7 @@
 								</view>
 							</view>
 							<image @click="clickbofang(dialog.backindex,item)" class="play"
-								src="../../static/images/recordingManagement/play.png"></image>
+								src="@/static/images/recordingManagement/play.png"></image>
 						</view>
 					</view>
 				</view>
@@ -90,7 +90,7 @@
 
 		<view class="bottombox">
 			<!-- 播放块 -->
-			<zaudio theme="theme4"></zaudio>
+			<zaudio :duration="duration" theme="theme4"></zaudio>
 			<!-- 底部弹框 -->
 			<view class="botbotmm">
 				<view class="tmmchen" @click="guanjiancishifo()">
@@ -441,6 +441,7 @@
 
 				ACTION: Symbol('zaudio'), // 唯一值区分每个页面的方法
 				isPageHide: false, // 是否息屏
+				duration: '', // 总时长
 			};
 		},
 
@@ -464,18 +465,26 @@
 				this.sliderChangeComplate(this.TIMEEVENT(time))
 			})
 			this.$zaudio.on('playing', this.ACTION, (obj) => {
+				this.duration = obj.duration
 				this.TimeUpdate(this.TIMEEVENT(obj.current))
 			})
 			this.$zaudio.on('error', this.ACTION, e => {
 				// this.qeihuanwenjian()
 				console.log(e, '加载失败')
 			})
+			
+			this.$zaudio.on('ended', this.ACTION, e => {
+				this.$zaudio.stop()
+				this.init({bg: 0, customerId: this.customerId})
+			})
 			uni.$on('Receivedetailabout', info => {
 				this.init(info)
 			})
 		},
 
 		onShow() {
+			//实时渲染当前的播放状态
+			this.$zaudio.syncRender()
 			let newmenulist = uni.getStorageSync('weapp_session_Menu_data');
 			this.permissions.commonly1 = newmenulist.bjgw;
 			// this.permissions.commonly2=newmenulist.jdwxbj;
@@ -1931,8 +1940,6 @@
 				.content {
 					margin-left: 0;
 					margin-right: 30upx;
-					background: #F6F6F6;
-					color: #999999;
 				}
 
 				.play {
@@ -1945,6 +1952,7 @@
 	}
 
 	.scroll-Y .text .avatar {
+		margin-top: 80rpx;
 		width: 64upx;
 		height: 64upx;
 		line-height: 64upx;
@@ -1968,10 +1976,8 @@
 		line-height: 60rpx;
 		text-align: left;
 		padding: 0 5px;
-		background: #2BC805;
 		border-radius: 8upx;
 		max-width: 442rpx;
-		color: #FFFFFF;
 		position: relative;
 
 		.tankuangcss {
@@ -1993,14 +1999,14 @@
 	}
 
 	.scroll-Y .text.active .content {
-		color: #38FFF1 !important;
+		color: #FF7538 !important;
 		position: relative;
 	}
 
 	.scroll-Y .text.active[data-speaker="2"] .content,
 	.scroll-Y .text.active[data-speaker="4"] .content,
 	.scroll-Y .text.active[data-speaker="6"] .content {
-		color: #FF7538;
+		color: #FF7538 !important;
 		position: relative;
 	}
 
@@ -2046,10 +2052,10 @@
 		line-height: 60rpx;
 		text-align: left;
 		padding: 0 5px;
-		background: #2BC805;
 		border-radius: 8upx;
 		max-width: 442rpx;
-		color: #FFFFFF;
+		background: #F6F6F6;
+		color: #999999;
 		position: relative;
 
 		.tankuangcss {
@@ -2343,4 +2349,8 @@
 	.rotatearrow {
 		transform: rotate(270deg);
 	}
+	.scroll-Y .isGreen .contentInfo .contentMain .content {
+		background: #2BC805 !important;
+		color: #FFFFFF;
+	}
 </style>

pages/index/learning.vue

@@ -208,6 +208,14 @@
 					setTimeout(function() {
 						uni.hideLoading();
 					}, 2000);
+					console.log(res)
+					if (!res[0]) {
+						uni.showToast({
+							title: '当前学习案例暂无数据',
+							icon: 'none'
+						})
+						return
+					}
 					if (res[0].merge == 0) {
 						uni.navigateTo({
 							url: `/pages/learning/Equinoctial/index2?customerId=${newobj.customerId}&biaoqian=${this.equinoctial[this.leftIndex].name}&startTime=${item.startTime}&startFile=${item.startFile}`

pages/learning/Equinoctial/index.vue

@@ -16,7 +16,7 @@
 				</view>
 			</view>
 
-			<zaudio theme="theme4"></zaudio>
+			<zaudio :duration="duration" theme="theme4"></zaudio>
 		</view>
 		<scroll-view :scroll-top="scrollTop" lower-threshold='20px' @scrolltolower="ltolower()"
 			:scroll-into-view="scrollId" scroll-y="true" class="text scroll-Y">
@@ -25,7 +25,7 @@
 				<!-- 聊天记录-->
 				<view class="dialog-block" v-for="(dialog,i) in dialogList" :key="i">
 					<view :id="'dialog'+i" class="fileName">录音文件</view>
-					<view class="text dingweishiy" :id="'dialog'+csdFileindex+'text'+index"
+					<view class="text dingweishiy" :id="'dialog'+csdFileindex+'text'+item.bg"
 						:class="{active: Math.floor(item.bg/1000) <= playNow && Math.floor(item.ed/1000) > playNow && i==0}"
 						v-for="(item,index) in dialog.message" :key="index" :data-speaker="item.speaker">
 						<view class="avatar">
@@ -185,7 +185,6 @@
 
 				alltimeStr: "00:00",
 				end: false,
-				timeStr: "00:00", //总的时间
 				recordPath: "",
 				csdFileindex: 0,
 				biaoqian: "",
@@ -196,6 +195,7 @@
 
 				ACTION: Symbol('zaudio'), // 唯一值区分每个页面的方法
 				isPageHide: false, // 是否息屏
+				duration: '', // 播放时长
 			};
 		},
 		onLoad(options) {
@@ -217,6 +217,7 @@
 				this.sliderChangeComplate(this.TIMEEVENT(time))
 			})
 			this.$zaudio.on('playing', this.ACTION, (obj) => {
+				this.duration = obj.duration
 				this.TimeUpdate(this.TIMEEVENT(obj.current))
 			})
 			this.$zaudio.on('ended', this.ACTION, e => {
@@ -388,8 +389,6 @@
 							if (cet.id == this.startFile) {
 								this.csdFileindex = index;
 								this.recordPath = res[index].recordPath
-								this.sliderMax = this.getTime(res[index].recordDuration)
-								this.timeStr = this.getTime(res[index].recordDuration)
 								this.date = res[index].receptionTime
 								this.num = index; //下拉起始位置
 								this.Bnum = index;
@@ -517,12 +516,8 @@
 			filechange(item, i) {
 				this.num = i; //下拉起始位置
 				this.Bnum = i;
-				console.log("下拉下标", this.Bnum)
-				console.log("上拉下标", this.num)
 				this.csdFileindex = i;
 				this.recordPath = item.recordPath;
-				this.sliderMax = this.getTime(item.recordDuration);
-				this.timeStr = this.getTime(item.recordDuration);
 				this.date = item.receptionTime;
 				this.isshowFile = false;
 				setTimeout(() => {
@@ -1301,7 +1296,7 @@
 	}
 
 	.scroll-Y .text.active .content {
-		color: #38FFF1 !important;
+		color: #FF7538 !important;
 		position: relative;
 	}
 

pages/learning/Equinoctial/index2.vue

@@ -32,7 +32,7 @@
 				<!-- 聊天记录-->
 				<view class="dialog-block" v-for="(dialog,i) in dialogList" :key="i">
 					<view :id="'dialog'+i" class="fileName">录音文件</view>
-					<view class="text dingweishiy" :id="'dialog'+csdFileindex+'text'+index" 
+					<view class="text dingweishiy" :id="'dialog'+csdFileindex+'text'+item.bg" 
 						  :class="{active: item.bg < playNow &&  item.ed > playNow &&  i==0}"
 						  v-for="(item,index) in dialog.message" :key="index" :data-speaker="item.speaker"
 					>
@@ -1273,7 +1273,7 @@
 	}
 
 	.scroll-Y .text.active .content {
-		color: #38FFF1 !important;
+		color: #FF7538 !important;
 		position: relative;
 	}
 

pages/learning/Thefulltext/index.vue

@@ -1367,7 +1367,7 @@
 	}
 
 	.scroll-Y .text.active .content {
-		color: #38FFF1 !important;
+		color: #FF7538 !important;
 		position: relative;
 	}
 

pages/learning/Thefulltext/index2.vue

@@ -29,7 +29,7 @@
 					<view :id="'dialog'+i" class="fileName">录音文件</view>
 
 					<view class="text" :id="'dialog'+csdFileindex+'text'+item.bg"
-						:class="{active: item.bg < playNow &&  item.ed > playNow &&  i== 0}"
+						:class="{active: Math.floor(item.bg/1000) < playNow &&  Math.floor(item.ed/1000) > playNow &&  i== 0, isGreen: item.isShow == 0}"
 						v-for="(item,index) in dialog.message" :key="index" :data-speaker="item.speaker">
 						<view class="avatar">
 							<view class="avatar">
@@ -223,6 +223,7 @@
 				
 				ACTION: Symbol('zaudio'), // 唯一值区分每个页面的方法
 				isPageHide: false, // 是否息屏
+				duration: '',
 				
 			};
 		},
@@ -250,9 +251,14 @@
 				this.sliderChangeComplate(this.TIMEEVENT(time))
 			})
 			this.$zaudio.on('playing', this.ACTION, (obj) => {
+				this.duration = obj.duration
 				this.TimeUpdate(this.TIMEEVENT(obj.current))
 			})
 			
+			uni.$on('THEFULLTEXT2', info => {
+				this.getluyinList(info)
+			})
+			
 		},
 		onShow() {
 			//实时渲染当前的播放状态
@@ -260,16 +266,8 @@
 			this.initRecord();
 			if (this.stateisshow == 2) {
 				var info = this.itemobj;
-			// } else {
-			// 	var pages = getCurrentPages();
-			// 	var currPage = pages[pages.length - 1]; //当前页面
-			// 	var info = currPage.data.info;
 			}
 			
-			uni.$on('THEFULLTEXT2', info => {
-				this.getluyinList(info)
-			})
-			
 			!this.isPageHide && this.getluyinList(info);
 		},
 		
@@ -670,8 +668,6 @@
 				this.textareaFocus = false;
 			},
 			
-			
-			
 			//录音实例
 			zyAudio() {
 				let data = [
@@ -1191,10 +1187,10 @@
 		line-height: 60rpx;
 		text-align: left;
 		padding: 0 5px;
-		background: #2BC805;
+		background: #F6F6F6;
 		border-radius: 8upx;
 		max-width: 442rpx;
-		color: #FFFFFF;
+		color: #999999;
 		position: relative;
 
 		.tankuangcss {
@@ -1213,9 +1209,13 @@
 			border-radius: 15rpx;
 		}
 	}
+	.scroll-Y .isGreen .contentInfo .contentMain .content {
+		background: #2BC805 !important;
+		color: #FFFFFF;
+	}
 
 	.scroll-Y .text.active .content {
-		color: #38FFF1 !important;
+		color: #FF7538 !important;
 		position: relative;
 	}
 

pages/mine/details.vue

@@ -27,9 +27,6 @@
 						src="../../static/images/nopike.png" mode=""></image>
 				</view>
 			</view>
-			<!-- 			<yz-audio :nowFileTime="nowTime" class="audio-container" ref="zyAudio" @ended="qeihuanwenjian" @timeUpdate="TimeUpdate"
-				@sliderChangeComplate="sliderChangeComplate"></yz-audio> -->
-
 			<zaudio theme="theme4"></zaudio>
 		</view>
 		<scroll-view :scroll-top="scrollTop" lower-threshold='20px' @scrolltolower="ltolower()"
@@ -275,11 +272,16 @@
 				this.TimeUpdate(this.TIMEEVENT(obj.current))
 			})
 			this.$zaudio.on('ended', this.ACTION, e => {
+				this.$nextTick(() => {
+					this.scrollId = "";
+				})
 				this.qeihuanwenjian()
 			})
 			this.$zaudio.on('error', this.ACTION, e => {
-				// this.qeihuanwenjian()
-				console.log(e, '加载失败')
+
+			})
+			uni.$on('DETAILSINIT', info => {
+				this.init(info)
 			})
 		},
 		onShow() {
@@ -293,9 +295,6 @@
 			if (this.stateisshow == 2) {
 				var info = this.itemobj;
 			}
-			uni.$on('DETAILSINIT', info => {
-				this.init(info)
-			})
 			this.gituserlist()
 			!this.isPageHide && this.init(info)
 		},
@@ -310,6 +309,7 @@
 			this.$zaudio.off('stop', this.ACTION);
 			this.$zaudio.off('playing', this.ACTION);
 			this.$zaudio.off('ended', this.ACTION);
+			this.$zaudio.off('error', this.ACTION);
 		},
 		
 
@@ -881,7 +881,6 @@
 			},
 			//长按点击播放
 			clickbofang(dialog, item) {
-				console.log(dialog, item)
 				this.dialogList.forEach(res => {
 					res.message.forEach(asd => {
 						asd.isshow = false;
@@ -1296,8 +1295,6 @@
 		.content {
 			margin-left: 0;
 			margin-right: 30upx;
-			background: #F6F6F6;
-			color: #999999;
 		}
 	}
 
@@ -1324,10 +1321,10 @@
 		line-height: 60rpx;
 		text-align: left;
 		padding: 0 5px;
-		background: #2BC805;
+		background: #F6F6F6;
 		border-radius: 8upx;
 		max-width: 442rpx;
-		color: #FFFFFF;
+		color: #999;
 		position: relative;
 
 		.tankuangcss {
@@ -1349,7 +1346,7 @@
 	}
 
 	.scroll-Y .text.active .content {
-		color: #38FFF1 !important;
+		color: #FF7538 !important;
 		position: relative;
 	}
 
@@ -1359,6 +1356,12 @@
 		color: #FF7538 !important;
 		position: relative;
 	}
+	
+	
+	.scroll-Y .isGreen .contentInfo .contentMain .content {
+		background: #2BC805 !important;
+		color: #FFFFFF;
+	}
 
 	.tab-box {
 		width: 100%;

pages/mine/details2.vue

@@ -34,7 +34,7 @@
 				<view :id="'dialog'+i" class="fileName">录音文件</view>
 				<block v-for="(item,index) in dialog.message" :key="index">
 					<view class="text"
-						:class="{active: Math.floor(item.bg/1000) <= playNow && Math.floor(item.ed/1000) > playNow && i==0}"
+						:class="{active: Math.floor(item.bg/1000) <= playNow && Math.floor(item.ed/1000) > playNow && i==0, isGreen: item.isShow == 0}"
 						:data-speaker="item.speaker" :id="'dialog'+csdFileindex+'text'+item.bg">
 						<view class="avatar">
 							<view :style="[SPEAKERSTYLE(item.speaker)]">
@@ -84,7 +84,7 @@
 		</scroll-view>
 		<view class="bottombox">
 			<!-- 播放块 :src="recordPath" -->
-			<zaudio theme="theme4"></zaudio>
+			<zaudio :duration="duration" theme="theme4"></zaudio>
 			<!-- 底部弹框 -->
 			<view class="botbotmm">
 				<view class="tmmchen" @click="guanjiancishifo()">
@@ -435,7 +435,6 @@
 				tablist: [],
 				roleindex: 0,
 				roleindexbiaoji: 0,
-				sliderValue: 0, //进度条最小值
 				recordPath: "",
 				customerId: "",
 				luyinList: [], //录音文件
@@ -524,6 +523,7 @@
 				roletiaoshu: 0,
 				ACTION: Symbol('zaudio'), // 唯一值区分每个页面的方法
 				isPageHide: false, // 是否息屏
+				duration: '', // 总时长
 			};
 		},
 		computed: {
@@ -548,12 +548,19 @@
 				this.sliderChangeComplate(this.TIMEEVENT(time))
 			})
 			this.$zaudio.on('playing', this.ACTION, (obj) => {
+				this.duration = obj.duration
 				this.TimeUpdate(this.TIMEEVENT(obj.current))
 			})
 			this.$zaudio.on('error', this.ACTION, e => {
-				// this.qeihuanwenjian()
 				console.log(e, '加载失败')
 			})
+			this.$zaudio.on('ended', this.ACTION, e => {
+				this.$zaudio.stop()
+				this.init({bg: 0, customerId: this.customerId})
+			})
+			uni.$on('DETAILS2INIT', (info) => {
+				this.init(info)
+			});
 		},
 
 
@@ -580,9 +587,6 @@
 			if (this.stateisshow == 2) {
 				var info = this.itemobj;
 			}
-			uni.$on('DETAILS2INIT', (info) => {
-				this.init(info)
-			});
 			!this.isPageHide && this.init(info);
 		},
 
@@ -962,6 +966,7 @@
 				var bgcd = this.playNow * 1000;
 				this.newluyinList = [];
 				this.dialogList = [];
+				console.log(this.playNow, '当前播放时长')
 				let obj = {
 					corpusId: this.luyinList[this.csdFileindex].id,
 					bg: bgcd,
@@ -1503,6 +1508,8 @@
 								})
 							}
 						})
+						this.dialogList = [];
+						this.newluyinList = []
 						this.newluyinList = jsonInfo;
 						this.dialogList.push(jsonInfo[this.textindex]);
 						this.adasdasdasd(Math.floor(info.bg / 1000))
@@ -2135,8 +2142,6 @@
 				.content {
 					margin-left: 0;
 					margin-right: 30upx;
-					background: #F6F6F6;
-					color: #999999;
 				}
 
 				.play {
@@ -2178,6 +2183,7 @@
 	}
 
 	.scroll-Y .text .avatar {
+		margin-top: 80rpx;
 		width: 64upx;
 		height: 64upx;
 		line-height: 64upx;
@@ -2190,7 +2196,6 @@
 			width: 40upx;
 		}
 	}
-
 	.scroll-Y .text .contentInfo .info {
 		color: #ccc;
 		font-size: 18rpx;
@@ -2208,10 +2213,10 @@
 		line-height: 60rpx;
 		text-align: left;
 		padding: 0 5px;
-		background: #2BC805;
 		border-radius: 8upx;
 		max-width: 442rpx;
-		color: #FFFFFF;
+		background: #F6F6F6;
+		color: #999999;
 		position: relative;
 
 		.tankuangcss {
@@ -2515,14 +2520,20 @@
 
 
 	.scroll-Y .text.active .content {
-		color: #38FFF1 !important;
+		color: #FF7538 !important;
 		position: relative;
 	}
 
+	.scroll-Y .text.active[data-speaker] .content,
 	.scroll-Y .text.active[data-speaker="2"] .content,
 	.scroll-Y .text.active[data-speaker="4"] .content,
 	.scroll-Y .text.active[data-speaker="6"] .content {
 		color: #FF7538 !important;
 		position: relative;
 	}
+	
+	.scroll-Y .isGreen .contentInfo .contentMain .content {
+		background: #2BC805 !important;
+		color: #FFFFFF;
+	}
 </style>