临时提交
648540858
parent
5c2b4f386b
commit
40e99e3247
|
|
@ -0,0 +1,206 @@
|
|||
<template>
|
||||
<div id="ptzPreset" style="width: 100%">
|
||||
<el-tag v-for="item in presetList"
|
||||
key="item.presetId"
|
||||
closable
|
||||
@close="delPreset(item)"
|
||||
@click="gotoPreset(item)"
|
||||
style="margin-right: 1rem; cursor: pointer"
|
||||
>
|
||||
{{item.presetName?item.presetName:item.presetId}}
|
||||
</el-tag>
|
||||
<el-input
|
||||
min="1"
|
||||
max="255"
|
||||
placeholder="预置位编号"
|
||||
addonBefore="预置位编号"
|
||||
addonAfter="(1-255)"
|
||||
style="width: 120px; vertical-align: bottom;"
|
||||
v-if="inputVisible"
|
||||
v-model="ptzPresetId"
|
||||
ref="saveTagInput"
|
||||
size="small"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<el-button @click="addPreset()">保存</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<el-button v-else size="small" @click="showInput">+ 添加</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: "ptzPreset",
|
||||
props: [ 'channelDeviceId', 'deviceId'],
|
||||
components: {},
|
||||
created() {
|
||||
this.getPresetList()
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
presetList: [],
|
||||
inputVisible: false,
|
||||
ptzPresetId: '',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
getPresetList: function () {
|
||||
this.$axios({
|
||||
method: 'get',
|
||||
url: `/api/ptz/preset/query/${this.deviceId}/${this.channelDeviceId}`,
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.presetList = res.data.data;
|
||||
// 防止出现表格错位
|
||||
this.$nextTick(() => {
|
||||
this.$refs.channelListTable.doLayout();
|
||||
})
|
||||
}
|
||||
|
||||
}).catch((error)=> {
|
||||
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
showInput() {
|
||||
this.inputVisible = true;
|
||||
this.$nextTick(_ => {
|
||||
this.$refs.saveTagInput.$refs.input.focus();
|
||||
});
|
||||
},
|
||||
addPreset: function (){
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
fullscreen: true,
|
||||
text: '正在发送指令',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
})
|
||||
this.$axios({
|
||||
method: 'get',
|
||||
url: `/api/ptz/preset/add/${this.deviceId}/${this.channelDeviceId}`,
|
||||
params: {
|
||||
presetId: this.ptzPresetId
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
setTimeout(()=>{
|
||||
loading.close()
|
||||
this.inputVisible = false;
|
||||
this.ptzPresetId = ""
|
||||
this.getPresetList()
|
||||
}, 1000)
|
||||
}else {
|
||||
loading.close()
|
||||
this.inputVisible = false;
|
||||
this.ptzPresetId = ""
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: res.data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}).catch((error)=> {
|
||||
loading.close()
|
||||
this.inputVisible = false;
|
||||
this.ptzPresetId = ""
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: error,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
},
|
||||
gotoPreset: function (preset){
|
||||
console.log(preset)
|
||||
this.$axios({
|
||||
method: 'get',
|
||||
url: `/api/ptz/preset/call/${this.deviceId}/${this.channelDeviceId}`,
|
||||
params: {
|
||||
presetId: preset.presetId
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '调用成功',
|
||||
type: 'success'
|
||||
});
|
||||
}else {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: res.data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}).catch((error)=> {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: error,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
},
|
||||
delPreset: function (preset){
|
||||
this.$confirm("确定删除此预置位", '提示', {
|
||||
dangerouslyUseHTMLString: true,
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
fullscreen: true,
|
||||
text: '正在发送指令',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
})
|
||||
this.$axios({
|
||||
method: 'get',
|
||||
url: `/api/ptz/preset/delete/${this.deviceId}/${this.channelDeviceId}`,
|
||||
params: {
|
||||
presetId: preset.presetId
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
setTimeout(()=>{
|
||||
loading.close()
|
||||
this.getPresetList()
|
||||
}, 1000)
|
||||
}else {
|
||||
loading.close()
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: res.data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
|
||||
}).catch((error)=> {
|
||||
loading.close()
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: error,
|
||||
type: 'error'
|
||||
});
|
||||
});
|
||||
}).catch(() => {
|
||||
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.channel-form {
|
||||
display: grid;
|
||||
background-color: #FFFFFF;
|
||||
padding: 1rem 2rem 0 2rem;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
gap: 1rem;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -199,9 +199,7 @@
|
|||
</el-select>
|
||||
|
||||
<ptzPreset :channelDeviceId="channelId" :deviceId="deviceId" v-if="ptzMethod === 'preset'" style="margin-top: 1rem"></ptzPreset>
|
||||
<div v-if="ptzMethod === 'cruising'">
|
||||
111
|
||||
</div>
|
||||
<ptzCruising :channelDeviceId="channelId" :deviceId="deviceId" v-if="ptzMethod === 'cruising'" style="margin-top: 1rem"></ptzCruising>
|
||||
<div v-if="ptzMethod === 'scan'">
|
||||
111
|
||||
</div>
|
||||
|
|
@ -357,12 +355,13 @@ import LivePlayer from '@liveqing/liveplayer'
|
|||
import crypto from 'crypto'
|
||||
import jessibucaPlayer from '../common/jessibuca.vue'
|
||||
import PtzPreset from "../common/ptzPreset.vue";
|
||||
import PtzCruising from "../common/ptzCruising.vue";
|
||||
|
||||
export default {
|
||||
name: 'devicePlayer',
|
||||
props: {},
|
||||
components: {
|
||||
PtzPreset,
|
||||
PtzPreset,PtzCruising,
|
||||
LivePlayer, jessibucaPlayer, rtcPlayer,
|
||||
},
|
||||
computed: {
|
||||
|
|
|
|||
Loading…
Reference in New Issue