tianlong/Agriculture-front-end
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

up

Browse Source
This commit is contained in:
tianlong
2023-09-21 17:37:29 +08:00
parent e1446b6082
commit 700b8a4449
249 changed files with 375 additions and 159 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/crops/output/maize/index.vue
View File

@ -2701,8 +2701,8 @@ $height: calc(100vh - 100px);
padding: 5px 5px;
span {
padding: 0 5px;
color: rgba(0, 255, 255, 1);
text-shadow: 0px 0px 6px rgba(0, 255, 255, 0.6);
color: rgba(255, 235, 59, 1);
text-shadow: 0px 0px 6px rgba(255, 235, 59, 0.6);
font-weight: 700;
}
.active {

4
src/views/crops/output/peanut/index.vue
View File

@ -2778,8 +2778,8 @@ $height: calc(100vh - 100px);
padding: 5px 5px;
span {
padding: 0 5px;
color: rgba(0, 255, 255, 1);
text-shadow: 0px 0px 6px rgba(0, 255, 255, 0.6);
color: rgba(255, 235, 59, 1);
text-shadow: 0px 0px 6px rgba(255, 235, 59, 0.6);
font-weight: 700;
}
.active {

4
src/views/crops/output/soybean/index.vue
View File

@ -2780,8 +2780,8 @@ $height: calc(100vh - 100px);
padding: 5px 5px;
span {
padding: 0 5px;
color: rgba(0, 255, 255, 1);
text-shadow: 0px 0px 6px rgba(0, 255, 255, 0.6);
color: rgba(255, 235, 59, 1);
text-shadow: 0px 0px 6px rgba(255, 235, 59, 0.6);
font-weight: 700;
}
.active {

4
src/views/crops/output/wheat/index.vue
View File

@ -2893,8 +2893,8 @@ $height: calc(100vh - 100px);
span {
padding: 0 5px;
color: rgba(0, 255, 255, 1);
text-shadow: 0px 0px 6px rgba(0, 255, 255, 0.6);
color: rgba(255, 235, 59, 1);
text-shadow: 0px 0px 6px rgba(255, 235, 59, 0.6);
font-weight: 700;
}

29
src/views/index.vue
View File

@ -1230,11 +1230,18 @@
<span style="color: rgba(100, 195, 164, 1)">{{ label2 }}</span>
</p>
<el-tree
:data="devicesArr"
:props="defaultProps"
@node-click="handleNodeClick"
/>
<el-tree :data="devicesArr" :props="defaultProps" @node-click="handleNodeClick">
<template class="custom-tree-node" #default="{ node, data }">
<span v-if='data.tlFlag==1' style='color:red'>{{ data.label }}</span>
<span v-else>{{ data.label }}</span>
<span v-if="!data.children && data.type == '大田视频'">
(
<span v-if='data.state== "在线"' class="inline"></span>
<span v-else class="inlines"></span>
)
</span>
</template>
</el-tree>
</div>
<div class="freckle">
<div class="searchDiv">
@ -3897,13 +3904,13 @@ let onDetailVideo = e => {
let time = new Date().getTime() / 1000;
let nonce = suijione(true, false, true, 32);
const inputString = `time:${parseInt(time)},nonce:${nonce},appSecret:${SECRET}`;
getSxtbf({ deviceId: e.cameraName })
getSxtbf({ deviceId: res.data[0].deviceId })
.then(response => {
let player = new imouPlayer({
id: 'myVideo',
// 设备序列号
deviceId: res.data[0].deviceId,
token: response.data.data.kitToken,
token: response.data.kitToken,
channelId: 0,
// 1 直播 2 录播
type: 1,
@ -6674,6 +6681,14 @@ $height: calc(100vh - 110px);
position: absolute;
bottom: 60px;
}
.inline::before {
content: '• 在线';
color: #0f0;
}
.inlines::before{
content: '• 离线';
color: red;
}
</style>
<style lang="scss">
.el-popper {

2
src/views/meteorological/monitor/FloodWarning/index.vue
View File

@ -263,10 +263,8 @@ const disabledDateFun = time => {
return {
disabled: true,
style: {
// Define your disabled date style here
color: 'red',
textDecoration: 'line-through',
// Add more CSS properties as needed
},
};
} else {

96
src/views/plough/VideoSurveillance/index.vue
View File

@ -11,8 +11,20 @@
<el-tree
:data="devicesArr"
:props="defaultProps"
node-key="id"
:default-expanded-keys="deviceIds"
@node-click="handleNodeClick"
/>
>
<template class="custom-tree-node" #default="{ node, data }">
<span>{{ data.label }}</span>
<span v-if="!data.children">
(
<span v-if="data.state == '在线'" class="inline"></span>
<span v-else class="inlines"></span>
)
</span>
</template>
</el-tree>
</div>
<div class="freckle">
<!-- <div class="searchDiv">
@ -60,6 +72,12 @@
/>
<el-table-column prop="village" label="位置" width="180" />
<el-table-column prop="cameraName" label="摄像头名称" width="180" />
<el-table-column prop="flag" label="缩放" width="180">
<template #default="scope">
<span v-if="scope.row.flag == 3">是</span>
<span v-else>否</span>
</template>
</el-table-column>
<el-table-column label="操作">
<template #default="scope">
<span
@ -158,6 +176,7 @@ let center = null; // 指定中心点
const newData = ref({});
let fatherData = ref('');
let baseLayers = null;
let deviceIds = ref([]);
const data = reactive({
videoSrc:
'http://cmgw-vpc.lechange.com:8888/LCO/9C023C5FACFE48F/0/1/20230530T033445/a44e6e04b0608347f0209ab2b25aa258.m3u8',
@ -169,8 +188,10 @@ onMounted(() => {
getCameraNameSs();
});
onUpdated(() => {
window.document.querySelector('.mode') && (document.querySelector('.mode').style.display = 'none');
window.document.querySelector('#screenfull') && (window.document.querySelector('#screenfull').style.display = 'none');
window.document.querySelector('.mode') &&
(document.querySelector('.mode').style.display = 'none');
window.document.querySelector('#screenfull') &&
(window.document.querySelector('#screenfull').style.display = 'none');
});
const initLeafletMap = () => {
map = L.map('cesiumContainers', {
@ -180,7 +201,11 @@ const initLeafletMap = () => {
doubleClickZoom: false, // 禁用双击放大
attributionControl: false, // 移除右下角leaflet标识
maxZoom: 16,
crs: serverAPI.tiandituzhuji=='http://59.206.203.34/tileservice/SDRasterPubMapDJ?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=sdcia&STYLE=default&TILEMATRIXSET=sdcia&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&FORMAT=application%2Fpng' ? L.CRS.EPSG4326 : L.CRS.EPSG3857
crs:
serverAPI.tiandituzhuji ==
'http://59.206.203.34/tileservice/SDRasterPubMapDJ?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=sdcia&STYLE=default&TILEMATRIXSET=sdcia&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&FORMAT=application%2Fpng'
? L.CRS.EPSG4326
: L.CRS.EPSG3857,
});
// 创建底图图层
let imgBaseLayer = null;
@ -238,17 +263,38 @@ const getCameraNames = videoName => {
res.data.forEach((item, index) => {
center = L.latLng(item.latitude, item.longitude);
map.setView(center, 17);
L.marker([item.latitude, item.longitude], { icon: greenIcon })
const marker = L.marker([item.latitude, item.longitude], { icon: greenIcon })
.addTo(map)
.bindPopup(
`<b>${item.cameraName}</b><br><br>经度:${item.longitude}<br><br>纬度:${item.latitude}`
`<b>${item.cameraName}</b><br><br>经度:${item.longitude}<br><br>纬度:${item.latitude}<br/><p><button class="play-button" style='width:100px;'>播放</button></p>`
)
.openPopup();
marker.on('popupopen', function (e) {
const playButton = e.popup.getElement().querySelector('.play-button');
playButton.addEventListener('click', function () {
// 在这里执行播放操作
onDetail(item);
// 阻止事件传播到地图
L.DomEvent.stopPropagation(e);
});
});
if (index == res.data.length - 1) {
setTimeout(() => {
const playButton = document.querySelector('.play-button');
playButton.addEventListener('click', function () {
// 在这里执行播放操作
onDetail(item);
// 阻止事件传播到地图
L.DomEvent.stopPropagation(e);
});
}, 1000);
}
});
});
};
const getCameraNameSs = () => {
getCameraNameS().then(res => {
const getCameraNameSs = town => {
getCameraNameS({ town }).then(res => {
console.log(res);
tabulation.value = res.data;
if (newData.value.children !== null) {
tableNewData.value = res.data.slice(
@ -268,12 +314,19 @@ const tabulationCurrentChange = e => {
/*------------事件----------------*/
//树结构
const handleNodeClick = (data, node, data1, data2) => {
let oriFatherId = node.parent.data;
label2.value = data.label;
formInline.value.flag = '';
// let oriFatherId = node.parent.parent.data;
// label1.value = oriFatherId.label;
newData.value = data;
getCameraNames(label2.value);
if (oriFatherId.label) {
getCameraNameSs(oriFatherId.label);
} else {
console.log();
getCameraNameSs(data.label);
}
};
function getRandom(a, b) {
var max = a;
@ -334,19 +387,13 @@ let onDetail = e => {
data.videoSrc = e.hdStreaming;
dialogVisible.value = true;
getQuery({ name: e.cameraName }).then(res => {
let API_KEY = res.data[0].appId;
let SECRET = res.data[0].appSecret;
let time = new Date().getTime() / 1000;
let nonce = suijione(true, false, true, 32);
const inputString = `time:${parseInt(time)},nonce:${nonce},appSecret:${SECRET}`;
let id = res.data[0].id;
getSxtbf({ deviceId: e.cameraName })
getSxtbf({ deviceId: res.data[0].deviceId })
.then(response => {
let player = new imouPlayer({
id: 'myVideo',
// 设备序列号
deviceId: res.data[0].deviceId,
token: response.data.data.kitToken,
token: response.data.kitToken,
channelId: 0,
// 1 直播 2 录播
type: 1,
@ -756,6 +803,22 @@ $height: calc(100vh - 100px);
position: absolute;
bottom: 60px;
}
:deep(.el-tree-node) {
//el-tree 换行展示
white-space: normal; //关键代码!!!!!!!!!
.el-tree-node__content {
height: 100%;
align-items: start;
}
}
.inline::before {
content: '• 在线';
color: #0f0;
}
.inlines::before {
content: '• 离线';
color: red;
}
</style>
<style lang="scss">
.video {
@ -782,4 +845,5 @@ $height: calc(100vh - 100px);
height: none;
}
}
</style>

149
src/views/plough/resources/index.vue
View File

@ -505,14 +505,14 @@ watch(
});
newData.forEach(item => {
if (layersGbz[item]) {
if (item == '土地确权') {
addUgcv(layersDicS['土地确权']);
if (['土地确权', '三调'].includes(item)) {
addUgcv(layersDicS[item]);
} else {
addwms(layersGbz[item]);
}
} else if (layersDic[item]) {
if (item == '土地确权') {
addUgcv(layersDicS['土地确权']);
if (['土地确权', '三调'].includes(item)) {
addUgcv(layersDicS[item]);
} else {
addwms(layersDic[item]);
}
@ -610,6 +610,14 @@ const datas = [
},
],
},
{
label: '三调',
children: [
{
label: '三调',
},
],
},
];
let flagObj = ref({
2012: true,
@ -680,6 +688,10 @@ let layersDicS = {
name: 'DK3702112022WGS84',
setOf: 'tudiquequanxk',
},
三调: {
name: 'T2021DLTB',
setOf: 'sandiaoshujuWGS84',
},
};
let layersDic = {
@ -703,6 +715,10 @@ let layersDic = {
setOf: 'DK3702112022WGS84@tudiquequanxk',
name: 'map-tudiquequanxk',
},
三调: {
setOf: 'T2021DLTB@sandiaoshujuWGS84',
name: 'map-sandiaoshujuWGS84',
},
};
// 组件挂载完成后执行
@ -758,7 +774,11 @@ function initmap() {
new ol.layer.Tile({
source: new ol.source.XYZ({
url: `${serverAPI.tiandituLayers}`,
projection: serverAPI.tiandituLayers == 'http://59.206.203.34/tileservice/SdRasterPubMap?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=sdimg2017&STYLE=default&TILEMATRIXSET=img2017&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&FORMAT=application%2Fpng'?'EPSG:4326':'EPSG:3857',
projection:
serverAPI.tiandituLayers ==
'http://59.206.203.34/tileservice/SdRasterPubMap?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=sdimg2017&STYLE=default&TILEMATRIXSET=img2017&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&FORMAT=application%2Fpng'
? 'EPSG:4326'
: 'EPSG:3857',
}),
preload: 20, // 设置预加载的瓦片数，这里是预加载当前级别和2个级别更低的瓦片
}),
@ -1288,6 +1308,57 @@ function QueryData(e, name, url, item) {
'</p>' +
'</div>';
});
} else if (alterData.value[0].name == '三调') {
titleDiv.innerHTML = '三调';
content.innerHTML =
'<div class="content-children">' +
'<p>标识码: ' +
'<span>' +
alterData.value[0].information.BSM +
'</span>' +
'</p>' +
'<p>地类名称: ' +
'<span>' +
alterData.value[0].information.DLMC +
'</span>' +
'</p>' +
'<p>图斑面积: ' +
'<span>' +
(attr.information.TBMJ / 666).toFixed(2) +
'(亩)' +
'</span>' +
'</p>' +
'<p>坐落单位名称: ' +
'<span>' +
attr.information.ZLDWMC +
'</span>' +
'</p>' +
'<p>权属性质: ' +
'<span>' +
attr.information.QSXZ +
'</span>' +
'</p>' +
'<p>权属单位名称: ' +
'<span>' +
attr.information.QSDWMC +
'</span>' +
'</p>' +
'<p>耕地坡度级别: ' +
'<span>' +
attr.information.GDPDJB +
'</span>' +
'</p>' +
'<p>飞入地标识: ' +
'<span>' +
alterData.value[0].information.FRDBS +
'</span>' +
'</p>' +
'<p>种植类型: ' +
'<span>' +
attr.information.ZZSXMC +
'</span>' +
'</p>' +
'</div>';
}
}
var layerzhezhao = map
@ -1785,6 +1856,57 @@ function QueryData(e, name, url, item) {
'</p>' +
'</div>';
});
} else if (attr.name == '三调') {
titleDiv.innerHTML = '三调';
content.innerHTML =
'<div class="content-children">' +
'<p>标识码: ' +
'<span>' +
alterData.value[0].information.BSM +
'</span>' +
'</p>' +
'<p>地类名称: ' +
'<span>' +
alterData.value[0].information.DLMC +
'</span>' +
'</p>' +
'<p>图斑面积: ' +
'<span>' +
(attr.information.TBMJ / 666).toFixed(2) +
'(亩)' +
'</span>' +
'</p>' +
'<p>坐落单位名称: ' +
'<span>' +
attr.information.ZLDWMC +
'</span>' +
'</p>' +
'<p>权属性质: ' +
'<span>' +
attr.information.QSXZ +
'</span>' +
'</p>' +
'<p>权属单位名称: ' +
'<span>' +
attr.information.QSDWMC +
'</span>' +
'</p>' +
'<p>耕地坡度级别: ' +
'<span>' +
attr.information.GDPDJB +
'</span>' +
'</p>' +
'<p>飞入地标识: ' +
'<span>' +
alterData.value[0].information.FRDBS +
'</span>' +
'</p>' +
'<p>种植类型: ' +
'<span>' +
attr.information.ZZSXMC +
'</span>' +
'</p>' +
'</div>';
}
}
// document.getElementById('popup-content').innerHTML = content;
@ -2207,6 +2329,23 @@ const renderCustomNode = (h, { node, data }) => {
},
node.label
);
case '三调':
return h(
'span',
{
class: {
gbz: !data.children,
},
style: {
'border-radius': '2px',
background: 'rgba(0,255,0)',
border: '2px solid rgba(254, 255, 181, 1)',
padding: '5px 15px 5px 15px',
},
},
node.label
);
break;
default:
break;
}