up
This commit is contained in:
@ -981,7 +981,7 @@ function villageClick(layers, xy, level, cartographic, movement) {
|
||||
// customName地图服务自定义属性名
|
||||
function addvillage(CQL_FILTER, customName) {
|
||||
let map2 = new Cesium.WebMapServiceImageryProvider({
|
||||
url: `http://121.36.229.60:9080/geoserver/shuzisannong/wms`,
|
||||
url: `${serverAPI.geoserverUrl}/shuzisannong/wms`,
|
||||
layers: 'shuzisannong:huangdaoqu_village', //图层名
|
||||
parameters: {
|
||||
service: 'WMS',
|
||||
|
File diff suppressed because it is too large
Load Diff
@ -887,7 +887,7 @@ function villageClick(layers, xy, level, cartographic) {
|
||||
// customName地图服务自定义属性名
|
||||
function addvillage(CQL_FILTER, customName) {
|
||||
let map2 = new Cesium.WebMapServiceImageryProvider({
|
||||
url: `http://121.36.229.60:9080/geoserver/shuzisannong/wms`,
|
||||
url: `${serverAPI.geoserverUrl}/shuzisannong/wms`,
|
||||
layers: 'shuzisannong:huangdaoqu_village', //图层名
|
||||
parameters: {
|
||||
service: 'WMS',
|
||||
|
File diff suppressed because it is too large
Load Diff
2477
src/views/index.vue
2477
src/views/index.vue
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@ -720,7 +720,7 @@ function addBoundaryHandle(data, name, color) {
|
||||
// customName地图服务自定义属性名
|
||||
function addvillage(CQL_FILTER, customName) {
|
||||
let map2 = new Cesium.WebMapServiceImageryProvider({
|
||||
url: `http://121.36.229.60:9080/geoserver/shuzisannong/wms`,
|
||||
url: `${ serverAPI.geoserverUrl}/shuzisannong/wms`,
|
||||
layers: 'shuzisannong:huangdaoqu_village', //图层名
|
||||
parameters: {
|
||||
service: 'WMS',
|
||||
|
@ -7,7 +7,28 @@
|
||||
<span>摄像头选择</span>
|
||||
</div>
|
||||
<div class="search">
|
||||
<el-input class="seach_input" v-model="input" placeholder="请输入要筛选摄像头名" clearable />
|
||||
<el-input
|
||||
class="seach_input"
|
||||
v-model="input"
|
||||
placeholder="请输入要筛选摄像头名"
|
||||
clearable
|
||||
/>
|
||||
<el-select
|
||||
popper-class="selectCity"
|
||||
class="seach_input"
|
||||
v-model="street"
|
||||
placeholder="请选择要筛选街道"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="cameraDiv">
|
||||
<p v-for="(item, index) in cameraArr" :key="index">{{ item }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="leftFoldDiv" @click="leftFoldClick()">
|
||||
@ -47,6 +68,26 @@
|
||||
<div class="title">
|
||||
<span>视频监控</span>
|
||||
</div>
|
||||
<div class="videoDiv">
|
||||
<div>
|
||||
<vue3VideoPlay
|
||||
v-bind="videopage"
|
||||
poster="https://cdn.jsdelivr.net/gh/xdlumia/files/video-play/ironMan.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<vue3VideoPlay
|
||||
v-bind="videopage"
|
||||
poster="https://cdn.jsdelivr.net/gh/xdlumia/files/video-play/ironMan.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<vue3VideoPlay
|
||||
v-bind="videopage"
|
||||
poster="https://cdn.jsdelivr.net/gh/xdlumia/files/video-play/ironMan.jpg"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rightFoldDiv" @click="rightFoldClick()">
|
||||
<el-tooltip
|
||||
@ -129,6 +170,57 @@ const formLandRef = ref([]);
|
||||
const flag = ref(false);
|
||||
let leftWraFlag = ref(true);
|
||||
let rightWraFlag = ref(true);
|
||||
const street = ref('');
|
||||
let cameraArr = ref(['摄像头名称1', '摄像头名称1', '摄像头名称1']);
|
||||
const options = [
|
||||
{
|
||||
value: 'Option1',
|
||||
label: 'Option1',
|
||||
},
|
||||
{
|
||||
value: 'Option2',
|
||||
label: 'Option2',
|
||||
},
|
||||
{
|
||||
value: 'Option3',
|
||||
label: 'Option3',
|
||||
},
|
||||
{
|
||||
value: 'Option4',
|
||||
label: 'Option4',
|
||||
},
|
||||
{
|
||||
value: 'Option5',
|
||||
label: 'Option5',
|
||||
},
|
||||
];
|
||||
|
||||
const videopage = reactive({
|
||||
width: '100%', //播放器宽度
|
||||
height: '100%', //播放器高度
|
||||
color: '#409eff', //主题色
|
||||
title: '', //视频名称
|
||||
src: 'https://cdn.jsdelivr.net/gh/xdlumia/files/video-play/IronMan.mp4', //视频源
|
||||
muted: false, //静音
|
||||
webFullScreen: false,
|
||||
speedRate: ['0.75', '1.0', '1.25', '1.5', '2.0'], //播放倍速
|
||||
autoPlay: false, //自动播放
|
||||
loop: false, //循环播放
|
||||
mirror: false, //镜像画面
|
||||
ligthOff: false, //关灯模式
|
||||
volume: 0.3, //默认音量大小
|
||||
control: true, //是否显示控制
|
||||
controlBtns: [
|
||||
// 'audioTrack',
|
||||
'quality',
|
||||
// 'speedRate',
|
||||
'volume',
|
||||
// 'setting',
|
||||
// 'pip',
|
||||
// 'pageFullScreen',
|
||||
'fullScreen',
|
||||
], //显示所有按钮,
|
||||
});
|
||||
|
||||
watch(
|
||||
() => Township.arr,
|
||||
@ -674,7 +766,7 @@ function villageClick(layers, xy, level, cartographic, movement) {
|
||||
// customName地图服务自定义属性名
|
||||
function addvillage(CQL_FILTER, customName) {
|
||||
let map2 = new Cesium.WebMapServiceImageryProvider({
|
||||
url: `http://121.36.229.60:9080/geoserver/shuzisannong/wms`,
|
||||
url: `${serverAPI.geoserverUrl}/shuzisannong/wms`,
|
||||
layers: 'shuzisannong:huangdaoqu_village', //图层名
|
||||
parameters: {
|
||||
service: 'WMS',
|
||||
@ -1168,11 +1260,39 @@ $height: calc(100vh - 100px);
|
||||
background: rgba(22, 94, 102, 1);
|
||||
border: 1px solid rgba(4, 153, 153, 1);
|
||||
box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.25);
|
||||
// margin-right: 10px;
|
||||
:deep(.el-input__wrapper) {
|
||||
box-shadow: none;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.cameraDiv {
|
||||
p {
|
||||
opacity: 1;
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
rgba(38, 255, 255, 0.15) 0%,
|
||||
rgba(38, 255, 255, 0.01) 100%
|
||||
);
|
||||
height: 48px;
|
||||
border-width: 0px 0px 0px 0px;
|
||||
border-style: solid;
|
||||
border-color: rgba(217, 231, 255, 1);
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
padding: 10px 15px 10px 15px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.leftbottom {
|
||||
@ -1274,7 +1394,9 @@ $height: calc(100vh - 100px);
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
|
||||
.videoDiv > div {
|
||||
padding: 10px;
|
||||
}
|
||||
.ProgressBar {
|
||||
width: 100%;
|
||||
height: 9px;
|
||||
@ -1309,6 +1431,9 @@ $height: calc(100vh - 100px);
|
||||
}
|
||||
}
|
||||
}
|
||||
:deep(.el-input__inner) {
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
|
||||
.legend {
|
||||
position: absolute;
|
||||
@ -1482,12 +1607,18 @@ $height: calc(100vh - 100px);
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.el-popper {
|
||||
border: none !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
// .el-popper {
|
||||
// border: none !important;
|
||||
// background: transparent !important;
|
||||
// }
|
||||
|
||||
.el-popper__arrow::before {
|
||||
background: rgba(41, 255, 255, 0.7) !important;
|
||||
// .el-popper__arrow::before {
|
||||
// background: rgba(41, 255, 255, 0.7) !important;
|
||||
// }
|
||||
// .el-popper__arrow::before {
|
||||
// background: rgba(41, 255, 255, 0.7) !important;
|
||||
// }
|
||||
.el-popper__arrow {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
|
@ -759,7 +759,7 @@ function villageClick(layers, xy, level, cartographic) {
|
||||
// customName地图服务自定义属性名
|
||||
function addvillage(CQL_FILTER, customName) {
|
||||
let map2 = new Cesium.WebMapServiceImageryProvider({
|
||||
url: `http://121.36.229.60:9080/geoserver/shuzisannong/wms`,
|
||||
url: `${serverAPI.geoserverUrl}/shuzisannong/wms`,
|
||||
layers: 'shuzisannong:huangdaoqu_village', //图层名
|
||||
parameters: {
|
||||
service: 'WMS',
|
||||
|
Reference in New Issue
Block a user