export default {
data() {
return {
// 进度条信息
Slider: {
// 进度条当前进度
Value: 0,
// 进度条最大值
Max: 100
},
// 进度信息
Schedule: {
current: "00:00",
assemble: "00:00"
},
// 操作信息
Operate: {
// 是否循环播放 1 顺序播放 2 循环播放
audio_play: 1,
// 是否收藏 1 未收藏 2 已收藏
collection: 1,
},
// 用户信息
userinfo: {},
// 音频id
course_details_id: '',
// 获取到的音频信息
Audio_Info: {},
// 背景音乐管理器
AudioCreate: null,
// 音频是否播放
Audio_pay: false,
// 倍速
Double_Speed: '1.0',
// 倍速选择
Buttons: [{
title: "0.5"
},
{
title: "0.8"
},
{
title: "1.0"
},
{
title: "1.25"
},
{
title: "1.5"
},
{
title: "2.0"
}
],
// 通知栏控制器
musicNotification: null,
// 是否创建了通知栏
isCreateNotification: false,
// 字体大小
Size: 1
}
},
onLoad(param) {
this.AudioCreate = uni.getBackgroundAudioManager()
this.musicNotification = uni.requireNativePlugin('XZH-musicNotification');
this.course_details_id = param.course_details_id
/**
* 初始化通知栏
*/
this.musicNotification.init({
//点击通知栏跳转页面
path: '/pages/audio/AudioDetails?course_details_id=' + this.course_details_id,
icon: '',
});
this.createNotification()
this.showFloatWindow()
// 监听生命周期事件回调
plus.globalEvent.addEventListener('musicLifecycle', (e) => {
console.log("生命周期", e);
});
// 监听暂停或播放按钮事件回调
plus.globalEvent.addEventListener('musicNotificationPause', (e) => {
console.log("暂停或播放按钮事件回调", e);
this.PlayPause()
});
// 监听播放上一首按钮事件回调
plus.globalEvent.addEventListener('musicNotificationPrevious', (e) => {
console.log("播放上一首按钮事件回调", e);
this.PreviousEpisode()
});
// 监听播放下一首按钮事件回调
plus.globalEvent.addEventListener('musicNotificationNext', (e) => {
console.log("播放下一首按钮事件回调", e);
this.NextSet()
});
// 监听收藏按钮事件回调
plus.globalEvent.addEventListener('musicNotificationFavourite', (e) => {
console.log("收藏按钮事件回调", e);
this.CollectFn()
});
// 监听关闭按钮事件回调
plus.globalEvent.addEventListener('musicNotificationClose', (e) => {
console.log("关闭按钮事件回调", e);
});
// 监听通知栏进度条拖动事件回调
plus.globalEvent.addEventListener('musicSeekTo', (e) => {
console.log("通知栏进度条拖动事件回调", e.position);
this.AudioCreate.seek(e.position)
});
// this.musicNotification.switchNotification(true)
this.AudioCreate.onCanplay((e) => {
if (this.isCreateNotification == true) {
console.log(this.Audio_Info)
// let res = this.musicNotification.update({
// //歌曲名字
// songName: this.Audio_Info.title,
// //专辑名字
// artistsName: this.Audio_Info.title,
// //收藏
// favour: this.Operate.collection == 1 ? false : true,
// //专辑图片
// picUrl: 'http://m.hanxuejy.com.cn/logo.png',
// // 时长
// duration: this.AudioCreate.duration ? this.AudioCreate.duration * 1000 : 0
// });
// switch (res.code) {
// case -1: //未知错误
// console.log("未知错误", res);
// return;
// case -2: //没有权限
// console.log(res.code)
// this.musicNotification.openPermissionSetting(); //没有权限，跳转设置页面
// return;
// }
}
})
},
onShow() {
let that = this
uni.getStorage({
key: 'userinfo',
success(res) {
that.userinfo = res.data
}
})
this.getAudioDetail()
},
onUnload() {
},
onHide: function() {
// 移除监听生命周期事件回调
plus.globalEvent.removeEventListener('musicLifecycle')
// 移除暂停或播放按钮事件回调监听
plus.globalEvent.removeEventListener('musicNotificationPause')
// 移除播放上一首按钮事件回调监听
plus.globalEvent.removeEventListener('musicNotificationPrevious')
// 移除播放下一首按钮事件回调监听
plus.globalEvent.removeEventListener('musicNotificationNext')
// 移除收藏按钮事件回调监听
plus.globalEvent.removeEventListener('musicNotificationFavourite')
// 移除关闭按钮事件回调
plus.globalEvent.removeEventListener('musicNotificationClose')
// 移除耳机事件回调监听
plus.globalEvent.removeEventListener('musicMediaButton')
// 移除通知栏进度条拖动事件回调
plus.globalEvent.removeEventListener('musicSeekTo')
},
methods: {
/**
* 判断是否有悬浮窗权限
*/
showFloatWindow() {
if (this.checkOverlayDisplayPermission()) {
console.log('有悬浮窗权限')
this.musicNotification.showFloatWindow("#AD1EF7")
} else {
// 没有权限，弹出一个对话框
this.showLockActivityModal(() => this.musicNotification.showFloatWindow("#AD1EF7"))
}
},
/**
* 检查是否有浮窗权限
*/
checkOverlayDisplayPermission() {
return this.musicNotification.checkOverlayDisplayPermission()
},
/**
* 通知用户
*/
showLockActivityModal(callback) {
uni.showModal({
content: '该功能需要开启悬浮窗权限',
success: ({
confirm
}) => {
if (confirm) {
// 用户点击确定，注册授权监听
plus.globalEvent.addEventListener('openLockActivity', ({
type
}) => {
// 获得悬浮窗权限
if (type) callback();
// 注销授权监听
plus.globalEvent.removeEventListener('openLockActivity');
});
/**
* 没有悬浮窗权限，跳转设置页面
*/
this.musicNotification.openOverlaySetting();
}
}
});
},
/**
* 判断是否创建了通知栏
*/
createNotification() {
// 创建通知栏，要创建通知栏成功才能做别的操作
return new Promise((resolve, reject) => {
this.musicNotification.createNotification(() => {
console.log('通知栏创建成功')
this.isCreateNotification = true;
resolve();
})
})
},
/**
* 获取到音频信息
*/
getAudioDetail(type) {
let params = {
user_id: this.userinfo.id,
course_details_id: this.course_details_id
}
this.$api.getAudioDetail(params).then(res => {
this.Audio_Info = res.data.data
this.Operate.collection = res.data.data.collection
if (this.isCreateNotification) {
this.CreateAudioManager()
}
}).catch(error => {
console.log(error)
})
},
/**
* 创建背景音乐管理器
*/
CreateAudioManager() {
// 1. 设置音频信息
// 1.1 设置音频标题
this.AudioCreate.title = this.Audio_Info.title;
// 1.2 设置封面图url
this.AudioCreate.coverImgUrl = 'http://m.hanxuejy.com.cn/logo.png';
// 1.3 设置音频的数据源
this.AudioCreate.src = this.Audio_Info.audio;
// 2. 获取音频时长
this.AudioCreate.onCanplay(res => {
let intervalID = setInterval(() => {
let time = this.AudioCreate.duration
if (!Number.isFinite(time)) {
this.AudioCreate.seek(0)
}
if (time !== 0 && time !== Infinity) {
clearInterval(intervalID);
let time2 = time ? time.toFixed(0) : this.AudioCreate.duration.toFixed(0);
let min2 = Math.floor(time2 / 60)
let second2 = time2 % 60
this.Schedule.assemble = (min2 >= 10 ? min2 : '0' + min2) + ':' + (
second2 >= 10 ? second2 : '0' +
second2)
}
}, 100);
});
// 3. 播放音频
// 3.1 监听播放事件
this.AudioCreate.onPlay((e) => {
this.Audio_pay = true
this.musicNotification.playOrPause(true)
});
// 3.2 监听播放进度
this.AudioCreate.onTimeUpdate((e) => {
let time1 = this.AudioCreate.currentTime.toFixed(0) || 0
let position = Math.max(0, this.AudioCreate.currentTime)
let min1 = Math.floor(time1 / 60)
let second1 = time1 % 60
this.Schedule.current = (min1 >= 10 ? min1 : '0' + min1) + ':' + (second1 >= 10 ? second1 :
'0' +
second1)
this.Slider.Value = this.AudioCreate.currentTime || 0
this.Slider.Max = this.AudioCreate.duration || 0
let time2 = this.AudioCreate.duration.toFixed(0);
let min2 = Math.floor(time2 / 60)
let second2 = time2 % 60
this.Schedule.assemble = (min2 >= 10 ? min2 : '0' + min2) + ':' + (
second2 >= 10 ? second2 : '0' +
second2)
this.musicNotification.setPosition(position * 1000);
});
// 4. 监听音频自然播放结束
this.AudioCreate.onEnded(e => {
console.log('音频播放结束了', e)
this.NextSet()
});
// 4. 监听音频播放出现错误
this.AudioCreate.onError((e) => {
console.log('音频播放出现错误', e)
});
},
/**
* 上一集
*/
PreviousEpisode() {
if (!this.Audio_Info.previous_episode) {
uni.showToast({
title: '已经是第一集了',
icon: 'none'
})
return
}
this.course_details_id = this.Audio_Info.previous_episode.id
this.getAudioDetail()
},
/**
* 下一集
*/
NextSet() {
if (!this.Audio_Info.next_set) {
uni.showToast({
title: '已经是最后一集了',
icon: 'none'
})
return
}
this.course_details_id = this.Audio_Info.next_set.id
this.getAudioDetail()
},
/**
* 用户拖动进度条
*/
SliderChange(e) {
this.AudioCreate.seek(e.detail.value);
let position = Math.max(0, this.AudioCreate.currentTime)
this.musicNotification.setPosition(position * 1000);
},
/**
* 音频的播放与暂停
*/
PlayPause() {
if (this.Audio_pay) {
this.AudioCreate.pause()
} else {
this.AudioCreate.play()
}
this.musicNotification.playOrPause(!this.Audio_pay)
this.Audio_pay = !this.Audio_pay
},
/**
* 音乐进度
*/
Progress(type) {
const currentTime = this.AudioCreate.currentTime;
if (type == 1) {
this.AudioCreate.seek(currentTime - 0.5);
} else {
this.AudioCreate.seek(currentTime + 0.5);
}
},
/**
* 倍速选择
*/
DoubleSpeed() {
let that = this
plus.nativeUI.actionSheet({
title: "请选择倍速",
cancel: "取消",
buttons: that.Buttons
},
function(e) {
let Double_speed = Number(that.Buttons[e.index - 1].title)
that.Double_Speed = that.Buttons[e.index - 1].title
that.AudioCreate.playbackRate = Double_speed
}
);
},
/**
* 收藏
*/
CollectFn() {
if (!this.userinfo.id) {
uni.showToast({
icon: 'none',
title: '請先登錄',
duration: 1000
})
setTimeout(() => {
uni.navigateTo({
url: '../login/login'
})
}, 300)
return
}
let params = {
user_id: this.userinfo.id,
token: this.userinfo.token,
is_collection: this.Operate.collection == 1 ? 2 : 1,
type: 2,
collection_id: this.Audio_Info.id
}
this.$api.getCollection(params).then(res => {
if (res.data.code == '200') {
this.Operate.collection = this.Operate.collection == 1 ? 2 : 1
// this.getAudioDetail(1)
uni.showToast({
title: res.data.msg,
duration: 1000
})
} else {
uni.showToast({
title: res.data.msg,
duration: 1000
})
}
})
},
/**
* 下载
*/
DownloadFn() {
let that = this
uni.showLoading({
title: '正在下载',
mask: true
})
let url = this.Audio_Info.audio;
let name = this.Audio_Info.title + '.mp3';
// var name = 'fileName.docx'; //文件名称可以在上传时进行保存，下载时取出，当文件名称中存在单双引号时，要做好处理，否则会报错
var dtask = plus.downloader.createDownload(
url, {
filename: "file://storage/emulated/0/漢學教育/" + name //利用保存路径，实现下载文件的重命名
},
function(d, status) {
var fileSaveUrl = plus.io.convertLocalFileSystemURL(d.filename);
// plus.runtime.openFile(d.filename); //选择软件打开文件
uni.showToast({
icon: 'none',
title: '文件已保存,请到“漢學教育”文件夹查看',
duration: 3000
})
plus.nativeUI.toast("下载成功", {
background: "rgba(255, 255, 255, 0.6)"
})
uni.hideLoading()
// 添加下载记录
// downloadApi(id, 1).then(res => {
// console.log(res)
// })
}
);
dtask.start();
},
/**
* 分享
*/
ShareFn(title, audio) {
plus.nativeUI.actionSheet({
title: "选择分享",
cancel: "取消",
buttons: [{
title: "微信聊天框"
}, {
title: "微信朋友圈"
}]
}, function(e) {
switch (e.index) {
case 1:
uni.share({
provider: "weixin",
scene: "WXSceneSession",
type: 3,
title: title,
mediaUrl: audio,
success: function(res) {
console.log("success:" + JSON.stringify(res));
},
fail: function(err) {
console.log("fail:" + JSON.stringify(err));
}
});
break;
case 2:
uni.share({
provider: "weixin",
scene: "WXSceneTimeline",
type: 3,
title: title,
mediaUrl: audio,
success: function(res) {
console.log("success:" + JSON.stringify(res));
},
fail: function(err) {
console.log("fail:" + JSON.stringify(err));
}
});
break;
}
})
},
/**
* 选择字体大小
*/
SelectSize(index) {
if (this.Size == index) return
this.Size = index
}
}
}音频的onError也没有触发
0 个回复