|
|
@@ -19,6 +19,7 @@
|
|
|
<video :src="videourl" id="myvideo" autoplay controls></video>
|
|
|
<!-- #endif -->
|
|
|
<!-- #ifdef H5 -->
|
|
|
+ <view id="myPlayer" ref="myPlayer"></view>
|
|
|
<!-- #endif -->
|
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
|
<!-- #endif -->
|
|
|
@@ -51,7 +52,7 @@
|
|
|
</view>
|
|
|
<picker mode="date" @change='bindDateChangeb'>
|
|
|
<view class="rlleft flexc">
|
|
|
- <view>2024/06/21</view>
|
|
|
+ <view>{{daytime}}</view>
|
|
|
<image :src="hupimg"></image>
|
|
|
</view>
|
|
|
</picker>
|
|
|
@@ -91,6 +92,10 @@
|
|
|
import {getDictionaryFn} from "@/api/mine/register.js"
|
|
|
import footers from '@/components/footer/footer.vue'
|
|
|
import zbTable from "@/components/zb-table/zb-tables.vue"
|
|
|
+ // #ifdef H5
|
|
|
+ import flvjs from 'flv.js';
|
|
|
+ // #endif
|
|
|
+
|
|
|
export default {
|
|
|
components:{yList,footers,zbTable},
|
|
|
data(){
|
|
|
@@ -124,15 +129,26 @@
|
|
|
wtdt:'',
|
|
|
adridx:0,
|
|
|
address:'',
|
|
|
- adrlist:[{label:'南大门',value:'0'},{label:'北大门',value:'1'}],//阅读状态
|
|
|
+ adrlist:[],//
|
|
|
fixedflag:false,
|
|
|
videourl:'',
|
|
|
nvaHeight:44,
|
|
|
marTop:0,//距离顶部的距离
|
|
|
stubarHeight:0,//
|
|
|
tabtop:0,//表格距离顶部的距离
|
|
|
+ daytime:'',//时间
|
|
|
tabflag:false,
|
|
|
tabscheight:0,//减去的部分
|
|
|
+ autoplay:true,
|
|
|
+ controls:true,
|
|
|
+ enableProgressGesture: false,
|
|
|
+ showPlayBtn: false,
|
|
|
+ showCenterPlayBtn: false,
|
|
|
+ showFullscreenBtn: false,
|
|
|
+ windowWidth: '',
|
|
|
+ windowHeight: '',
|
|
|
+ flvPlayer: null,
|
|
|
+ player: null,
|
|
|
}
|
|
|
},
|
|
|
onPageScroll(e) {
|
|
|
@@ -155,7 +171,7 @@
|
|
|
this.list=[];
|
|
|
this.getDataFn();
|
|
|
})
|
|
|
-
|
|
|
+ this.time()
|
|
|
this.init()
|
|
|
// this.getDataFn()
|
|
|
uni.getSystemInfo({
|
|
|
@@ -185,8 +201,89 @@
|
|
|
},
|
|
|
methods:{
|
|
|
checkPermi, checkRole,
|
|
|
+ time() {
|
|
|
+ var date = new Date();
|
|
|
+ var y = date.getFullYear();
|
|
|
+ var m = date.getMonth() + 1;
|
|
|
+ var d = date.getDate();
|
|
|
+ // var h = date.getHours();
|
|
|
+ // var min = date.getMinutes();
|
|
|
+ // var s = date.getSeconds();
|
|
|
+ // var week = date.getDay(); //获取当前星期X(0-6,0代表星期天)
|
|
|
+ // var weeks = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
|
|
|
+ this.daytime = y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d)
|
|
|
+ // var timeStr = (h < 10 ? ('0' + h) : h) + ':' + (min < 10 ? ('0' + min) : min) + ':' + (s < 10 ? (
|
|
|
+ // '0' + s) : s);
|
|
|
+ },
|
|
|
+ getLivePlayer() {
|
|
|
+ uni.showLoading({
|
|
|
+ mask: true,
|
|
|
+ title: 'loading...'
|
|
|
+ });
|
|
|
+ // 生成需要的video 组件
|
|
|
+ // var player = document.getElementById('videoElement');
|
|
|
+ var player = document.createElement('video');
|
|
|
+ player.id = 'video';
|
|
|
+ player.style = 'width: 100%;height: 211px';
|
|
|
+ player.enableProgressGesture = this.enableProgressGesture;
|
|
|
+ player.controls = this.controls;
|
|
|
+ player.muted = true;
|
|
|
+ player.showCenterPlayBtn = this.showCenterPlayBtn;
|
|
|
+ player.showPlayBtn = this.showPlayBtn;
|
|
|
+ player.showFullscreenBtn = this.showFullscreenBtn;
|
|
|
+ player.x5VideoPlayerType = 'h5-page';
|
|
|
+ player.x5VideoPlayerFullscreen = 'false';
|
|
|
+ player.autoplay = this.autoplay; // 以上均为 video标签的属性配置
|
|
|
+ var myPlayer= document.getElementById('myPlayer')
|
|
|
+ // console.log(myPlayer.childNodes,1)
|
|
|
+ myPlayer.innerHTML=''
|
|
|
+ myPlayer.appendChild(player);
|
|
|
+ if (flvjs.isSupported()) {
|
|
|
+ this.flvPlayer = flvjs.createPlayer({
|
|
|
+ type: 'flv',
|
|
|
+ isLive: true, //<====直播的话，加个这个
|
|
|
+ url: this.videourl//直播流地址
|
|
|
+ });
|
|
|
+ this.flvPlayer.attachMediaElement(player);
|
|
|
+ this.flvPlayer.load(); //加载
|
|
|
+
|
|
|
+ // setTimeout(() => {
|
|
|
+ // var player2 = document.createElement('video');
|
|
|
+ // player2.play();
|
|
|
+ // }, 2000);
|
|
|
+ this.player = player;
|
|
|
+ this.flvPlayer.on(flvjs.Events.ERROR, (errorType, errorDetail, errorInfo) => {
|
|
|
+ console.log('播放错误');
|
|
|
+ this.flv_destroy();
|
|
|
+
|
|
|
+ });
|
|
|
+ uni.hideLoading();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ flv_start() {
|
|
|
+ //开始
|
|
|
+ console.log(this.player);
|
|
|
+ this.player.play();
|
|
|
+ },
|
|
|
+ flv_pause() {
|
|
|
+ //暂停
|
|
|
+ this.player.pause();
|
|
|
+ },
|
|
|
+ flv_destroy() {
|
|
|
+ //停止
|
|
|
+ this.player.pause();
|
|
|
+ this.player.unload();
|
|
|
+ this.player.detachMediaElement();
|
|
|
+ this.player.destroy();
|
|
|
+ this.player = null;
|
|
|
+ },
|
|
|
+ flv_seekto() {
|
|
|
+ // 复制其他人的 我还没用这个
|
|
|
+ this.player.currentTime = parseFloat(document.getElementsByName('seekpoint')[0].value);
|
|
|
+ },
|
|
|
bindDateChangea(e){
|
|
|
var val=e.detail.value;
|
|
|
+ this.adridx=val
|
|
|
this.address=this.adrlist[val].name;
|
|
|
this.indexCode=this.adrlist[val].indexCode;
|
|
|
// 获取直播视频
|
|
|
@@ -198,15 +295,18 @@
|
|
|
if(res.code==200){
|
|
|
var data=res.data.data;
|
|
|
if(data){
|
|
|
- this.videourl=data.url
|
|
|
+ this.videourl=data.url;
|
|
|
+ // #ifdef H5
|
|
|
+ this.getLivePlayer()
|
|
|
+ // #endif
|
|
|
}
|
|
|
}else{
|
|
|
this.$toast(res.msg)
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
- bindDateChangeb(){
|
|
|
-
|
|
|
+ bindDateChangeb(e){
|
|
|
+ this.daytime=e.detail.value
|
|
|
},
|
|
|
getrefreshData(){
|
|
|
this.pageNum=1;
|
|
|
@@ -323,7 +423,7 @@ page{background: #ffffff;}
|
|
|
}
|
|
|
.navbg{width: 100%;height: 692rpx;}
|
|
|
.vidbox{overflow: hidden;
|
|
|
- border-radius: 14rpx;box-sizing: border-box;width:100%;height: 444rpx;position: relative;
|
|
|
+ border-radius: 14rpx;box-sizing: border-box;width:100%;position: relative;
|
|
|
video{width: 100%;height: 450rpx;}
|
|
|
.vidfot{padding: 0 20rpx 0 30rpx;
|
|
|
height: 76rpx;background: rgba(0, 0, 0, 0.5);position: absolute;left: 0;right: 0;bottom: 0;
|
zouling