123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266 |
- var _this, dataObj = [],
- nowYsy = null;
- var _Player = {
- one: null
- };
- var loading = null;
- new Vue({
- el: '#app',
- data: function() {
- return {
- dataLi: [],
- nowTab: {},
- tabArr: {},
- playSucc: {
- one: false,
- two: false,
- thr: false,
- fou: false
- },
- videoNum: 1
- }
- },
- created() {
- _this = this;
- nowYsy = JSON.parse(localStorage.getItem("nowShip"));
- _this.initAjax();
- },
- mounted() {
- window.addEventListener('message', (data) => {
- nowYsy = JSON.parse(localStorage.getItem("nowShip"));
- _this.initAjax();
- })
- },
- methods: {
- initAjax() {
- if (nowYsy != null && nowYsy != "null") {
- loading = this.$loading({
- background: 'rgba(0, 0, 0, 0.4)'
- })
- }
- dataObj = [];
- _this.getList();
- },
- getList() {
- if (nowYsy != null && nowYsy != "null") {
- getOneYsy(nowYsy.sn,function(sfg){
- let _opts = {
- url: ys7Url + "/api/lapp/device/camera/list",
- type:"POST"
- };
- let _data = {
- "deviceSerial": nowYsy.sn,
- "accessToken": getCookie("ylToken")
- };
- let _hea = {
- "Content-Type": "application/x-www-form-urlencoded"
- };
- postAxios(_opts, _data, _hea).then((res) => {
- if (res.code == 200) {
- dataObj = res.data;
- } else {
- dataObj = [];
- }
- _this.checkList(sfg.status);
- loading.close();
- })
- },true);
- }
- },
- checkList(_sta) {
- let _arr = [];
- if (nowYsy.sn != "" && dataObj.length) {
- dataObj.forEach((it, ind) => {
- if (it.channelName.indexOf("@") == -1 && nowYsy.sn.indexOf(it.deviceSerial) != -1) {
- it.name = it.channelName.split("PTZ")[0].split("_")[0];
- it.fatSat = _sta;
- _arr.push(it);
- }
- })
- }
- _this.closeVid();
- _this.dataLi = _arr;
- },
- changTab(key) {
- let _flag = true;
- if (_this.tabArr[key.deviceSerial + "_" + key.channelNo] != undefined) {
- _this.$message({
- showClose: true,
- message: '设备已经在播放!!!',
- type: 'warning'
- });
- return;
- }
- for (let val in _Player) {
- if (_Player[val] == null) {
- _this.dataLi.forEach(item => {
- if ((item.deviceSerial == key.deviceSerial) && (key.channelNo == item
- .channelNo)) {
- if (item.status == 1 && item.fatSat == 1) {
- _this.nowTab[val] = item;
- _this.tabArr[item.deviceSerial + "_" + item.channelNo] = item;
- _this.playEzopen(val);
- } else {
- _this.$message({
- showClose: true,
- message: '设备离线中!!!',
- type: 'warning'
- });
- }
- }
- })
- _flag = false;
- break;
- }
- }
- if (_flag) {
- _this.$message({
- showClose: true,
- message: '暂无可用通道!!!',
- type: 'warning'
- });
- }
- },
- playEzopen(key) {
- let _wid = $("#videoWeiHie").width();
- let _hie = $("#videoWeiHie").height();
- let _src = "ezopen://open.ys7.com/" + (_this.nowTab[key].deviceSerial) + "/" + (_this.nowTab[key].channelNo) + ".live";
- _Player[key] = new EZUIKit.EZUIKitPlayer({
- id: "playWind_" + key,
- autoplay: true,
- url: _src,
- accessToken: getCookie("ylToken"),
- width: (parseFloat(_wid) - 2)/(_this.videoNum>1?2:1),
- height: (parseFloat(_hie) - 2)/(_this.videoNum>1?2:1),
- audio: false,
- plugin: ['talk'],
- themeData: {
- "header": {
- "color": "#1890ff",
- "activeColor": "#FFFFFF",
- "backgroundColor": "#000000",
- "btnList": [
- {
- "iconId": "deviceName",
- "part": "left",
- "defaultActive": 0,
- "memo": "顶部设备名称",
- "isrender": 1
- }]
- },
- "footer": {
- "color": "#FFFFFF",
- "activeColor": "#1890FF",
- "backgroundColor": "#00000021",
- "btnList": [{
- "iconId": "play",
- "part": "left",
- "defaultActive": 1,
- "memo": "播放",
- "isrender": 1
- },
- {
- "iconId": "capturePicture",
- "part": "left",
- "defaultActive": 0,
- "memo": "截屏按钮",
- "isrender": 1
- },
- {
- "iconId": "sound",
- "part": "left",
- "defaultActive": 0,
- "memo": "声音按钮",
- "isrender": 1
- },
- {
- "iconId": "recordvideo",
- "part": "left",
- "defaultActive": 0,
- "memo": "录制按钮",
- "isrender": 1
- },
- {
- "iconId": "hd",
- "part": "right",
- "defaultActive": 0,
- "memo": "清晰度切换按钮",
- "isrender": 1
- },
- {
- "iconId": "webExpend",
- "part": "right",
- "defaultActive": 0,
- "memo": "网页全屏按钮",
- "isrender": 1
- },
- {
- "iconId": "expend",
- "part": "right",
- "defaultActive": 0,
- "memo": "全局全屏按钮",
- "isrender": 1
- }
- ]
- }
- },
- decoderPath: staticUrl,
- handleError: _this.handleError(key),
- handleSuccess: _this.handleSuccess(key),
- });
- },
- handleError(key) {
- if (_Player[key] != null) {
- _this.closeVid(key)
- _this.$message({
- showClose: true,
- message: '视频播放失败!!!',
- type: 'error'
- });
- }
- },
- closeVid(key) {
- if (_Player[key] != null) {
- _Player[key].stop();
- _Player[key].destroy();
- _this.playSucc[key] = false;
- _Player[key] = null;
- delete _this.tabArr[_this.nowTab[key].deviceSerial + "_" + _this.nowTab[key].channelNo];
- delete _this.nowTab[key];
- }
- },
- handleSuccess(key) {
- _this.playSucc[key] = true;
- },
- closePla(key){
- _this.closeVid(key);
- },
- changeVidNum(key) {
- if (_this.videoNum == 4 && key == 1) {
- for (let val in _Player) {
- if (val != "one") {
- _this.closeVid(val);
- }
- }
- _Player = {
- one: _Player["one"]
- };
- }
- if (_this.videoNum == 1 && key == 4) {
- _Player = {
- one: _Player["one"],
- two: null,
- thr: null,
- fou: null
- };
- }
- _this.videoNum = key;
- if (_Player["one"] != null) {
- _Player["one"].stop();
- _Player["one"].destroy();
- _Player["one"] = null;
- _this.playEzopen("one");
- }
- }
- }
- })
|