feixian
徐景良 2024-12-05 15:57:52 +08:00
parent a1215a843b
commit d69889cbc1
6 changed files with 394 additions and 47 deletions

View File

@ -1,7 +1,7 @@
NODE_ENV = development
# 正式服务器
VUE_APP_BASE_API = http://221.2.83.254:9001/api
VUE_APP_BASE_API = http://221.2.83.254:9013/api
VUE_APP_BASE_IMG_URL = http://221.2.83.254:9001
VUE_APP_WEBSOCKET_URL = ws://221.2.83.254:9002/ws
VUE_APP_GEOSERVER_URL = http://221.2.83.254:9007/

View File

@ -26,7 +26,7 @@
<div v-if="monitorSelect == '视频监控'">
<div class="monitor-sub-header" >
<div class="UAV-title">市应急局监控设备</div>
<div style="display: flex;align-items: center;margin-right: 9px;cursor: pointer;">
<div style="display: flex;align-items: center;margin-right: 9px;cursor: pointer;" @click="monitorListVisible=true">
<span class="Uav-number">{{monitorInfo.total}}</span>
<div class="drop-down-icon" style="margin-left: 6px;"></div>
</div>
@ -36,6 +36,19 @@
<div :class="`sub-button ${monitorSubSelect == '摄像头'? 'sub-button-select': ''}`" @click="monitorSubSelect = '摄像头'">
<span class="sub-button-span">摄像头</span>
</div>
<div class="list-select-container" v-show="monitorListVisible">
<div class="list-box">
<div class="select-item" v-for="(item,index) in monitorInfoList" :key="index">
<el-checkbox v-model="item.checked" @change="playMonitor(item,index)">{{item.jkdmckjg}}</el-checkbox>
</div>
</div>
<div class="play-operation-cointainer">
<el-button size="mini" @click="monitorListVisible=false"></el-button>
<el-button size="mini" @click="monitorListVisible=false"></el-button>
</div>
</div>
</div>
<div class="camera-content">
<div class="camera-item"
@ -44,7 +57,7 @@
>
<EasyPlayer
:key="index"
style="width:186px;height:139px;"
style="width:186px;height:139px;overflow:hidden;"
:videoUrl="item"
:aspect="easyPlayerConfig.aspect"
live
@ -61,8 +74,8 @@
<div v-show="monitorSelect == '无人机'">
<div class="monitor-sub-header" >
<div class="UAV-title">DJ大疆巡航费县马庄镇....</div>
<div style="display: flex;align-items: center;margin-right: 9px;cursor: pointer;">
<div class="UAV-title">无人机视频巡航</div>
<div style="display: flex;align-items: center;margin-right: 9px;cursor: pointer;" @click="uavListVisible=true">
<span class="Uav-number">{{list.length}}</span>
<div class="drop-down-icon" style="margin-left: 6px;"></div>
</div>
@ -72,6 +85,15 @@
<div :class="`sub-button ${monitorSubSelect == '摄像头'? 'sub-button-select': ''}`" @click="monitorSubSelect = '摄像头'">
<span class="sub-button-span">摄像头</span>
</div>
<div class="list-select-container" v-show="false">
<div class="select-item" v-for="(item,index) in list" :key="index">
<el-checkbox v-model="item.checked" @change="playUavVideo(item,index)"> {{item.model}}</el-checkbox>
</div>
<div class="play-operation-cointainer">
<el-button size="mini" @click="uavListVisible=false"></el-button>
<el-button size="mini" @click="uavListVisible=false"></el-button>
</div>
</div>
</div>
<div class="camera-content">
<div class="camera-item" v-for="(item,index) in list" :key="index">
@ -79,6 +101,7 @@
:id="'player-container-'+item.account"
width="186px"
height="139px"
style="overflow:hidden;"
autoplay
preload="auto"
playsinline
@ -103,7 +126,7 @@ export default {
data() {
return {
monitorSelect: '无人机',
monitorSelect: '视频监控',
monitorSubSelect: '无人机巡航',
//
@ -115,13 +138,22 @@ export default {
aspect:"16:9",
fluent:true
},
monitorInfoList:[],
playArrays:[],
//
list: [],
list: [
// {"account":"17861857726","createtime":"2023-03-23 15:44:38","height":0.5,"ip":"192.168.10.102","lat":34.999999,"lng":117.878787,"model":"Mavic Air 3"},
// {"account":"17861857729","createtime":"2023-03-23 15:44:38","height":0.5,"ip":"192.168.10.105","lat":34.73333,"lng":118.1,"model":"Mavic Air 4"},
// {"account":"17861857725","createtime":"2023-03-23 15:44:38","height":0.5,"ip":"192.168.10.106","lat":34.63333,"lng":118.2,"model":"Mavic Air 5"},
// {"account":"17861857724","createtime":"2023-03-23 15:44:38","height":0.5,"ip":"192.168.10.107","lat":34.53333,"lng":118.3,"model":"Mavic Air 6"},
// {"account":"17861857723","createtime":"2023-03-23 15:44:38","height":0.5,"ip":"192.168.10.108","lat":34.83333,"lng":118.4,"model":"Mavic Air 7"}
],
player: null,
uavGraphicLayer: null,
uavRandom:100,
monitorListVisible:false,
uavListVisible:false,
}
},
mounted(){
@ -132,6 +164,35 @@ export default {
},
methods:{
//
playMonitor(info,index){
this.$set(
this.monitorInfoList,
index,
{ ...this.monitorInfoList[index],
checked: info.checked
});
if(info.checked){
let obj = this.playArrays.find((item,index)=>{
return item == "http://221.2.83.254:7012/live/"+info.jkdgbidzlkjg+".m3u8";
})
if(obj){
return null;
}else{
this.playArrays.push("http://221.2.83.254:7012/live/"+info.jkdgbidzlkjg+".m3u8");
}
}else{
this.playArrays.forEach((item,index)=>{
if(item == "http://221.2.83.254:7012/live/"+info.jkdgbidzlkjg+".m3u8"){
this.playArrays.splice(index,1);
}
})
}
console.log("playArrays",this.playArrays);
},
handlerGetMonitorList(){
let listQuery = {
county:"",
@ -140,10 +201,33 @@ export default {
}
getMethodCommon("/YingJiJu/LoadCameraInfo",listQuery).then(res=>{
if(res.code == 200){
this.monitorInfo.list = res.data;
this.monitorInfoList = res.data;
this.monitorInfo.total = res.count
this.monitorInfo.list.forEach((item,index)=>{
/*
37130100181328000001
37130100181328000620
37130100181328000558
*/
this.monitorInfoList.forEach((item,index)=>{
if(item.jkdgbidzlkjg == "37130100181328000558" || item.jkdgbidzlkjg == "37130100181328000001"){
let target = this.monitorInfoList[index];
this.monitorInfoList.splice(index,1);
this.monitorInfoList.unshift(target);
}
})
// this.monitorInfoList.sort((item,index)=>{
// })
this.monitorInfoList.forEach((item,index)=>{
this.monitorInfoList[index].checked = false;
if(index<4){
this.monitorInfoList[index].checked = true;
this.playArrays.push("http://221.2.83.254:7012/live/"+item.jkdgbidzlkjg+".m3u8")
}
})
@ -152,6 +236,34 @@ export default {
},
//
playUavVideo(info,index){
this.$set(
this.list,
index,
{ ...this.list[index],
checked: info.checked
});
if(info.checked){
let obj = this.list.find((item,index)=>{
return item.account == info.account;
})
if(obj){
return null;
}else{
}
}else{
this.list.forEach((item,index)=>{
})
}
console.log("playArrays",this.playArrays);
},
getSocketData(evt) {
let _this = this;
if (isJson(evt.detail.data)){
@ -330,6 +442,45 @@ export default {
font-size: 13px;
line-height: 13px;
margin-bottom: 13px;
position:relative;
.list-select-container{
width:100%;
height:296px;
background:#3b6f6ef7;
position:absolute;
top:40px;
left:0px;
border: 1px solid #2daaa9;
z-index:9999;
.play-operation-cointainer{
width:100%;
padding:10px 0px;
position:absolute;
bottom:0px;
left:0px;
text-align: right;
padding-right:20px;
}
.list-box{
width:100%;
height: calc( 100% - 48px);
overflow: auto;
.select-item{
width:100%;
padding:0px 15px;
color:#fff;
line-height:34px;
font-size:14px;
&:nth-child(2n){
background:#014a4d4a;
}
}
&::-webkit-scrollbar{
display: none;
}
}
}
.UAV-title{
width: 152px;
height: 13px;
@ -368,6 +519,11 @@ export default {
.camera-content{
display: flex;
flex-wrap: wrap;
overflow-y: auto;
max-height: 306px;
&::-webkit-scrollbar{
display:none;
}
.camera-item{
width: 190px;
height: 143px;
@ -380,4 +536,32 @@ export default {
}
}
}
::v-deep .el-checkbox__inner{
border-color:none!important;
background-color:none!important;
}
::v-deep .el-button--mini {
font-size: 12px;
color: #fff;
border-radius: 0px;
background: #169fa359;
border-color: #2daaa9;
cursor:pointer;
}
::v-deep .el-checkbox__label{
color:#fff;
}
::v-deep .is-checked .el-checkbox__label {
color:#fff;
}
::v-deep .is-checked .el-checkbox__inner{
background:#007C7F;
border-color:#007C7F;
}
</style>

View File

@ -9,7 +9,7 @@
>
<div class="item-title">{{item.name}}</div>
<div class="item-number-background">
<span class="item-number">{{item.id}}</span>
<span class="item-number">{{item.count}}</span>
</div>
</div>
</div>
@ -17,6 +17,7 @@
</template>
<script>
import axios from 'axios'
import { getMethodCommon } from '../../../api/common';
let GEOSERVER_BASE_API = process.env.VUE_APP_GEOSERVER_URL;
export default {
name:'',
@ -43,6 +44,143 @@ export default {
},
methods:{
handlerLoadLayerList(){
getMethodCommon("/FireCodePC/queryLayer").then(res=>{
if(res.code == 200){
let configLayers = [];
res.result.forEach((it,index)=>{
try{
let attribute = JSON.parse(it.attribute);
attribute.count = it.count
//
if(attribute && attribute.symbol && attribute.symbol.styleField && attribute.symbol.styleFieldOptions && Object.keys(attribute.symbol.styleFieldOptions).length>0){
// console.log(attribute.layers,attribute)
attribute.type = 'geojson';
if(attribute.layers){
attribute.url = "geoserver/ksp/ows?service=WFS&version=1.0.0&request=GetFeature&typeName="+attribute.layers+"&maxFeatures=1000000&outputFormat=application%2Fjson";
}
// delete attribute.layers;
delete attribute.parameters;
delete attribute.highlight;
console.log("图层属性信息:",attribute.url,attribute);
if(!attribute.symbol.styleOptions){
attribute.symbol.styleOptions = {
"opacity": 0.8,
"color": "",
"width": 2,
"clampToGround": true
}
}
attribute.zIndex = 10000000000;
}
if(attribute.dynamic){
attribute.type = 'geojson';
if(attribute.layers){
attribute.url = "geoserver/ksp/ows?service=WFS&version=1.0.0&request=GetFeature&typeName="+attribute.layers+"&maxFeatures=1000000&outputFormat=application%2Fjson";
attribute.symbol = {
type: "polyline",
styleOptions: {
clampToGround:true,
width: 5,
materialType: mars3d.MaterialType.LineFlow,
materialOptions: {
color: Cesium.Color.CHARTREUSE,
image: "img/textures/line-color-yellow.png",
speed: 8
}
}
}
}
}
//
if(attribute.symbol && attribute.symbol.styleOptions && attribute.symbol.styleOptions.label){
attribute.symbol.styleOptions.label.pixelOffsetY = -40
let oldText = attribute.symbol.styleOptions.label.text;
attribute.symbol.styleOptions.label = {
text: oldText,
font_size: 14,
color: Cesium.Color.AZURE,
outline: true,
outlineColor: Cesium.Color.BLACK,
outlineWidth: 2,
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
// pixelOffset: new Cesium.Cartesian2(10, -25) //
pixelOffsetY:-40
}
}
//
delete attribute.highlight;
//
if(attribute.symbol && attribute.symbol.styleOptions && attribute.symbol.styleOptions.label && attribute.symbol.styleOptions.label.text){
/**
* 图标标题显示情况
key字段中文名称value字段英文名称
* 1. key:value
* 2. key:value@key:value
* 3. key:value@,@key:value
* 4. @value
* 5. @value1@value2
* 6. @value1@,@value2
* 7. key:value1@value2
* */
let text = "";
if(attribute.symbol.styleOptions.label.text.match("@")){
let arr = attribute.symbol.styleOptions.label.text.split("@");
if(arr.length>0){
arr.forEach((item,index)=>{
if(item.match(":")){
let garr = item.split(":")
text = text+garr[0]+":{"+garr[1]+"}"
}else if(item.length==1){
text = text+item
}else if(item.length>1){
text = text+"{"+item+"}"
}
})
}
}else if(attribute.symbol.styleOptions.label.text.length>1 && attribute.symbol.styleOptions.label.text.match(":") ){
let garr = attribute.symbol.styleOptions.label.text.split(":")
text = text+garr[0]+":{"+garr[1]+"}"
}else if(attribute.symbol.styleOptions.label.text.length>1 && !attribute.symbol.styleOptions.label.text.match(":")){
text = "{"+attribute.symbol.styleOptions.label.text+"}";
}
attribute.symbol.styleOptions.label.text = text;
}
let ipinfo = this.matchHttpIpPort(attribute.url);
if(ipinfo){ //
attribute.url = attribute.url.replace(ipinfo[0],GEOSERVER_BASE_API);
}else{ //
attribute.url = GEOSERVER_BASE_API+attribute.url
}
if(attribute.type == 'geojson'){
attribute.url = attribute.url + "&cql_filter=is_del%20=0"
}else if(attribute.type == 'wms'){
attribute.parameters.cql_filter="is_del=0"
}
configLayers.push(attribute);
this.layerList = configLayers
}catch(e){
alert(e);
console.error(e);
}
})
}
})
return ;
axios({
method: "get",
url: "http://221.2.83.254:9006/applicationMars/getApplicationInfo/feixian",

View File

@ -45,7 +45,7 @@ export default {
components: { Forewarning, Person, Monitor, ResponseResource, Header, InfoModal, SearchComponent, Map,Onlineuserbox},
data() {
return {
configUrl: `config/${areaName}Config.json`,
configUrl: `config/feixianConfig.json`,
widgetUrl: "config/widget.json",
mapLoading:false,
showForewarningModal: false,

View File

@ -50,7 +50,7 @@
</el-table-column>
<el-table-column
prop="unitName"
prop="server_name"
label="资源名称"
show-overflow-tooltip
align="center"
@ -58,13 +58,21 @@
</el-table-column>
<el-table-column
prop="createTime"
prop="count"
label="资源数量"
show-overflow-tooltip
align="center"
>
</el-table-column>
<el-table-column
prop="sort"
label="排序"
show-overflow-tooltip
align="center"
>
</el-table-column>
</el-table>
</div>
</div>
@ -319,18 +327,21 @@ export default {
cancelButtonText: "取消",
type: "warning",
}).then(() => {
postMethodCommon("/FireCodePC/DeleteUserUnitById?id=" +
_this.multipleSelection[0].id,
{}
).then((res) => {
if (res.code == 200) {
let id = this.multipleSelection[0].id;
postMethodCommon("/FireCodePC/deleteLayer?ids="+id).then(res=>{
if(res.code == 200){
this.getList();
this.$message({
type: "success",
message: "删除成功",
});
type:"success",
message:"删除成功!"
})
}else{
this.$message({
type:"error",
message:"删除失败!"
})
}
_this.getList();
});
})
}).catch(() => {
this.$message({
type: "info",
@ -412,12 +423,11 @@ export default {
},
getList() {
this.listLoading = true;
getMethodCommon("/FireCodePC/GetUserUnit", this.listQuery).then(
getMethodCommon("/FireCodePC/queryLayer").then(
(res) => {
if (res.code == 200) {
console.log(res);
this.tableData = res.data;
this.tableData = res.result;
this.total = res.count;
this.listLoading = false;
}
@ -442,6 +452,24 @@ export default {
this.editForm = this.multipleSelection[0];
this.editServiceVisible = true;
},
handleDelete(){
alert(123);
let id = this.selectMenus[0].id;
postMethodCommon("/FireCodePC/deleteLayer?ids="+id).then(res=>{
if(res.code == 200){
this.getList();
this.$message({
type:"success",
message:"删除成功!"
})
}else{
this.$message({
type:"error",
message:"删除失败!"
})
}
})
}
},
};
</script>

View File

@ -124,9 +124,11 @@ import axios from 'axios';
},
methods: {
handleCheckChange(node, checked, indeterminate) {
let selectedNodes = this.$refs.menuTree.getCheckedNodes();
this.checkList = this.$refs.menuTree.getCheckedNodes();
this.checkList = selectedNodes.map(node => node.id);
console.log("checkList",this.checkList);
},
getApplicationInfo() {
axios.get("http://221.2.83.254:9006/applicationMars/getApplicationInfo/feixian").then(res => {
@ -182,25 +184,20 @@ import axios from 'axios';
},
submitForm() {
var _this = this
this.$refs['form'].validate((valid) => {
if (valid) {
//
postMethodCommon("/FireCodePC/AddOrUpdateUserUnit", _this.addForm).then(response => {
if (response.code == 200) {
// shp
this.$emit("addSuccess");
this.$message({
type: "success",
message: "添加成功"
})
}
})
} else {
console.log('error submit!!');
return false;
}
});
if(this.checkList.length>0){
postMethodCommon("/FireCodePC/addLayers?ids="+_this.checkList[0], ).then(response => {
if (response.code == 200) {
// shp
this.$emit("addSuccess");
this.$message({
type: "success",
message: "添加成功"
})
}
})
}
},
createForm() {
var _this = this