|
@@ -225,7 +225,7 @@
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide" v-for="(item,index) in homeList" :key="item.id" :class="[index==0 ? 'swiper-slide-active' : '' , index==1 ? 'swiper-slide-next' : '']">
|
|
<div class="swiper-slide" v-for="(item,index) in homeList" :key="item.id" :class="[index==0 ? 'swiper-slide-active' : '' , index==1 ? 'swiper-slide-next' : '']">
|
|
<div class="canvas" style="z-index: 1;">
|
|
<div class="canvas" style="z-index: 1;">
|
|
- <div style="height: 100%;" class="wine">
|
|
|
|
|
|
+ <div style="height: 100%;" class="wine" :id="'wine'+index">
|
|
</div>
|
|
</div>
|
|
<div class="camvas-head" style="z-index: 5555;">
|
|
<div class="camvas-head" style="z-index: 5555;">
|
|
<div class="tophead">
|
|
<div class="tophead">
|
|
@@ -330,10 +330,13 @@
|
|
message: 'Hello Vue!',
|
|
message: 'Hello Vue!',
|
|
homeList: [],
|
|
homeList: [],
|
|
urlData: {},
|
|
urlData: {},
|
|
- rbdData: {}
|
|
|
|
|
|
+ rbdData: {},
|
|
|
|
+ activeIndexData: ""
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
- this.gethomeList();
|
|
|
|
|
|
+ this.$nextTick(function() {
|
|
|
|
+ this.gethomeList();
|
|
|
|
+ });
|
|
var swiper = new Swiper('.swiper-container', {
|
|
var swiper = new Swiper('.swiper-container', {
|
|
observer: true, //修改swiper自己或子元素时,自动初始化swiper
|
|
observer: true, //修改swiper自己或子元素时,自动初始化swiper
|
|
observeParents: true, //修改swiper的父元素时,自动初始化swiper
|
|
observeParents: true, //修改swiper的父元素时,自动初始化swiper
|
|
@@ -342,19 +345,31 @@
|
|
prevEl: '.swiper-button-prev',
|
|
prevEl: '.swiper-button-prev',
|
|
},
|
|
},
|
|
on: {
|
|
on: {
|
|
- onSlideChangeStart: function(swiper) {
|
|
|
|
- alert(swiper.activeIndex);
|
|
|
|
|
|
+ transitionStart: function() {
|
|
|
|
+ console.log("下标啊", this.activeIndex)
|
|
|
|
+ this.activeIndexData = this.activeIndex;
|
|
},
|
|
},
|
|
- onSlideChangeEnd: function(swiper) {
|
|
|
|
- console.log("下标啊", swiper)
|
|
|
|
|
|
+ slideChangeTransitionStart: function() {
|
|
|
|
+ console.log("下标啊", this.activeIndex)
|
|
|
|
+ this.activeIndexData = this.activeIndex;
|
|
},
|
|
},
|
|
- onTransitionStart: function(swiper, activeIndex) {
|
|
|
|
- console.log("下标啊", swiper, activeIndex)
|
|
|
|
|
|
+ slideChangeTransitionEnd: function() {
|
|
|
|
+ console.log("下标啊", this.activeIndex)
|
|
|
|
+ this.activeIndexData = this.activeIndex;
|
|
},
|
|
},
|
|
- onSlideChangeEnd: function(swiperHere) {
|
|
|
|
- var txt = $('.swiper-slide-active').html();
|
|
|
|
- console.log("打印索引值", txt)
|
|
|
|
- }
|
|
|
|
|
|
+ // slideChangeStart: function() {
|
|
|
|
+ // alert(this.activeIndext);
|
|
|
|
+ // },
|
|
|
|
+ // slideChangeEnd: function() {
|
|
|
|
+ // console.log("下标啊", this)
|
|
|
|
+ // },
|
|
|
|
+ // ransitionStart: function(activeIndex) {
|
|
|
|
+ // console.log("下标啊", this, activeIndex)
|
|
|
|
+ // },
|
|
|
|
+ // slideChangeEnd: function(swiperHere) {
|
|
|
|
+ // var txt = $('.swiper-slide-active').html();
|
|
|
|
+ // console.log("打印索引值", txt)
|
|
|
|
+ // }
|
|
}
|
|
}
|
|
|
|
|
|
});
|
|
});
|
|
@@ -404,12 +419,9 @@
|
|
},
|
|
},
|
|
swiperNext(data) {
|
|
swiperNext(data) {
|
|
let activeIndex = $('.swiper-slide-active').index() + 1;
|
|
let activeIndex = $('.swiper-slide-active').index() + 1;
|
|
- console.log("下标啊下标", this.homeList[activeIndex]);
|
|
|
|
- var domnext = $('.swiper-slide-active').next().children().find(".wine");
|
|
|
|
- domnext.attr("id", "wine");
|
|
|
|
- // console.log("打印索引值", domnext)
|
|
|
|
- var domprev = $('.swiper-slide-next').prev().children().find(".wine");
|
|
|
|
- domprev.removeAttr("id");
|
|
|
|
|
|
+ var id = "#wine" + $('.swiper-slide-active').index();
|
|
|
|
+ var domprev = $(id);
|
|
|
|
+ console.log("下标id======", id);
|
|
domprev.empty();
|
|
domprev.empty();
|
|
let rbdData = {
|
|
let rbdData = {
|
|
"userCardId": this.homeList[activeIndex].id,
|
|
"userCardId": this.homeList[activeIndex].id,
|
|
@@ -418,68 +430,75 @@
|
|
var baseUrl = "http://192.168.31.20";
|
|
var baseUrl = "http://192.168.31.20";
|
|
var urlss = 'test.androidscloud.com'
|
|
var urlss = 'test.androidscloud.com'
|
|
let that = this;
|
|
let that = this;
|
|
-
|
|
|
|
- setTimeout(() => {
|
|
|
|
- $.ajax({
|
|
|
|
- url: baseUrl + "/api/storage/v1/cardStatus/getRbd",
|
|
|
|
- data: JSON.stringify(rbdData),
|
|
|
|
- type: 'post',
|
|
|
|
- dataType: 'json',
|
|
|
|
- async: false,
|
|
|
|
- contentType: "application/json;charset=UTF-8",
|
|
|
|
- headers: {
|
|
|
|
- 'token': tokens.substring(6, tokens.length),
|
|
|
|
- "Authorization": tokens.substring(6, tokens.length)
|
|
|
|
- },
|
|
|
|
- success: function(data) {
|
|
|
|
-
|
|
|
|
- that.urlData = data.data;
|
|
|
|
- console.log("挂载安卓卡成功",that.urlData);
|
|
|
|
- //
|
|
|
|
- }
|
|
|
|
- })
|
|
|
|
- $(".swiper-wrapper .swiper-slide-active .wine").attr('id', 'wine');
|
|
|
|
- var player = new Player({
|
|
|
|
- size: {
|
|
|
|
- width: 768,
|
|
|
|
- height: 1024
|
|
|
|
- }
|
|
|
|
- });
|
|
|
|
-
|
|
|
|
- var secanv = document.getElementById("wine");
|
|
|
|
- secanv.appendChild(player.canvas);
|
|
|
|
-
|
|
|
|
- var strhost = "wss://" + urlss + "/videoWebSocket?clientType=1&cardIp=" +
|
|
|
|
- that.urlData.exIp +
|
|
|
|
- "&port=" + that.urlData.exPort + "&sn=" + that.urlData.sn;
|
|
|
|
- var client = new WebSocket(strhost);
|
|
|
|
- console.log('wsssss==============', client)
|
|
|
|
-
|
|
|
|
- client.binaryType = 'arraybuffer';
|
|
|
|
- // debugger
|
|
|
|
- client.onopen = function(evt) {
|
|
|
|
- // onOpen(evt)
|
|
|
|
- console.log("开始链接==============", evt);
|
|
|
|
- };
|
|
|
|
- client.onclose = function(evt) {
|
|
|
|
- // onClose(evt)
|
|
|
|
- };
|
|
|
|
- client.onmessage = function(evt) {
|
|
|
|
- // onMessage(evt)
|
|
|
|
- console.log("onMessage==============", evt);
|
|
|
|
- var messageData = new Uint8Array(evt.data);
|
|
|
|
-
|
|
|
|
- player.decode(messageData);
|
|
|
|
- };
|
|
|
|
- client.onerror = function(evt) {
|
|
|
|
- // onError(evt)
|
|
|
|
- };
|
|
|
|
- }, 5)
|
|
|
|
|
|
+ var player = new Player({
|
|
|
|
+ size: {
|
|
|
|
+ width: 768,
|
|
|
|
+ height: 1024
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ var id = 'wine' + activeIndex;
|
|
|
|
+ var secanv = document.getElementById(id);
|
|
|
|
+ secanv.appendChild(player.canvas);
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ // setTimeout(() => {
|
|
|
|
+ $.ajax({
|
|
|
|
+ url: baseUrl + "/api/storage/v1/cardStatus/getRbd",
|
|
|
|
+ data: JSON.stringify(rbdData),
|
|
|
|
+ type: 'post',
|
|
|
|
+ dataType: 'json',
|
|
|
|
+ async: false,
|
|
|
|
+ contentType: "application/json;charset=UTF-8",
|
|
|
|
+ headers: {
|
|
|
|
+ 'token': tokens.substring(6, tokens.length),
|
|
|
|
+ "Authorization": tokens.substring(6, tokens.length)
|
|
|
|
+ },
|
|
|
|
+ success: function(data) {
|
|
|
|
+
|
|
|
|
+ that.urlData = data.data;
|
|
|
|
+ console.log("挂载安卓卡成功", that.urlData);
|
|
|
|
+ //
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ // var strhost = "wss://" + urlss + "/videoWebSocket?clientType=1&cardIp=" +
|
|
|
|
+ // that.urlData.exIp +
|
|
|
|
+ // "&port=" + that.urlData.exPort + "&sn=" + that.urlData.sn;
|
|
|
|
+ var strhost = "ws://192.168.11.66:9101";
|
|
|
|
+ var client = new WebSocket(strhost);
|
|
|
|
+ console.log('wsssss==============', client)
|
|
|
|
+
|
|
|
|
+ client.binaryType = 'arraybuffer';
|
|
|
|
+ // debugger
|
|
|
|
+ client.onopen = function(evt) {
|
|
|
|
+ // onOpen(evt)
|
|
|
|
+ console.log("开始链接==============", evt);
|
|
|
|
+ };
|
|
|
|
+ client.onclose = function(evt) {
|
|
|
|
+ // onClose(evt)
|
|
|
|
+ };
|
|
|
|
+ client.onmessage = function(evt) {
|
|
|
|
+ // onMessage(evt)
|
|
|
|
+ // console.log("onMessage==============", evt);
|
|
|
|
+ var messageData = new Uint8Array(evt.data);
|
|
|
|
+
|
|
|
|
+ player.decode(messageData);
|
|
|
|
+ };
|
|
|
|
+ client.onerror = function(evt) {
|
|
|
|
+ // onError(evt)
|
|
|
|
+ };
|
|
|
|
+ // }, 1)
|
|
|
|
+
|
|
|
|
|
|
},
|
|
},
|
|
swiperPrev() {
|
|
swiperPrev() {
|
|
let activeIndex = $('.swiper-slide-active').index() - 1;
|
|
let activeIndex = $('.swiper-slide-active').index() - 1;
|
|
- console.log("下标啊下标", this.homeList[activeIndex]);
|
|
|
|
|
|
+ var id = "#wine" + $('.swiper-slide-active').index();
|
|
|
|
+ var domprev = $(id);
|
|
|
|
+ console.log("下标id======", id);
|
|
|
|
+ domprev.empty();
|
|
let rbdData = {
|
|
let rbdData = {
|
|
"userCardId": this.homeList[activeIndex].id,
|
|
"userCardId": this.homeList[activeIndex].id,
|
|
"deviceStatus": 1,
|
|
"deviceStatus": 1,
|
|
@@ -487,65 +506,61 @@
|
|
var baseUrl = "http://192.168.31.20";
|
|
var baseUrl = "http://192.168.31.20";
|
|
var urlss = 'test.androidscloud.com'
|
|
var urlss = 'test.androidscloud.com'
|
|
let that = this;
|
|
let that = this;
|
|
|
|
+ var player = new Player({
|
|
|
|
+ size: {
|
|
|
|
+ width: 768,
|
|
|
|
+ height: 1024
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ var id = 'wine' + activeIndex;
|
|
|
|
+ var secanv = document.getElementById(id);
|
|
|
|
+ secanv.appendChild(player.canvas);
|
|
|
|
|
|
- var domnext = $('.swiper-slide-prev').next().children().find(".wine");
|
|
|
|
- domnext.removeAttr("id");
|
|
|
|
- // console.log("打印索引值", domnext)
|
|
|
|
- var domprev = $('.swiper-slide-active').prev().children().find(".wine");
|
|
|
|
- domprev.attr("id", "wine");
|
|
|
|
- domnext.empty();
|
|
|
|
- setTimeout(() => {
|
|
|
|
- $.ajax({
|
|
|
|
- url: baseUrl + "/api/storage/v1/cardStatus/getRbd",
|
|
|
|
- data: JSON.stringify(rbdData),
|
|
|
|
- type: 'post',
|
|
|
|
- dataType: 'json',
|
|
|
|
- async: false,
|
|
|
|
- contentType: "application/json;charset=UTF-8",
|
|
|
|
- headers: {
|
|
|
|
- 'token': tokens.substring(6, tokens.length),
|
|
|
|
- "Authorization": tokens.substring(6, tokens.length)
|
|
|
|
- },
|
|
|
|
- success: function(data) {
|
|
|
|
- that.urlData = data.data;
|
|
|
|
- console.log("挂载安卓卡成功",that.urlData);
|
|
|
|
- //
|
|
|
|
- }
|
|
|
|
- })
|
|
|
|
- $(".swiper-wrapper .swiper-slide-active .wine").attr('id', 'wine');
|
|
|
|
- var player = new Player({
|
|
|
|
- size: {
|
|
|
|
- width: 768,
|
|
|
|
- height: 1024
|
|
|
|
- }
|
|
|
|
- });
|
|
|
|
- var secanv = document.getElementById("wine");
|
|
|
|
- secanv.appendChild(player.canvas);
|
|
|
|
- var strhost = "wss://" + urlss + "/videoWebSocket?clientType=1&cardIp=" +
|
|
|
|
- that.urlData.exIp +
|
|
|
|
- "&port=" + that.urlData.exPort + "&sn=" + that.urlData.sn;
|
|
|
|
- var client = new WebSocket(strhost);
|
|
|
|
- console.log('wsssss==============', client)
|
|
|
|
-
|
|
|
|
- client.binaryType = 'arraybuffer';
|
|
|
|
- // debugger
|
|
|
|
- client.onopen = function(evt) {
|
|
|
|
- console.log("开始链接==============", evt);
|
|
|
|
- };
|
|
|
|
- client.onclose = function(evt) {
|
|
|
|
- // onClose(evt)
|
|
|
|
- };
|
|
|
|
- client.onmessage = function(evt) {
|
|
|
|
- // onMessage(evt)
|
|
|
|
- console.log("onMessage==============", evt);
|
|
|
|
- var messageData = new Uint8Array(evt.data);
|
|
|
|
-
|
|
|
|
- player.decode(messageData);
|
|
|
|
- };
|
|
|
|
- client.onerror = function(evt) {
|
|
|
|
- // onError(evt)
|
|
|
|
- };
|
|
|
|
- }, 5)
|
|
|
|
|
|
+ // setTimeout(() => {
|
|
|
|
+ $.ajax({
|
|
|
|
+ url: baseUrl + "/api/storage/v1/cardStatus/getRbd",
|
|
|
|
+ data: JSON.stringify(rbdData),
|
|
|
|
+ type: 'post',
|
|
|
|
+ dataType: 'json',
|
|
|
|
+ async: false,
|
|
|
|
+ contentType: "application/json;charset=UTF-8",
|
|
|
|
+ headers: {
|
|
|
|
+ 'token': tokens.substring(6, tokens.length),
|
|
|
|
+ "Authorization": tokens.substring(6, tokens.length)
|
|
|
|
+ },
|
|
|
|
+ success: function(data) {
|
|
|
|
+ that.urlData = data.data;
|
|
|
|
+ console.log("挂载安卓卡成功", that.urlData);
|
|
|
|
+ //
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+
|
|
|
|
+ // var strhost = "wss://" + urlss + "/videoWebSocket?clientType=1&cardIp=" +
|
|
|
|
+ // that.urlData.exIp +
|
|
|
|
+ // "&port=" + that.urlData.exPort + "&sn=" + that.urlData.sn;
|
|
|
|
+ var strhost = "ws://192.168.11.66:9101";
|
|
|
|
+ var client = new WebSocket(strhost);
|
|
|
|
+ console.log('wsssss==============', client)
|
|
|
|
+
|
|
|
|
+ client.binaryType = 'arraybuffer';
|
|
|
|
+ // debugger
|
|
|
|
+ client.onopen = function(evt) {
|
|
|
|
+ console.log("开始链接==============", evt);
|
|
|
|
+ };
|
|
|
|
+ client.onclose = function(evt) {
|
|
|
|
+ // onClose(evt)
|
|
|
|
+ };
|
|
|
|
+ client.onmessage = function(evt) {
|
|
|
|
+ // onMessage(evt)
|
|
|
|
+ // console.log("onMessage==============", evt);
|
|
|
|
+ var messageData = new Uint8Array(evt.data);
|
|
|
|
+
|
|
|
|
+ player.decode(messageData);
|
|
|
|
+ };
|
|
|
|
+ client.onerror = function(evt) {
|
|
|
|
+ // onError(evt)
|
|
|
|
+ };
|
|
|
|
+ // }, 1)
|
|
|
|
|
|
},
|
|
},
|
|
gethomeList() {
|
|
gethomeList() {
|
|
@@ -622,8 +637,6 @@
|
|
this.urlData = data;
|
|
this.urlData = data;
|
|
let that = this;
|
|
let that = this;
|
|
|
|
|
|
-
|
|
|
|
-
|
|
|
|
$.ajax({
|
|
$.ajax({
|
|
url: baseUrl + "/api/user/v1/client/disk/info",
|
|
url: baseUrl + "/api/user/v1/client/disk/info",
|
|
data: {},
|
|
data: {},
|
|
@@ -645,12 +658,14 @@
|
|
"deviceStatus": 1,
|
|
"deviceStatus": 1,
|
|
};
|
|
};
|
|
|
|
|
|
|
|
+ let activeIndex = $('.swiper-slide-active').index();
|
|
|
|
|
|
// let that = this;
|
|
// let that = this;
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
$.ajax({
|
|
$.ajax({
|
|
url: baseUrl + "/api/storage/v1/cardStatus/getRbd",
|
|
url: baseUrl + "/api/storage/v1/cardStatus/getRbd",
|
|
data: JSON.stringify(rbdData),
|
|
data: JSON.stringify(rbdData),
|
|
|
|
+ // data:rbdData,
|
|
type: 'post',
|
|
type: 'post',
|
|
dataType: 'json',
|
|
dataType: 'json',
|
|
contentType: "application/json;charset=UTF-8",
|
|
contentType: "application/json;charset=UTF-8",
|
|
@@ -661,24 +676,28 @@
|
|
},
|
|
},
|
|
success: function(data) {
|
|
success: function(data) {
|
|
that.urlData = data.data;
|
|
that.urlData = data.data;
|
|
- console.log("挂载安卓卡成功",that.urlData);
|
|
|
|
|
|
+ console.log("挂载安卓卡成功", that.urlData);
|
|
//
|
|
//
|
|
}
|
|
}
|
|
})
|
|
})
|
|
console.log("that.urlDatathat.urlDatathat.urlDatathat.urlData", that.urlData);
|
|
console.log("that.urlDatathat.urlDatathat.urlDatathat.urlData", that.urlData);
|
|
- $(".swiper-wrapper .swiper-slide-active .wine").attr('id', 'wine');
|
|
|
|
var player = new Player({
|
|
var player = new Player({
|
|
size: {
|
|
size: {
|
|
width: 768,
|
|
width: 768,
|
|
height: 1024
|
|
height: 1024
|
|
}
|
|
}
|
|
});
|
|
});
|
|
- var secanv = document.getElementById("wine");
|
|
|
|
|
|
+ var id = 'wine' + activeIndex;
|
|
|
|
+ console.log("首页=====", id);
|
|
|
|
+ var secanv = document.getElementById(id);
|
|
secanv.appendChild(player.canvas);
|
|
secanv.appendChild(player.canvas);
|
|
|
|
+ console.log("首页=====", secanv);
|
|
|
|
+
|
|
// var strhost = "wss://" + urlss + "/videoWebSocket?clientType=1&cardIp=" +
|
|
// var strhost = "wss://" + urlss + "/videoWebSocket?clientType=1&cardIp=" +
|
|
// that.urlData.exIp +
|
|
// that.urlData.exIp +
|
|
// "&port=" + that.urlData.exPort + "&sn=" + that.urlData.sn;
|
|
// "&port=" + that.urlData.exPort + "&sn=" + that.urlData.sn;
|
|
- var strhost="ws://192.168.11.66:9101";
|
|
|
|
|
|
+ var strhost = "ws://192.168.11.66:9101";
|
|
|
|
+ // var strhost="ws://"+that.urlData.exIp+":"+that.urlData.exPort
|
|
var client = new WebSocket(strhost);
|
|
var client = new WebSocket(strhost);
|
|
console.log('wsssss==============', client)
|
|
console.log('wsssss==============', client)
|
|
|
|
|
|
@@ -701,7 +720,7 @@
|
|
client.onerror = function(evt) {
|
|
client.onerror = function(evt) {
|
|
// onError(evt)
|
|
// onError(evt)
|
|
};
|
|
};
|
|
- }, 5)
|
|
|
|
|
|
+ }, 1)
|
|
|
|
|
|
|
|
|
|
} else {
|
|
} else {
|