up
This commit is contained in:
@ -5,14 +5,19 @@
|
||||
<div class="leftTop">
|
||||
<div class="title">
|
||||
<span>种植面积时间统计</span>
|
||||
<p @click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianjishijian.xlsx'
|
||||
)
|
||||
">
|
||||
<p
|
||||
@click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianj_zuoshang.xlsx'
|
||||
)
|
||||
"
|
||||
>
|
||||
下载
|
||||
|
||||
<img src="@/assets/icons/svg/downloads.svg" style="width: 14px; height: 14px; cursor: pointer" />
|
||||
<img
|
||||
src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer"
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
<div ref="areaDiv" class="areaDiv"></div>
|
||||
@ -21,13 +26,18 @@
|
||||
<div class="leftbottom">
|
||||
<div class="title">
|
||||
<span>种植面积统计</span>
|
||||
<p @click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianji%20.xlsx'
|
||||
)
|
||||
">
|
||||
<p
|
||||
@click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianji%20.xlsx'
|
||||
)
|
||||
"
|
||||
>
|
||||
下载
|
||||
<img src="@/assets/icons/svg/downloads.svg" style="width: 14px; height: 14px; cursor: pointer" />
|
||||
<img
|
||||
src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer"
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
<div ref="typesofDiv" class="typesofDiv"></div>
|
||||
@ -95,13 +105,34 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="leftFoldDiv" @click="leftFoldClick()">
|
||||
<el-tooltip class="box-item" :show-arrow="false" :disabled="leftWraFlag" hide-after="0" show-after="200"
|
||||
effect="dark" content="展开" placement="top">
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
:show-arrow="false"
|
||||
:disabled="leftWraFlag"
|
||||
hide-after="0"
|
||||
show-after="200"
|
||||
effect="dark"
|
||||
content="展开"
|
||||
placement="top"
|
||||
>
|
||||
<img v-if="!leftWraFlag" src="@/assets/images/close1.png" alt="" />
|
||||
</el-tooltip>
|
||||
<el-tooltip :disabled="!leftWraFlag" :show-arrow="false" class="box-item" show-after="200" hide-after="0"
|
||||
effect="dark" content="收起" placement="top">
|
||||
<img class="imgrotate" v-if="leftWraFlag" src="@/assets/images/close1.png" alt="" />
|
||||
<el-tooltip
|
||||
:disabled="!leftWraFlag"
|
||||
:show-arrow="false"
|
||||
class="box-item"
|
||||
show-after="200"
|
||||
hide-after="0"
|
||||
effect="dark"
|
||||
content="收起"
|
||||
placement="top"
|
||||
>
|
||||
<img
|
||||
class="imgrotate"
|
||||
v-if="leftWraFlag"
|
||||
src="@/assets/images/close1.png"
|
||||
alt=""
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
@ -109,13 +140,18 @@
|
||||
<div class="rightTop">
|
||||
<div class="title">
|
||||
<span>种植面积统计-高标准农田</span>
|
||||
<p @click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/81f3b011-7a5d-4a21-88aa-8ea51142e564_%E6%95%B0%E6%8D%AE%E5%AF%BC%E5%87%BA.xlsx'
|
||||
)
|
||||
">
|
||||
<p
|
||||
@click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/81f3b011-7a5d-4a21-88aa-8ea51142e564_%E6%95%B0%E6%8D%AE%E5%AF%BC%E5%87%BA.xlsx'
|
||||
)
|
||||
"
|
||||
>
|
||||
下载
|
||||
<img src="@/assets/icons/svg/downloads.svg" style="width: 14px; height: 14px; cursor: pointer" />
|
||||
<img
|
||||
src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer"
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
<div ref="farmlandDiv" class="farmlandDiv"></div>
|
||||
@ -124,29 +160,65 @@
|
||||
<div class="rightbottom">
|
||||
<div class="title">
|
||||
<span>种植面积统计-行政区划</span>
|
||||
<p @click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/0c0ff4cf-151a-470e-856a-b0fce0fde997_%E6%95%B0%E6%8D%AE%E5%AF%BC%E5%87%BA.xlsx'
|
||||
)
|
||||
">
|
||||
<p
|
||||
@click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/0c0ff4cf-151a-470e-856a-b0fce0fde997_%E6%95%B0%E6%8D%AE%E5%AF%BC%E5%87%BA.xlsx'
|
||||
)
|
||||
"
|
||||
>
|
||||
下载
|
||||
<img src="@/assets/icons/svg/downloads.svg" style="width: 14px; height: 14px; cursor: pointer" />
|
||||
<img
|
||||
src="@/assets/icons/svg/downloads.svg"
|
||||
style="width: 14px; height: 14px; cursor: pointer"
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
<el-select popper-class="select_city" @change="selectTab(item)" v-model="value" clearable placeholder="全部">
|
||||
<el-option v-for="item in Township.arr" :key="item.properties.XZDM" :label="item.properties.XZMC"
|
||||
:value="item.properties.XZDM" />
|
||||
<el-select
|
||||
popper-class="select_city"
|
||||
@change="selectTab(item)"
|
||||
v-model="value"
|
||||
clearable
|
||||
placeholder="全部"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in Township.arr"
|
||||
:key="item.properties.XZDM"
|
||||
:label="item.properties.XZMC"
|
||||
:value="item.properties.XZDM"
|
||||
/>
|
||||
</el-select>
|
||||
<div ref="ASdivisionDiv" class="ASdivision"></div>
|
||||
</div>
|
||||
<div class="rightFoldDiv" @click="rightFoldClick()">
|
||||
<el-tooltip :disabled="!rightWraFlag" :show-arrow="false" hide-after="0" show-after="200" class="box-item"
|
||||
effect="dark" content="收起" placement="top">
|
||||
<el-tooltip
|
||||
:disabled="!rightWraFlag"
|
||||
:show-arrow="false"
|
||||
hide-after="0"
|
||||
show-after="200"
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
content="收起"
|
||||
placement="top"
|
||||
>
|
||||
<img v-if="rightWraFlag" src="@/assets/images/close1.png" alt="" />
|
||||
</el-tooltip>
|
||||
<el-tooltip :disabled="rightWraFlag" :show-arrow="false" hide-after="0" show-after="200" class="box-item"
|
||||
effect="dark" content="展开" placement="top">
|
||||
<img class="imgrotate" v-if="!rightWraFlag" src="@/assets/images/close1.png" alt="" />
|
||||
<el-tooltip
|
||||
:disabled="rightWraFlag"
|
||||
:show-arrow="false"
|
||||
hide-after="0"
|
||||
show-after="200"
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
content="展开"
|
||||
placement="top"
|
||||
>
|
||||
<img
|
||||
class="imgrotate"
|
||||
v-if="!rightWraFlag"
|
||||
src="@/assets/images/close1.png"
|
||||
alt=""
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
@ -207,8 +279,8 @@ const clickInfoMap = ref({ name: '', value: '' });
|
||||
const checkedCities = ref([]);
|
||||
const formLandRef = ref([]);
|
||||
const flag = ref(false);
|
||||
let leftWraFlag = ref(true);
|
||||
let rightWraFlag = ref(true);
|
||||
let leftWraFlag = ref(false);
|
||||
let rightWraFlag = ref(false);
|
||||
let ff = ref('{x:765,y:191}');
|
||||
let Pie3D = reactive({
|
||||
arr: [
|
||||
@ -389,6 +461,11 @@ onMounted(() => {
|
||||
// ProgressBar();
|
||||
ASdivision();
|
||||
getFarmland();
|
||||
|
||||
let leftWra = document.querySelector('.leftWra');
|
||||
leftWra ? (leftWra.style.transform = 'translate(-107%,0)') : '';
|
||||
let rightWra = document.querySelector('.rightWra');
|
||||
rightWra.style.transform = 'translate(107%,0)';
|
||||
});
|
||||
|
||||
/*-------------地图------------------------*/
|
||||
@ -674,7 +751,7 @@ function getFarmland() {
|
||||
console.log('农田：', res);
|
||||
formLandRef.value = res.data.features;
|
||||
})
|
||||
.catch(err => { });
|
||||
.catch(err => {});
|
||||
}
|
||||
|
||||
let townZuowu = ref({ label: [] }); //镇的作物
|
||||
@ -722,8 +799,12 @@ function layerClick() {
|
||||
let newData = data['0'];
|
||||
if (newData.properties && newData.properties.XZDM) {
|
||||
console.log('XZDM:', XZDM);
|
||||
console.log('newData.properties.XZDM:', newData.properties.XZDM);
|
||||
console.log(
|
||||
'newData.properties.XZDM:',
|
||||
newData.properties.XZDM
|
||||
);
|
||||
if (XZDM !== newData.properties.XZDM) {
|
||||
flag.value = true;
|
||||
//防止重复加载
|
||||
XZDM = newData.properties.XZDM;
|
||||
value.value = XZDM; //
|
||||
@ -763,7 +844,7 @@ function layerClick() {
|
||||
if (
|
||||
entitys[na]._name &&
|
||||
entitys[na]._name ===
|
||||
'point' + newData.properties.XZDM
|
||||
'point' + newData.properties.XZDM
|
||||
) {
|
||||
let info = entitys[na]._info;
|
||||
// entitys[na].label.show = true
|
||||
@ -787,7 +868,7 @@ function layerClick() {
|
||||
XZQDM = '';
|
||||
} else {
|
||||
// // 已经有镇了，监听村点击
|
||||
villageClick(layers, xy, level, cartographic,movement);
|
||||
villageClick(layers, xy, level, cartographic, movement);
|
||||
}
|
||||
} else {
|
||||
removeWms(['village_CQL']);
|
||||
@ -805,7 +886,7 @@ function layerClick() {
|
||||
}
|
||||
let XZQDM = '';
|
||||
// 村点击高亮
|
||||
function villageClick(layers, xy, level, cartographic,movement) {
|
||||
function villageClick(layers, xy, level, cartographic, movement) {
|
||||
const index = layers.findIndex(
|
||||
item =>
|
||||
item._imageryProvider._layers &&
|
||||
@ -884,9 +965,7 @@ function villageClick(layers, xy, level, cartographic,movement) {
|
||||
|
||||
// 展示弹窗
|
||||
showOverlayChart(movement.position); // 添加地图移动监听：使地图移动弹窗跟着移动
|
||||
viewer.scene.postRender.addEventListener(
|
||||
infoWindowPostRender
|
||||
);
|
||||
viewer.scene.postRender.addEventListener(infoWindowPostRender);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -959,7 +1038,7 @@ function leftFoldClick() {
|
||||
leftWra ? (leftWra.style.transform = 'translate(0,0)') : '';
|
||||
} else {
|
||||
let leftWra = document.querySelector('.leftWra');
|
||||
leftWra ? leftWra.style.transform = 'translate(-107%,0)' : '';
|
||||
leftWra ? (leftWra.style.transform = 'translate(-107%,0)') : '';
|
||||
}
|
||||
}
|
||||
function rightFoldClick() {
|
||||
@ -1112,6 +1191,7 @@ const selectTab = () => {
|
||||
];
|
||||
if (value.value == '370211') {
|
||||
removeWms(['village_CQL']);
|
||||
XZDM=null
|
||||
removeWms(['aaa']);
|
||||
getTownships();
|
||||
tableData = [
|
||||
@ -1238,6 +1318,7 @@ const selectTab = () => {
|
||||
],
|
||||
});
|
||||
hiddenOverlayChart();
|
||||
return
|
||||
}
|
||||
areatext = '1293842';
|
||||
tableData = [
|
||||
@ -1866,9 +1947,11 @@ function typesof() {
|
||||
tooltip: {
|
||||
formatter: params => {
|
||||
if (params.seriesName !== 'mouseoutSeries') {
|
||||
return `${params.seriesName
|
||||
}<br/><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${params.color
|
||||
};"></span>${option.series[params.seriesIndex].pieData.value}`;
|
||||
return `${
|
||||
params.seriesName
|
||||
}<br/><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${
|
||||
params.color
|
||||
};"></span>${option.series[params.seriesIndex].pieData.value}`;
|
||||
}
|
||||
},
|
||||
},
|
||||
@ -2305,8 +2388,15 @@ function addWms(layers, customName) {
|
||||
}
|
||||
//返回
|
||||
function back() {
|
||||
delete townZuowu.value.XZQMC;
|
||||
removeWms(['gbznt'], true);
|
||||
addWms('shuzisannong:huangdaoqu_town', 'tl');
|
||||
removeWms(['aaa']);
|
||||
value.value = '370211';
|
||||
selectTab();
|
||||
if (flag.value === '1') {
|
||||
console.log(flag.value);
|
||||
addWms('shuzisannong:huangdaoqu_town', 'tl');
|
||||
}
|
||||
viewer.camera.flyTo({
|
||||
destination: Cesium.Rectangle.fromDegrees(119.5091, 35.5671, 120.3285, 36.1455),
|
||||
duration: 2,
|
||||
@ -2316,7 +2406,7 @@ function back() {
|
||||
}
|
||||
// 图表点击事件
|
||||
function ChartClick(item) {
|
||||
console.log('item:', item);
|
||||
delete townZuowu.value;
|
||||
// 移除作物
|
||||
removeWms(['huangdaoqu_town'], true);
|
||||
removeWms(['tl'], true);
|
||||
@ -2337,6 +2427,10 @@ function ChartClick(item) {
|
||||
if (!cz) {
|
||||
// 添加高标准农田服务
|
||||
addWms(layername, layername + 'gbznt');
|
||||
townZuowu.value.label = [
|
||||
{ crop: '小麦', Shape_Area: '53000' },
|
||||
{ crop: '地瓜', Shape_Area: '50000' },
|
||||
];
|
||||
}
|
||||
// 定位到地块
|
||||
let features = formLandRef.value;
|
||||
@ -2356,15 +2450,7 @@ function ChartClick(item) {
|
||||
});
|
||||
}
|
||||
});
|
||||
flag.value = true;
|
||||
|
||||
townZuowu.value = {
|
||||
label: [
|
||||
{ crop: '小麦', Shape_Area: '53000' },
|
||||
{ crop: '地瓜', Shape_Area: '50000' },
|
||||
],
|
||||
};
|
||||
console.log(townZuowu.label);
|
||||
flag.value = '1';
|
||||
showOverlayChart({ x: 642, y: 312 });
|
||||
}
|
||||
function ASdivision() {
|
||||
@ -2778,7 +2864,7 @@ function getAreaFenlei() {
|
||||
});
|
||||
});
|
||||
})
|
||||
.catch(err => { });
|
||||
.catch(err => {});
|
||||
}
|
||||
let fenleiRef = ref({});
|
||||
function mbHandle() {
|
||||
@ -2802,7 +2888,7 @@ function mbHandle() {
|
||||
fenleiRef.value = town;
|
||||
getAreaFenlei();
|
||||
})
|
||||
.catch(err => { });
|
||||
.catch(err => {});
|
||||
}
|
||||
|
||||
/*------------------------------------------柱状图--------------------------------------------*/
|
||||
@ -2973,8 +3059,10 @@ function infoWindowPostRender() {
|
||||
|
||||
if (Cesium.defined(windowPosition)) {
|
||||
const pop = document.getElementById('pop');
|
||||
pop.style.top = windowPosition.y - 10 + 'px';
|
||||
pop.style.left = windowPosition.x + 10 + 'px';
|
||||
if (pop) {
|
||||
pop.style.top = windowPosition.y - 10 + 'px';
|
||||
pop.style.left = windowPosition.x + 10 + 'px';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -3021,6 +3109,7 @@ function infoWindowPostRender() {
|
||||
|
||||
// 隐藏弹窗
|
||||
function hiddenOverlayChart() {
|
||||
delete townZuowu.value.XZQMC;
|
||||
// 移除各种高亮
|
||||
// XZDM = '';
|
||||
XZQDM = '';
|
||||
@ -3030,28 +3119,33 @@ function hiddenOverlayChart() {
|
||||
deleteEntityByName('villageLine');
|
||||
deleteEntityByName('townLine');
|
||||
const pop = document.getElementById('pop');
|
||||
pop.style.display = 'none'; // 清除监听事件
|
||||
if (pop) {
|
||||
pop.style.display = 'none'; // 清除监听事件
|
||||
}
|
||||
|
||||
viewer.scene.postRender.removeEventListener(infoWindowPostRender);
|
||||
// 重定位
|
||||
// viewer.camera.flyTo({
|
||||
// destination: Cesium.Rectangle.fromDegrees(119.5091, 35.5671, 120.3285, 36.1455),
|
||||
// duration: 2,
|
||||
// });
|
||||
removeWms(['gbznt'], true);
|
||||
if (flag.value) {
|
||||
addWms('shuzisannong:huangdaoqu_town', 'tl');
|
||||
}
|
||||
flag.value = false;
|
||||
// removeWms(['gbznt'], true);
|
||||
// if (flag.value) {
|
||||
// addWms('shuzisannong:huangdaoqu_town', 'tl');
|
||||
// }
|
||||
}
|
||||
//显示弹窗
|
||||
function showOverlayChart(position) {
|
||||
console.log(position);
|
||||
const pop = document.getElementById('pop');
|
||||
pop.style.display = 'block';
|
||||
pop.style.position = 'absolute';
|
||||
pop.style.top = position.y - 10 + 'px';
|
||||
pop.style.left = position.x + 10 + 'px';
|
||||
pop.style.zIndex = 99;
|
||||
if (townZuowu.value.label.length) {
|
||||
const pop = document.getElementById('pop');
|
||||
if (pop) {
|
||||
pop.style.display = 'block';
|
||||
pop.style.position = 'absolute';
|
||||
pop.style.top = position.y - 10 + 'px';
|
||||
pop.style.left = position.x + 10 + 'px';
|
||||
pop.style.zIndex = 99;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// function random(min, max) {
|
||||
@ -3093,9 +3187,11 @@ $height: calc(100vh - 100px);
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
background: linear-gradient(180deg,
|
||||
rgba(255, 255, 255, 1) 33.33%,
|
||||
rgba(41, 255, 219, 1) 100%);
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(255, 255, 255, 1) 33.33%,
|
||||
rgba(41, 255, 219, 1) 100%
|
||||
);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
@ -3105,9 +3201,11 @@ $height: calc(100vh - 100px);
|
||||
height: 25px;
|
||||
border-radius: 20px;
|
||||
font-size: 14px;
|
||||
background: linear-gradient(180deg,
|
||||
rgba(16, 111, 111, 1) 0%,
|
||||
rgba(47, 214, 214, 1) 100%);
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(16, 111, 111, 1) 0%,
|
||||
rgba(47, 214, 214, 1) 100%
|
||||
);
|
||||
border: 1.5px solid rgba(23, 194, 180, 1);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@ -3197,9 +3295,11 @@ $height: calc(100vh - 100px);
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
opacity: 1;
|
||||
background: linear-gradient(90deg,
|
||||
rgba(21, 173, 148, 0.1) 0%,
|
||||
rgba(21, 173, 148, 0) 100%);
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
rgba(21, 173, 148, 0.1) 0%,
|
||||
rgba(21, 173, 148, 0) 100%
|
||||
);
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
@ -3396,7 +3496,7 @@ $height: calc(100vh - 100px);
|
||||
// align-items: flex-end;
|
||||
padding: 30px 8px 20px 8px;
|
||||
|
||||
&>div:nth-child(1) {
|
||||
& > div:nth-child(1) {
|
||||
font-weight: 400;
|
||||
letter-spacing: 0px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
@ -3404,7 +3504,7 @@ $height: calc(100vh - 100px);
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
&>div:nth-child(2) {
|
||||
& > div:nth-child(2) {
|
||||
color: rgba(255, 255, 255, 1);
|
||||
width: 129px;
|
||||
height: 24px;
|
||||
@ -3443,11 +3543,11 @@ $height: calc(100vh - 100px);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&>div {
|
||||
& > div {
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
|
||||
&>div:nth-child(1) {
|
||||
& > div:nth-child(1) {
|
||||
font-weight: 400;
|
||||
letter-spacing: 0px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
@ -3456,7 +3556,7 @@ $height: calc(100vh - 100px);
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
&>div:nth-child(2) {
|
||||
& > div:nth-child(2) {
|
||||
color: rgba(255, 255, 255, 1);
|
||||
width: 129px;
|
||||
height: 24px;
|
||||
@ -3478,7 +3578,8 @@ $height: calc(100vh - 100px);
|
||||
top: 20px;
|
||||
}
|
||||
|
||||
:deep(.el-select__popper.el-popper) {}
|
||||
:deep(.el-select__popper.el-popper) {
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.select_city {
|
||||
@ -8,7 +8,7 @@
|
||||
<p
|
||||
@click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianjishijian.xlsx'
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhifenlei_zuoshang.xlsx'
|
||||
)
|
||||
"
|
||||
>
|
||||
@ -27,7 +27,7 @@
|
||||
<p
|
||||
@click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianjishijian.xlsx'
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhifenlei_zouxia.xlsx'
|
||||
)
|
||||
"
|
||||
>
|
||||
@ -81,7 +81,7 @@
|
||||
<p
|
||||
@click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianjishijian.xlsx'
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhifenlei_youshang.xlsx'
|
||||
)
|
||||
"
|
||||
>
|
||||
@ -101,7 +101,7 @@
|
||||
<p
|
||||
@click="
|
||||
Deta(
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianjishijian.xlsx'
|
||||
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhifenlei_youxia.xlsx'
|
||||
)
|
||||
"
|
||||
>
|
||||
@ -173,7 +173,7 @@
|
||||
border: `1px solid ${value.color}`,
|
||||
width: `100%`,
|
||||
}"
|
||||
v-model="checked3"
|
||||
:v-model="value.disabled"
|
||||
:disabled="value.disabled"
|
||||
:label="item"
|
||||
/>
|
||||
@ -289,8 +289,8 @@ let Township = reactive({ arr: [], brr: [], crr: [] }); //街道
|
||||
const value = ref('370211');
|
||||
const clickInfoMap = ref({ info: [] });
|
||||
const flag = ref(false);
|
||||
let leftWraFlag = ref(true);
|
||||
let rightWraFlag = ref(true);
|
||||
let leftWraFlag = ref(false);
|
||||
let rightWraFlag = ref(false);
|
||||
//下载
|
||||
/*---------------------------*/
|
||||
const Deta = item => {
|
||||
@ -445,7 +445,16 @@ function initonMounted() {
|
||||
ASdivision(); //图表
|
||||
getArea(); //请求
|
||||
getFarmland();
|
||||
checkList.value = Object.keys(dic);
|
||||
for (const key in dic) {
|
||||
if(dic[key].disabled !==true){
|
||||
checkList.value.push(key)
|
||||
}
|
||||
}
|
||||
// checkList.value = Object.keys(dic);
|
||||
let leftWra = document.querySelector('.leftWra');
|
||||
leftWra ? (leftWra.style.transform = 'translate(-107%,0)') : '';
|
||||
let rightWra = document.querySelector('.rightWra');
|
||||
rightWra.style.transform = 'translate(107%,0)';
|
||||
}
|
||||
const mapOption = {
|
||||
url:
|
||||
@ -532,7 +541,7 @@ function initMap() {
|
||||
addWms('shuzisannong:huangdaoqu_town', 'shuzisannong:huangdaoqu_town');
|
||||
}
|
||||
|
||||
const checkList = ref([]);
|
||||
const checkList = ref(['false']);
|
||||
|
||||
function getLevel(height) {
|
||||
if (height > 48000000) {
|
||||
@ -947,6 +956,8 @@ function getFarmland() {
|
||||
}
|
||||
//返回
|
||||
function back() {
|
||||
value.value = '370211';
|
||||
selectTab()
|
||||
removeWms(['huangdaoqu_town'], true);
|
||||
removeWms(['shuzisannong:farmlandgbzn'], true);
|
||||
addWms('shuzisannong:huangdaoqu_town', 'shuzisannong:huangdaoqu_town');
|
||||
@ -1043,6 +1054,7 @@ const getaArea = () => {
|
||||
const selectTab = () => {
|
||||
areachar();
|
||||
if (value.value == '370211') {
|
||||
XZDM=null
|
||||
//全部
|
||||
getTownships();
|
||||
classData = [302034, 243990, 42344, 34234, 304235];
|
||||
@ -1289,7 +1301,7 @@ function areachar() {
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: ['小麦', '花生', '大豆', '花生', '蓝莓'],
|
||||
data: ['小麦', '花生', '大豆', '地瓜', '蓝莓'],
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#C0C4CC',
|
||||
@ -2259,7 +2271,7 @@ $height: calc(100vh - 100px);
|
||||
.imgrotate {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
|
||||
.title {
|
||||
width: 100%;
|
||||
height: 45px;
|
||||
@ -2329,7 +2341,7 @@ $height: calc(100vh - 100px);
|
||||
}
|
||||
.leftTop {
|
||||
// height: 35%;
|
||||
max-width: calc(100% - 20px);
|
||||
max-width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@ -2347,7 +2359,7 @@ $height: calc(100vh - 100px);
|
||||
height: 35%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: calc(100% - 7px);
|
||||
max-width: 100%;
|
||||
align-items: center;
|
||||
|
||||
.typesofDiv {
|
||||
@ -1388,6 +1388,9 @@ function areachar() {
|
||||
},
|
||||
legend: {
|
||||
data: ['最大值', '最小值'],
|
||||
itemWidth: 20,
|
||||
itemHeight: 12.5,
|
||||
icon: 'rect',
|
||||
textStyle: {
|
||||
fontSize: 12,
|
||||
color: 'rgb(0,253,255,0.6)',
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -67,7 +67,7 @@
|
||||
</el-form>
|
||||
<!-- 底部 -->
|
||||
<div class="el-login-footer">
|
||||
<span>Copyright © 2018-2022 ruoyi.vip All Rights Reserved.</span>
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -171,7 +171,7 @@ getCookie();
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
background-image: url('../assets/images/login-background.jpg');
|
||||
background-image: url('../assets/images/login-background.png');
|
||||
background-size: cover;
|
||||
}
|
||||
.title {
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1173,8 +1173,18 @@ function farmland() {
|
||||
textStyle: { color: 'rgba(255,255,255,.9)' },
|
||||
itemWidth: 20,
|
||||
itemHeight: 12.5,
|
||||
icon: 'rect',
|
||||
backgroundColor: 'transparent',
|
||||
x: 'right', // 水平居右
|
||||
},
|
||||
tooltip: {},
|
||||
grid: {
|
||||
left: '5%',
|
||||
right: '5%',
|
||||
bottom: '9%',
|
||||
top: '15%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['水田', '旱地', '水浇地', '其他', '其他'],
|
||||
@ -1317,28 +1327,24 @@ function ASdivision() {
|
||||
const ASdivisionDivIntance = echarts.init(ASdivisionDiv.value);
|
||||
var data = [
|
||||
{
|
||||
areaName: '测试1',
|
||||
rate: '30',
|
||||
areaName: '区域一',
|
||||
rate: '3598',
|
||||
},
|
||||
{
|
||||
areaName: '测试2',
|
||||
rate: '80',
|
||||
areaName: '区域二',
|
||||
rate: '1235',
|
||||
},
|
||||
{
|
||||
areaName: '测试3',
|
||||
rate: '100',
|
||||
areaName: '区域三',
|
||||
rate: '2354',
|
||||
},
|
||||
{
|
||||
areaName: '测试4',
|
||||
rate: '90',
|
||||
areaName: '区域四',
|
||||
rate: '3251',
|
||||
},
|
||||
{
|
||||
areaName: '测试5',
|
||||
rate: '60',
|
||||
},
|
||||
{
|
||||
areaName: '测试6',
|
||||
rate: '70',
|
||||
areaName: '区域五',
|
||||
rate: '1652',
|
||||
},
|
||||
];
|
||||
var nameList = [];
|
||||
@ -1354,17 +1360,27 @@ function ASdivision() {
|
||||
// 坐标轴指示器，坐标轴触发有效
|
||||
type: 'shadow', // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
formatter: function (params) {
|
||||
let dot =
|
||||
'<span style="display:inline-block;margin-right:5px;border-radius:50%;width:10px;height:10px;background-color:#02C4DD"></span>';
|
||||
return params[0].name + '<br>' + '办结率 ：' + params[0].value + '%';
|
||||
},
|
||||
// formatter: function (params) {
|
||||
// let dot =
|
||||
// '<span style="display:inline-block;margin-right:5px;border-radius:50%;width:10px;height:10px;background-color:#02C4DD"></span>';
|
||||
// return params[0].name + '<br>' + '办结率 ：' + params[0].value + '%';
|
||||
// },
|
||||
},
|
||||
legend: {
|
||||
show: true,
|
||||
top: '10',
|
||||
right: '5%',
|
||||
textStyle: { color: 'rgba(255,255,255,.9)' },
|
||||
itemWidth: 20,
|
||||
itemHeight: 12.5,
|
||||
icon: 'rect',
|
||||
backgroundColor: 'transparent',
|
||||
},
|
||||
grid: {
|
||||
left: '0%',
|
||||
right: '4%',
|
||||
left: '5%',
|
||||
right: '5%',
|
||||
bottom: '9%',
|
||||
top: '5%',
|
||||
top: '10%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
@ -1421,7 +1437,7 @@ function ASdivision() {
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '',
|
||||
name: '面积',
|
||||
barMinHeight: 10,
|
||||
type: 'pictorialBar',
|
||||
barCategoryGap: '60%',
|
||||
@ -1443,8 +1459,10 @@ function ASdivision() {
|
||||
},
|
||||
},
|
||||
label: {
|
||||
normal: {
|
||||
show: false,
|
||||
show: true,
|
||||
position: 'top',
|
||||
textStyle: {
|
||||
color: '#ffffff',
|
||||
},
|
||||
},
|
||||
data: dataList,
|
||||
|
||||
@ -159,7 +159,7 @@ getCode();
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
background-image: url("../assets/images/login-background.jpg");
|
||||
background-image: url("../assets/images/login-background.png");
|
||||
background-size: cover;
|
||||
}
|
||||
.title {
|
||||
|
||||
Reference in New Issue
Block a user