This commit is contained in:
伊丽莎白 2023-04-23 15:56:32 +08:00
parent d20a1e0ca1
commit a8e0623460
3 changed files with 8304 additions and 8265 deletions

16092
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -1,47 +1,48 @@
{ {
"name": "ruoyi", "name": "ruoyi",
"version": "3.8.4", "version": "3.8.4",
"description": "若依管理系统", "description": "若依管理系统",
"author": "若依", "author": "若依",
"license": "MIT", "license": "MIT",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build:prod": "vite build", "build:prod": "vite build",
"build:stage": "vite build --mode staging", "build:stage": "vite build --mode staging",
"preview": "vite preview" "preview": "vite preview"
}, },
"repository": { "repository": {
"type": "git", "type": "git",
"url": "https://gitee.com/y_project/RuoYi-Vue.git" "url": "https://gitee.com/y_project/RuoYi-Vue.git"
}, },
"dependencies": { "dependencies": {
"@element-plus/icons-vue": "2.0.10", "@element-plus/icons-vue": "2.0.10",
"@fit-screen/vue": "^0.2.0", "@fit-screen/vue": "^0.2.0",
"@vueuse/core": "9.5.0", "@vueuse/core": "9.5.0",
"axios": "0.27.2", "axios": "0.27.2",
"echarts": "^5.3.0", "echarts": "^5.3.0",
"element-plus": "2.2.21", "element-plus": "2.2.21",
"file-saver": "2.0.5", "file-saver": "2.0.5",
"fuse.js": "6.6.2", "fuse.js": "6.6.2",
"js-cookie": "3.0.1", "js-cookie": "3.0.1",
"jsencrypt": "3.3.1", "jsencrypt": "3.3.1",
"lib-flexible": "^0.3.2", "lib-flexible": "^0.3.2",
"nprogress": "0.2.0", "nprogress": "0.2.0",
"pinia": "2.0.22", "pinia": "2.0.22",
"postcss-px2rem": "^0.3.0", "postcss-px2rem": "^0.3.0",
"v-scale-screen": "^2.2.0", "v-scale-screen": "^2.2.0",
"vue": "3.2.45", "vue": "3.2.45",
"vue-cropper": "1.0.3", "vue-cropper": "1.0.3",
"vue-router": "4.1.4" "vue-router": "4.1.4"
}, },
"devDependencies": { "devDependencies": {
"@vitejs/plugin-vue": "3.1.0", "@vitejs/plugin-vue": "3.1.0",
"@vue/compiler-sfc": "3.2.45", "@vue/compiler-sfc": "3.2.45",
"sass": "1.56.1", "sass": "1.56.1",
"unplugin-auto-import": "0.11.4", "unplugin-auto-import": "0.11.4",
"vite": "3.2.3", "vite": "3.2.3",
"vite-plugin-compression": "0.5.1", "vite-plugin-compression": "0.5.1",
"vite-plugin-svg-icons": "2.0.1", "vite-plugin-svg-icons": "2.0.1",
"vite-plugin-vue-setup-extend": "0.4.0" "vite-plugin-vue-setup-extend": "0.4.0"
}
} }
}

View File

