This commit is contained in:
2023-05-05 16:32:31 +08:00
parent 7907a06dad
commit 10dde79643
194 changed files with 4493 additions and 266 deletions

View File

@ -132,6 +132,73 @@
<div class="cancel" @click="hiddenOverlayChart">X</div>
</div>
<el-button v-if="flag" class="back_button" @click="back()">返回</el-button>
<el-collapse class="legend" accordion>
<el-collapse-item name="1">
<template #title>图例</template>
<div class="mt-4">
<el-checkbox-group v-model="checkList" @change="change">
<!-- <el-checkbox
v-for="(value, item, key) in dic"
:key="key"
:style="{
background: value.color,
border: `1px solid ${value.color}`,
width: `100%`,
}"
v-model="checked3"
:disabled="value.disabled"
:label="item"
/> -->
<el-checkbox
style="
background: rgba(255, 238, 204, 1);
border: 1px solid rgba(251, 171, 60, 1);
width: 100%;
"
v-model="checked3"
label="0-200"
/>
<el-checkbox
style="
background: rgba(255, 220, 153, 1);
border: 1px solid rgba(251, 219, 13, 1);
width: 100%;
"
v-model="checked4"
label="200-400"
/>
<el-checkbox
style="
background: rgba(255, 203, 102, 1);
border: 1px solid rgba(244, 218, 136, 1);
width: 100%;
"
v-model="checked3"
label="400-600"
/>
<el-checkbox
style="
background: rgba(255, 185, 51, 1);
border: 1px solid rgba(174, 83, 110, 1);
width: 100%;
"
v-model="checked4"
label="600-800"
/>
<el-checkbox
style="
background: rgba(255, 168, 0, 1);
border: 1px solid rgba(242, 177, 167, 1);
width: 100%;
"
v-model="checked3"
label="800-1000"
/>
</el-checkbox-group>
</div>
</el-collapse-item>
</el-collapse>
</div>
</template>
@ -2583,19 +2650,41 @@ $height: calc(100vh - 100px);
.legend {
position: absolute;
right: 28%;
bottom: 18%;
right: 25%;
bottom: 7%;
width: 129px;
height: 338px;
opacity: 1;
border-radius: 4px;
background: rgba(2, 31, 26, 0.6);
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
padding: 10px 10px 10px 10px;
border: 1px solid rgba(4, 153, 153, 1);
// height: 50px;
:deep(.el-collapse-item__header) {
background: rgba(2, 31, 26, 0.6);
color: rgba(255, 255, 255, 1);
text-align: center;
padding: 0 30px;
font-size: 14px;
}
--el-collapse-content-bg-color {
background: rgba(2, 31, 26, 0.6);
}
:deep(.el-collapse-item__content) {
background: rgba(2, 31, 26, 0.6);
padding: 0 10px;
padding-bottom: 10px;
}
--el-collapse-border-color: none;
--el-collapse-content-bg-color: none;
// opacity: 1;
// border-radius: 4px;
// background: rgba(2, 31, 26, 0.6);
// display: flex;
// flex-direction: column;
// justify-content: flex-start;
// align-items: center;
// padding: 10px 10px 10px 10px;
p {
margin: 10px;
font-size: 14px;
@ -2628,7 +2717,10 @@ $height: calc(100vh - 100px);
.bottom_center {
position: absolute;
left: calc(400px + 12vw);
// left: calc(400px + 20px + 8vw);
left: -2%;
right: 0;
margin: auto;
width: calc(100% - (400px * 2) - (10vw * 2));
min-width: 380px;
bottom: 5%;