This commit is contained in:
2309368887@qq.com 2022-06-29 10:46:31 +08:00
commit 8c5306dc09
9 changed files with 352 additions and 41 deletions

File diff suppressed because one or more lines are too long

View File

@ -61,6 +61,24 @@ export default {
}
}
},
video: {
list: {
name: "获取视频设备列表",
req: async function(){
return await http.post(
`${config.API_URL}/third/tdevice/vchannel/`,
);
}
},
item:{
name: "获取视频",
req: async function(data){
return await http.post(
`${config.API_URL}/third/dahua/`,data
);
}
},
},

View File

@ -264,7 +264,6 @@ export default {
},
//
async getData() {
this.loading = true;
var reqData = {
[config.request.page]: this.currentPage,
@ -282,18 +281,15 @@ export default {
try {
var res = await this.apiObj.req(reqData);
if (this.hidePagination) {
if (res.length == 0) {
this.emptyText = "暂无数据";
}
if(this.$route.path==='/sys/dept'||this.$route.path==='/sys/perm'){
this.tableData = this.redata(res);
console.log(this.tableData)
}else{
this.tableData = res || [];
}
// this.tableData = res;
this.loading = false;
this.$refs.scTable.setScrollTop(0);
this.$emit("dataChange", res, this.tableData);
@ -312,11 +308,10 @@ export default {
if (this.hidePagination) {
dataList = response.data || [];
} else {
dataList = response.rows || [];
dataList = response.rows?response.rows:response.data.pageData?response.data.pageData:[];
}
if(this.$route.path==='/sys/dept'||this.$route.path==='/ops/menu'){
this.tableData = this.redata(dataList);
console.log(this.tableData)
}else{
this.tableData = dataList || [];
@ -325,8 +320,6 @@ export default {
this.summary = response.summary || {};
this.loading = false;
this.$refs.scTable.setScrollTop(0);
this.$emit("dataChange", res, this.tableData);
} catch (error) {
this.loading = false;
@ -345,7 +338,6 @@ export default {
let obj = posts.reduce((res, v) => (res[v.id] = v , res), {});//Object
let arr = [];
for (let item of posts) {
//debugger;
if (item.parentId == null) {
arr.push(item);
continue
@ -354,7 +346,6 @@ export default {
parent.children = parent.children ? parent.children : [];
parent.children.push(item);
}
console.log(arr);
return arr;
},

View File

@ -391,6 +391,15 @@ const routes = [
"icon": "el-icon-menu",
},
"component": "am/em1"
},
{
"name": "monitor",
"path": "/am/monitor",
"meta": {
"title": "视频通道",
"icon": "el-icon-menu",
},
"component": "am/monitor"
},
]
},

View File

@ -46,7 +46,7 @@
<el-table-column label="当前人数" prop="count_people" min-width="90"></el-table-column>
<el-table-column label="所属部门" prop="create_time" min-width="180"></el-table-column>
<el-table-column label="创建时间" prop="create_time" width="160"></el-table-column>
<el-table-column label="操作" fixed="right" align="center" width="120">
<el-table-column label="操作" fixed="right" align="center" width="160">
<template #default="scope">
<el-button-group>
<el-button text type="primary" size="small" @click="handleRail(scope.row)">围栏</el-button>

View File

@ -5,6 +5,20 @@
destroy-on-close
@closed="closeDrawer"
>
<el-form
:model="coordinates"
label-width="80px"
style="position:absolute;top:15px;left:200px;"
>
<el-form-item label="围栏名称" prop="name">
<el-input
v-model="coordinates.railName"
placeholder="请输入围栏名称"
clearable
style="width: 150px;"
></el-input>
</el-form-item>
</el-form>
<el-container v-loading="loading">
<el-main style="padding: 0 20px 20px 20px;">
<!--地图-->
@ -40,7 +54,17 @@
loading: false,
visible: true,
isSaveing: false,
coordinates:[],
coordinates:{
floorNo:'',
railName:'',
railType:1,//1:0
mapType:'1',//2xy1
color:'1',
polygon:{
points:[]
}
},
points:[],
};
},
mounted() {
@ -97,19 +121,18 @@
let drawTool2 = new jsmap.JSDrawToolControl({
position: jsmap.JSControlPosition.RIGHT_TOP, //
offset: {
x: 80,
y: 180
x: 30,
y: 30
}, //
drawMode: jsmap.JSDrawMode.POLYGON, //POINT: POLYLINE:线 POLYGON:
//
callback: (feature) => {
console.log('add', feature);
console.log(feature.properties);//type:POLYGON;id:"";name:"";floorNo:"";floorId:""
console.log(feature.geometry);//feature.geometry.coordinates:[[],[]]
that.coordinates = feature.geometry.coordinates[0];
debugger;
this.coordinates.floorNo = feature.properties.floorNo;
this.coordinates.floorId = feature.properties.floorId;
that.points = feature.geometry.coordinates[0];
},
//
removeCallback: (feature) => {
@ -132,29 +155,34 @@
},
//
submit() {
if(this.coordinates.length>0){
this.isSaveing = true;
this.$API.am.area.bindRail.req(this.areaId,this.coordinates)
let that = this;
let pointXY = [];
let tool = new jsmap.JSMapCoordTool(window.map);
let points = that.points;
if(points.length>0){
that.isSaveing = true;
that.coordinates.color = 'rgba(255,0,0,.4)';
debugger;
points.forEach(item=>{
debugger;
let coordinate = {x:parseFloat(item[0]),y:parseFloat(item[1])};
let pixel = tool.mapToScreenCoordinate(coordinate);
pointXY.push(pixel);
});
that.coordinates.polygon.points = pointXY;
that.$API.am.area.bindRail.req(that.areaId,that.coordinates)
.then(res => {
this.isSaveing = false;
this.visible = false;
this.$emit("success");
this.$message.success("操作成功");
that.isSaveing = false;
that.visible = false;
that.$emit("success");
that.$message.success("操作成功");
return res
}).catch(err => {
this.isSaveing = false;
that.isSaveing = false;
return err
})
}else{
}
}else{}
},
/*//表单注入数据
setData(data) {
console.log(defaultForm);
this.areaId = data.id;
this.areaName = data.name;
},*/
},
};
</script>

117
src/views/am/monitor.vue Normal file
View File

@ -0,0 +1,117 @@
<template>
<el-container>
<el-header>
<div class="left-panel">
<div class="right-panel-search">
<el-input v-model="search.keyword" placeholder="姓名/手机号" clearable @click="upsearch"></el-input>
<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
</div>
</div>
</el-header>
<el-main class="nopadding">
<scTable ref="table" :apiObj="apiObj" row-key="id" @selection-change="selectionChange" stripe @resetQuery="resetQuery" >
<el-table-column type="selection" width="50"></el-table-column>
<el-table-column label="序号" type="index" width="50"></el-table-column>
<el-table-column label="设备编号" prop="deviceCode" min-width="100"></el-table-column>
<el-table-column label="通道编号" prop="channelCode" min-width="100"></el-table-column>
<el-table-column label="通道名称" prop="channelName" min-width="150"></el-table-column>
<el-table-column label="通道状态" prop="stat" min-width="150"></el-table-column>
<el-table-column label="通道类型" min-width="100">
<template #default="scope">{{scope.row.channelType}}</template>
</el-table-column>
<el-table-column label="设备类型" min-width="100">
<template #default="scope">{{scope.row.cameraType}}</template>
</el-table-column>
<el-table-column label="是否在线" prop="isOnline" min-width="180"></el-table-column>
<el-table-column label="创建时间" prop="createTime" width="160"></el-table-column>
<el-table-column label="操作" fixed="right" align="center" width="160">
<template #default="scope">
<el-button-group>
<el-button text type="primary" size="small" @click="handleView(scope.row)">实时监控</el-button>
<el-popconfirm title="确定删除吗?" @confirm="handleDel(scope.row, scope.$index)">
<template #reference>
<el-button text type="danger" size="small">删除</el-button>
</template>
</el-popconfirm>
</el-button-group>
</template>
</el-table-column>
</scTable>
</el-main>
</el-container>
<video-channel-view v-if="dialogSave" ref="saveDialog" :channelId="channelId" :channelName="channelName" @closed="dialogSave=false"></video-channel-view>
</template>
<script>
import videoChannelView from './vchannel_view'
export default {
name: 'monitor',
components: {
videoChannelView
},
data() {
return {
apiObj: this.$API.am.video.list,
dialogSave: false,
query: {},
selection: [],
search: {
keyword: null
},
channelId:''
}
},
methods: {
handleView(row) {
this.channelId = row.channelCode;
this.channelName = row.channelName;
this.dialogSave = true;
},
//
async handleDel(row){
await this.$API.am.area.delete.req(row.id).then(res=>{
if(res.err_msg){
this.$message.error(res.err_msg);
}else{
this.$refs.table.refresh();
this.$message.success("删除成功")
}
});
},
//
async batch_del(){
this.$confirm(`确定删除选中的 ${this.selection.length} 项吗?如果删除项中含有子集将会被一并删除`, '提示', {
type: 'warning'
}).then(() => {
const loading = this.$loading();
let params = {pk:{pks:this.selection}};
this.$API.am.area.deletes.req(params).then(res=>{
loading.close();
if(res.err_msg){
this.$message.error(res.err_msg);
}else{
this.$refs.table.refresh();
this.$message.success("删除成功")
}
});
}).catch(() => {
})
},
//
selectionChange(selection){
this.selection = selection;
},
//
upsearch(){
},
resetQuery(){
this.query = {}
}
}
}
</script>

View File

@ -0,0 +1,90 @@
<template>
<el-drawer
v-model="visible"
destroy-on-close
@closed="closeDrawer"
:size="800"
>
<el-container v-loading="loading">
<el-main style="padding: 0 20px 20px 20px;">
<sc-title :title="channelName"></sc-title>
<video id="videoElement" muted="muted"></video>
</el-main>
<el-footer>
<el-button @click="visible = false">关闭</el-button>
</el-footer>
</el-container>
</el-drawer>
</template>
<!--<script src="https://cdn.bootcdn.net/ajax/libs/flv.js/1.6.2/flv.js"></script>-->
<script>
import scVideo from '@/components/scVideo'
export default {
components: {scVideo},
emits: ["success", "closed"],
props: {
channelId: {
type: String,
},
channelName: {
type: String,
}
},
data() {
return {
loading: false,
visible: true,
isSaveing: false,
params:{
json:{
data: {
channelId: "",
streamType: "2",
type: "flv"
}
},
code:'video_realtime'
},
};
},
created(){
const scriptInfo = document.createElement("script");
scriptInfo.setAttribute("data-callType","callScript");
scriptInfo.src = "https://cdn.bootcdn.net/ajax/libs/flv.js/1.6.2/flv.js";
document.head.appendChild(scriptInfo)
},
mounted() {
this.$nextTick(()=>{
this.params.json.data.channelId = this.channelId;
// this.params.json = JSON.stringify(this.jso);
this.$API.am.video.item.req(this.params).then(res=>{
debugger;
console.log(res);
this.url = res.url;
if (flvjs.isSupported()) {
let videoElement = document.getElementById('videoElement');
let flvPlayer = flvjs.createPlayer({
type: 'flv',
url: res.url
});
flvPlayer.attachMediaElement(videoElement);
flvPlayer.load();
flvPlayer.play();
}
})
})
},
methods: {
closeDrawer() {
this.$emit('closed');
},
},
};
</script>
<style>
/*.el-drawer.rtl{
width: 90%!important;
}*/
</style>

View File

@ -193,7 +193,8 @@
export default {
data() {
return {
boxMarkerLayer:null,
boxMarkerLayer:null,//
pointMarkerLayer:null,//
flyManager:null,
dropIndex:'1',
markList: [false, false, false, false, false, false, false, false],
@ -337,6 +338,7 @@
});
window.map.addControl(drawTool2);
this.boxMaskerLayer();
this.pointMaskerLayer();
});
window.map.on('mapClickNode', event => {
debugger;
@ -382,6 +384,60 @@
}
});
this.boxMarkerLayer.addMarker(boxMarker);
var boxMarker1 = new jsmap.JSBoxMarker({
id: 'box',
position: [
{x: 114.6284236353879, y: 38.81587979561416, z: 0},
{x: 114.62920209224112, y: 38.81519905830823, z: 0},
{x: 114.63022009284202, y: 38.81594033572247, z: 0},
{x: 114.62938229018444, y: 38.81656925374177, z: 0},
],
floorId: 1,//id
color: 'rgba(134,255,78,0.44)',//
height: 0,//
stretchHeight: 20,//
strokeColor: '#87FF4F',//线
show: true, //
depthTest:Boolean,
allowPicking: false, //
displayCondition: new jsmap.JSDisplayCondition(0.0, 1000),//
callback: (marker) => {
console.log(marker);
}
});
this.boxMarkerLayer.addMarker(boxMarker1);
},
pointMaskerLayer(){
this.pointMarkerLayer = new jsmap.JSPointMarkerLayer({
minimumLevel:3,
maxmumLevel:22,
show:false
});
window.map.addLayer(this.pointMarkerLayer);
this.showPointMarkers();
},
showPointMarkers(){
/*let tool = new jsmap.JSMapCoordTool(window.map);
let coordinate = {x:114.63128751408715,y:38.81306617819082};
let pixel = tool.mapToScreenCoordinate(coordinate);*/
let pointMarker = new jsmap.JSPointMarker({
id:'point1',
color: '#00FF00', //
size: 10, //
position: new jsmap.JSPoint(114.63070237278036, 114.63070237278036, 0), //
floorId: 2, //id,1
outlineColor: '#CD5C5C', //线
outlineWidth: 2, //线
depthTest: true, //
show: true, //
allowPicking: true, //
displayCondition: new jsmap.JSDisplayCondition(0.0, 1000), //
nearFarScale: new jsmap.JSNearFarScale(0.0, 10.0, 500, 0.5), //
callback: (node) => {
console.log(node);
}//
});
this.pointMarkerLayer.addMarker(pointMarker);
},
userSelect() {
this.showUserSelect = !this.showUserSelect
@ -427,7 +483,6 @@
}
this.markList = arr;
} else {
// this.markList[index] = !this.markList[index];
let list = this.markList.slice(1,8);
if(list.indexOf(true)>-1&&list.indexOf(false)<0){
this.markList[0]=true;
@ -436,13 +491,16 @@
}
}
debugger;
if(index === 0&&this.markList[5]||index === 5&&this.markList[5]){
if(this.markList[5]){
this.boxMarkerLayer.show=true;
}else{
// this.layer.setMarkerVisibleByFilter(false, 'show >= true');
this.boxMarkerLayer.show=false;
}
if(this.markList[2]){
this.pointMarkerLayer.show=true;
}else{
this.pointMarkerLayer.show=false;
}
},
changeDropIndex(index){
let that = this;