@ -5,19 +5,13 @@
<div class="leftTop"> <div class="leftTop">
<div class="title"> <div class="title">
<span>种植面积时间统计</span> <span>种植面积时间统计</span>
<p <p @click="Deta(
@click=" 'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianjishijian.xlsx'
Deta( )
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianjishijian.xlsx' ">
)
"
>
下载 &nbsp; 下载 &nbsp;
<img <img src="@/assets/icons/svg/downloads.svg" style="width: 14px; height: 14px; cursor: pointer" />
src="@/assets/icons/svg/downloads.svg"
style="width: 14px; height: 14px; cursor: pointer"
/>
</p> </p>
</div> </div>
<div ref="areaDiv" class="areaDiv"></div> <div ref="areaDiv" class="areaDiv"></div>
@ -26,18 +20,12 @@
<div class="leftbottom"> <div class="leftbottom">
<div class="title"> <div class="title">
<span>种植面积统计</span> <span>种植面积统计</span>
<p <p @click="Deta(
@click=" 'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianji%20.xlsx'
Deta( )
'https://1912c.oss-cn-beijing.aliyuncs.com/egg-oss-demo/zhongzhimianji%20.xlsx' ">
)
"
>
下载 &nbsp; 下载 &nbsp;
<img <img src="@/assets/icons/svg/downloads.svg" style="width: 14px; height: 14px; cursor: pointer" />
src="@/assets/icons/svg/downloads.svg"
style="width: 14px; height: 14px; cursor: pointer"
/>
</p> </p>
</div> </div>
<div ref="typesofDiv" class="typesofDiv"></div> <div ref="typesofDiv" class="typesofDiv"></div>
@ -54,18 +42,12 @@
<div class="rightTop"> <div class="rightTop">
<div class="title"> <div class="title">
<span>作物类型统计-高标准农田</span> <span>作物类型统计-高标准农田</span>
<p <p @click="Deta(
@click=" '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'
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' ">
)
"
>
下载 &nbsp; 下载 &nbsp;
<img <img src="@/assets/icons/svg/downloads.svg" style="width: 14px; height: 14px; cursor: pointer" />
src="@/assets/icons/svg/downloads.svg"
style="width: 14px; height: 14px; cursor: pointer"
/>
</p> </p>
</div> </div>
<div ref="farmlandDiv" class="farmlandDiv"></div> <div ref="farmlandDiv" class="farmlandDiv"></div>
@ -74,27 +56,17 @@
<div class="rightbottom"> <div class="rightbottom">
<div class="title"> <div class="title">
<span>作物类型统计-行政区划</span> <span>作物类型统计-行政区划</span>
<p <p @click="Deta(
@click=" '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'
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' ">
)
"
>
下载 &nbsp; 下载 &nbsp;
<img <img src="@/assets/icons/svg/downloads.svg" style="width: 14px; height: 14px; cursor: pointer" />
src="@/assets/icons/svg/downloads.svg"
style="width: 14px; height: 14px; cursor: pointer"
/>
</p> </p>
</div> </div>
<el-select @change="selectTab(item)" v-model="value" clearable placeholder="全部"> <el-select @change="selectTab(item)" v-model="value" clearable placeholder="全部">
<el-option <el-option v-for="item in Township.arr" :key="item.properties.XZDM" :label="item.properties.XZMC"
v-for="item in Township.arr" :value="item.properties.XZDM" />
:key="item.properties.XZDM"
:label="item.properties.XZMC"
:value="item.properties.XZDM"
/>
</el-select> </el-select>
<div ref="ASdivisionDiv" class="ASdivision"></div> <div ref="ASdivisionDiv" class="ASdivision"></div>
</div> </div>
@ -103,78 +75,42 @@
<p>图例</p> <p>图例</p>
<div class="mt-4"> <div class="mt-4">
<el-checkbox-group @change="change()" v-model="checkedCities"> <el-checkbox-group @change="change()" v-model="checkedCities">
<el-checkbox <el-checkbox checked style="
checked
style="
background: rgba(102, 142, 214, 0.8); background: rgba(102, 142, 214, 0.8);
border: 1px solid rgba(102, 142, 214, 1); border: 1px solid rgba(102, 142, 214, 1);
" " label="小麦" />
label="小麦" <el-checkbox checked style="
/>
<el-checkbox
checked
style="
background: rgba(255, 225, 104, 0.8); background: rgba(255, 225, 104, 0.8);
border: 1px solid rgba(255, 225, 104, 1); border: 1px solid rgba(255, 225, 104, 1);
" " label="玉米" />
label="玉米" <el-checkbox checked style="
/>
<el-checkbox
checked
style="
background: rgba(156, 220, 130, 0.8); background: rgba(156, 220, 130, 0.8);
border: 1px solid rgba(156, 220, 130, 1); border: 1px solid rgba(156, 220, 130, 1);
" " label="大豆" />
label="大豆" <el-checkbox checked style="
/>
<el-checkbox
checked
style="
background: rgba(209, 91, 127, 0.8); background: rgba(209, 91, 127, 0.8);
border: 1px solid rgba(209, 91, 127, 1); border: 1px solid rgba(209, 91, 127, 1);
" " label="地瓜" />
label="地瓜" <el-checkbox checked style="
/>
<el-checkbox
checked
style="
background: rgba(212, 236, 89, 0.8); background: rgba(212, 236, 89, 0.8);
border: 1px solid rgba(212, 236, 89, 1); border: 1px solid rgba(212, 236, 89, 1);
" " label="花生" />
label="花生" <el-checkbox checked style="
/>
<el-checkbox
checked
style="
background: rgba(50, 211, 235, 0.8); background: rgba(50, 211, 235, 0.8);
border: 1px solid rgba(50, 211, 235, 1); border: 1px solid rgba(50, 211, 235, 1);
" " label="蓝莓" />
label="蓝莓" <el-checkbox checked style="
/>
<el-checkbox
checked
style="
background: rgba(91, 196, 159, 0.8); background: rgba(91, 196, 159, 0.8);
border: 1px solid rgba(91, 196, 159, 1); border: 1px solid rgba(91, 196, 159, 1);
" " label="茶叶" />
label="茶叶" <el-checkbox checked style="
/>
<el-checkbox
checked
style="
background: rgba(254, 182, 77, 0.8); background: rgba(254, 182, 77, 0.8);
border: 1px solid rgba(254, 182, 77, 1); border: 1px solid rgba(254, 182, 77, 1);
" " label="马铃薯" />
label="马铃薯" <el-checkbox checked style="
/>
<el-checkbox
checked
style="
background: rgba(250, 129, 109, 0.8); background: rgba(250, 129, 109, 0.8);
border: 1px solid rgba(250, 129, 109, 1); border: 1px solid rgba(250, 129, 109, 1);
" " label="白菜和萝卜" />
label="白菜和萝卜"
/>
</el-checkbox-group> </el-checkbox-group>
</div> </div>
</div> </div>
@ -198,7 +134,7 @@
</template> </template>
<script setup> <script setup>
import { ref, onMounted, inject, reactive } from 'vue'; import { ref, onMounted, inject, reactive, watch } from 'vue';
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import TimeLine from '@/components/TimeLine/TimeLine.vue'; import TimeLine from '@/components/TimeLine/TimeLine.vue';
import { useEcharts } from '@/hooks/useEcharts'; import { useEcharts } from '@/hooks/useEcharts';
@ -230,7 +166,9 @@ let dic = {
白菜和萝卜: 'rgba(250, 129, 109, 0.8)', 白菜和萝卜: 'rgba(250, 129, 109, 0.8)',
其他: 'rgba(250, 129, 109, 0.8)', 其他: 'rgba(250, 129, 109, 0.8)',
}; };
watch(() => Township.arr, (val) => {
console.log('val:', val)
})
// //
var data = { var data = {
title: [], title: [],
@ -386,47 +324,8 @@ function initMap() {
duration: 2, duration: 2,
}); });
var handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas); //
handler.setInputAction(function (movement) { layerClick()
var ray = viewer.camera.getPickRay(movement.position);
var cartesian = viewer.scene.globe.pick(ray, viewer.scene);
if (cartesian) {
let cartographic = Cesium.Cartographic.fromCartesian(cartesian);
if (cartographic) {
let xy = new Cesium.Cartesian2();
let alti = viewer.camera.positionCartographic.height;
let level = getLevel(alti);
const layers = viewer.imageryLayers._layers;
console.log(layers);
const providerPoint = layers[layers.length - 1];
//
let provider = providerPoint._imageryProvider;
if (
provider &&
provider.ready &&
provider._layers &&
providerPoint.show === true
) {
xy = provider.tilingScheme.positionToTileXY(cartographic, level, xy);
let promise = provider.pickFeatures(
xy.x,
xy.y,
level,
cartographic.longitude,
cartographic.latitude
);
if (promise) {
promise.then(data => {
if (data.length > 0) {
}
});
}
}
}
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
// //
// Cesium.GeoJsonDataSource.load( // Cesium.GeoJsonDataSource.load(
@ -534,6 +433,9 @@ function initMap() {
// ); // );
} }
// data
// name便
// color
function addBoundaryHandle(data, name, color) { function addBoundaryHandle(data, name, color) {
data.forEach(item => { data.forEach(item => {
let arr = []; let arr = [];
@ -602,6 +504,124 @@ function getLevel(height) {
} }
} }
let XZDM = ''
//
function layerClick() {
var handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);
handler.setInputAction(function (movement) {
var ray = viewer.camera.getPickRay(movement.position);
var cartesian = viewer.scene.globe.pick(ray, viewer.scene);
if (cartesian) {
let cartographic = Cesium.Cartographic.fromCartesian(cartesian);
if (cartographic) {
let xy = new Cesium.Cartesian2();
let alti = viewer.camera.positionCartographic.height;
let level = getLevel(alti);
const layers = viewer.imageryLayers._layers;
console.log('layers:', layers);
const index = layers.findIndex(item => item._imageryProvider._layers && item._imageryProvider._layers === 'shuzisannong:huangdaoqu_town')
if (index > -1) {
const providerPoint = layers[index];
//
let provider = providerPoint._imageryProvider;
if (provider && provider.ready && provider._layers && providerPoint.show === true) {
xy = provider.tilingScheme.positionToTileXY(cartographic, level, xy);
let promise = provider.pickFeatures(xy.x, xy.y, level, cartographic.longitude, cartographic.latitude);
if (promise) {
promise.then(data => {
if (data.length > 0) {
console.log('data:', data)
let newData = data['0']
if (newData.properties && newData.properties.XZDM) {
if (XZDM !== newData.properties.XZDM) {//
XZDM = newData.properties.XZDM
console.log('111', newData)
let item = newData.data
//
viewer.camera.flyTo({
destination: Cesium.Rectangle.fromDegrees(item.bbox[0], item.bbox[1], item.bbox[2], item.bbox[3]),
duration: 2,
});
//
deleteEntityByName('townLine')
//
addBoundaryHandle(item.geometry.coordinates, 'townLine', 'yellow')
//
removeWms(['village_CQL'])
//
addvillage(`XZDM=${newData.properties.XZDM}`, 'village_CQL')
}
} else {
removeWms(['village_CQL'])
}
}
});
}
}
}
}
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
}
//
// CQL_FILTER:
// customName
function addvillage(CQL_FILTER, customName) {
console.log('222')
let map2 = new Cesium.WebMapServiceImageryProvider({
url: `http://121.36.229.60:9080/geoserver/shuzisannong/wms`,
layers: 'shuzisannong:huangdaoqu_village', //
parameters: {
service: 'WMS',
format: 'image/png',
transparent: true, //
// CQL_FILTER: `XZDM=${value.value}`,
CQL_FILTER: CQL_FILTER
},
});
map2.customName = customName;
viewer.imageryLayers.addImageryProvider(map2);
}
// wms
// nameArry customName
// isMohu
function removeWms(nameArry, isMohu) {
if (viewer) {
// customName
const layers = viewer.imageryLayers._layers
for (let f = layers.length - 1; f >= 0; f--) {
nameArry.forEach(item => {
if (layers[f]._imageryProvider && layers[f]._imageryProvider.customName) {
if (isMohu) {
if (layers[f]._imageryProvider.customName.indexOf(item) > -1) {
viewer.imageryLayers.remove(layers[f])
}
} else {
if (layers[f]._imageryProvider.customName === item) {
viewer.imageryLayers.remove(layers[f])
}
}
}
})
}
}
}
// ()
function deleteEntityByName(name) {
if (viewer) {
let entitys = viewer.entities._entities._array;
for (var na = entitys.length - 1; na >= 0; na--) {
if (entitys[na]._name && entitys[na]._name === name) {
viewer.entities.remove(entitys[na]);
}
}
}
}
/*------------------接口--------------------*/ /*------------------接口--------------------*/
const getArea = () => { const getArea = () => {
@ -665,6 +685,7 @@ const selectTab = () => {
getTownships(); getTownships();
} }
let arr = [...Township.arr]; let arr = [...Township.arr];
console.log('arr:', arr)
arr.forEach(item => { arr.forEach(item => {
if (item.properties.XZDM == value.value) { if (item.properties.XZDM == value.value) {
viewer.camera.flyTo({ viewer.camera.flyTo({
@ -689,24 +710,20 @@ const selectTab = () => {
data.title = [...Object.values(brr)]; data.title = [...Object.values(brr)];
ASdivision(); ASdivision();
}); });
const layers = viewer.imageryLayers._layers;
for (let f = layers.length - 1; f >= 0; f--) { let town = [...Township.arr]
if (layers[f]._imageryProvider.aaa === 'aaa') { const townData = town.find(item => item.properties.XZDM === value.value)
viewer.imageryLayers.remove(layers[f]); if (townData) {
} //
deleteEntityByName('townLine')
//
addBoundaryHandle(townData.geometry.coordinates, 'townLine', 'yellow')
} }
let map2 = new Cesium.WebMapServiceImageryProvider({ //
url: `http://121.36.229.60:9080/geoserver/shuzisannong/wms`, removeWms(['aaa'])
layers: 'shuzisannong:huangdaoqu_village', // //
parameters: { addvillage(`XZDM=${value.value}`, 'aaa')
service: 'WMS',
format: 'image/png',
transparent: true, //
CQL_FILTER: `XZDM=${value.value}`,
},
});
map2.aaa = 'aaa';
viewer.imageryLayers.addImageryProvider(map2);
}; };
// //
@ -1310,7 +1327,6 @@ function ProgressBar() {
// option && ProgressBarDivIntance.setOption(option); // option && ProgressBarDivIntance.setOption(option);
useEcharts(ProgressBarDivIntance, option); useEcharts(ProgressBarDivIntance, option);
} }
function ASdivision() { function ASdivision() {
const ASdivisionDivIntance = echarts.init(ASdivisionDiv.value); const ASdivisionDivIntance = echarts.init(ASdivisionDiv.value);
var option = { var option = {
@ -1546,6 +1562,7 @@ function ASdivision() {
// option && ASdivisionDivIntance.setOption(option, true); // option && ASdivisionDivIntance.setOption(option, true);
useEcharts(ASdivisionDivIntance, option); useEcharts(ASdivisionDivIntance, option);
} }
/*--------------------------------------------------------------------------------------------*/ /*--------------------------------------------------------------------------------------------*/
/*------------------------------------------柱状图--------------------------------------------*/ /*------------------------------------------柱状图--------------------------------------------*/
@ -1782,14 +1799,17 @@ function ASdivision() {
// function random(min, max) { // function random(min, max) {
// return Math.floor(Math.random() * (max - min)) + min; // return Math.floor(Math.random() * (max - min)) + min;
// } // }
/*-------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------*/
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
$height: calc(100vh - 100px); $height: calc(100vh - 100px);
.center { .center {
width: 100%; width: 100%;
height: 100%; height: 100%;
.title { .title {
width: 100%; width: 100%;
height: 45px; height: 45px;
@ -1803,22 +1823,22 @@ $height: calc(100vh - 100px);
cursor: pointer; cursor: pointer;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
span { span {
width: 80%; width: 80%;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
} }
p { p {
width: 79px; width: 79px;
height: 25px; height: 25px;
border-radius: 20px; border-radius: 20px;
font-size: 14px; font-size: 14px;
background: linear-gradient( background: linear-gradient(180deg,
180deg, rgba(16, 111, 111, 1) 0%,
rgba(16, 111, 111, 1) 0%, rgba(47, 214, 214, 1) 100%);
rgba(47, 214, 214, 1) 100%
);
border: 1.5px solid rgba(23, 194, 180, 1); border: 1.5px solid rgba(23, 194, 180, 1);
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -1839,6 +1859,7 @@ $height: calc(100vh - 100px);
max-width: calc(100% - 20px); max-width: calc(100% - 20px);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.areaDiv { .areaDiv {
width: 100%; width: 100%;
height: 327px; height: 327px;
@ -1846,12 +1867,14 @@ $height: calc(100vh - 100px);
display: flex; display: flex;
padding: 1px; padding: 1px;
} }
.ProgressBar { .ProgressBar {
width: 100%; width: 100%;
height: 9px; height: 9px;
opacity: 1; opacity: 1;
} }
} }
.leftbottom { .leftbottom {
width: 100%; width: 100%;
height: 455px; height: 455px;
@ -1861,15 +1884,18 @@ $height: calc(100vh - 100px);
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
padding-top: 13px; padding-top: 13px;
.typesofDiv { .typesofDiv {
width: 100%; width: 100%;
height: 200px; height: 200px;
} }
.tableDiv { .tableDiv {
background: rgba(255, 255, 255, 0.05); background: rgba(255, 255, 255, 0.05);
display: flex; display: flex;
justify-content: center; justify-content: center;
width: 85%; width: 85%;
:deep(.ones) { :deep(.ones) {
width: 100%; width: 100%;
height: 171; height: 171;
@ -1900,6 +1926,7 @@ $height: calc(100vh - 100px);
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
background: rgba(2, 31, 26, 0.3); background: rgba(2, 31, 26, 0.3);
.rightTop { .rightTop {
width: 100%; width: 100%;
height: 40%; height: 40%;
@ -1908,17 +1935,20 @@ $height: calc(100vh - 100px);
flex-direction: column; flex-direction: column;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
.farmlandDiv { .farmlandDiv {
width: 100%; width: 100%;
height: 340px; height: 340px;
opacity: 1; opacity: 1;
} }
.ProgressBar { .ProgressBar {
width: 100%; width: 100%;
height: 9px; height: 9px;
opacity: 1; opacity: 1;
} }
} }
.rightbottom { .rightbottom {
width: 100%; width: 100%;
height: 490px; height: 490px;
@ -1935,13 +1965,16 @@ $height: calc(100vh - 100px);
background: rgba(22, 94, 102, 1); background: rgba(22, 94, 102, 1);
border: 1px solid rgba(4, 153, 153, 1) !important; border: 1px solid rgba(4, 153, 153, 1) !important;
margin-top: 20px; margin-top: 20px;
:deep(.el-input__wrapper) { :deep(.el-input__wrapper) {
background-color: transparent; background-color: transparent;
} }
:deep(.el-input__inner) { :deep(.el-input__inner) {
color: rgba(255, 255, 255, 0.7); color: rgba(255, 255, 255, 0.7);
} }
} }
.ASdivision { .ASdivision {
width: 415px; width: 415px;
height: 368px; height: 368px;
@ -1964,6 +1997,7 @@ $height: calc(100vh - 100px);
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
padding: 10px 10px 10px 10px; padding: 10px 10px 10px 10px;
p { p {
margin: 10px; margin: 10px;
font-size: 14px; font-size: 14px;
@ -1973,6 +2007,7 @@ $height: calc(100vh - 100px);
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
text-align: center; text-align: center;
} }
.mt-4 { .mt-4 {
.el-checkbox { .el-checkbox {
height: 30px; height: 30px;
@ -1987,6 +2022,7 @@ $height: calc(100vh - 100px);
text-align: left; text-align: left;
} }
} }
:deep(.el-checkbox__label) { :deep(.el-checkbox__label) {
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
} }
@ -2004,6 +2040,7 @@ $height: calc(100vh - 100px);
background: rgba(2, 31, 26, 0.6); background: rgba(2, 31, 26, 0.6);
border: 1px solid rgba(4, 153, 153, 1); border: 1px solid rgba(4, 153, 153, 1);
} }
.tool { .tool {
position: absolute; position: absolute;
right: 30%; right: 30%;
@ -2016,6 +2053,7 @@ $height: calc(100vh - 100px);
justify-content: flex-start; justify-content: flex-start;
align-items: flex-start; align-items: flex-start;
} }
#popup { #popup {
border-radius: 5px; border-radius: 5px;
background: rgba(2, 31, 26, 0.6); background: rgba(2, 31, 26, 0.6);
@ -2024,7 +2062,7 @@ $height: calc(100vh - 100px);
// align-items: flex-end; // align-items: flex-end;
padding: 30px 8px 20px 8px; padding: 30px 8px 20px 8px;
& > div:nth-child(1) { &>div:nth-child(1) {
font-weight: 400; font-weight: 400;
letter-spacing: 0px; letter-spacing: 0px;
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
@ -2032,7 +2070,7 @@ $height: calc(100vh - 100px);
line-height: 24px; line-height: 24px;
} }
& > div:nth-child(2) { &>div:nth-child(2) {
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
width: 129px; width: 129px;
height: 24px; height: 24px;
@ -2054,6 +2092,6 @@ $height: calc(100vh - 100px);
cursor: pointer; cursor: pointer;
} }
} }
:deep(.el-select__popper.el-popper) {
} :deep(.el-select__popper.el-popper) {}
</style> </style>