新版式

This commit is contained in:
duanliang
2025-11-26 23:25:22 +08:00
parent 2f34ab23a6
commit d05a0f645e
6 changed files with 123 additions and 30 deletions

View File

@@ -32,18 +32,18 @@
</div>
<Line
width="100%"
:height="440"
:height="140"
:data="scenicQueueData"
:xAxisData="scenicQueueXAxisData"
/>
</div>
</div>
<div class="box mr-8">
<div class="box box-9 mr-8">
<Title1 title="景区承载" />
<div class="">
<div class="flex">
<circle-progress
:width="170"
:width="60"
:height="50"
:value="scenicStore.scenicBearData.header.jqRate"
:title="`${scenicStore.scenicBearData.header.jqRate}%`"
@@ -68,13 +68,13 @@
</div>
<Line
width="100%"
:height="390"
:height="125"
:data="scenicBearData"
:xAxisData="scenicBearXAxisData"
/>
</div>
</div>
<div class="box-1 mr-8" style="padding: 0;">
<div class="box-1 mr-8" v-if="false" style="padding: 0;">
<Title1 title="停车信息" />
<div class="">
<div class=" flex flex-1">
@@ -102,7 +102,7 @@
<div class="pt-10">
<Title3 title="今日景区车流量" />
</div>
<Line width="100%" :height="390" :data="carBearData" :xAxisData="carBearXAxisData" />
<Line width="100%" :height="105" :data="carBearData" :xAxisData="carBearXAxisData" />
</div>
<div class="border flex-1">
<div class="pt-10">
@@ -113,7 +113,7 @@
:dataList="dataLists"
:total="carTotal"
width="100%"
:height="300"
:height="110"
/>
</div>
</div>
@@ -137,16 +137,16 @@
</div>
<PieRow
label="告警总数"
:dataList="scenicStore.secureData.dataList"
:dataList="scenicStore?.secureData.dataList"
:total="alarmTotal"
width="100%"
:height="450"
:height="140"
/>
</div>
</div>
</div>
<div class="flex mt-8">
<div class="box-3 mr-8">
<div class="flex mt-8" >
<div class="box-3 mr-8" >
<div class="look-box">
<Title1 title="交通信息" />
<div @click="hanldeLookMap" class="look-btn">查看详情</div>
@@ -167,8 +167,8 @@
<div class="border mr-8">
<Title3 title="拥堵次数占比" />
<jam
:width="220"
:height="700"
width="100%"
:height="200"
sub-title="拥堵频次总数"
:list="scenicStore.trafficData.data.countRate"
:text="'暂无拥堵'"
@@ -178,8 +178,8 @@
<Title3 title="拥堵时长占比" />
<jam
:text="'暂无拥堵'"
:width="220"
:height="720"
width="100%"
:height="200"
sub-title="拥堵总时长(分钟)"
:list="scenicStore.trafficData.data.timeRate"
/>
@@ -189,7 +189,7 @@
<div class="box-4 mr-8">
<Title1 title="用户画像" />
<div class="flex" style="height: 100%;">
<div class="flex" style="height: 88%;">
<div class="border mr-8 flex-1">
<Title3 title="年龄/性别占比" />
<age :list="scenicStore.userPortraitData.data.ageRate" />
@@ -221,16 +221,16 @@
<Title3 title="客源地分析TOP5" />
<RegionTop
:list="scenicStore.userPortraitData.data.provinceRate"
:width="250"
:height="800"
width="100%"
:height="200"
/>
</div>
<div class="border flex-1">
<Title3 title="购票来源" />
<TicketSource
:list="scenicStore.userPortraitData.data.channel"
:width="240"
:height="800"
width="100%"
:height="200"
/>
</div>
</div>
@@ -649,7 +649,7 @@
align-items: center;
background: #0a4190;
border-radius: vw(4);
font-size: vw(18); /* 16×1.2 */
font-size: font-vw(18); /* 16×1.2 */
font-weight:700;
color: #fff;
z-index: 999;
@@ -1055,6 +1055,7 @@
}
.container {
margin: vh(120) 0 0 vw(10);
flex:1;
.count-box {
padding: 0 vw(10);
height: vh(140);
@@ -1072,28 +1073,40 @@
}
.box {
@extend .bg;
width: vw(650);
// height: vh(475);
// width: vw(650);
height: vh(880);
min-width: vw(800);
flex:1;
}
.box-9{
// width: vw(750);
}
.box-1 {
@extend .bg;
// height: vh(475);
}
.box-2 {
@extend .bg;
// height: vh(475);
height: vh(880);
flex:1;
}
.box-3 {
@extend .bg;
flex:1;
// width: vw(750);
// height: vh(465);
}
.box-4 {
@extend .bg;
flex:1;
// height: vh(465);
}
.box-5 {
// width: vw(750);
@extend .bg;
// height: vh(465);
height:100%;
flex:1;
}
.car-box {