Merge branch 'fly' into xy-ly

master
fanluyan 2 years ago
commit f3c634bf99

@ -54,11 +54,11 @@ export default {
return { return {
activeIndex: "/realTimeMonitor", activeIndex: "/realTimeMonitor",
items: [ items: [
{ // {
icon: "el-icon-s-home", // icon: "el-icon-s-home",
index: "stritl", // index: "stritl",
title: "首页", // title: "",
}, // },
{ {
icon: "el-icon-camera", icon: "el-icon-camera",
index: "realTimeMonitor", index: "realTimeMonitor",

@ -10,34 +10,53 @@
label-position="left" label-position="left"
ref="formInfo" ref="formInfo"
label-width="auto" label-width="auto"
:rules="rules" :model="ruleForm"
:model="formdata"
> >
<el-form-item label="名称" prop="name"> <el-form-item label="名称" prop="name">
<el-input v-model="formdata.name" autocomplete="off"></el-input> <el-input v-model="ruleForm.name" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
<div class="timeBoxArr"> <div class="addtimeBox" ref="timescrollref">
<el-form-item label="时间" prop="time"> <div
<el-time-picker class="timeBoxArr"
is-range v-for="(item, index) in ruleForm.formList"
v-model="formdata.time" :key="index"
range-separator="至" >
start-placeholder="开始时间" <el-form-item label="时间" :prop="'formList.' + index + '.time'">
end-placeholder="结束时间" <el-time-picker
value-format="HH:mm:ss" is-range
v-model="item.time"
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
value-format="HH:mm:ss"
>
</el-time-picker>
</el-form-item>
<el-form-item
label="间隔(分)"
:prop="'formList.' + index + '.span'"
> >
</el-time-picker> <!-- <el-input v-model="formdata.span" autocomplete="off" type="number"></el-input> -->
</el-form-item> <el-input-number v-model="item.span" :min="1"></el-input-number>
<el-form-item label="间隔(分)" prop="span"> </el-form-item>
<!-- <el-input v-model="formdata.span" autocomplete="off" type="number"></el-input> --> <div class="btngrop">
<el-input-number v-model="formdata.span" :min="1"></el-input-number> <el-button
</el-form-item> v-if="index !== 0"
<button>新增</button> type="danger"
<button>删除</button> icon="el-icon-minus"
@click="deleteModule(item, index)"
></el-button>
<el-button
icon="el-icon-plus"
type="primary"
@click="addModule()"
v-if="index + 1 == ruleForm.formList.length"
></el-button>
</div>
</div>
</div> </div>
<el-form-item label="备注" prop="remark"> <el-form-item label="备注" prop="remark">
<el-input v-model="formdata.remark" autocomplete="off"></el-input> <el-input v-model="ruleForm.remark" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
@ -55,19 +74,45 @@ export default {
data() { data() {
return { return {
isShow: false, isShow: false,
formdata: {}, ruleForm: {
name: "",
formList: [
{
time: "",
span: "",
},
],
remark: "",
},
}; };
}, },
methods: { methods: {
// addModule() {
getdataform(val) { //
console.log(val); this.ruleForm.formList.push({
if (val == null) { time: "",
return (this.formdata = {}); span: "",
});
console.log(this.$refs.timescrollref);
this.$nextTick(() => {
console.log(this.$refs.timescrollref);
if (this.$refs.timescrollref) {
console.log(this.$refs.timescrollref.scrollHeight);
this.$refs.timescrollref.scrollTop =
this.$refs.timescrollref.scrollHeight;
}
});
},
deleteModule(item, index) {
console.log(item, index);
const itemList = this.ruleForm.formList.indexOf(item);
if (itemList !== -1) {
this.ruleForm.formList.splice(index, 1);
} }
this.formdata = val;
this.$set(this.formdata, "time", [val.startTime, val.endTime]);
}, },
//
// //
submitForm() { submitForm() {
this.$refs.formInfo.validate((valid) => { this.$refs.formInfo.validate((valid) => {
@ -92,6 +137,10 @@ export default {
<style lang="less"> <style lang="less">
.adddeviceDialog { .adddeviceDialog {
.el-form { .el-form {
.addtimeBox {
max-height: 205px;
overflow: auto;
}
.timeBoxArr { .timeBoxArr {
display: flex; display: flex;
.el-date-editor.el-input, .el-date-editor.el-input,
@ -99,6 +148,15 @@ export default {
width: 226px; width: 226px;
margin-right: 16px; margin-right: 16px;
} }
.btngrop {
margin-bottom: 16px;
margin-left: 16px;
height: 32px;
.el-button--small {
padding: 9px 8px;
}
}
} }
} }
} }

@ -141,14 +141,14 @@ export default {
handleAdddevice() { handleAdddevice() {
this.title = "新增"; this.title = "新增";
this.$refs.adddeviceDialogref.display(); this.$refs.adddeviceDialogref.display();
this.$refs.adddeviceDialogref.getdataform(null); //this.$refs.adddeviceDialogref.getdataform(null);
}, },
// //
handleResive(data) { handleResive(data) {
this.title = "修改"; this.title = "修改";
this.$refs.adddeviceDialogref.display(); this.$refs.adddeviceDialogref.display();
this.$refs.adddeviceDialogref.getdataform(data); //this.$refs.adddeviceDialogref.getdataform(data);
}, },
// //

@ -34,18 +34,36 @@
</div> </div>
<div class="imageCenter" v-loading="loading"> <div class="imageCenter" v-loading="loading">
<div class="imgList" v-for="(item, index) in picList" :key="index"> <div class="imgList" v-for="(item, index) in picList" :key="index">
<img :src="item.path" /> <viewer class="bigpic" v-if="!item.path.includes('mp4')">
<img :src="item.path" />
</viewer>
<video width="100%" height="90%" controls autoplay v-else>
<source :src="item.path" type="video/mp4" />
</video>
<p class="infoTop"> <p class="infoTop">
{{ item.channelId }}-{{ item.termId }}-{{ item.fileSize }} {{ item.channelId }}-{{ item.termId }}-{{ item.fileSize }}
</p> </p>
<p class="infoBottom">{{ $moment(item.photoTime).format("yy-MM-DD HH:mm:ss") }} </p> <p class="infoBottom">
{{ $moment(item.photoTime).format("yy-MM-DD HH:mm:ss") }} 
</p>
</div> </div>
</div> </div>
<el-dialog title="设置" :visible.sync="setdialog" width="30%" :close-on-click-modal="false"> <el-dialog
<el-form label-width="100px" label-position="left" > title="设置"
:visible.sync="setdialog"
width="30%"
:close-on-click-modal="false"
>
<el-form label-width="100px" label-position="left">
<el-form-item label="轮巡速度"> <el-form-item label="轮巡速度">
<el-select v-model="selSpeed" placeholder="请选择"> <el-select v-model="selSpeed" placeholder="请选择">
<el-option v-for="item in speedOptions" :key="item.value" :label="item.label" :value="item.value"></el-option> <el-option
v-for="item in speedOptions"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<!-- <el-form-item label="画面布局"> <!-- <el-form-item label="画面布局">
@ -67,7 +85,7 @@ import qs from "qs";
export default { export default {
data() { data() {
return { return {
setdialog:false,// setdialog: false, //
speedOptions: [ speedOptions: [
{ {
value: 5, value: 5,
@ -93,8 +111,8 @@ export default {
value: 15, value: 15,
label: "15秒", label: "15秒",
}, },
],// ], //
selSpeed:5, selSpeed: 5,
layoutOptions: [ layoutOptions: [
{ {
value: 1, value: 1,
@ -120,8 +138,8 @@ export default {
value: 6, value: 6,
label: "4*3", label: "4*3",
}, },
],// ], //
selLayout:1, selLayout: 1,
options: [ options: [
{ {
value: "选项1", value: "选项1",
@ -142,23 +160,24 @@ export default {
remainingTime: 0, // remainingTime: 0, //
isRuning: false, isRuning: false,
timer: null, timer: null,
loading:false loading: false,
}; };
}, },
methods: { methods: {
setbtn(){ setbtn() {
this.isRuning = false; this.isRuning = false;
this.pauseCountdown(); this.pauseCountdown();
this.setdialog = true this.setdialog = true;
this.selSpeed = parseInt(localStorage.getItem('totalTime')) ? parseInt(localStorage.getItem('totalTime')) : 15 this.selSpeed = parseInt(localStorage.getItem("totalTime"))
? parseInt(localStorage.getItem("totalTime"))
: 15;
}, },
submitForm(){ submitForm() {
localStorage.setItem('totalTime', this.selSpeed) localStorage.setItem("totalTime", this.selSpeed);
this.setdialog = false; this.setdialog = false;
this.$message.success("设置成功"); this.$message.success("设置成功");
}, },
handleSizeChange(val) { handleSizeChange(val) {},
},
handleCurrentChange(val) { handleCurrentChange(val) {
this.isRuning = false; this.isRuning = false;
this.pauseCountdown(); this.pauseCountdown();
@ -167,19 +186,20 @@ export default {
}, },
// //
getPicData() { getPicData() {
this.loading = true this.loading = true;
getPictureList({ getPictureList({
pageindex: this.page, pageindex: this.page,
pagesize: this.pageSize pagesize: this.pageSize,
}).then((res) => {
this.picList = res.data.list
this.totalPage = res.data.totalpage
this.total = res.data.total
this.loading = false
}) })
.catch((err) => { .then((res) => {
console.log(err); this.picList = res.data.list;
}); this.totalPage = res.data.totalpage;
this.total = res.data.total;
this.loading = false;
})
.catch((err) => {
console.log(err);
});
}, },
// //
@ -188,7 +208,9 @@ export default {
if (this.remainingTime <= 0) { if (this.remainingTime <= 0) {
//0 //0
clearInterval(this.timer); clearInterval(this.timer);
this.remainingTime = parseInt(localStorage.getItem('totalTime')) ? parseInt(localStorage.getItem('totalTime')) : 15; this.remainingTime = parseInt(localStorage.getItem("totalTime"))
? parseInt(localStorage.getItem("totalTime"))
: 15;
this.startCountdown(); this.startCountdown();
this.page++; this.page++;
this.getPicData(); this.getPicData();
@ -280,7 +302,10 @@ export default {
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
border-radius: 3px px; border-radius: 3px px;
height: 49%; height: 49%;
.bigpic {
width: 100%;
height: 100%;
}
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;

@ -210,7 +210,7 @@ export default {
height: calc(100% - 52px); height: calc(100% - 52px);
overflow: auto; overflow: auto;
.imgList { .imgList {
width: 23.5%; width: calc((100% - 96px) / 4);
position: relative; position: relative;
display: inline-block; display: inline-block;
margin: 8px; margin: 8px;

Loading…
Cancel
Save