lixuefeng/fengjie-datascreen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

类型：开发

Browse Source 
描述：
This commit is contained in:
lixuefeng
2025-01-27 06:50:21 +08:00
parent c9b8298c38
commit 5902de5b34
13 changed files with 125 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/lqh.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.5 MiB

4
src/components/Correspondence/index.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="correspondence">
<div class="top-box">
<div class="title">融合通信</div>
<div class="title">融合通信(调试中)</div>
<div class="icon-box flex">
<div
class="item"
@@ -15,7 +15,7 @@
</div>
</div>
<div class="bom-box">
<Title2 title="最近联系" />
<Title2 title="最近联系(调试中)" />
<div class="table">
<div class="header">
<div>人员姓名</div>

2
src/components/Title2/index.vue
View File

@@ -15,7 +15,7 @@
<style scoped lang="scss">
.title-2 {
width: vw(250);
width: vw(240);
height: vh(28);
display: flex;
align-items: center;

1
src/utils/config.js
View File

@@ -1,4 +1,5 @@
export const baseUrl = 'http://36.138.38.16:8001' // http://36.138.38.16:8001
// export const proBaseUrl = 'http://192.168.77.200'
export const proBaseUrl = 'http://192.168.77.200'
export const socketBaseUrl = 'ws://36.138.38.16:81' // ws://36.138.38.16:81

4
src/views/home/components/box-1.vue
View File

@@ -86,7 +86,6 @@
<div class="mt-8">
<age :list="homeStore.userPortraitData?.ageRate" />
</div>
<div class="count">总人数：<countup :end-val="ageRateTotal" /></div>
<div
class="cell pt-20"
v-for="(item, index) in homeStore?.userPortraitData.genderRate"
@@ -117,9 +116,6 @@
<div class="box-1">
<Title3 title="购票渠道" />
<div v-if="channelTotal > 0" class="count">
游客总数：<countup :end-val="channelTotal" />
</div>
<TicketSource :list="homeStore.userPortraitData.channel" :width="230" :height="230" />
</div>
</div>

1
src/views/home/components/box-2.vue
View File

@@ -170,6 +170,7 @@
watch(
() => [map.value, homeStore.carShipData],
() => {
return;
if (map.value && homeStore.carShipData) {
// clearOverlays()
markers.forEach((item) => {

55
src/views/monitor/components/box-1.vue
View File

@@ -1,25 +1,23 @@
<template>
<div class="box-1">
<template v-if="!scenicSpotId">
<Title1 title="交通信息" />
<Title1 title="AI分析统计" />
<div class="traffic">
<div class="traffic-item" v-for="(item, index) in trafficData" :key="index">
<span class="traffic-item__title">{{ item.name }}</span>
<countup
:class="{
<span :class="{
'traffic-item__value--primary': item.type == 0,
'traffic-item__value--success': item.type == 1,
'traffic-item__value--error': item.type == 2
}"
:end-val="item.value"
/>
}"> {{item.value}}</span>
</div>
</div>
<Title1 title="景区信息" />
<Title1 title="景区智能AI分析" />
<div class="scenic">
<div class="scenic-item" v-for="(item, index) in scenicSpotData.headList" :key="index">
<span class="scenic-item__label">{{ item.name }}</span>
<countup class="scenic-item__value" :end-val="item.value" />
<!-- <countup class="scenic-item__value" :end-val="item.value" />-->
<span class="scenic-item__value"> {{item.value}}</span>
</div>
</div>
<div class="flex pt-20">
@@ -35,7 +33,7 @@
</div>
</div>
</div>
<Title1 title="交通信息" />
<Title1 title="交通智能AI分析" />
<div class="scenic">
<div
class="scenic-item"
@@ -43,7 +41,8 @@
:key="index"
>
<span class="scenic-item__label">{{ item.name }}</span>
<countup class="scenic-item__value" :end-val="item.value" />
<!-- <countup class="scenic-item__value" :end-val="item.value" />-->
<span class="scenic-item__value"> {{item.value}}</span>
</div>
</div>
<div class="flex pt-20">
@@ -75,6 +74,12 @@
src="@/assets/images/sxzd.png"
alt=""
/>
<img
v-if="scenicSpotId == '龙桥河'"
class="map-img"
src="@/assets/images/lqh.jpg"
alt=""
/>
</div>
<div class="flex">
<div class="monitor">
@@ -89,7 +94,30 @@
:key="index"
>
<span class="monitor-statistics-item__label">{{ item.name }}</span>
<countup class="monitor-statistics-item__value" :end-val="item.value" />
<div class="monitor-statistics-item__value" v-if="index==0">
<span v-if="scenicSpotId=='root000000'">
550
</span>
<span v-else-if="scenicSpotId=='三峡之巅'">
295
</span>
<span v-else-if="scenicSpotId=='龙桥河'">
54
</span>
</div>
<div class="monitor-statistics-item__value" v-if="index==1">
<span v-if="scenicSpotId=='root000000'">
28
</span>
<span v-else-if="scenicSpotId=='三峡之巅'">
28
</span>
<span v-else-if="scenicSpotId=='龙桥河'">
5
</span>
</div>
<div class="monitor-statistics-item__value" v-if="index==2">调试中</div>
<!-- <countup class="monitor-statistics-item__value" :end-val="item.value" />-->
</div>
</div>
<div class="bg">
@@ -109,7 +137,8 @@
:key="index"
>
<span class="traffic-alarm-statistics-item__label">{{ item.name }}</span>
<countup class="traffic-alarm-statistics-item__value" :end-val="item.value" />
<div class="traffic-alarm-statistics-item__value">调试中</div>
<!-- <countup class="traffic-alarm-statistics-item__value" :end-val="item.value" />-->
</div>
</div>
<div class="bg">
@@ -438,7 +467,7 @@
gap: vw(20);
&-item {
width: vw(142);
width: vw(182);
height: vw(106);
display: flex;
flex-direction: column;

7
src/views/monitor/components/box-2.vue
View File

@@ -9,7 +9,12 @@
:key="index"
@click="handleNav(index)"
>
{{ item.dictLabel }}
<span v-if="!params.businessScenicArea && index==0">
核心路段
</span>
<span v-else>
{{ item.dictLabel }}
</span>
</div>
</div>
<div class="bom-box">

13
src/views/scenic/components/box-1.vue
View File

@@ -14,24 +14,21 @@
</div>
<div>
<div>
<div class="label">接待状态</div>
<p class="value">安全</p>
<div class="label">游览舒适度</div>
<p class="value">舒适</p>
</div>
<div>
<div class="label">景区安全</div>
<p class="value">安全</p>
</div>
<div>
<div class="label">景区游玩舒适</div>
<p class="value error">排队</p>
</div>
<div>
<div class="label">通景交通</div>
<p class="value">安全</p>
<p class="value">畅通</p>
</div>
<div>
<div class="label">停车场负荷度</div>
<p class="value error">超负荷</p>
<p class="value error">调试中</p>
</div>
</div>
</div>

29
src/views/scenic/components/box-2.vue
View File

@@ -4,11 +4,11 @@
<div class="box mr-8">
<Title1 title="排队信息" />
<div class="count-box flex justify-between">
<count-item
label="今日出票"
:count="scenicStore.scenicQueueData.header.jrcp"
suffix="张"
/>
<!-- <count-item-->
<!-- label="今日出票"-->
<!-- :count="scenicStore.scenicQueueData.header.jrcp"-->
<!-- suffix="张"-->
<!-- />-->
<count-item
label="今日接待人数"
:count="scenicStore.scenicQueueData.header.jrjdrs"
@@ -73,7 +73,7 @@
</div>
</div>
<div class="box-1 mr-8">
<Title1 title="停车信息" />
<Title1 title="停车信息（调试中）" />
<div class="flex">
<div class="height70 flex flex-1">
<circle-progress
@@ -87,7 +87,7 @@
/>
</div>
<div class="ml-20 flex flex-1 justify-between">
<count-item label="总车位数" :count="scenicStore.stopCarData.info.count" suffix="个" />
<count-item label="总停车场" :count="scenicStore.stopCarData.info.count" suffix="个" />
<count-item
label="剩余车位数"
:count="scenicStore.stopCarData.info.remain"
@@ -98,13 +98,13 @@
<div class="flex">
<div class="border mr-8 flex-1">
<div class="pt-10">
<Title3 title="今日景区车流量" />
<Title3 title="今日景区车流量（调试中）" />
</div>
<Line :width="360" :height="300" :data="carBearData" :xAxisData="carBearXAxisData" />
</div>
<div class="border flex-1">
<div class="pt-10">
<Title3 title="车辆归属地占比" />
<Title3 title="车辆归属地占比（调试中）" />
</div>
<PieRow
label="停车总数"
@@ -117,7 +117,7 @@
</div>
</div>
<div class="box-2">
<Title1 title="安全信息 " />
<Title1 title="安全信息（调试中） " />
<div class="count-box flex">
<count-item
v-for="item in scenicStore.secureData.headList"
@@ -130,7 +130,7 @@
</div>
<div class="border flex-1">
<div class="pt-10">
<Title3 title="异常告警占比" />
<Title3 title="异常告警占比（调试中）" />
</div>
<PieRow
label="告警总数"
@@ -144,7 +144,7 @@
</div>
<div class="flex mt-8">
<div class="box-3 mr-8">
<Title1 title="交通信息" />
<Title1 title="交通信息（调试中）" />
<div class="count-box flex">
<count-item
v-for="(item, index) in scenicStore.trafficData.infoList"
@@ -185,7 +185,6 @@
<div class="border mr-8 flex-1">
<Title3 title="年龄/性别占比" />
<age :list="scenicStore.userPortraitData.data.ageRate" />
<div class="count">总人数：<countup :end-val="ageTotal" /></div>
<div
class="cell pt-20"
v-for="(item, index) in scenicStore.userPortraitData.data.genderRate"
@@ -220,7 +219,6 @@
</div>
<div class="border flex-1">
<Title3 title="购票来源" />
<div class="count">总人数：<countup :end-val="channelTotal" /></div>
<TicketSource
:list="scenicStore.userPortraitData.data.channel"
:width="240"
@@ -239,8 +237,7 @@
<span>总数：</span>
<countup
:end-val="
scenicStore.carShipData.car.count?.drivingCount +
scenicStore.carShipData.car.count?.nonDrivingCount
scenicStore.carShipData.car.count?.drivingCount +scenicStore.carShipData.car.count?.nonDrivingCount
"
/>
</div>

97
src/views/traffic/components/box-1.vue
View File

@@ -34,61 +34,69 @@
<div class="chart-item">
<Title3 title="拥堵频次占比" />
<div class="chart__inner">
<spotRate
:dataList="chartData.roadNum"
:total="chartData.totalNum"
label="拥堵频次总数"
/>
<ul class="chart__legend">
<li class="chart__legend-item" v-for="(item, index) in chartData.roadNum" :key="index">
<p class="dot" :style="{ background: colors[index] }" />
<p class="name">{{ item.name }}</p>
<p class="value">{{ item.value }}%</p>
</li>
</ul>
<div>
<spotRate
:dataList="chartData.roadNum"
:total="chartData.totalNum"
label="拥堵频次总数"
/>
<ul class="chart__legend">
<li class="chart__legend-item" v-for="(item, index) in chartData.roadNum" :key="index">
<p class="dot" :style="{ background: colors[index] }" />
<p class="name">{{ item.name }}</p>
<p class="value">{{ item.value }}%</p>
</li>
</ul>
</div>
</div>
</div>
<div class="chart-item">
<Title3 title="拥堵时长占比" />
<div class="chart__inner">
<spotRate
:dataList="chartData.roadTime"
:total="chartData.totalTime"
label="拥堵总时长"
/>
<ul class="chart__legend">
<li class="chart__legend-item" v-for="(item, index) in chartData.roadTime" :key="index">
<p class="dot" :style="{ background: colors[index] }" />
<p class="name">{{ item.name }}</p>
<p class="value">{{ item.value }}%</p>
</li>
</ul>
<div>
<spotRate
:dataList="chartData.roadTime"
:total="chartData.totalTime"
label="拥堵总时长"
/>
<ul class="chart__legend">
<li class="chart__legend-item" v-for="(item, index) in chartData.roadTime" :key="index">
<p class="dot" :style="{ background: colors[index] }" />
<p class="name">{{ item.name }}</p>
<p class="value">{{ item.value }}%</p>
</li>
</ul>
</div>
</div>
</div>
<div class="chart-item">
<Title3 title="拥堵类型频次占比" />
<div class="chart__inner">
<spotRate :dataList="chartData.typeNum" :total="chartData.totalNum" label="拥堵总数" />
<ul class="chart__legend">
<li class="chart__legend-item" v-for="(item, index) in chartData.typeNum" :key="index">
<p class="dot" :style="{ background: colors[index] }" />
<p class="name">{{ item.name }}</p>
<p class="value">{{ item.value }}%</p>
</li>
</ul>
<div>
<spotRate :dataList="chartData.typeNum" :total="chartData.totalNum" label="拥堵总数" />
<ul class="chart__legend">
<li class="chart__legend-item" v-for="(item, index) in chartData.typeNum" :key="index">
<p class="dot" :style="{ background: colors[index] }" />
<p class="name">{{ item.name }}</p>
<p class="value">{{ item.value }}%</p>
</li>
</ul>
</div>
</div>
</div>
<div class="chart-item">
<Title3 title="拥堵类型时长占比" />
<div class="chart__inner">
<spotRate :dataList="chartData.typeTime" :total="chartData.totalTime" label="拥堵总数" />
<ul class="chart__legend">
<li class="chart__legend-item" v-for="(item, index) in chartData.typeTime" :key="index">
<p class="dot" :style="{ background: colors[index] }" />
<p class="name">{{ item.name }}</p>
<p class="value">{{ item.value }}%</p>
</li>
</ul>
<div>
<spotRate :dataList="chartData.typeTime" :total="chartData.totalTime" label="拥堵总数" />
<ul class="chart__legend">
<li class="chart__legend-item" v-for="(item, index) in chartData.typeTime" :key="index">
<p class="dot" :style="{ background: colors[index] }" />
<p class="name">{{ item.name }}</p>
<p class="value">{{ item.value }}%</p>
</li>
</ul>
</div>
</div>
</div>
</div>
@@ -140,7 +148,7 @@
<style lang="scss" scoped>
.box-1 {
margin-top: vh(120);
width: vw(826);
width: vw(626);
height: vh(950);
background: linear-gradient(321deg, #0b2f64 0%, #062b57 100%);
@@ -151,24 +159,23 @@
padding: 0 vw(8);
&-item {
width: vw(400);
width: vw(300);
background-image: url('@/assets/images/bg-3.png');
background-size: 100% 100%;
}
&__inner {
display: flex;
align-items: center;
justify-content: center;
height: vh(380);
}
&__legend {
flex: 1;
&-item {
position: relative;
width: 100%;
height: vh(40);
height: vh(30);
display: flex;
align-items: center;
margin-bottom: vh(8);

2
src/views/traffic/components/box-2.vue
View File

@@ -189,7 +189,7 @@
.traffic-map {
position: relative;
z-index: 9;
width: vw(1300);
width: vw(1500);
height: vh(955);
margin-left: vw(8);
box-sizing: border-box;

2
src/views/traffic/components/spotRate.vue
View File

@@ -101,6 +101,6 @@
<style scoped lang="scss">
.spotRate {
width: vw(200);
height: vh(320);
height: vh(260);
}
</style>