视频播放
This commit is contained in:
wyw
parent
78d93e94f9
commit
ce3749966e
@ -67,6 +67,12 @@
|
||||
"navigationBarTitleText": "视频查看"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/apply/viewVideoplyplayer",
|
||||
"style": {
|
||||
"navigationBarTitleText": "视频播放"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/apply/complete",
|
||||
"style": {
|
||||
|
||||
@ -3,7 +3,6 @@
|
||||
<view class="content">
|
||||
<view class="container">
|
||||
<view class="form-sub">
|
||||
|
||||
<u-form :model="model" ref="uForm" label-width="90px" class="demo-ruleForm" size="mini">
|
||||
<view style="font-size: 15px; font-weight: bold;color: #3d4b70;margin-bottom: 10px;">隐患信息</view>
|
||||
<u-form-item label="区域名称" prop="RISK_AREA_NAME" borderBottom ref="item1"
|
||||
@ -20,6 +19,12 @@
|
||||
@change="doTrueOrFalse()" />
|
||||
</u-radio-group>
|
||||
</u-form-item>
|
||||
<!-- <u-form-item borderBottom> -->
|
||||
<!-- <div id="player" v-if="this.ISLOCAL"></div>
|
||||
<div id="playerL" v-else>
|
||||
<video v-if="!this.ISLOCAL" id="myVideo" :src="this.FILE_PATH" controls></video>
|
||||
</div> -->
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
|
||||
<!-- 动态加载隐患信息 -->
|
||||
@ -31,24 +36,22 @@
|
||||
<uni-collapse :border="false" accordion>
|
||||
<uni-card style="margin-bottom: 5px;" margin="0" spacing="0" :is-shadow="false"
|
||||
v-for="(item, index) in model.ListShow">
|
||||
<uni-collapse-item :title="(index+1) + '. ' + item.CHECKCONTENT" name="1">
|
||||
<u-form-item label="检查内容" prop="CHECKCONTENT" borderBottom>
|
||||
<u--input disabled disabledColor="#fff" v-model="item.CHECKCONTENT"
|
||||
<uni-collapse-item :title="(index+1) + '. ' + item.Nav_Viedo.NAME" name="1">
|
||||
<u-form-item label="区域名称" prop="Nav_Area.NAME" borderBottom>
|
||||
<u--input disabled disabledColor="#fff" v-model="item.Nav_Area.NAME"
|
||||
border="none" inputAlign="right"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item v-if="model.ISDOWN=='是'" label="区域" prop="Nav_RiskArea.NAME"
|
||||
borderBottom>
|
||||
<u--input disabled disabledColor="#fff" v-model="item.Nav_RiskArea.NAME"
|
||||
<u-form-item label="视频名称" prop="Nav_Viedo.NAME" borderBottom>
|
||||
<u--input disabled disabledColor="#fff" v-model="item.Nav_Viedo.NAME"
|
||||
border="none" inputAlign="right"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item label="地址" prop="DESCREPTION" borderBottom>
|
||||
<u--input disabled disabledColor="#fff" v-model="item.DESCREPTION"
|
||||
border="none" inputAlign="right"></u--input>
|
||||
<u-form-item v-if="item.Nav_Viedo.ISLOCAL" borderBottom>
|
||||
<video id="myVideo" :src="item.Nav_Viedo.FILE_PATH" controls></video>
|
||||
</u-form-item>
|
||||
<u-form-item v-else borderBottom style="text-align: center;">
|
||||
<button type="primary" class="btnSubDel" @click="startPlay(item)"
|
||||
style="width: 35%;">播放</button>
|
||||
</u-form-item>
|
||||
<!-- <u-form-item label="上报时间" prop="CREATE_TIME" borderBottom>
|
||||
<u--input disabled disabledColor="#fff" v-model="item.CREATE_TIME"
|
||||
border="none" inputAlign="right"></u--input>
|
||||
</u-form-item> -->
|
||||
</uni-collapse-item>
|
||||
</uni-card>
|
||||
</uni-collapse>
|
||||
@ -68,12 +71,14 @@
|
||||
<script>
|
||||
import {
|
||||
OrderPagedRiskArea,
|
||||
PagedCheckMain
|
||||
PagedVideo
|
||||
} from '../../services/apply'
|
||||
import {
|
||||
initFilter,
|
||||
extendRule
|
||||
} from '../../utils/common'
|
||||
import config from '../../config/common';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
@ -81,6 +86,10 @@
|
||||
pageIndex: 0,
|
||||
pageSize: 20,
|
||||
total: 0,
|
||||
// vodPlayerJs: 'https://player.polyv.net/resp/vod-player/latest/player.js',
|
||||
// vid: '', // '3cbccb39d99458bbef9fafad687a63ac_3',
|
||||
// FILE_PATH: '',
|
||||
// ISLOCAL: true,
|
||||
model: {
|
||||
RISK_AREA_NAME: '请选择区域',
|
||||
RISK_AREA_ID: '',
|
||||
@ -126,7 +135,6 @@
|
||||
this.OrgId = option.OrgId // 'B043B28B-BBC3-C452-6052-4FBA1457ABFA'
|
||||
if (this.model.RISK_AREA_ID != undefined && this.model.RISK_AREA_ID != '') {
|
||||
// this.PagedCheckMain()//扫二维码 默认赋值
|
||||
|
||||
const json = initFilter(this.OrgId, null, "NAME", 0, 1);
|
||||
json.IgnoreDataRule = true
|
||||
json.Limit = 2
|
||||
@ -137,31 +145,56 @@
|
||||
}
|
||||
})
|
||||
}
|
||||
// var player = polyvPlayer({
|
||||
// wrap: "#player",
|
||||
// width: 400,
|
||||
// height: 300,
|
||||
// vid: vid, //云点播平台的视频唯一id。
|
||||
// });
|
||||
},
|
||||
// mounted() {
|
||||
// this.loadPlayerScript(this.loadPlayer);
|
||||
// },
|
||||
// onReady() {
|
||||
// //如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
|
||||
// this.$refs.uForm.setRules(this.rules)
|
||||
// },
|
||||
methods: {
|
||||
PagedCheckMain(paginate) {
|
||||
PagedVideo(paginate) {
|
||||
this.pageIndex++
|
||||
const json = initFilter(this.OrgId, this.model.RISK_AREA_ID, "CREATE_TIME", 1, this.pageIndex, ((
|
||||
this.model.ISDOWN == '否' || this.model.ISDOWN == '') ? false : true))
|
||||
json.IgnoreDataRule = true
|
||||
json.Limit = this.pageSize
|
||||
json.SelectField = ["CHECKCONTENT", "DESCREPTION", "Nav_RiskArea.NAME", "CREATE_TIME"]
|
||||
PagedCheckMain(json).then(res => {
|
||||
json.SelectField = ["Nav_Area.NAME", "Nav_Viedo.NAME", "Nav_Viedo.ISLOCAL", "Nav_Viedo.FILE_PATH"]
|
||||
PagedVideo(json).then(res => {
|
||||
if (res.IsSuccessful) {
|
||||
this.total = res.TotalCount
|
||||
// this.model.ListShow = res.Data
|
||||
if (res.Data && res.Data.length > 0) {
|
||||
res.Data.forEach(e => {
|
||||
if (e.Nav_Viedo.ISLOCAL) {
|
||||
e.Nav_Viedo.FILE_PATH = config.uni_app_web_source_url + e.Nav_Viedo
|
||||
.FILE_PATH
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
if (paginate) {
|
||||
this.model.ListShow = this.model.ListShow.concat(res.Data)
|
||||
} else {
|
||||
this.model.ListShow = res.Data
|
||||
}
|
||||
|
||||
// this.loadPlayerScript(this.loadPlayer);//保利威信息对接
|
||||
if (res.TotalCount == 0)
|
||||
uni.$showMsg("未获取到数据", 'none')
|
||||
// else {
|
||||
// for (let i = 0; i < this.model.ListShow.length; i++) {
|
||||
// if (!this.model.ListShow[i].Nav_Viedo.ISLOCAL)
|
||||
// this.loadPlayerP(i,this.model.ListShow[i].Nav_Viedo.FILE_PATH);
|
||||
// }
|
||||
// }
|
||||
} else {
|
||||
this.model.ListShow = [{
|
||||
CHECKCONTENT: '',
|
||||
@ -174,7 +207,7 @@
|
||||
doTrueOrFalse() {
|
||||
this.pageIndex = 0
|
||||
if (this.model.RISK_AREA_ID != undefined && this.model.RISK_AREA_ID.length > 0)
|
||||
this.PagedCheckMain();
|
||||
this.PagedVideo();
|
||||
},
|
||||
|
||||
closePicker() {
|
||||
@ -239,33 +272,94 @@
|
||||
// 暂无数据
|
||||
}
|
||||
},
|
||||
startPlay(item) {
|
||||
var vid = ''
|
||||
if (item.Nav_Viedo.FILE_PATH.indexOf('=') > -1)
|
||||
vid = item.Nav_Viedo.FILE_PATH.split('=')[1]
|
||||
if (vid.length > 0) {
|
||||
uni.navigateTo({
|
||||
url: 'viewVideoplyplayer?vid=' + vid
|
||||
});
|
||||
}
|
||||
},
|
||||
handleSelected(e) {
|
||||
this.selectorInfo.showPopup = false
|
||||
this.model.RISK_AREA_NAME = e.NAME
|
||||
this.model.RISK_AREA_ID = e.ID
|
||||
this.PagedCheckMain()
|
||||
this.PagedVideo()
|
||||
// this.WorkerScheduling()
|
||||
}
|
||||
},
|
||||
// playVideo(FILE_PATH) {
|
||||
// var vid = ''
|
||||
// if (FILE_PATH.indexOf('=') > -1)
|
||||
// vid = FILE_PATH.split('=')[1]
|
||||
// if (vid.length > 0) {
|
||||
// uni.navigateTo({
|
||||
// url: 'ext-ply-player?id=' + vid
|
||||
// });
|
||||
// }
|
||||
// },
|
||||
|
||||
// loadPlayerScript(callback) {
|
||||
// if (!window.polyvPlayer) {
|
||||
// const myScript = document.createElement('script');
|
||||
// myScript.setAttribute('src', this.vodPlayerJs);
|
||||
// myScript.onload = callback;
|
||||
// document.body.appendChild(myScript);
|
||||
// } else {
|
||||
// callback();
|
||||
// }
|
||||
// },
|
||||
// loadPlayer() {
|
||||
// const polyvPlayer = window.polyvPlayer;
|
||||
// this.player = polyvPlayer({
|
||||
// wrap: '#player',
|
||||
// width: 300,
|
||||
// height: 300,
|
||||
// vid: this.vid,
|
||||
// });
|
||||
// },
|
||||
|
||||
// loadPlayerScriptIni() {
|
||||
// if (!window.polyvPlayer) {
|
||||
// const myScript = document.createElement('script');
|
||||
// myScript.setAttribute('src', this.vodPlayerJs);
|
||||
// // myScript.onload = callbackP(index);
|
||||
// document.body.appendChild(myScript);
|
||||
// }
|
||||
// },
|
||||
// loadPlayerScriptP(index, callbackP) {
|
||||
// debugger
|
||||
// if (!window.polyvPlayer) {
|
||||
// const myScript = document.createElement('script');
|
||||
// myScript.setAttribute('src', this.vodPlayerJs);
|
||||
// myScript.onload = callbackP(index);
|
||||
// document.body.appendChild(myScript);
|
||||
// } else {
|
||||
// callbackP(index);
|
||||
// }
|
||||
// },
|
||||
// loadPlayerP(index, path) {
|
||||
// const polyvPlayer = window.polyvPlayer;
|
||||
// debugger
|
||||
// var eleId = '#player' + index
|
||||
// var eVid = path.split('=')[1]
|
||||
// this.player = polyvPlayer({
|
||||
// wrap: eleId,
|
||||
// width: 300,
|
||||
// height: 300,
|
||||
// vid: eVid,
|
||||
// });
|
||||
// }
|
||||
|
||||
},
|
||||
onReachBottom() {
|
||||
if (this.total > this.pageSize * this.pageIndex)
|
||||
this.PagedCheckMain(true)
|
||||
}
|
||||
// watch: {
|
||||
// keyword(n, o) {
|
||||
// this.pageIndex = 0
|
||||
// this.keyword = n
|
||||
// this.PagedCheckMain()
|
||||
// },
|
||||
// searchStartTime(n, o) {
|
||||
// this.pageIndex = 0
|
||||
// this.searchStartTime = n
|
||||
// this.PagedCheckMain()
|
||||
// },
|
||||
// filterStatus(n, o) {
|
||||
// this.pageIndex = 0
|
||||
// this.filterStatus = n
|
||||
// this.PagedCheckMain()
|
||||
this.PagedVideo(true)
|
||||
},
|
||||
// destroyed() {
|
||||
// if (this.player) {
|
||||
// this.player.destroy();
|
||||
// }
|
||||
// }
|
||||
}
|
||||
|
||||
125
pages/apply/viewVideoplyplayer.nvue
Normal file
125
pages/apply/viewVideoplyplayer.nvue
Normal file
@ -0,0 +1,125 @@
|
||||
<template>
|
||||
<!-- 视频查看 待开发-->
|
||||
<view class="content">
|
||||
<view class="container">
|
||||
<view class="form-sub">
|
||||
<u-form ref="uForm" label-width="90px" class="demo-ruleForm" size="mini">
|
||||
<view style="font-size: 15px; font-weight: bold;color: #3d4b70;margin-bottom: 10px;">视频服务播放</view>
|
||||
<div id="player"></div>
|
||||
</u-form>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
vodPlayerJs: 'https://player.polyv.net/resp/vod-player/latest/player.js',
|
||||
vid: '',
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
this.vid = option.vid
|
||||
},
|
||||
mounted() {
|
||||
this.loadPlayerScript(this.loadPlayer);
|
||||
},
|
||||
methods: {
|
||||
loadPlayerScript(callback) {
|
||||
if (!window.polyvPlayer) {
|
||||
const myScript = document.createElement('script');
|
||||
myScript.setAttribute('src', this.vodPlayerJs);
|
||||
myScript.onload = callback;
|
||||
document.body.appendChild(myScript);
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
loadPlayer() {
|
||||
const polyvPlayer = window.polyvPlayer;
|
||||
this.player = polyvPlayer({
|
||||
wrap: '#player',
|
||||
width: 300,
|
||||
height: 300,
|
||||
vid: this.vid,
|
||||
});
|
||||
},
|
||||
},
|
||||
destroyed() {
|
||||
if (this.player) {
|
||||
this.player.destroy();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.content {
|
||||
background-color: #f4f7ff;
|
||||
width: 100%;
|
||||
/* #ifndef APP-PLUS */
|
||||
height: calc(100vh - 44px - 50px); // 非APP平台下生效
|
||||
/* #endif */
|
||||
/* #ifdef APP-PLUS */
|
||||
height: calc(100vh); // APP平台下生效
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 20px 16px 10px 16px;
|
||||
}
|
||||
|
||||
.form-sub {
|
||||
/* margin: 20px 16px 10px 16px; */
|
||||
/* border: 1px solid #EBEEF5; */
|
||||
padding: 20px 10px 10px 10px;
|
||||
/* box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 3px 1px; */
|
||||
background-color: #ffffff;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.demo-ruleForm>>>.u-form-item__body__left__content__label {
|
||||
font-size: 14px;
|
||||
color: #8e8b9c;
|
||||
/* justify-content: flex-start; */
|
||||
}
|
||||
|
||||
.demo-ruleForm>>>.u-form-item__body__left__content__ {
|
||||
left: -11px;
|
||||
top: 0px
|
||||
}
|
||||
|
||||
.demo-ruleForm>>>.u-textarea__field {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.demo-ruleForm>>>.u-cell__title-text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.demo-ruleForm-thr>>>.u-textarea {
|
||||
padding: 9px 9px 25px 9px;
|
||||
}
|
||||
|
||||
.demo-ruleForm-thr>>>.u-form-item__body__left__content__label {
|
||||
font-size: 14px;
|
||||
color: #8e8b9c;
|
||||
/* justify-content: flex-start; */
|
||||
}
|
||||
|
||||
.demo-ruleForm-thr>>>.u-form-item__body__left__content__ {
|
||||
left: -11px;
|
||||
top: 0px
|
||||
}
|
||||
|
||||
.demo-ruleForm-thr>>>.u-textarea__field {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.demo-ruleForm-thr>>>.u-cell__title-text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -223,7 +223,7 @@
|
||||
uni.setStorageSync('tenantId', e.tenantId)
|
||||
if (this.OrgId && this.OrgId.length > 1)
|
||||
this.getCaidan()
|
||||
this.Sync()
|
||||
// this.Sync()
|
||||
},
|
||||
|
||||
Sync() {
|
||||
|
||||
@ -70,4 +70,12 @@ export const PagedEvaluateRisk = (params) => {
|
||||
method: 'post',
|
||||
data: params,
|
||||
})
|
||||
}
|
||||
//视频查看
|
||||
export const PagedVideo = (params) => {
|
||||
return request.send({
|
||||
url: '/BI/H5Controller/PagedVideo',
|
||||
method: 'post',
|
||||
data: params,
|
||||
})
|
||||
}
|
||||
@ -17,6 +17,8 @@ export default {
|
||||
let header = {
|
||||
'Content-Type': params.method === 'post' ? 'application/json' : 'application/json;charset=UTF-8',
|
||||
'Tenant': tenantId, // avue配置相关
|
||||
//测试对接
|
||||
// 'signature':'snJ0cOfn7aZ54nKcMQnz3tG1kL8IyN5H/FHsVyDpJxWyH2QNgZlCE+KSHQqcKR4PzZnpaqp7/awwGvleUsoFRn6pc1of6UZsCTEeWF2zG5ciHosp+jRhNGp55bLXCnqt+9bj9KU4Ca+lpHP/9B8nE6OW/9zoRkccFXxeZBSg32fBmlHlkjvi9cmTc0oQ/osdoRZ2HdiLJ6WZNXr9Uz9nUj7Du/qXvN5BZN7V8pxxdm9mgGnCMLMwz7cglB9mYyt/tKp9ur2UjO3bwFJ7ypZWWCQ9Af/dJe0Z8i9muTQptJCuXJ6kHjYaFHm1jny0rtO2pbaO7WPyYJQeke8d16yVNg==',
|
||||
...params.header
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user