|
|
|
|
@ -3,7 +3,6 @@
|
|
|
|
|
<div class="picHead">
|
|
|
|
|
<div class="pageNation">
|
|
|
|
|
<el-pagination
|
|
|
|
|
@size-change="handleSizeChange"
|
|
|
|
|
@current-change="handleCurrentChange"
|
|
|
|
|
:current-page="page"
|
|
|
|
|
:page-size="pageSize"
|
|
|
|
|
@ -13,23 +12,13 @@
|
|
|
|
|
</el-pagination>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="buttonGroup">
|
|
|
|
|
<span class="info">
|
|
|
|
|
<b> {{ isRuning ? remainingTime : "已暂停" }} </b>
|
|
|
|
|
</span>
|
|
|
|
|
<el-button type="primary" @click="toggleCountdown">{{
|
|
|
|
|
isRuning ? "暂停轮巡" : "开始轮巡"
|
|
|
|
|
}}</el-button>
|
|
|
|
|
<el-button type="primary" @click="setbtn">设置</el-button>
|
|
|
|
|
<!-- <el-button type="primary">轮询条件</el-button>
|
|
|
|
|
<el-select v-model="value" placeholder="请选择">
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in options"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
:label="item.label"
|
|
|
|
|
:value="item.value"
|
|
|
|
|
>
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select> -->
|
|
|
|
|
<span class="info">
|
|
|
|
|
<b> {{ isRuning ? remainingTime : "已暂停" }} </b>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imageCenter" v-loading="loading">
|
|
|
|
|
@ -57,19 +46,10 @@
|
|
|
|
|
<div class="bigpic" v-else>
|
|
|
|
|
<img src="../../assets/img/nopic.jpg" />
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <div class="bigimg" v-else-if="item.path.indexOf('videos') !== -1">
|
|
|
|
|
<video
|
|
|
|
|
width="100%"
|
|
|
|
|
height="100%"
|
|
|
|
|
:src="item.path"
|
|
|
|
|
controls="controls"
|
|
|
|
|
></video>
|
|
|
|
|
</div> -->
|
|
|
|
|
|
|
|
|
|
<p class="infoTop">
|
|
|
|
|
{{ item.linename }}-{{ item.displayname }}-{{ item.channnelname }}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="infoBottom">
|
|
|
|
|
<p class="infoBottom" v-if="item.photoTime !== null">
|
|
|
|
|
{{ $moment(item.photoTime).format("yy-MM-DD HH:mm:ss") }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
@ -110,6 +90,16 @@ import qs from "qs";
|
|
|
|
|
export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
value: "选项1",
|
|
|
|
|
page: 1, // 当前页数
|
|
|
|
|
pageSize: 4, // 每页数量
|
|
|
|
|
totalPage: 0, //总页数
|
|
|
|
|
total: 0, //总条数
|
|
|
|
|
picList: [], //图片列表数据
|
|
|
|
|
remainingTime: 5, //剩余时间
|
|
|
|
|
isRuning: false,
|
|
|
|
|
timer: null,
|
|
|
|
|
loading: false,
|
|
|
|
|
setdialog: false, //设置弹框
|
|
|
|
|
speedOptions: [
|
|
|
|
|
{
|
|
|
|
|
@ -175,17 +165,6 @@ export default {
|
|
|
|
|
label: "倒序",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
value: "选项1",
|
|
|
|
|
page: 1, // 当前页数
|
|
|
|
|
pageSize: 4, // 每页数量
|
|
|
|
|
totalPage: 0, //总页数
|
|
|
|
|
total: 0, //总条数
|
|
|
|
|
picList: [], //图片列表数据
|
|
|
|
|
basUrl: "",
|
|
|
|
|
remainingTime: 15, //剩余时间
|
|
|
|
|
isRuning: false,
|
|
|
|
|
timer: null,
|
|
|
|
|
loading: false,
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
@ -202,7 +181,7 @@ export default {
|
|
|
|
|
this.setdialog = false;
|
|
|
|
|
this.$message.success("设置成功");
|
|
|
|
|
},
|
|
|
|
|
handleSizeChange(val) {},
|
|
|
|
|
//点击分页
|
|
|
|
|
handleCurrentChange(val) {
|
|
|
|
|
this.isRuning = false;
|
|
|
|
|
this.pauseCountdown();
|
|
|
|
|
@ -217,6 +196,7 @@ export default {
|
|
|
|
|
pagesize: this.pageSize,
|
|
|
|
|
})
|
|
|
|
|
.then((res) => {
|
|
|
|
|
console.log(this.totalPage);
|
|
|
|
|
this.picList = res.data.list;
|
|
|
|
|
this.totalPage = res.data.totalpage;
|
|
|
|
|
this.total = res.data.total;
|
|
|
|
|
@ -226,22 +206,23 @@ export default {
|
|
|
|
|
console.log(err);
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
//开始轮巡
|
|
|
|
|
//开始轮询
|
|
|
|
|
startCountdown() {
|
|
|
|
|
console.log(this.remainingTime);
|
|
|
|
|
this.timer = setInterval(() => {
|
|
|
|
|
if (this.remainingTime <= 0) {
|
|
|
|
|
//等于0时 清除定时器，剩余时间等于总时间，从新执行当前轮巡函数
|
|
|
|
|
clearInterval(this.timer);
|
|
|
|
|
this.remainingTime = parseInt(localStorage.getItem("totalTime"))
|
|
|
|
|
? parseInt(localStorage.getItem("totalTime"))
|
|
|
|
|
: 15;
|
|
|
|
|
this.startCountdown();
|
|
|
|
|
this.clearTimer();
|
|
|
|
|
console.log("结束");
|
|
|
|
|
this.page++;
|
|
|
|
|
this.getPicData();
|
|
|
|
|
if (this.page >= this.totalPage) {
|
|
|
|
|
clearInterval(this.timer);
|
|
|
|
|
this.page = 1;
|
|
|
|
|
console.log(this.totalPage);
|
|
|
|
|
if (this.page > this.totalPage) {
|
|
|
|
|
console.log("组后一页");
|
|
|
|
|
this.page = 0;
|
|
|
|
|
this.startCountdown();
|
|
|
|
|
} else {
|
|
|
|
|
console.log(this.page);
|
|
|
|
|
this.remainingTime = 5;
|
|
|
|
|
this.getPicData();
|
|
|
|
|
this.startCountdown();
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
@ -249,20 +230,28 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
}, 1000);
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
//暂停轮巡
|
|
|
|
|
clearTimer() {
|
|
|
|
|
//清除定时器
|
|
|
|
|
clearInterval(this.timer);
|
|
|
|
|
this.timer = null;
|
|
|
|
|
},
|
|
|
|
|
pauseCountdown() {
|
|
|
|
|
clearInterval(this.timer); //清除定时器
|
|
|
|
|
//清除定时器
|
|
|
|
|
clearInterval(this.timer);
|
|
|
|
|
this.timer = null;
|
|
|
|
|
},
|
|
|
|
|
//根据isRuning执行开始暂停操作
|
|
|
|
|
toggleCountdown() {
|
|
|
|
|
if (this.isRuning) {
|
|
|
|
|
console.log(this.isRuning);
|
|
|
|
|
this.pauseCountdown();
|
|
|
|
|
} else {
|
|
|
|
|
console.log(this.isRuning);
|
|
|
|
|
this.startCountdown();
|
|
|
|
|
this.getPicData();
|
|
|
|
|
}
|
|
|
|
|
this.isRuning = !this.isRuning;
|
|
|
|
|
console.log(this.isRuning);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
computed: {},
|
|
|
|
|
@ -298,7 +287,7 @@ export default {
|
|
|
|
|
.info {
|
|
|
|
|
width: 80px;
|
|
|
|
|
text-align: center;
|
|
|
|
|
margin-left: 16px;
|
|
|
|
|
margin-right: 16px;
|
|
|
|
|
line-height: 32px;
|
|
|
|
|
b {
|
|
|
|
|
font-size: 24px;
|
|
|
|
|
@ -315,18 +304,20 @@ export default {
|
|
|
|
|
// justify-content: space-around;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
height: calc(100% - 52px);
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
.imgList {
|
|
|
|
|
width: 49.4%;
|
|
|
|
|
width: 49.8%;
|
|
|
|
|
position: relative;
|
|
|
|
|
display: inline-block;
|
|
|
|
|
margin-right: 0.25%;
|
|
|
|
|
margin-left: 0.25%;
|
|
|
|
|
margin-top: 0.3%;
|
|
|
|
|
margin-right: 0.1%;
|
|
|
|
|
margin-left: 0.1%;
|
|
|
|
|
margin-top: 0.1%;
|
|
|
|
|
margin-bottom: 0.1%;
|
|
|
|
|
position: relative;
|
|
|
|
|
-moz-border-radius: 3px;
|
|
|
|
|
-webkit-border-radius: 3px;
|
|
|
|
|
border-radius: 3px px;
|
|
|
|
|
height: 49%;
|
|
|
|
|
height: 49.8%;
|
|
|
|
|
.bigpic {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
@ -342,7 +333,7 @@ export default {
|
|
|
|
|
bottom: 28px;
|
|
|
|
|
left: 0px;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
background-color: #3a87ad !important;
|
|
|
|
|
background: linear-gradient(180deg, #00eaff 10%, #409eff 100%);
|
|
|
|
|
color: @color-white;
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
margin-top: 2px;
|
|
|
|
|
@ -355,7 +346,7 @@ export default {
|
|
|
|
|
color: @color-white;
|
|
|
|
|
left: 0px;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
background-color: #51b17c !important;
|
|
|
|
|
background: linear-gradient(180deg, #00eaff 10%, #409eff 100%);
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
margin-top: 2px;
|
|
|
|
|
padding-left: 5px;
|
|
|
|
|
|
fanluyan
2 years ago
