This commit is contained in:
李想 2025-04-24 11:36:25 +08:00
commit 50bc05ccff
5 changed files with 81 additions and 65 deletions

View File

@ -18,5 +18,4 @@ const size = computed(() => SettingStore.themeConfig.globalComSize);
</script> </script>
<style lang="scss"> <style lang="scss">
@import './styles/style'; @import './styles/style';
@import './assets/fonts/font.css';
</style> </style>

View File

@ -119,7 +119,7 @@ function handleTitleClick(val) {
box-sizing: border-box; box-sizing: border-box;
} }
.header_title { .header_title {
background-color: #f5f5f5; background-color: #000;
position: relative; position: relative;
padding: 0 68px; padding: 0 68px;
display: flex; display: flex;

View File

@ -1,5 +1,6 @@
@import 'common/base'; @import 'common/base';
@import 'common/define'; @import 'common/define';
@import './assets/fonts/font.css';
#app { #app {
position: relative; position: relative;
width: 100%; width: 100%;
@ -7,11 +8,31 @@
font-family: Avenir, sans-serif; font-family: Avenir, sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
background-color: #ffffff; background-color: #000;
}
.el-dialog__body {
overflow: hidden auto;
height: auto;
max-height: calc(100vh - 130px);
}
.txt-ellipsis {
display: -webkit-inline-box;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
white-space: normal;
}
.clamp1 {
line-clamp: 1;
-webkit-line-clamp: 1;
line-height: 1.5;
max-height: calc(1.5em * 1);
} }
// .el-dialog__body { .clamp2 {
// overflow: hidden auto; line-clamp: 2;
// height: auto; -webkit-line-clamp: 2;
// max-height: calc(100vh - 130px); line-height: 1.5;
// } max-height: calc(1.5em * 2);
}

View File

@ -87,7 +87,7 @@ let rollDataList = reactive([
flex-direction: column; flex-direction: column;
} }
.left-charts-item { .left-charts-item {
width: 100%; width: calc(100% - 5px);
height: calc((100% - 30px) / 3); height: calc((100% - 30px) / 3);
} }
@ -98,7 +98,7 @@ let rollDataList = reactive([
flex-direction: column; flex-direction: column;
} }
.right-charts-item { .right-charts-item {
width: 100%; width: calc(100% - 5px);
height: calc((100% - 30px) / 3); height: calc((100% - 30px) / 3);
} }
} }

View File

@ -1,60 +1,56 @@
<template> <template>
<div class="data-home-index"> <div class="data-home-index">
<baseBg :name-val="'land'" top-title="土地资源管理系统"> <el-row style="width: 100%; height: 100%">
<template #center> <el-col :span="6" class="left-charts">
<el-row style="width: 100%; height: 100%"> <div class="left-charts-item">
<el-col :span="6" class="left-charts"> <customBack top-title="耕地面积统计" :top-postion="'left'">
<div class="left-charts-item"> <template #back>
<customBack top-title="耕地面积统计" :top-postion="'left'"> <distributionCharts></distributionCharts>
<template #back> </template>
<distributionCharts></distributionCharts> </customBack>
</template> </div>
</customBack> <div class="left-charts-item">
</div> <customBack top-title="农村土地资源" :top-postion="'left'">
<div class="left-charts-item"> <template #back>
<customBack top-title="农村土地资源" :top-postion="'left'"> <landCirculation></landCirculation>
<template #back> </template>
<landCirculation></landCirculation> </customBack>
</template> </div>
</customBack> <div class="left-charts-item">
</div> <customBack top-title="项目效益分析" :top-postion="'left'">
<div class="left-charts-item"> <template #back>
<customBack top-title="项目效益分析" :top-postion="'left'"> <landPatrol></landPatrol>
<template #back> </template>
<landPatrol></landPatrol> </customBack>
</template> </div>
</customBack> </el-col>
</div> <el-col :span="12">
</el-col> <centerMap></centerMap>
<el-col :span="12"> </el-col>
<centerMap></centerMap> <el-col :span="6" class="right-charts">
</el-col> <div class="right-charts-item">
<el-col :span="6" class="right-charts"> <customBack top-title="农用地数据统计" :top-postion="'right'">
<div class="right-charts-item"> <template #back>
<customBack top-title="农用地数据统计" :top-postion="'right'"> <landuseCharts></landuseCharts>
<template #back> </template>
<landuseCharts></landuseCharts> </customBack>
</template> </div>
</customBack> <div class="right-charts-item">
</div> <customBack top-title="年度农用地规划面积" :top-postion="'right'">
<div class="right-charts-item"> <template #back>
<customBack top-title="年度农用地规划面积" :top-postion="'right'"> <landPlan></landPlan>
<template #back> </template>
<landPlan></landPlan> </customBack>
</template> </div>
</customBack> <div class="right-charts-item">
</div> <customBack top-title="各地农用地利用面积" :top-postion="'right'">
<div class="right-charts-item"> <template #back>
<customBack top-title="各地农用地利用面积" :top-postion="'right'"> <landareaCharts></landareaCharts>
<template #back> </template>
<landareaCharts></landareaCharts> </customBack>
</template> </div>
</customBack> </el-col>
</div> </el-row>
</el-col>
</el-row>
</template>
</baseBg>
</div> </div>
</template> </template>
<script setup> <script setup>