up
This commit is contained in:
@ -357,7 +357,6 @@ import { useEcharts } from '@/hooks/useEcharts';
|
||||
import {
|
||||
getTownship,
|
||||
getvillage,
|
||||
getareas,
|
||||
getcropper,
|
||||
getcropTypeStatistics,
|
||||
gethighStandard,
|
||||
@ -880,14 +879,14 @@ let dd = {
|
||||
};
|
||||
let dic = {
|
||||
小麦: { color: 'rgba(25, 196, 22, 1)', disabled: false },
|
||||
玉米: { color: 'rgba(255, 240, 26, 1)', disabled: true },
|
||||
玉米: { color: 'rgba(255, 240, 26, 1)', disabled: false },
|
||||
大豆: { color: 'rgba(255, 184, 148, 1)', disabled: false },
|
||||
地瓜: { color: 'rgba(255, 18, 18, 1)', disabled: false },
|
||||
花生: { color: 'rgba(255, 140, 255, 1)', disabled: false },
|
||||
蓝莓: { color: ' rgba(0, 153, 255, 1)', disabled: false },
|
||||
茶叶: { color: 'rgba(0, 209, 195, 1)', disabled: false },
|
||||
马铃薯: { color: 'rgba(253, 127, 1, 1)', disabled: true },
|
||||
白菜和萝卜: { color: 'rgba(201, 255, 148, 1)', disabled: true },
|
||||
马铃薯: { color: 'rgba(253, 127, 1, 1)', disabled: false },
|
||||
白菜和萝卜: { color: 'rgba(201, 255, 148, 1)', disabled: false },
|
||||
其他: { color: 'rgba(166, 224, 255, 1)', disabled: false },
|
||||
};
|
||||
// 图层字典
|
||||
@ -1103,7 +1102,6 @@ onMounted(() => {
|
||||
// 初始化
|
||||
function initonMounted() {
|
||||
theTimes(); //年
|
||||
getaArea(); //面积
|
||||
//地图
|
||||
initmap();
|
||||
showDaChangArea();
|
||||
@ -1128,9 +1126,11 @@ function initonMounted() {
|
||||
}
|
||||
onUpdated(() => {
|
||||
if (localStorage.getItem(router.currentRoute.value.path) == 'false') {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '地图模式';
|
||||
window.document.querySelector('#screenfull').style.display = 'none';
|
||||
} else {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '列表模式';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
}
|
||||
@ -1228,14 +1228,14 @@ function showDaChangArea() {
|
||||
axios.get('/json/huangdao.json').then(({ data }) => {
|
||||
const fts = new ol.format.GeoJSON().readFeatures(data);
|
||||
const ft = fts[0];
|
||||
addConver(ft.getGeometry().getCoordinates());
|
||||
addConver(ft.getGeometry().getCoordinates(), 'huandao');
|
||||
});
|
||||
}
|
||||
//添加遮罩
|
||||
function addConver(data) {
|
||||
function addConver(data, name) {
|
||||
let source = new ol.source.Vector();
|
||||
var converLayer = new ol.layer.Vector({
|
||||
id: 'zhezhao',
|
||||
id: name ? name : 'zhezhao',
|
||||
source: source,
|
||||
style: new ol.style.Style({
|
||||
fill: new ol.style.Fill({
|
||||
@ -1326,9 +1326,8 @@ function QueryData(e, name, url, item) {
|
||||
if (item == '镇' && data.result.recordsets[0].features.features[0].properties.XJQYDM) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.XJQYDM;
|
||||
value.value = code;
|
||||
getTownships();
|
||||
let arr = [];
|
||||
getTownship('370211').then(res => {
|
||||
getTownship({ divisions: '370211', yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
if (item.tomeCode == code) {
|
||||
name = item.tomeName;
|
||||
@ -1344,7 +1343,7 @@ function QueryData(e, name, url, item) {
|
||||
) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.CJQYDM;
|
||||
let arr = [];
|
||||
getAdministrativeChun({ divisions: code }).then(res => {
|
||||
getAdministrativeChun({ divisions: code, yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
arr.push(item);
|
||||
});
|
||||
@ -1671,7 +1670,7 @@ const getTownships = (city, time) => {
|
||||
});
|
||||
};
|
||||
//村
|
||||
const getvillages = city => {
|
||||
const getvillages = (city, time) => {
|
||||
dd = {
|
||||
小麦: [],
|
||||
玉米: [],
|
||||
@ -1684,7 +1683,7 @@ const getvillages = city => {
|
||||
白菜和萝卜: [],
|
||||
其他: [],
|
||||
};
|
||||
getvillage({ divisions: city }).then(res => {
|
||||
getvillage({ divisions: city, yearMonth: time }).then(res => {
|
||||
Township.brr = res.data;
|
||||
let arr = [...res.data];
|
||||
let brr = [];
|
||||
@ -1713,33 +1712,6 @@ const getvillages = city => {
|
||||
ASdivision();
|
||||
});
|
||||
};
|
||||
//面积
|
||||
const getaArea = () => {
|
||||
let arr = [];
|
||||
let a = {};
|
||||
getareas().then(res => {
|
||||
if (res.features) {
|
||||
Township.crr = res.features;
|
||||
data.title.forEach((item, indexs) => {
|
||||
let town = res.features.map(i => {
|
||||
if (item === i.properties.town) {
|
||||
return i.properties;
|
||||
}
|
||||
});
|
||||
Object.keys(dd).forEach(it => {
|
||||
const index = town.findIndex(a => a && a.crop === it);
|
||||
if (index > -1) {
|
||||
dd[it].push(1);
|
||||
} else {
|
||||
dd[it].push(null);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
ASdivision();
|
||||
// selectTab();
|
||||
});
|
||||
};
|
||||
|
||||
//作物分类面积统计
|
||||
const getcroppers = (city, time) => {
|
||||
@ -1853,7 +1825,6 @@ const getlistModes = value => {
|
||||
function areachar() {
|
||||
if (areaDiv.value) {
|
||||
const areaDivIntance = echarts.init(areaDiv.value);
|
||||
console.log(classData);
|
||||
let option = {
|
||||
// backgroundColor: 'rgba(255, 255, 255, 0.1)',
|
||||
textStyle: {
|
||||
@ -2018,7 +1989,7 @@ function areachar() {
|
||||
],
|
||||
tooltip: {
|
||||
show: true,
|
||||
formatter: '面积:{c0}',
|
||||
// formatter: '面积:{c0}',
|
||||
},
|
||||
};
|
||||
// option && areaDivIntance.setOption(option);
|
||||
@ -2547,7 +2518,7 @@ function farmland() {
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
{
|
||||
name: '地瓜',
|
||||
type: 'bar',
|
||||
barWidth: 12,
|
||||
@ -2569,6 +2540,72 @@ function farmland() {
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: '玉米',
|
||||
type: 'bar',
|
||||
barWidth: 12,
|
||||
stack: 'stack',
|
||||
data: highStandarditem.玉米,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
barBorderRadius: 0,
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0.9, 0, [
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(255, 240, 26, 1)',
|
||||
},
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(255, 240, 26, 1)',
|
||||
},
|
||||
]),
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: '马铃薯',
|
||||
type: 'bar',
|
||||
barWidth: 12,
|
||||
stack: 'stack',
|
||||
data: highStandarditem.马铃薯,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
barBorderRadius: 0,
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0.9, 0, [
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(253, 127, 1, 1)',
|
||||
},
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(253, 127, 1, 1)',
|
||||
},
|
||||
]),
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: '白菜和萝卜',
|
||||
type: 'bar',
|
||||
barWidth: 12,
|
||||
stack: 'stack',
|
||||
data: highStandarditem.白菜和萝卜,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
barBorderRadius: 0,
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0.9, 0, [
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(201, 255, 148, 1)',
|
||||
},
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(201, 255, 148, 1)',
|
||||
},
|
||||
]),
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: '其他',
|
||||
type: 'bar',
|
||||
@ -2960,6 +2997,120 @@ function ASdivision() {
|
||||
},
|
||||
data: dd.蓝莓, // 系列中的数据内容数组
|
||||
},
|
||||
{
|
||||
type: 'bar', // 系列类型
|
||||
name: '玉米', // 系列名称, 用于tooltip的显示, legend 的图例筛选
|
||||
// 数据堆叠,同个类目轴上系列配置相同的stack值后,后一个系列的值会在前一个系列的值上相加
|
||||
stack: '总量',
|
||||
barMaxWidth: 30, // 柱条的最大宽度,不设时自适应
|
||||
// 图形上的文本标签
|
||||
label: {
|
||||
show: true,
|
||||
position: 'inside',
|
||||
formatter: '玉米',
|
||||
textStyle: {
|
||||
fontSize: 12,
|
||||
fontWeight: 'bolder',
|
||||
color: 'black',
|
||||
},
|
||||
},
|
||||
// 图形样式
|
||||
itemStyle: {
|
||||
barBorderRadius: [0, 0, 0, 0],
|
||||
barBorderRadius: [0, 0, 0, 0], //
|
||||
borderWidth: 1, // 设置边框宽度
|
||||
borderColor: 'rgba(255, 240, 26, 1)', // 设置边框颜色
|
||||
color: {
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: ' rgba(255, 240, 26, 1)', // 0% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: ' rgba(255, 240, 26, 1)', // 100% 处的颜色
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
data: dd.玉米, // 系列中的数据内容数组
|
||||
},
|
||||
{
|
||||
type: 'bar', // 系列类型
|
||||
name: '马铃薯', // 系列名称, 用于tooltip的显示, legend 的图例筛选
|
||||
// 数据堆叠,同个类目轴上系列配置相同的stack值后,后一个系列的值会在前一个系列的值上相加
|
||||
stack: '总量',
|
||||
barMaxWidth: 30, // 柱条的最大宽度,不设时自适应
|
||||
// 图形上的文本标签
|
||||
label: {
|
||||
show: true,
|
||||
position: 'inside',
|
||||
formatter: '马铃薯',
|
||||
textStyle: {
|
||||
fontSize: 12,
|
||||
fontWeight: 'bolder',
|
||||
color: 'black',
|
||||
},
|
||||
},
|
||||
// 图形样式
|
||||
itemStyle: {
|
||||
barBorderRadius: [0, 0, 0, 0],
|
||||
barBorderRadius: [0, 0, 0, 0], //
|
||||
borderWidth: 1, // 设置边框宽度
|
||||
borderColor: 'rgba(253, 127, 1, 1)', // 设置边框颜色
|
||||
color: {
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: ' rgba(253, 127, 1, 1)', // 0% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: ' rgba(253, 127, 1, 1)', // 100% 处的颜色
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
data: dd.马铃薯, // 系列中的数据内容数组
|
||||
},
|
||||
{
|
||||
type: 'bar', // 系列类型
|
||||
name: '白菜和萝卜', // 系列名称, 用于tooltip的显示, legend 的图例筛选
|
||||
// 数据堆叠,同个类目轴上系列配置相同的stack值后,后一个系列的值会在前一个系列的值上相加
|
||||
stack: '总量',
|
||||
barMaxWidth: 30, // 柱条的最大宽度,不设时自适应
|
||||
// 图形上的文本标签
|
||||
label: {
|
||||
show: true,
|
||||
position: 'inside',
|
||||
formatter: '白菜和萝卜',
|
||||
textStyle: {
|
||||
fontSize: 12,
|
||||
fontWeight: 'bolder',
|
||||
color: 'black',
|
||||
},
|
||||
},
|
||||
// 图形样式
|
||||
itemStyle: {
|
||||
barBorderRadius: [0, 0, 0, 0],
|
||||
barBorderRadius: [0, 0, 0, 0], //
|
||||
borderWidth: 1, // 设置边框宽度
|
||||
borderColor: 'rgba(201, 255, 148, 1)', // 设置边框颜色
|
||||
color: {
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: ' rgba(201, 255, 148, 1)', // 0% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: ' rgba(201, 255, 148, 1)', // 100% 处的颜色
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
data: dd.白菜和萝卜, // 系列中的数据内容数组
|
||||
},
|
||||
{
|
||||
type: 'bar', // 系列类型
|
||||
name: '其他', // 系列名称, 用于tooltip的显示, legend 的图例筛选
|
||||
@ -3855,7 +4006,7 @@ $height: calc(100vh - 100px);
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
p {
|
||||
width: 223px;
|
||||
width: 50%;
|
||||
height: 28px;
|
||||
line-height: 28px;
|
||||
font-size: 14px;
|
||||
|
@ -388,6 +388,7 @@ let amount = ref([
|
||||
wheatOutput: 0,
|
||||
},
|
||||
]);
|
||||
let yearTime = ref('');
|
||||
//搜索
|
||||
let formInline = ref({
|
||||
time: '',
|
||||
@ -397,7 +398,6 @@ let formInline = ref({
|
||||
});
|
||||
let layers = ref(null); //村
|
||||
|
||||
|
||||
// 组件挂载完成后执行
|
||||
onMounted(() => {
|
||||
initonMounted();
|
||||
@ -412,8 +412,10 @@ function initonMounted() {
|
||||
}
|
||||
onUpdated(() => {
|
||||
if (localStorage.getItem(router.currentRoute.value.path) == 'false') {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '地图模式';
|
||||
} else {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '列表模式';
|
||||
}
|
||||
});
|
||||
@ -421,9 +423,9 @@ watch(
|
||||
() => oldDatas.value,
|
||||
(val, oldVal) => {
|
||||
value.value = '370211';
|
||||
getwheatTotalYearValues(value.value,oldDatas.value.name); //作物产量预估
|
||||
getwheatHeightStandardFarmlands(value.value,oldDatas.value.name); //高标准农田
|
||||
getwheatGetAllTownss(value.value,oldDatas.value.name); //镇级
|
||||
getwheatTotalYearValues(value.value, oldDatas.value.name); //作物产量预估
|
||||
getwheatHeightStandardFarmlands(value.value, oldDatas.value.name); //高标准农田
|
||||
getwheatGetAllTownss(value.value, oldDatas.value.name); //镇级
|
||||
}
|
||||
);
|
||||
/*-------------地图------------------------*/
|
||||
@ -597,11 +599,19 @@ const SwitchMode = () => {
|
||||
chartModes();
|
||||
};
|
||||
|
||||
const resetForm = () => {
|
||||
(formInline.value.year = yearTime.value), (formInline.value.statistical = '镇');
|
||||
formInline.value.droughtRating = '小麦';
|
||||
formInline.value.area = num.value;
|
||||
onSubmit()
|
||||
};
|
||||
|
||||
/*------------------接口--------------------*/
|
||||
|
||||
//列表模式年
|
||||
const getparameterEstimationYears = () => {
|
||||
getparameterEstimationYear().then(res => {
|
||||
yearTime.value = { name: res.data[0] };
|
||||
oldDatas.value = { name: res.data[0] };
|
||||
res.data.forEach(item => {
|
||||
dataSource.value.push({ name: item });
|
||||
@ -613,22 +623,22 @@ const getparameterEstimationYears = () => {
|
||||
};
|
||||
|
||||
//产量预估
|
||||
const getwheatTotalYearValues = (city,time) => {
|
||||
getwheatTotalYearValue({ divisions: city , yearMonth:time}).then(res => {
|
||||
const getwheatTotalYearValues = (city, time) => {
|
||||
getwheatTotalYearValue({ divisions: city, yearMonth: time }).then(res => {
|
||||
estimate.value = res.data;
|
||||
areachar();
|
||||
});
|
||||
};
|
||||
//高标准农田
|
||||
const getwheatHeightStandardFarmlands = (city ,time)=> {
|
||||
getwheatHeightStandardFarmland({ divisions: city , yearMonth:time}).then(res => {
|
||||
const getwheatHeightStandardFarmlands = (city, time) => {
|
||||
getwheatHeightStandardFarmland({ divisions: city, yearMonth: time }).then(res => {
|
||||
standardArr.value = res.data;
|
||||
farmland();
|
||||
});
|
||||
};
|
||||
//镇
|
||||
const getwheatGetAllTownss = (city ,time) => {
|
||||
getwheatGetAllTowns({ divisions: city , yearMonth:time}).then(res => {
|
||||
const getwheatGetAllTownss = (city, time) => {
|
||||
getwheatGetAllTowns({ divisions: city, yearMonth: time }).then(res => {
|
||||
administration.value = res.data;
|
||||
Township.brr = JSON.parse(JSON.stringify(res.data));
|
||||
Township.arr = Township.brr.sort((a, b) => {
|
||||
@ -709,7 +719,6 @@ const Deta3 = item => {
|
||||
};
|
||||
const dowcity = () => {
|
||||
let arr = JSON.parse(JSON.stringify(amount.value[0]));
|
||||
console.log(arr);
|
||||
insectarr.value.push(arr);
|
||||
exportExcel(insectarr.value, '干旱面积统计表', 'Sheet1');
|
||||
};
|
||||
|
@ -318,7 +318,7 @@
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="onSubmit">查询</el-button>
|
||||
<el-button plain @click="resetForm" :disabled="!SwitchFlag ? true : false">
|
||||
<el-button plain @click="resetForm" >
|
||||
重置
|
||||
</el-button>
|
||||
<el-button v-if="!operate" type="primary" text @click="dowcity">
|
||||
@ -623,9 +623,11 @@ function initonMounted() {
|
||||
|
||||
onUpdated(() => {
|
||||
if (localStorage.getItem(router.currentRoute.value.path) == 'false') {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '地图模式';
|
||||
window.document.querySelector('#screenfull').style.display = 'none';
|
||||
} else {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '列表模式';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
}
|
||||
@ -739,7 +741,7 @@ function showDaChangArea() {
|
||||
axios.get('/json/huangdao.json').then(({ data }) => {
|
||||
const fts = new ol.format.GeoJSON().readFeatures(data);
|
||||
const ft = fts[0];
|
||||
addConver(ft.getGeometry().getCoordinates());
|
||||
addConver(ft.getGeometry().getCoordinates(),'huandao');
|
||||
});
|
||||
}
|
||||
|
||||
@ -766,7 +768,7 @@ function QueryData(e, name, url, item) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.XJQYDM;
|
||||
value.value = code;
|
||||
let arr = [];
|
||||
getgradeStatistics({ divisions: '370211', yearMonth: '2023-05' }).then(res => {
|
||||
getgradeStatistics({ divisions: '370211', yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
if (item.subregion == code) {
|
||||
name = item.subregionName;
|
||||
@ -779,7 +781,7 @@ function QueryData(e, name, url, item) {
|
||||
} else if (item == '村') {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.CJQYDM;
|
||||
let arr = [];
|
||||
getAdministrativeDivisionsChun({ divisions: code }).then(res => {
|
||||
getAdministrativeDivisionsChun({ divisions: code ,yearMonth: oldDatas.value.name }).then(res => {
|
||||
console.log(res.data);
|
||||
res.data.forEach(item => {
|
||||
console.log(item);
|
||||
@ -844,10 +846,10 @@ function QueryData(e, name, url, item) {
|
||||
});
|
||||
}
|
||||
//添加遮罩
|
||||
function addConver(data) {
|
||||
function addConver(data,name) {
|
||||
let source = new ol.source.Vector();
|
||||
var converLayer = new ol.layer.Vector({
|
||||
id: 'zhezhao',
|
||||
id: name ? name : 'zhezhao',
|
||||
source: source,
|
||||
style: new ol.style.Style({
|
||||
fill: new ol.style.Fill({
|
||||
@ -2690,7 +2692,7 @@ $height: calc(100vh - 100px);
|
||||
margin-right: 10px;
|
||||
}
|
||||
:deep(.el-input__wrapper) {
|
||||
width: 100px;
|
||||
width: 125px;
|
||||
}
|
||||
.modeDiv {
|
||||
width: 234px;
|
||||
|
@ -1066,18 +1066,176 @@
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column prop="dataTime" label="日期" />
|
||||
<el-table-column prop="soilTemperature1" label="0cm温度(℃)" />
|
||||
<el-table-column prop="soilTemperature2" label="-10cm温度" />
|
||||
<el-table-column prop="soilTemperature3" label="-20cm温度" />
|
||||
<el-table-column prop="soilTemperature4" label="-30cm温度" />
|
||||
<el-table-column prop="soilTemperature5" label="-40温度" />
|
||||
<el-table-column prop="soilHumidity1" width="80" label="0cm湿度(%rh)" />
|
||||
<el-table-column prop="soilHumidity2" label="-10cm湿度" />
|
||||
<el-table-column prop="soilHumidity3" label="-20cm湿度" />
|
||||
<el-table-column prop="soilHumidity4" label="-30cm湿度" />
|
||||
<el-table-column prop="soilHumidity5" label="-40cm湿度" />
|
||||
<el-table-column prop="soilPh" width="70" label="PH值(ph)" />
|
||||
<el-table-column prop="soilEc" width="70" label="EC值(S/cm)" />
|
||||
<el-table-column prop="soilTemperature1" label="0cm温度(℃)">
|
||||
<template #default="scope">
|
||||
<span
|
||||
v-if="
|
||||
scope.row.soilTemperature1 >= '-10' &&
|
||||
scope.row.soilTemperature1 <= '40'
|
||||
"
|
||||
>
|
||||
{{ scope.row.soilTemperature1 }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilTemperature1 }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilTemperature2" label="-10cm温度">
|
||||
<template #default="scope">
|
||||
<span
|
||||
v-if="
|
||||
scope.row.soilTemperature2 >= '-5' &&
|
||||
scope.row.soilTemperature2 <= '40'
|
||||
"
|
||||
>
|
||||
{{ scope.row.soilTemperature2 }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilTemperature2 }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilTemperature3" label="-20cm温度">
|
||||
<template #default="scope">
|
||||
<span
|
||||
v-if="
|
||||
scope.row.soilTemperature3 >= '0' &&
|
||||
scope.row.soilTemperature3 <= '30'
|
||||
"
|
||||
>
|
||||
{{ scope.row.soilTemperature3 }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilTemperature3 }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilTemperature4" label="-30cm温度">
|
||||
<template #default="scope">
|
||||
<span
|
||||
v-if="
|
||||
scope.row.soilTemperature4 >= '0' &&
|
||||
scope.row.soilTemperature4 <= '30'
|
||||
"
|
||||
>
|
||||
{{ scope.row.soilTemperature4 }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilTemperature4 }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilTemperature5" label="-40温度">
|
||||
<template #default="scope">
|
||||
<span
|
||||
v-if="
|
||||
scope.row.soilTemperature5 >= '0' &&
|
||||
scope.row.soilTemperature5 <= '30'
|
||||
"
|
||||
>
|
||||
{{ scope.row.soilTemperature5 }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilTemperature5 }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilHumidity1" width="80" label="0cm湿度(%rh)">
|
||||
<template #default="scope">
|
||||
<span
|
||||
v-if="
|
||||
scope.row.soilHumidity1 >= '5' &&
|
||||
scope.row.soilHumidity1 <= '60'
|
||||
"
|
||||
>
|
||||
{{ scope.row.soilHumidity1 }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilHumidity1 }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilHumidity2" label="-10cm湿度">
|
||||
<template #default="scope">
|
||||
<span
|
||||
v-if="
|
||||
scope.row.soilHumidity2 >= '0' &&
|
||||
scope.row.soilHumidity2 <= '30'
|
||||
"
|
||||
>
|
||||
{{ scope.row.soilHumidity2 }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilHumidity2 }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilHumidity3" label="-20cm湿度">
|
||||
<template #default="scope">
|
||||
<span
|
||||
v-if="
|
||||
scope.row.soilHumidity3 >= '0' &&
|
||||
scope.row.soilHumidity3 <= '30'
|
||||
"
|
||||
>
|
||||
{{ scope.row.soilHumidity3 }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilHumidity3 }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilHumidity4" label="-30cm湿度">
|
||||
<template #default="scope">
|
||||
<span
|
||||
v-if="
|
||||
scope.row.soilHumidity4 >= '0' &&
|
||||
scope.row.soilHumidity4 <= '40'
|
||||
"
|
||||
>
|
||||
{{ scope.row.soilHumidity4 }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilHumidity4 }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilHumidity5" label="-40cm湿度">
|
||||
<template #default="scope">
|
||||
<span
|
||||
v-if="
|
||||
scope.row.soilHumidity5 >= '0' &&
|
||||
scope.row.soilHumidity5 <= '40'
|
||||
"
|
||||
>
|
||||
{{ scope.row.soilHumidity5 }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilHumidity5 }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilPh" width="70" label="PH值(ph)">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.soilPh >= '5.5' && scope.row.soilPh <= '7.5'">
|
||||
{{ scope.row.soilPh }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilPh }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="soilEc" width="70" label="EC值(S/cm)">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.soilEc >= '0' && scope.row.soilEc <= '0.2'">
|
||||
{{ scope.row.soilEc }}
|
||||
</span>
|
||||
<span v-else style="color: rgba(255, 62, 57, 1)">
|
||||
{{ scope.row.soilEc }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column class="red" prop="warning" width="52" label="预警情况">
|
||||
<template #default="scope">
|
||||
@ -1254,7 +1412,7 @@
|
||||
v-for="(item, index) in tableItem"
|
||||
:key="index"
|
||||
:label="item.lable"
|
||||
width="120"
|
||||
width="180"
|
||||
>
|
||||
<template #default="scope">
|
||||
<div v-if="label3 == '虫情监测仪'">
|
||||
@ -1926,7 +2084,6 @@ import TimeLine from '@/components/TimeLine/TimeLine.vue';
|
||||
import { downLoadFile } from '@/utils/download.js';
|
||||
import { useEcharts } from '@/hooks/useEcharts';
|
||||
// import MapInit from '.././components/tiandituapi/tianditu_api.js'
|
||||
import { getarea, getTownship, getvillage, getareas, dow } from '@/api/crops/classify.js';
|
||||
import {
|
||||
getSpore,
|
||||
getfindAllSoil,
|
||||
@ -1947,6 +2104,7 @@ import { useRouter } from 'vue-router';
|
||||
import 'leaflet/dist/leaflet.css';
|
||||
import L from 'leaflet';
|
||||
import iconShadow from '/img/marker/mark.png';
|
||||
import elementResizeDetectorMaker from 'element-resize-detector';
|
||||
|
||||
let map = L.Map;
|
||||
const router = useRouter();
|
||||
@ -2120,7 +2278,6 @@ function initonMounted() {
|
||||
getsporeEquipmentConditions(); //孢子设备信息
|
||||
getfindAllSoils(); //土壤
|
||||
getinsects(); //虫情
|
||||
getaArea(); //面积
|
||||
initLeafletMap();
|
||||
// getTownships();
|
||||
getdeviceNumbers('0'); //所有设备列表
|
||||
@ -2132,10 +2289,12 @@ function initonMounted() {
|
||||
}
|
||||
onUpdated(() => {
|
||||
if (localStorage.getItem(router.currentRoute.value.path) == 'true') {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '列表模式';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
} else {
|
||||
document.querySelector('.mode').innerText = '地图模式';
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
window.document.querySelector('#screenfull').style.display = 'none';
|
||||
}
|
||||
});
|
||||
@ -2294,10 +2453,10 @@ const alter = () => {
|
||||
titleDiv.innerHTML = '<p>设备名称: ' + attr.name + '</p>';
|
||||
content.innerHTML =
|
||||
'<div class="content-children">' +
|
||||
`<p> <img src="@/assets/images/icon.png"/> 经度:` +
|
||||
`<p><img src="/img/icon.png" >经度:` +
|
||||
attr.geometry.flatCoordinates[0] +
|
||||
'</p>' +
|
||||
'<p>纬度:' +
|
||||
'<p><img src="/img/icon.png" >纬度:' +
|
||||
attr.geometry.flatCoordinates[1] +
|
||||
'</p>' +
|
||||
'</div>';
|
||||
@ -3202,7 +3361,7 @@ const resettingss = () => {
|
||||
getfindAllSoil().then(res => {
|
||||
bugarr.value = res.data;
|
||||
// bugarrs.value=res.data
|
||||
bugarrs.value = res.data.slice(
|
||||
soilArr.value = res.data.slice(
|
||||
(currentPage.value - 1) * pageSize.value,
|
||||
(currentPage.value - 1) * pageSize.value + pageSize.value
|
||||
);
|
||||
@ -3653,27 +3812,7 @@ const getTownships = () => {
|
||||
data.title = [...Object.values(brr)];
|
||||
});
|
||||
};
|
||||
//面积
|
||||
const getaArea = () => {
|
||||
getareas().then(res => {
|
||||
Township.crr = res.features;
|
||||
data.title.forEach((item, index) => {
|
||||
let town = res.features.map(i => {
|
||||
if (item === i.properties.town) {
|
||||
return i.properties;
|
||||
}
|
||||
});
|
||||
Object.keys(dd).forEach(it => {
|
||||
const index = town.findIndex(a => a && a.crop === it);
|
||||
if (index > -1) {
|
||||
dd[it].push(town[index].Shape_Area);
|
||||
} else {
|
||||
dd[it].push(null);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
/*-------------echarts--------------*/
|
||||
var baozi =
|
||||
@ -4553,6 +4692,13 @@ function chartModes() {
|
||||
],
|
||||
};
|
||||
useEcharts(ASdivisionDivIntance, option);
|
||||
|
||||
let erd = elementResizeDetectorMaker();
|
||||
erd.listenTo(chartModeDiv.value, () => {
|
||||
nextTick(() => {
|
||||
ASdivisionDivIntance.resize();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 添加wms
|
||||
@ -5807,6 +5953,7 @@ $height: calc(100vh - 110px);
|
||||
padding-left: 24px;
|
||||
background: url('@/assets/images/duande.png') no-repeat !important;
|
||||
background-size: 100% !important;
|
||||
display: flex;
|
||||
}
|
||||
#P-id {
|
||||
width: 100%;
|
||||
|
@ -174,7 +174,7 @@ import {
|
||||
getsendSms,
|
||||
getmeteorologyEquipment, meteorologicalsPeople, meteorology, zdmc,
|
||||
} from '@/api/meteorological/monitor/information.js';
|
||||
|
||||
import { ElMessage } from 'element-plus'
|
||||
import 'echarts-gl';
|
||||
|
||||
|
||||
@ -345,7 +345,7 @@ let map = ref(null);
|
||||
const cun = () => {
|
||||
layers = new ol.layer.Tile({
|
||||
source: new ol.source.TileSuperMapRest({
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/huangdaoqu_village@huangdaoqu_bianjie',
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/CJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
//rasterfunction: new SuperMap.NDVIParameter({ redIndex: 0, nirIndex: 2 }),
|
||||
cacheEnabled: false,
|
||||
}),
|
||||
@ -360,7 +360,7 @@ const cun = () => {
|
||||
const zhen = () => {
|
||||
var layer = new ol.layer.Tile({
|
||||
source: new ol.source.TileSuperMapRest({
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/huangdaoqu_town@huangdaoqu_bianjie',
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/XJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
//rasterfunction: new SuperMap.NDVIParameter({ redIndex: 0, nirIndex: 2 }),
|
||||
cacheEnabled: false,
|
||||
}),
|
||||
@ -381,6 +381,10 @@ onMounted(() => {
|
||||
let rightWra = document.querySelector('.rightWra');
|
||||
rightWra.style.transform = 'translate(107%,0)';
|
||||
});
|
||||
onUpdated(() => {
|
||||
document.querySelector('.mode').style.display = 'none';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
});
|
||||
let alterData = ref([]);
|
||||
let newArr = ref([]);
|
||||
const zdmcList = ref([])
|
||||
@ -841,9 +845,14 @@ const selectTime = () => {
|
||||
};
|
||||
const subText = () => {
|
||||
//发送短信
|
||||
getsendSms({meteorologicalStations: multipleSelection.value}).then(res => {
|
||||
console.log(res.data);
|
||||
});
|
||||
getsendSms(multipleSelection.value).then(res => {
|
||||
if (res.data.code == 'OK') {
|
||||
ElMessage({
|
||||
message: '发送成功',
|
||||
type: 'success',
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleSelectionChange = val => {
|
||||
multipleSelection.value = val;
|
||||
|
@ -174,7 +174,7 @@ import {
|
||||
getsendSms,
|
||||
getmeteorologyEquipment, meteorologicalsPeople, meteorology, zdmc,
|
||||
} from '@/api/meteorological/monitor/information.js';
|
||||
|
||||
import { ElMessage } from 'element-plus'
|
||||
import 'echarts-gl';
|
||||
|
||||
|
||||
@ -349,7 +349,7 @@ let map = ref(null);
|
||||
const cun = () => {
|
||||
layers = new ol.layer.Tile({
|
||||
source: new ol.source.TileSuperMapRest({
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/huangdaoqu_village@huangdaoqu_bianjie',
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/CJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
//rasterfunction: new SuperMap.NDVIParameter({ redIndex: 0, nirIndex: 2 }),
|
||||
cacheEnabled: false,
|
||||
}),
|
||||
@ -364,7 +364,7 @@ const cun = () => {
|
||||
const zhen = () => {
|
||||
var layer = new ol.layer.Tile({
|
||||
source: new ol.source.TileSuperMapRest({
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/huangdaoqu_town@huangdaoqu_bianjie',
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/XJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
//rasterfunction: new SuperMap.NDVIParameter({ redIndex: 0, nirIndex: 2 }),
|
||||
cacheEnabled: false,
|
||||
}),
|
||||
@ -385,6 +385,10 @@ onMounted(() => {
|
||||
let rightWra = document.querySelector('.rightWra');
|
||||
rightWra.style.transform = 'translate(107%,0)';
|
||||
});
|
||||
onUpdated(() => {
|
||||
document.querySelector('.mode').style.display = 'none';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
});
|
||||
let alterData = ref([]);
|
||||
let newArr = ref([]);
|
||||
const zdmcList = ref([])
|
||||
@ -845,9 +849,14 @@ const selectTime = () => {
|
||||
};
|
||||
const subText = () => {
|
||||
//发送短信
|
||||
getsendSms({meteorologicalStations: multipleSelection.value}).then(res => {
|
||||
console.log(res.data);
|
||||
});
|
||||
getsendSms(multipleSelection.value).then(res => {
|
||||
if (res.data.code == 'OK') {
|
||||
ElMessage({
|
||||
message: '发送成功',
|
||||
type: 'success',
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleSelectionChange = val => {
|
||||
multipleSelection.value = val;
|
||||
|
File diff suppressed because one or more lines are too long
@ -174,7 +174,7 @@ import {
|
||||
getsendSms,
|
||||
getmeteorologyEquipment, meteorologicalsPeople, meteorology, zdmc,
|
||||
} from '@/api/meteorological/monitor/information.js';
|
||||
|
||||
import { ElMessage } from 'element-plus'
|
||||
import 'echarts-gl';
|
||||
|
||||
|
||||
@ -345,7 +345,7 @@ let map = ref(null);
|
||||
const cun = () => {
|
||||
layers = new ol.layer.Tile({
|
||||
source: new ol.source.TileSuperMapRest({
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/huangdaoqu_village@huangdaoqu_bianjie',
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/CJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
//rasterfunction: new SuperMap.NDVIParameter({ redIndex: 0, nirIndex: 2 }),
|
||||
cacheEnabled: false,
|
||||
}),
|
||||
@ -360,7 +360,7 @@ const cun = () => {
|
||||
const zhen = () => {
|
||||
var layer = new ol.layer.Tile({
|
||||
source: new ol.source.TileSuperMapRest({
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/huangdaoqu_town@huangdaoqu_bianjie',
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/XJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
//rasterfunction: new SuperMap.NDVIParameter({ redIndex: 0, nirIndex: 2 }),
|
||||
cacheEnabled: false,
|
||||
}),
|
||||
@ -381,6 +381,10 @@ onMounted(() => {
|
||||
let rightWra = document.querySelector('.rightWra');
|
||||
rightWra.style.transform = 'translate(107%,0)';
|
||||
});
|
||||
onUpdated(() => {
|
||||
document.querySelector('.mode').style.display = 'none';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
});
|
||||
let alterData = ref([]);
|
||||
let newArr = ref([]);
|
||||
const zdmcList = ref([])
|
||||
@ -841,9 +845,15 @@ const selectTime = () => {
|
||||
};
|
||||
const subText = () => {
|
||||
//发送短信
|
||||
getsendSms({meteorologicalStations: multipleSelection.value}).then(res => {
|
||||
console.log(res.data);
|
||||
});
|
||||
getsendSms(multipleSelection.value).then(res => {
|
||||
console.log(res.data);
|
||||
if (res.data.code == 'OK') {
|
||||
ElMessage({
|
||||
message: '发送成功',
|
||||
type: 'success',
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleSelectionChange = val => {
|
||||
multipleSelection.value = val;
|
||||
|
@ -172,6 +172,7 @@ import L from 'leaflet';
|
||||
import iconShadow from '/img/marker/mark.png';
|
||||
import moment from 'Moment';
|
||||
import { downLoadFile } from '@/utils/download.js';
|
||||
import elementResizeDetectorMaker from "element-resize-detector";
|
||||
|
||||
let map = L.Map;
|
||||
let tabulation = ref([]);
|
||||
@ -219,6 +220,10 @@ onMounted(() => {
|
||||
getmeteorologys();
|
||||
getMeteorologyTbs();
|
||||
});
|
||||
onUpdated(() => {
|
||||
document.querySelector('.mode').style.display = 'none';
|
||||
window.document.querySelector('#screenfull').style.display = 'none';
|
||||
});
|
||||
|
||||
const initLeafletMap = () => {
|
||||
//加载地图
|
||||
@ -430,7 +435,6 @@ const dowcity = () => {
|
||||
|
||||
function farmland() {
|
||||
const farmlandDivIntance = echarts.init(chartDiv.value);
|
||||
console.log(chartData);
|
||||
let leftY = '温度(℃)';
|
||||
let rightY = '湿度(%)';
|
||||
let arr1 = chartData.value.airTemperature;
|
||||
@ -756,8 +760,14 @@ function farmland() {
|
||||
],
|
||||
};
|
||||
|
||||
option && farmlandDivIntance.setOption(option, { notMerge: true, grid: { bottom: 20 } });
|
||||
// option && farmlandDivIntance.setOption(option, { notMerge: true, grid: { bottom: 20 } });
|
||||
useEcharts(farmlandDivIntance, option);
|
||||
let erd = elementResizeDetectorMaker();
|
||||
erd.listenTo(chartDiv.value, () => {
|
||||
nextTick(() => {
|
||||
farmlandDivIntance.resize();
|
||||
})
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -825,7 +835,12 @@ $height: calc(100vh - 100px);
|
||||
.chartModeFather {
|
||||
width: 100%;
|
||||
height: 89%;
|
||||
.chartDiv{
|
||||
width: 100% !important;
|
||||
height: 89% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.demo-tabs {
|
||||
// width: 100%;
|
||||
// height: 98%;
|
||||
|
@ -429,6 +429,7 @@ function initonMounted() {
|
||||
theTimes(); //年
|
||||
//地图
|
||||
initmap();
|
||||
showDaChangArea()
|
||||
alter();
|
||||
areachar();
|
||||
typesof();
|
||||
@ -445,8 +446,10 @@ function initonMounted() {
|
||||
}
|
||||
onUpdated(() => {
|
||||
if (localStorage.getItem(router.currentRoute.value.path) == 'false') {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '地图模式';
|
||||
} else {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '列表模式';
|
||||
}
|
||||
});
|
||||
@ -662,11 +665,20 @@ const alter = () => {
|
||||
});
|
||||
map.addOverlay(overlay);
|
||||
};
|
||||
|
||||
//创建蒙层,凸显黄岛区域
|
||||
function showDaChangArea() {
|
||||
axios.get('/json/huangdao.json').then(({ data }) => {
|
||||
const fts = new ol.format.GeoJSON().readFeatures(data);
|
||||
const ft = fts[0];
|
||||
addConver(ft.getGeometry().getCoordinates(),'huandao');
|
||||
});
|
||||
}
|
||||
//添加遮罩
|
||||
function addConver(data) {
|
||||
function addConver(data,name) {
|
||||
let source = new ol.source.Vector();
|
||||
var converLayer = new ol.layer.Vector({
|
||||
id: 'zhezhao',
|
||||
id: name ? name : 'zhezhao',
|
||||
source: source,
|
||||
style: new ol.style.Style({
|
||||
fill: new ol.style.Fill({
|
||||
@ -842,7 +854,7 @@ const handleChange = value => {
|
||||
formInline.value.area = value;
|
||||
};
|
||||
const onSubmit = () => {
|
||||
if (formInline.value.statistical !== '行政区划') {
|
||||
if (formInline.value.statistical == '行政区划') {
|
||||
formInline.value.droughtRating = null;
|
||||
}
|
||||
let arr = [];
|
||||
@ -850,7 +862,7 @@ const onSubmit = () => {
|
||||
getllistDroughtsDamage({
|
||||
yearMonth: formInline.value.time,
|
||||
statistical: formInline.value.statistical,
|
||||
droughtRating: formInline.value.droughtRating,
|
||||
droughtRating: formInline.value.droughtRating == null ? '1' : formInline.value.droughtRating,
|
||||
area: formInline.value.area,
|
||||
}).then(res => {
|
||||
console.log(res.data);
|
||||
|
@ -489,7 +489,7 @@ let tableData = ref([]);
|
||||
// 图层字典
|
||||
let layersDic = {
|
||||
湿润: {
|
||||
setOf: '2022-12-20-ganhan',
|
||||
setOf: `2022-12-20-ganhan`,
|
||||
name: 'T2022_12_20_shirun',
|
||||
},
|
||||
适宜: {
|
||||
@ -518,6 +518,7 @@ function initonMounted() {
|
||||
theTimes(); //年
|
||||
//地图
|
||||
initmap();
|
||||
showDaChangArea();
|
||||
typesof();
|
||||
farmland();
|
||||
// ProgressBar();
|
||||
@ -530,7 +531,6 @@ function initonMounted() {
|
||||
}
|
||||
}
|
||||
checkList.value = checkListdata.value;
|
||||
|
||||
let leftWra = document.querySelector('.leftWra');
|
||||
leftWra ? (leftWra.style.transform = 'translate(-107%,0)') : '';
|
||||
let rightWra = document.querySelector('.rightWra');
|
||||
@ -539,9 +539,11 @@ function initonMounted() {
|
||||
}
|
||||
onUpdated(() => {
|
||||
if (localStorage.getItem(router.currentRoute.value.path) == 'false') {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '地图模式';
|
||||
window.document.querySelector('#screenfull').style.display = 'none';
|
||||
} else {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '列表模式';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
}
|
||||
@ -661,7 +663,7 @@ function QueryData(e, name, url, item) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.XJQYDM;
|
||||
value.value = code;
|
||||
let arr = [];
|
||||
getTownship().then(res => {
|
||||
getTownship({ divisions: '370211', yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
if (item.streetCode == code) {
|
||||
name = item.streetName;
|
||||
@ -677,16 +679,18 @@ function QueryData(e, name, url, item) {
|
||||
) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.CJQYDM;
|
||||
let arr = [];
|
||||
getAdministrativeAreaChun({ divisions: code }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
console.log(item);
|
||||
name = item.streetName;
|
||||
arr.push(item);
|
||||
});
|
||||
name = res.data[0].streetName;
|
||||
alterArr.value = arr;
|
||||
alter();
|
||||
});
|
||||
getAdministrativeAreaChun({ divisions: code, yearMonth: oldDatas.value.name }).then(
|
||||
res => {
|
||||
res.data.forEach(item => {
|
||||
console.log(item);
|
||||
name = item.streetName;
|
||||
arr.push(item);
|
||||
});
|
||||
name = res.data[0].streetName;
|
||||
alterArr.value = arr;
|
||||
alter();
|
||||
}
|
||||
);
|
||||
}
|
||||
function alter() {
|
||||
if (data.result.currentCount > 0) {
|
||||
@ -742,11 +746,20 @@ function QueryData(e, name, url, item) {
|
||||
overlay.setPosition(undefined);
|
||||
});
|
||||
}
|
||||
|
||||
//创建蒙层,凸显黄岛区域
|
||||
function showDaChangArea() {
|
||||
axios.get('/json/huangdao.json').then(({ data }) => {
|
||||
const fts = new ol.format.GeoJSON().readFeatures(data);
|
||||
const ft = fts[0];
|
||||
addConver(ft.getGeometry().getCoordinates(), 'huandao');
|
||||
});
|
||||
}
|
||||
//添加遮罩
|
||||
function addConver(data) {
|
||||
function addConver(data, name) {
|
||||
let source = new ol.source.Vector();
|
||||
var converLayer = new ol.layer.Vector({
|
||||
id: 'zhezhao',
|
||||
id: name ? name : 'zhezhao',
|
||||
source: source,
|
||||
style: new ol.style.Style({
|
||||
fill: new ol.style.Fill({
|
||||
@ -838,7 +851,32 @@ const changeTableHead = (tableData, fieldName) => {
|
||||
const list = tableData.map(item => {
|
||||
const obj = {};
|
||||
for (const k in item) {
|
||||
if (fieldName[k]) {
|
||||
if (fieldName[k] == '区域名称') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
for (const k in item) {
|
||||
if (fieldName[k] == '湿润 (亩)') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
for (const k in item) {
|
||||
if (fieldName[k] == '适宜(亩)') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
for (const k in item) {
|
||||
if (fieldName[k] == '轻度干旱(亩)') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
for (const k in item) {
|
||||
if (fieldName[k] == '中度干旱(亩)') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
for (const k in item) {
|
||||
if (fieldName[k] == '重度干旱(亩)') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
@ -874,10 +912,12 @@ const exportExcel = (
|
||||
};
|
||||
const list = changeTableHead(tableData, fieldNameObj);
|
||||
// 创建工作表
|
||||
console.log(list);
|
||||
const data = xlsx.utils.json_to_sheet(list);
|
||||
// 创建工作簿
|
||||
const wb = xlsx.utils.book_new();
|
||||
// 将工作表放入工作簿中
|
||||
console.log(data);
|
||||
xlsx.utils.book_append_sheet(wb, data, pageName);
|
||||
// 生成文件并下载
|
||||
xlsx.writeFile(wb, `${fileName}.xlsx`);
|
||||
@ -919,6 +959,35 @@ watch(
|
||||
getproportionOfAreas(value.value, oldDatas.value.name); //干旱等级面积占比
|
||||
geteachFreezingGradeAreas(oldDatas.value.name); //高标准农田干旱等级面积占比
|
||||
getTownships(value.value, oldDatas.value.name); //镇
|
||||
// let str = oldDatas.value.name;
|
||||
// let str1 = str.replace(/-/g, '_');
|
||||
// console.log(str1,)
|
||||
// layersDic = {
|
||||
// 湿润: {
|
||||
// setOf: `${oldDatas.value.name}-ganhan`,
|
||||
// name: 'T2023_01_03_shirun',
|
||||
// },
|
||||
// 适宜: {
|
||||
// setOf: `${oldDatas.value.name}-ganhan`,
|
||||
// name: 'T2023_01_03_shiyi',
|
||||
// },
|
||||
// 轻度干旱: {
|
||||
// setOf: '2022-12-20-ganhan',
|
||||
// name: 'T2022_12_20_qingduganhan',
|
||||
// },
|
||||
// 中度干旱: {
|
||||
// setOf: '2022-12-20-ganhan',
|
||||
// name: 'T2022_12_20_medium_ganhan',
|
||||
// },
|
||||
// 重度干旱: {
|
||||
// setOf: '2022-12-20-ganhan',
|
||||
// name: 'T2022_12_20_serious_ganhan',
|
||||
// },
|
||||
// };
|
||||
// for (const key in checkList.value) {
|
||||
// console.log();
|
||||
// addwms(layersDic[checkList.value[key]]);
|
||||
// }
|
||||
}
|
||||
);
|
||||
let nums = 0;
|
||||
@ -1350,6 +1419,7 @@ const Deta4 = item => {
|
||||
brr = brr.sort((a, b) => {
|
||||
return a.region.length - b.region.length;
|
||||
});
|
||||
console.log(brr);
|
||||
exportExcel(brr, `${region}干旱等级面积-行政区划`, 'Sheet1');
|
||||
});
|
||||
} else {
|
||||
@ -1384,12 +1454,12 @@ const Deta4 = item => {
|
||||
}
|
||||
});
|
||||
});
|
||||
console.log(brr);
|
||||
exportExcel(brr, `${region}作物干旱等级统计-行政区划`, 'Sheet1');
|
||||
});
|
||||
}
|
||||
};
|
||||
const dowcity = () => {
|
||||
console.log(insectarr);
|
||||
let arr = JSON.parse(JSON.stringify(amount.value[0]));
|
||||
arr.region = '合计';
|
||||
insectarr.value.push(arr);
|
||||
|
@ -239,22 +239,22 @@
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="风力等级" prop="power">
|
||||
<el-input v-model="ruleForm.power">
|
||||
<el-input v-model="ruleForm.power">
|
||||
<template #append>级</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="台风过境风速" prop="speed">
|
||||
<el-input disabled v-model="ruleForm.speed">
|
||||
<el-input v-model="ruleForm.speed">
|
||||
<template #append>米/秒</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="台风实时中心气压" prop="pressure">
|
||||
<el-input disabled v-model="ruleForm.pressure">
|
||||
<el-input v-model="ruleForm.pressure">
|
||||
<template #append>百帕</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="风圈半径" prop="radius">
|
||||
<el-input disabled v-model="ruleForm.radius7">
|
||||
<el-form-item label="风圈半径" prop="radius7">
|
||||
<el-input v-model="ruleForm.radius7">
|
||||
<template #append>千米</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
@ -405,6 +405,27 @@ const rules = reactive({
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
speed: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入过境风速时间',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
pressure: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输台风实时中心气压',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
radius7: [
|
||||
{
|
||||
required: true,
|
||||
message: '风圈半径',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
});
|
||||
watch(
|
||||
() => value1.value,
|
||||
@ -441,6 +462,10 @@ onMounted(() => {
|
||||
let rightWra = document.querySelector('.rightWra');
|
||||
rightWra.style.transform = 'translate(107%,0)';
|
||||
});
|
||||
onUpdated(() => {
|
||||
document.querySelector('.mode').style.display = 'none';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
});
|
||||
|
||||
/*-------------地图------------------------*/
|
||||
const mapOption = {
|
||||
@ -783,11 +808,18 @@ const submitClick = () => {
|
||||
submitForm(ruleFormRef);
|
||||
};
|
||||
const submitForm = async formEl => {
|
||||
await formEl.validate((valid, fields) => {
|
||||
if (valid) {
|
||||
console.log('submit!');
|
||||
} else {
|
||||
console.log('error submit!', fields);
|
||||
}
|
||||
});
|
||||
butFlag.value = true;
|
||||
if (ruleForm.value.duration.length < 1) {
|
||||
ElMessage.error('请输入过境时间');
|
||||
return;
|
||||
}else if(ruleForm.value.power.length < 1){
|
||||
} else if (ruleForm.value.power.length < 1) {
|
||||
ElMessage.error('请输入风力等级');
|
||||
return;
|
||||
} else {
|
||||
@ -3151,8 +3183,8 @@ $height: calc(100vh - 100px);
|
||||
box-shadow: none;
|
||||
background: rgba(22, 94, 102, 1);
|
||||
}
|
||||
.el-form-item__label{
|
||||
color:#fff;
|
||||
.el-form-item__label {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -512,6 +512,7 @@ function initonMounted() {
|
||||
theTimes(); //年
|
||||
//地图
|
||||
initmap();
|
||||
showDaChangArea();
|
||||
areachar();
|
||||
typesof();
|
||||
farmland();
|
||||
@ -533,9 +534,11 @@ function initonMounted() {
|
||||
onUpdated(() => {
|
||||
console.log(localStorage.getItem(router.currentRoute.value.path));
|
||||
if (localStorage.getItem(router.currentRoute.value.path) == 'false') {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '地图模式';
|
||||
window.document.querySelector('#screenfull').style.display = 'none';
|
||||
} else {
|
||||
document.querySelector('.mode').style.display = 'block';
|
||||
document.querySelector('.mode').innerText = '列表模式';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
}
|
||||
@ -656,7 +659,7 @@ function QueryData(e, name, url, item) {
|
||||
value.value = code;
|
||||
getTownships();
|
||||
let arr = [];
|
||||
getTownship({ divisions: '370211' }).then(res => {
|
||||
getTownship({ divisions: '370211', yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
console.log(item);
|
||||
if (item.streetCode == code) {
|
||||
@ -673,7 +676,7 @@ function QueryData(e, name, url, item) {
|
||||
) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.CJQYDM;
|
||||
let arr = [];
|
||||
getvillageChun({ divisions: code }).then(res => {
|
||||
getvillageChun({ divisions: code, yearMonth: oldDatas.value.name }).then(res => {
|
||||
console.log(res.data);
|
||||
res.data.forEach(item => {
|
||||
console.log(item);
|
||||
@ -753,11 +756,20 @@ const alter = () => {
|
||||
});
|
||||
map.addOverlay(overlay);
|
||||
};
|
||||
|
||||
//创建蒙层,凸显黄岛区域
|
||||
function showDaChangArea() {
|
||||
axios.get('/json/huangdao.json').then(({ data }) => {
|
||||
const fts = new ol.format.GeoJSON().readFeatures(data);
|
||||
const ft = fts[0];
|
||||
addConver(ft.getGeometry().getCoordinates(), 'huandao');
|
||||
});
|
||||
}
|
||||
//添加遮罩
|
||||
function addConver(data) {
|
||||
function addConver(data, name) {
|
||||
let source = new ol.source.Vector();
|
||||
var converLayer = new ol.layer.Vector({
|
||||
id: 'zhezhao',
|
||||
id: name ? name : 'zhezhao',
|
||||
source: source,
|
||||
style: new ol.style.Style({
|
||||
fill: new ol.style.Fill({
|
||||
@ -1390,7 +1402,27 @@ const changeTableHead = (tableData, fieldName) => {
|
||||
const list = tableData.map(item => {
|
||||
const obj = {};
|
||||
for (const k in item) {
|
||||
if (fieldName[k]) {
|
||||
if (fieldName[k] == '区域名称') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
for (const k in item) {
|
||||
if (fieldName[k] == '无冻害(亩)') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
for (const k in item) {
|
||||
if (fieldName[k] == '轻度冻害(亩)') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
for (const k in item) {
|
||||
if (fieldName[k] == '中度冻害(亩)') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
for (const k in item) {
|
||||
if (fieldName[k] == '重度冻害(亩)') {
|
||||
obj[fieldName[k]] = item[k];
|
||||
}
|
||||
}
|
||||
|
@ -209,8 +209,8 @@ onMounted(() => {
|
||||
|
||||
function initonMounted() {
|
||||
getFlYears();
|
||||
// getvillages(); //村
|
||||
initmap(); //地图
|
||||
showDaChangArea();
|
||||
alter();
|
||||
for (const key in dic) {
|
||||
if (dic[key].disabled !== true) {
|
||||
@ -219,7 +219,10 @@ function initonMounted() {
|
||||
}
|
||||
checkList.value = checkListdata.value;
|
||||
}
|
||||
|
||||
onUpdated(() => {
|
||||
document.querySelector('.mode').style.display = 'none';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
});
|
||||
watch(
|
||||
() => oldDatas.value,
|
||||
(val, oldVal) => {
|
||||
@ -383,7 +386,7 @@ function QueryData(e, name, url, item) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.XJQYDM;
|
||||
value.value = code;
|
||||
let arr = [];
|
||||
getNonFood().then(res => {
|
||||
getNonFood({ divisions: '370211', yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
if (item.subregionCode == code) {
|
||||
name = item.subregionName;
|
||||
@ -399,7 +402,7 @@ function QueryData(e, name, url, item) {
|
||||
) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.CJQYDM;
|
||||
let arr = [];
|
||||
getNonFoodHuoChun({ divisions: code, yearMonth: '2023-05' }).then(res => {
|
||||
getNonFoodHuoChun({ divisions: code, yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
if (item.subregionCode == code) {
|
||||
name = item.subregionName;
|
||||
@ -481,11 +484,19 @@ const alter = () => {
|
||||
});
|
||||
map.addOverlay(overlay);
|
||||
};
|
||||
//创建蒙层,凸显黄岛区域
|
||||
function showDaChangArea() {
|
||||
axios.get('/json/huangdao.json').then(({ data }) => {
|
||||
const fts = new ol.format.GeoJSON().readFeatures(data);
|
||||
const ft = fts[0];
|
||||
addConver(ft.getGeometry().getCoordinates(),'huandao');
|
||||
});
|
||||
}
|
||||
//添加遮罩
|
||||
function addConver(data) {
|
||||
function addConver(data,name) {
|
||||
let source = new ol.source.Vector();
|
||||
var converLayer = new ol.layer.Vector({
|
||||
id: 'zhezhao',
|
||||
id: name ? name : 'zhezhao',
|
||||
source: source,
|
||||
style: new ol.style.Style({
|
||||
fill: new ol.style.Fill({
|
||||
|
@ -154,7 +154,7 @@ onMounted(() => {
|
||||
getCameraNames();
|
||||
});
|
||||
onUpdated(() => {
|
||||
// document.querySelector('.mode').style.display = 'none';
|
||||
document.querySelector('.mode').style.display = 'none';
|
||||
window.document.querySelector('#screenfull').style.display = 'none';
|
||||
});
|
||||
const initLeafletMap = () => {
|
||||
|
@ -220,6 +220,7 @@ onMounted(() => {
|
||||
function initonMounted() {
|
||||
getLhdyears();
|
||||
initmap(); //地图
|
||||
showDaChangArea();
|
||||
alter();
|
||||
getCityAndCountZbs();
|
||||
for (const key in dic) {
|
||||
@ -231,6 +232,10 @@ function initonMounted() {
|
||||
checkList.value = checkListdata.value;
|
||||
console.log(checkList.value);
|
||||
}
|
||||
onUpdated(() => {
|
||||
document.querySelector('.mode').style.display = 'none';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
});
|
||||
watch(
|
||||
() => oldDatas.value,
|
||||
(val, oldVal) => {
|
||||
@ -393,7 +398,7 @@ function QueryData(e, name, url, item) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.XJQYDM;
|
||||
value.value = code;
|
||||
let arr = [];
|
||||
getAbandon().then(res => {
|
||||
getAbandon({ divisions: '370211', yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
console.log(item.subregionCode, code);
|
||||
if (item.subregionCode == code) {
|
||||
@ -410,7 +415,7 @@ function QueryData(e, name, url, item) {
|
||||
) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.CJQYDM;
|
||||
let arr = [];
|
||||
getNonFoodHuoChun({ divisions: code, yearMonth: '2023-05' }).then(res => {
|
||||
getNonFoodHuoChun({ divisions: code, yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
if (item.subregionCode == code) {
|
||||
name = item.subregionName;
|
||||
@ -492,11 +497,19 @@ const alter = () => {
|
||||
});
|
||||
map.addOverlay(overlay);
|
||||
};
|
||||
//创建蒙层,凸显黄岛区域
|
||||
function showDaChangArea() {
|
||||
axios.get('/json/huangdao.json').then(({ data }) => {
|
||||
const fts = new ol.format.GeoJSON().readFeatures(data);
|
||||
const ft = fts[0];
|
||||
addConver(ft.getGeometry().getCoordinates(),'huandao');
|
||||
});
|
||||
}
|
||||
//添加遮罩
|
||||
function addConver(data) {
|
||||
function addConver(data,name) {
|
||||
let source = new ol.source.Vector();
|
||||
var converLayer = new ol.layer.Vector({
|
||||
id: 'zhezhao',
|
||||
id: name ? name : 'zhezhao',
|
||||
source: source,
|
||||
style: new ol.style.Style({
|
||||
fill: new ol.style.Fill({
|
||||
|
@ -135,6 +135,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, inject, watch } from 'vue';
|
||||
import axios from 'axios';
|
||||
import * as echarts from 'echarts';
|
||||
import 'echarts-gl';
|
||||
import TimeLine from '@/components/TimeLine/TimeLine.vue';
|
||||
@ -143,7 +144,7 @@ import {
|
||||
getNonGrain,
|
||||
getNonGrainChun,
|
||||
getNonGrainHuoChun,
|
||||
getFnYear
|
||||
getFnYear,
|
||||
} from '@/api/plough/agriculturization.js';
|
||||
|
||||
let viewer = ref(null);
|
||||
@ -214,6 +215,7 @@ onMounted(() => {
|
||||
function initonMounted() {
|
||||
// getvillages(); //村
|
||||
initmap(); //地图
|
||||
showDaChangArea();
|
||||
alter();
|
||||
for (const key in dic) {
|
||||
if (dic[key].disabled !== true) {
|
||||
@ -222,7 +224,10 @@ function initonMounted() {
|
||||
}
|
||||
checkList.value = checkListdata.value;
|
||||
}
|
||||
|
||||
onUpdated(() => {
|
||||
document.querySelector('.mode').style.display = 'none';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
});
|
||||
watch(
|
||||
() => oldDatas.value,
|
||||
(val, oldVal) => {
|
||||
@ -291,15 +296,15 @@ function initmap() {
|
||||
if (zoom >= 13) {
|
||||
QueryData(
|
||||
e,
|
||||
'huangdaoqu_village@huangdaoqu_bianjie',
|
||||
'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/huangdaoqu_village@huangdaoqu_bianjie',
|
||||
'CJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/CJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
'村'
|
||||
);
|
||||
} else {
|
||||
QueryData(
|
||||
e,
|
||||
'huangdaoqu_town@huangdaoqu_bianjie',
|
||||
'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/huangdaoqu_town@huangdaoqu_bianjie',
|
||||
'XJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/XJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
'镇'
|
||||
);
|
||||
}
|
||||
@ -326,7 +331,7 @@ function initmap() {
|
||||
const cun = () => {
|
||||
layers = new ol.layer.Tile({
|
||||
source: new ol.source.TileSuperMapRest({
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/huangdaoqu_village@huangdaoqu_bianjie',
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/CJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
//rasterfunction: new SuperMap.NDVIParameter({ redIndex: 0, nirIndex: 2 }),
|
||||
cacheEnabled: false,
|
||||
}),
|
||||
@ -339,7 +344,7 @@ const cun = () => {
|
||||
const zhen = () => {
|
||||
var layer = new ol.layer.Tile({
|
||||
source: new ol.source.TileSuperMapRest({
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/huangdaoqu_town@huangdaoqu_bianjie',
|
||||
url: 'http://36.134.44.75:8090/iserver/services/map-huangdaoqu_bianjie/rest/maps/XJQY3702112019WGS84@huangdaoqu_bianjie',
|
||||
//rasterfunction: new SuperMap.NDVIParameter({ redIndex: 0, nirIndex: 2 }),
|
||||
cacheEnabled: false,
|
||||
}),
|
||||
@ -386,7 +391,7 @@ function QueryData(e, name, url, item) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.XJQYDM;
|
||||
value.value = code;
|
||||
let arr = [];
|
||||
getNonGrain().then(res => {
|
||||
getNonGrain({ divisions: '370211', yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
if (item.subregionCode == code) {
|
||||
name = item.subregionName;
|
||||
@ -402,7 +407,7 @@ function QueryData(e, name, url, item) {
|
||||
) {
|
||||
let code = data.result.recordsets[0].features.features[0].properties.CJQYDM;
|
||||
let arr = [];
|
||||
getNonGrainHuoChun({ divisions: code, yearMonth: '2023-05' }).then(res => {
|
||||
getNonGrainHuoChun({ divisions: code, yearMonth: oldDatas.value.name }).then(res => {
|
||||
res.data.forEach(item => {
|
||||
if (item.subregionCode == code) {
|
||||
name = item.subregionName;
|
||||
@ -484,11 +489,19 @@ const alter = () => {
|
||||
});
|
||||
map.addOverlay(overlay);
|
||||
};
|
||||
//创建蒙层,凸显黄岛区域
|
||||
function showDaChangArea() {
|
||||
axios.get('/json/huangdao.json').then(({ data }) => {
|
||||
const fts = new ol.format.GeoJSON().readFeatures(data);
|
||||
const ft = fts[0];
|
||||
addConver(ft.getGeometry().getCoordinates(), 'huandao');
|
||||
});
|
||||
}
|
||||
//添加遮罩
|
||||
function addConver(data) {
|
||||
function addConver(data, name) {
|
||||
let source = new ol.source.Vector();
|
||||
var converLayer = new ol.layer.Vector({
|
||||
id: 'zhezhao',
|
||||
id: name ? name : 'zhezhao',
|
||||
source: source,
|
||||
style: new ol.style.Style({
|
||||
fill: new ol.style.Fill({
|
||||
@ -584,14 +597,14 @@ function rightFoldClick() {
|
||||
|
||||
//接口
|
||||
//时间
|
||||
const getFnYears=()=>{
|
||||
getFnYear().then(res=>{
|
||||
const getFnYears = () => {
|
||||
getFnYear().then(res => {
|
||||
oldDatas.value = { name: res.data[0] };
|
||||
res.data.forEach(item => {
|
||||
dataSource.value.push({ name: item });
|
||||
});
|
||||
})
|
||||
}
|
||||
});
|
||||
};
|
||||
//镇
|
||||
const getNonGrains = time => {
|
||||
Township.arr = [];
|
||||
|
@ -283,7 +283,7 @@
|
||||
effect="dark"
|
||||
content="测量线"
|
||||
placement="left"
|
||||
offset='1'
|
||||
offset="1"
|
||||
>
|
||||
<img src="@/assets/images/measure.png" alt="" />
|
||||
</el-tooltip>
|
||||
@ -298,7 +298,7 @@
|
||||
effect="dark"
|
||||
content="测量面"
|
||||
placement="left"
|
||||
offset='1'
|
||||
offset="1"
|
||||
>
|
||||
<img src="@/assets/images/face.png" alt="" />
|
||||
</el-tooltip>
|
||||
@ -313,7 +313,7 @@
|
||||
effect="dark"
|
||||
content="清除"
|
||||
placement="left"
|
||||
offset='1'
|
||||
offset="1"
|
||||
>
|
||||
<img src="@/assets/images/shanchu.png" alt="" />
|
||||
</el-tooltip>
|
||||
@ -636,7 +636,10 @@ onMounted(() => {
|
||||
villageNewDataFun();
|
||||
getDistrictsBlockss('高标准农田');
|
||||
});
|
||||
|
||||
onUpdated(() => {
|
||||
document.querySelector('.mode').style.display = 'none';
|
||||
window.document.querySelector('#screenfull').style.display = 'block';
|
||||
});
|
||||
/*-------------地图------------------------*/
|
||||
let map = ref(null);
|
||||
let container = ref(null);
|
||||
|
Reference in New Issue
Block a user