0626
This commit is contained in:
commit
e18f328bce
|
|
@ -110,3 +110,7 @@ export const videoStream=(param:any={})=>{
|
|||
export const getListCurrentMonth = (param: any = {}) => {
|
||||
return GET('/device/mevent/listCurrentMonth', param);
|
||||
}
|
||||
// 今日各监测点车流情况
|
||||
export const getPointTraffic=(param:any={})=>{
|
||||
return GET('/device/trafficFlow/pointTraffic',param)
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.4 KiB |
|
|
@ -18,7 +18,6 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
defineProps({
|
||||
pendingCount: {
|
||||
type: Number,
|
||||
|
|
|
|||
|
|
@ -41,41 +41,46 @@ const allEvents = ref<EventItem[]>([
|
|||
const formatTime = (time: string) => {
|
||||
return dayjs(time).format("YYYY-MM-DD HH:mm:ss");
|
||||
};
|
||||
onMounted(()=>{
|
||||
const endTime = dayjs().endOf('day').format('YYYY-MM-DD HH:mm:ss');
|
||||
const startTime = dayjs().subtract(6, 'day').startOf('day').format('YYYY-MM-DD HH:mm:ss');
|
||||
meventListHistory({startTime, endTime}).then((res)=>{
|
||||
console.log(res, 'rrreeesss')
|
||||
onMounted(() => {
|
||||
const endTime = dayjs().endOf("day").format("YYYY-MM-DD HH:mm:ss");
|
||||
const startTime = dayjs()
|
||||
.subtract(6, "day")
|
||||
.startOf("day")
|
||||
.format("YYYY-MM-DD HH:mm:ss");
|
||||
meventListHistory({ startTime, endTime }).then((res) => {
|
||||
console.log(res, "rrreeesss");
|
||||
allEvents.value = res.rows.map((item: any) => ({
|
||||
type: item.eventType,
|
||||
location: (item.direction === '1' ? '黄骅港方向 ' : item.direction === '2' ? '邯郸方向 ' : '') + item.pilenum,
|
||||
location:
|
||||
(item.direction === "1"
|
||||
? "黄骅港方向 "
|
||||
: item.direction === "2"
|
||||
? "邯郸方向 "
|
||||
: "") + item.pilenum,
|
||||
time: item.time,
|
||||
status: item.status == '0' ? '待处置' : '处置中',
|
||||
status: item.status == "0" ? "待处置" : "处置中",
|
||||
}));
|
||||
})
|
||||
})
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="event-task">
|
||||
<div v-for="(event, index) in allEvents"
|
||||
:key="index" class="event-section">
|
||||
<div v-for="(event, index) in allEvents" :key="index" class="event-section">
|
||||
<div class="section-header">
|
||||
<div style="color: #fbfbfc">{{event.type}}</div>
|
||||
<div style="color: #fbfbfc">{{ event.type }}</div>
|
||||
<div
|
||||
class="event-status"
|
||||
:class="{
|
||||
processing: event.status === '处置中',
|
||||
pending: event.status === '待处置'
|
||||
pending: event.status === '待处置',
|
||||
}"
|
||||
>
|
||||
{{ event.status }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="event-list">
|
||||
<div
|
||||
class="event-item"
|
||||
>
|
||||
<div class="event-item">
|
||||
<div class="event-info">
|
||||
<div class="location">{{ event.location }}</div>
|
||||
<div class="time">{{ formatTime(event.time) }}</div>
|
||||
|
|
|
|||
|
|
@ -16,6 +16,13 @@ const areaData = ref({
|
|||
unit: "m²",
|
||||
});
|
||||
|
||||
const props = defineProps({
|
||||
popUpContent: {
|
||||
type: Object,
|
||||
default: () => ({
|
||||
})
|
||||
}
|
||||
});
|
||||
// 车位数据
|
||||
const parkingData = ref([
|
||||
{ label: "充电车位", value: 1888 },
|
||||
|
|
@ -113,6 +120,7 @@ const togglePoint = async (point: any) => {
|
|||
}
|
||||
};
|
||||
onMounted(() => {
|
||||
console.log(props.popUpContent, 'ddddddddddddd')
|
||||
const endTime = dayjs().endOf('day').format('YYYY-MM-DD HH:mm:ss');
|
||||
getVideoDeviceList({ endTime: endTime, currentPage: 1, pageSize: 2 }).then((res) => { //暂时是公共的 先取两条
|
||||
console.log(res, 'rrrrrrrrrrrrrrrrrrrrrrrrrsssssssssssss')
|
||||
|
|
@ -136,9 +144,9 @@ onMounted(() => {
|
|||
<!-- 添加标题 -->
|
||||
<div class="title-header">
|
||||
<div class="header-icon">
|
||||
<div class="camera-square-small" title="服务区基本信息"></div>
|
||||
<div class="camera-square-small" title= "{{props.popUpContent.type}} 基本信息"></div>
|
||||
</div>
|
||||
<span>服务区基本信息</span>
|
||||
<span>{{props.popUpContent.type}}基本信息</span>
|
||||
</div>
|
||||
<!-- 状态内容 -->
|
||||
<div class="status-content">
|
||||
|
|
@ -148,19 +156,19 @@ onMounted(() => {
|
|||
<div class="corner-decoration bottom-right"></div>
|
||||
<div class="status-info">
|
||||
<div class="info-left">
|
||||
<img :src="fwqImage" alt="服务区" class="fwq-image" />
|
||||
<img :src=" props.popUpContent.fwqImage" alt="服务区" class="fwq-image" />
|
||||
</div>
|
||||
<div class="info-center">
|
||||
<span class="info-label">占地面积(m²)</span>
|
||||
<span class="info-label">{{ props.popUpContent.areaData.name1 }}</span>
|
||||
</div>
|
||||
<div class="info-right">
|
||||
<span class="info-value">{{ areaData.value }}</span>
|
||||
<span class="info-value">{{ props.popUpContent.areaData.value }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 添加车位信息展示 -->
|
||||
<div class="parking-info">
|
||||
<div v-for="(item, index) in parkingData" :key="index" class="parking-item">
|
||||
<div v-for="(item, index) in props.popUpContent.llist" :key="index" class="parking-item">
|
||||
<div class="parking-label">{{ item.label }}</div>
|
||||
<div class="parking-value">{{ item.value }}</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,8 +4,8 @@
|
|||
<div v-for="(stat, index) in statistics" :key="index" class="stat-card" style="position: relative;">
|
||||
<div
|
||||
class="box"
|
||||
@mouseenter="stat.label === '服务区' && (showDropdown = true)"
|
||||
@mouseleave="stat.label === '服务区' && (showDropdown = false)"
|
||||
@mouseenter="stat.label=='服务区'?showDropdown = true:stat.label==='收费站'?showDropdown1 = true:stat.label==='桥梁（座）'?showDropdown2 = true:stat.label==='枢纽互通（座）'?showDropdown3 = true:''"
|
||||
@mouseleave="stat.label=='服务区'?showDropdown = false:stat.label==='收费站'?showDropdown1 = false:stat.label==='桥梁（座）'?showDropdown2 = false:stat.label==='枢纽互通（座）'?showDropdown3 = false:''"
|
||||
style="position: relative;"
|
||||
>
|
||||
<div class="icon-wrapper">
|
||||
|
|
@ -33,7 +33,61 @@
|
|||
:key="area"
|
||||
@click="selectServiceArea(area)"
|
||||
>
|
||||
{{ area }}
|
||||
{{ area.name }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<!-- 收费站 -->
|
||||
<template v-if="stat.label === '收费站'">
|
||||
<div
|
||||
v-show="showDropdown1"
|
||||
class="dropdown large-dropdown"
|
||||
@mouseenter="showDropdown1 = true"
|
||||
@mouseleave="showDropdown1 = false"
|
||||
>
|
||||
<div
|
||||
class="dropdown-item"
|
||||
v-for="area in tollStationList"
|
||||
:key="area"
|
||||
@click="selectServiceArea(area)"
|
||||
>
|
||||
{{ area.name }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<!-- 桥梁 -->
|
||||
<template v-if="stat.label === '桥梁（座）'">
|
||||
<div
|
||||
v-show="showDropdown2"
|
||||
class="dropdown large-dropdown"
|
||||
@mouseenter="showDropdown2 = true"
|
||||
@mouseleave="showDropdown2 = false"
|
||||
>
|
||||
<div
|
||||
class="dropdown-item"
|
||||
v-for="area in bridgeList"
|
||||
:key="area"
|
||||
@click="selectServiceArea(area)"
|
||||
>
|
||||
{{ area.name }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<!-- 枢纽互通（座） -->
|
||||
<template v-if="stat.label === '枢纽互通（座）'">
|
||||
<div
|
||||
v-show="showDropdown3"
|
||||
class="dropdown large-dropdown"
|
||||
@mouseenter="showDropdown3 = true"
|
||||
@mouseleave="showDropdown3 = false"
|
||||
>
|
||||
<div
|
||||
class="dropdown-item"
|
||||
v-for="area in hubIntercommunicationList"
|
||||
:key="area"
|
||||
@click="selectServiceArea(area)"
|
||||
>
|
||||
{{ area.name }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -60,7 +114,7 @@
|
|||
<div class="close-btn" @click="closeDialog">×</div>
|
||||
</div>
|
||||
<div class="map-con">
|
||||
<RealTimeImageCenter />
|
||||
<RealTimeImageCenter :popUpContent="popUpContent"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="map-container bg-header bg-header-one" style="width: 1800px;" v-if="showDeviceInfo">
|
||||
|
|
@ -92,6 +146,7 @@
|
|||
import { ref, nextTick } from "vue";
|
||||
import { onMounted } from 'vue';
|
||||
import fee from "@/assets/img/fee.png";
|
||||
import fwq from "@/assets/img/fwq2.png";
|
||||
import km from "@/assets/img/km.png";
|
||||
import toll from "@/assets/img/toll.png";
|
||||
import RealTimeImageCenter from "./RealTimeImageCenter.vue";
|
||||
|
|
@ -102,6 +157,10 @@ import { getDeviceList } from "@/api/modules/index";
|
|||
import DeviceInfoComponentTwo from "./DeviceInfoComponentTwo.vue";
|
||||
import Map from "./map.vue"
|
||||
import { emitter } from '@/utils/eventBus';
|
||||
import fwqImage from "@/assets/img/fwq.png";
|
||||
import ql from "@/assets/img/ql.png";
|
||||
import sfz from "@/assets/img/sfz.png";
|
||||
import snht from "@/assets/img/snht.png";
|
||||
const showServiceArea = ref(false);
|
||||
const showMap = ref(true);
|
||||
const showDeviceInfo = ref(false);
|
||||
|
|
@ -110,13 +169,316 @@ const closeDialog = () => {
|
|||
showServiceArea.value = false;
|
||||
};
|
||||
const showDropdown = ref(false);
|
||||
const serviceAreas = ["南皮服务区", "东光服务区"];
|
||||
const selectedServiceArea = ref("南皮服务区");
|
||||
const showDropdown1 = ref(false);
|
||||
const showDropdown2 = ref(false);
|
||||
const showDropdown3 = ref(false);
|
||||
//服务区
|
||||
const serviceAreas =[{
|
||||
name:"南皮服务区",
|
||||
type:'服务区',
|
||||
fwqImage:fwqImage,
|
||||
areaData:{
|
||||
value: 6000,
|
||||
unit: "m²",
|
||||
name1:'占地面积(m²)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "充电车位", value: 1888 },
|
||||
{ label: "大型车位", value: 60 },
|
||||
{ label: "小型车位", value: 200 },
|
||||
{ label: "危险品车位", value: 20 },
|
||||
]},{
|
||||
name:"东光服务区",
|
||||
type:'服务区',
|
||||
fwqImage:fwqImage,
|
||||
areaData:{
|
||||
value: 6000,
|
||||
unit: "m²",
|
||||
name1:'占地面积(m²)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "充电车位", value: 1888 },
|
||||
{ label: "大型车位", value: 60 },
|
||||
{ label: "小型车位", value: 200 },
|
||||
{ label: "危险品车位", value: 20 }]
|
||||
}]
|
||||
const popUpContent= ref([])
|
||||
const selectedServiceArea = ref({});
|
||||
//收费站
|
||||
// const tollStationList = ["连镇", "找王", "寨子", "盐山", "盐山东"];
|
||||
|
||||
const tollStationList = [{
|
||||
name:"连镇",
|
||||
type:'收费站',
|
||||
fwqImage:sfz,
|
||||
areaData:{
|
||||
value: 1200,
|
||||
unit: "m²",
|
||||
name1:'建筑面积(m²)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "入口ETC车道", value: 2 },
|
||||
{ label: "出口ETC车道", value: 2 },
|
||||
{ label: "入口混合车道", value: 2 },
|
||||
{ label: "出口混合车道", value: 2 },
|
||||
]},{
|
||||
name:"找王",
|
||||
type:'收费站',
|
||||
fwqImage:sfz,
|
||||
areaData:{
|
||||
value: 1200,
|
||||
unit: "m²",
|
||||
name1:'建筑面积(m²)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "入口ETC车道", value: 2 },
|
||||
{ label: "出口ETC车道", value: 2 },
|
||||
{ label: "入口混合车道", value: 2 },
|
||||
{ label: "出口混合车道", value: 2 },
|
||||
]
|
||||
},{
|
||||
name:"寨子",
|
||||
type:'收费站',
|
||||
fwqImage:sfz,
|
||||
areaData:{
|
||||
value: 1200,
|
||||
unit: "m²",
|
||||
name1:'建筑面积(m²)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "入口ETC车道", value: 2 },
|
||||
{ label: "出口ETC车道", value: 2 },
|
||||
{ label: "入口混合车道", value: 2 },
|
||||
{ label: "出口混合车道", value: 2 },
|
||||
]
|
||||
},{
|
||||
name:"盐山",
|
||||
type:'收费站',
|
||||
fwqImage:sfz,
|
||||
areaData:{
|
||||
value: 1200,
|
||||
unit: "m²",
|
||||
name1:'建筑面积(m²)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "入口ETC车道", value: 1 },
|
||||
{ label: "出口ETC车道", value: 1 },
|
||||
{ label: "入口混合车道", value: 2 },
|
||||
{ label: "出口混合车道", value: 2 },
|
||||
]
|
||||
},{
|
||||
name:"盐山东",
|
||||
type:'收费站',
|
||||
fwqImage:sfz,
|
||||
areaData:{
|
||||
value: 1200,
|
||||
unit: "m²",
|
||||
name1:'建筑面积(m²)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "入口ETC车道", value: 2 },
|
||||
{ label: "出口ETC车道", value: 2 },
|
||||
{ label: "入口混合车道", value: 2 },
|
||||
{ label: "出口混合车道", value: 2 },
|
||||
]
|
||||
}];
|
||||
const tollStation = ref("连镇");
|
||||
//桥梁
|
||||
// const bridgeList = ["南运河特大桥", "秦庄村大桥", "宣惠河大桥", "沙河大桥", "龙王河大桥", "大单沟大桥", "大商平底渠大桥"];
|
||||
const bridgeList = [{
|
||||
name:"南运河特大桥",
|
||||
type:'桥梁（座）',
|
||||
fwqImage:ql,
|
||||
areaData:{
|
||||
value: 1003.838,
|
||||
unit: "m²",
|
||||
name1:'长度(m)（沧州境内）'
|
||||
},
|
||||
llist:[
|
||||
{ label: "中心桩号", value: 'K61+407' },
|
||||
]
|
||||
},{
|
||||
name:"秦庄村大桥",
|
||||
type:'桥梁（座）',
|
||||
fwqImage:ql,
|
||||
areaData:{
|
||||
value:577.543,
|
||||
unit: "m²",
|
||||
name1:'长度(m)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "中心桩号", value: 'K62+401' },
|
||||
]
|
||||
},{
|
||||
name:"宣惠河大桥",
|
||||
type:'桥梁（座）',
|
||||
fwqImage:ql,
|
||||
areaData:{
|
||||
value:702,
|
||||
unit: "m²",
|
||||
name1:'长度(m)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "中心桩号", value: 'K65+716' },
|
||||
]
|
||||
},{
|
||||
name:"沙河大桥",
|
||||
type:'桥梁（座）',
|
||||
fwqImage:ql,
|
||||
areaData:{
|
||||
value:131,
|
||||
unit: "m²",
|
||||
name1:'长度(m)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "中心桩号", value: 'K76+079' },
|
||||
]
|
||||
},{
|
||||
name:"龙王河大桥",
|
||||
type:'桥梁（座）',
|
||||
fwqImage:ql,
|
||||
areaData:{
|
||||
value:156,
|
||||
unit: "m²",
|
||||
name1:'长度(m)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "中心桩号", value: 'K90+280' },
|
||||
]
|
||||
},{
|
||||
name:"大单沟大桥",
|
||||
type:'桥梁（座）',
|
||||
fwqImage:ql,
|
||||
areaData:{
|
||||
value:127,
|
||||
unit: "m²",
|
||||
name1:'长度(m)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "中心桩号", value: 'K96+099' },
|
||||
]
|
||||
},{
|
||||
name:"大商平底渠大桥",
|
||||
type:'桥梁（座）',
|
||||
fwqImage:ql,
|
||||
areaData:{
|
||||
value:106,
|
||||
unit: "m²",
|
||||
name1:'长度(m)'
|
||||
},
|
||||
llist:[
|
||||
{ label: "中心桩号", value: 'K114+265' },
|
||||
]
|
||||
}];
|
||||
const bridge1 = ref("南运河特大桥");
|
||||
//枢纽互通
|
||||
// const hubIntercommunicationList = ["连镇互通", "大屯枢纽", "找王互通", "寨子互通", "小庄枢纽", "盐山互通", "盐山东互通"];
|
||||
const hubIntercommunicationList = [{
|
||||
name:"连镇互通",
|
||||
type:'枢纽互通',
|
||||
fwqImage:snht,
|
||||
areaData:{
|
||||
value:'K64+776',
|
||||
unit: "m²",
|
||||
name1:'桩号'
|
||||
},
|
||||
llist:[
|
||||
{ label: "被交路名称", value: 'G105(京澳线)' },
|
||||
{ label: "被交路等级", value: '一级公路' },
|
||||
]
|
||||
},{
|
||||
name:"大屯枢纽",
|
||||
type:'枢纽互通',
|
||||
fwqImage:snht,
|
||||
areaData:{
|
||||
value:'K69+454',
|
||||
unit: "m²",
|
||||
name1:'桩号'
|
||||
},
|
||||
llist:[
|
||||
{ label: "被交路名称", value: '京台高速' },
|
||||
{ label: "被交路等级", value: '高速公路' },
|
||||
]
|
||||
},{
|
||||
name:"找王互通",
|
||||
type:'枢纽互通',
|
||||
fwqImage:snht,
|
||||
areaData:{
|
||||
value:'K80+359',
|
||||
unit: "m²",
|
||||
name1:'桩号'
|
||||
},
|
||||
llist:[
|
||||
{ label: "被交路名称", value: 'S337(辛平线)' },
|
||||
{ label: "被交路等级", value: '一级公路' },
|
||||
]
|
||||
},{
|
||||
name:"寨子互通",
|
||||
type:'枢纽互通',
|
||||
fwqImage:snht,
|
||||
areaData:{
|
||||
value:'K80+359',
|
||||
unit: "m²",
|
||||
name1:'桩号'
|
||||
},
|
||||
llist:[
|
||||
{ label: "被交路名称", value: 'G104(京平线)' },
|
||||
{ label: "被交路等级", value: '二级公路' },
|
||||
]
|
||||
},{
|
||||
name:"小庄枢纽",
|
||||
type:'枢纽互通',
|
||||
fwqImage:snht,
|
||||
areaData:{
|
||||
value:'K119+655',
|
||||
unit: "m²",
|
||||
name1:'桩号'
|
||||
},
|
||||
llist:[
|
||||
{ label: "被交路名称", value: '京沪高速' },
|
||||
{ label: "被交路等级", value: '高速公路' },
|
||||
]
|
||||
},{
|
||||
name:"盐山互通",
|
||||
type:'枢纽互通',
|
||||
fwqImage:snht,
|
||||
areaData:{
|
||||
value:'S216(吕千线)',
|
||||
unit: "m²",
|
||||
name1:'桩号'
|
||||
},
|
||||
llist:[
|
||||
{ label: "被交路名称", value: 'S216(吕千线)' },
|
||||
{ label: "被交路等级", value: '一级公路' },
|
||||
]
|
||||
},{
|
||||
name:"盐山东互通",
|
||||
type:'枢纽互通',
|
||||
fwqImage:snht,
|
||||
areaData:{
|
||||
value:'K139+358',
|
||||
unit: "m²",
|
||||
name1:'桩号'
|
||||
},
|
||||
llist:[
|
||||
{ label: "被交路名称", value: 'G205(山深线)' },
|
||||
{ label: "被交路等级", value: '一级公路' },
|
||||
]
|
||||
}];
|
||||
const hubIntercommunication = ref("连镇互通");
|
||||
|
||||
function selectServiceArea(area) {
|
||||
selectedServiceArea.value = area;
|
||||
console.log(area, 'tttttttttt')
|
||||
selectedServiceArea.value = area.name;
|
||||
popUpContent.value = area
|
||||
tollStation.value = area;
|
||||
bridge1.value = area;
|
||||
hubIntercommunication.value = area;
|
||||
showServiceArea.value = true;
|
||||
showDropdown.value = false;
|
||||
showDropdown1.value = false;
|
||||
showDropdown2.value = false;
|
||||
showDropdown3.value = false;
|
||||
}
|
||||
// 统计数据配置
|
||||
const statistics = ref([
|
||||
|
|
@ -131,7 +493,7 @@ const statistics = ref([
|
|||
label: "收费站",
|
||||
},
|
||||
{
|
||||
image: fee,
|
||||
image: fwq,
|
||||
value: "2",
|
||||
label: "服务区",
|
||||
},
|
||||
|
|
@ -143,7 +505,7 @@ const statistics = ref([
|
|||
{
|
||||
image: hub,
|
||||
value: "7",
|
||||
label: "隧道互通（座）",
|
||||
label: "枢纽互通（座）",
|
||||
},
|
||||
]);
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,11 @@ import eqm3Default from "@/assets/img/eqm/eqm3.png";
|
|||
import eqm3Active from "@/assets/img/eqm/eqm3_active.png";
|
||||
import eqm4Default from "@/assets/img/eqm/eqm4.png";
|
||||
import eqm4Active from "@/assets/img/eqm/eqm4_active.png";
|
||||
import { todayTrafficCount, trafficTrend } from "@/api/modules/index";
|
||||
import {
|
||||
todayTrafficCount,
|
||||
trafficTrend,
|
||||
getPointTraffic,
|
||||
} from "@/api/modules/index";
|
||||
import { update } from "lodash-es";
|
||||
// 车流量数据
|
||||
const trafficData = {
|
||||
|
|
@ -37,20 +41,37 @@ const trafficData = {
|
|||
};
|
||||
|
||||
// 监测点车流数据
|
||||
const monitoringPointsData = reactive({
|
||||
points: [
|
||||
{ name: "连镇", weeklyAvg: 19500, dailyTotal: 16500 },
|
||||
{ name: "扬王", weeklyAvg: 12000, dailyTotal: 14500 },
|
||||
{ name: "小庄", weeklyAvg: 10800, dailyTotal: 12300 },
|
||||
{ name: "寨子", weeklyAvg: 21500, dailyTotal: 26800 },
|
||||
{ name: "盐山", weeklyAvg: 19700, dailyTotal: 22000 },
|
||||
],
|
||||
});
|
||||
const monitoringPointsData = ref([]);
|
||||
|
||||
// 交通流量趋势数据
|
||||
const trafficTrendData = reactive({
|
||||
hours: ["00:00","01:00","02:00","03:00", "04:00","05:00","06:00","07:00", "08:00", "09:00", "10:00", "11:00","12:00",
|
||||
"13:00","14:00","15:00","16:00", "17:00","18:00","19:00","20:00","21:00","22:00","23:00", "24:00"],
|
||||
hours: [
|
||||
"00:00",
|
||||
"01:00",
|
||||
"02:00",
|
||||
"03:00",
|
||||
"04:00",
|
||||
"05:00",
|
||||
"06:00",
|
||||
"07:00",
|
||||
"08:00",
|
||||
"09:00",
|
||||
"10:00",
|
||||
"11:00",
|
||||
"12:00",
|
||||
"13:00",
|
||||
"14:00",
|
||||
"15:00",
|
||||
"16:00",
|
||||
"17:00",
|
||||
"18:00",
|
||||
"19:00",
|
||||
"20:00",
|
||||
"21:00",
|
||||
"22:00",
|
||||
"23:00",
|
||||
"24:00",
|
||||
],
|
||||
realTimeValues: [],
|
||||
averageValues: [],
|
||||
});
|
||||
|
|
@ -186,37 +207,56 @@ const chartOptions: EChartsOption = {
|
|||
},
|
||||
],
|
||||
};
|
||||
const chartShow = ref(false);
|
||||
const chartShow2 = ref(false);
|
||||
|
||||
// 初始化图表
|
||||
const { initCharts, setOptions } = useCharts(chartRef, chartOptions);
|
||||
// 获取当前日期并格式化为 YYYY-MM-DD
|
||||
const today = new Date();
|
||||
const year = today.getFullYear();
|
||||
const month = String(today.getMonth() + 1).padStart(2, '0'); // 月份从 0 开始
|
||||
const day = String(today.getDate()).padStart(2, '0');
|
||||
const month = String(today.getMonth() + 1).padStart(2, "0"); // 月份从 0 开始
|
||||
const day = String(today.getDate()).padStart(2, "0");
|
||||
|
||||
const todayTime = ref(`${year}-${month}-${day}`);
|
||||
// 确保图表在组件挂载后渲染
|
||||
onMounted(async () => {
|
||||
let dataMap = {
|
||||
today: todayTime.value,
|
||||
};
|
||||
const ress = await getPointTraffic(dataMap);
|
||||
monitoringPointsData.value = ress.data || [];
|
||||
chartShow.value = true;
|
||||
initCharts();
|
||||
|
||||
try {
|
||||
const query = {
|
||||
todayTime: todayTime.value
|
||||
todayTime: todayTime.value,
|
||||
};
|
||||
const res = await todayTrafficCount(query);
|
||||
if (res.data) {
|
||||
res.data.forEach((item) => {
|
||||
if (item.vehicleType == 1) { //小车
|
||||
if (item.vehicleType == 1) {
|
||||
//小车
|
||||
trafficData.car.value = item.vehicleCount;
|
||||
trafficData.car.percentage = item.percentage;
|
||||
} else if (item.vehicleType == 2) { //货车
|
||||
// alert(trafficData.car.percentage);
|
||||
// this.$forceUpdate(); // 直接调用
|
||||
} else if (item.vehicleType == 2) {
|
||||
//货车
|
||||
trafficData.truck.value = item.vehicleCount;
|
||||
trafficData.truck.percentage = item.percentage;
|
||||
} else if (item.vehicleType == 3) { //客车
|
||||
} else if (item.vehicleType == 3) {
|
||||
//客车
|
||||
trafficData.bus.value = item.vehicleCount;
|
||||
trafficData.bus.percentage = item.percentage;
|
||||
}
|
||||
trafficData.total = item.total;
|
||||
})
|
||||
});
|
||||
|
||||
chartShow2.value = true;
|
||||
// this.$forceUpdate();
|
||||
// this.$forceUpdate();
|
||||
// console.log(trafficData, 'trafficData')
|
||||
}
|
||||
chartOptions.series[0].data = [
|
||||
|
|
@ -278,16 +318,18 @@ onMounted(async () => {
|
|||
|
||||
// 调用 setOptions 方法重新渲染图表
|
||||
setOptions(chartOptions);
|
||||
trafficTrend({today: '2025-05-30', pileNum: ''}).then((res) => {
|
||||
console.log(res, '///////////////////')
|
||||
trafficTrend({ today: "2025-05-30", pileNum: "" }).then((res) => {
|
||||
console.log(res, "///////////////////");
|
||||
if (res.code == 200) {
|
||||
// 清空原有数据
|
||||
trafficTrendData.realTimeValues = [];
|
||||
trafficTrendData.averageValues = [];
|
||||
|
||||
trafficTrendData.realTimeValues = [...res.data.map(item => item.total)];
|
||||
trafficTrendData.averageValues = [...res.data.map(item => item.avg)];
|
||||
console.log(trafficTrendData, 'trafficTrendData')
|
||||
trafficTrendData.realTimeValues = [
|
||||
...res.data.map((item) => item.total),
|
||||
];
|
||||
trafficTrendData.averageValues = [...res.data.map((item) => item.avg)];
|
||||
console.log(trafficTrendData, "trafficTrendData");
|
||||
// // 可选：重新渲染图表
|
||||
// trendChartInstance.setOption({
|
||||
// series: [{
|
||||
|
|
@ -297,11 +339,10 @@ onMounted(async () => {
|
|||
// }]
|
||||
// });
|
||||
}
|
||||
})
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("请求设备列表失败:", error);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// 趋势图时间范围选项
|
||||
|
|
@ -321,38 +362,43 @@ const handleTimeRangeChange = (event: Event) => {
|
|||
// 这里可以添加切换时间范围的逻辑
|
||||
};
|
||||
const items = ref([
|
||||
{
|
||||
{
|
||||
defaultImg: eqm1Default,
|
||||
activeImg: eqm1Active,
|
||||
isActive: true, // 默认选中
|
||||
type: '44', //
|
||||
type: "44", //
|
||||
},
|
||||
{
|
||||
defaultImg: eqm2Default,
|
||||
activeImg: eqm2Active,
|
||||
isActive: true,
|
||||
type: '22', // 视频监控
|
||||
type: "22", // 视频监控
|
||||
},
|
||||
{
|
||||
defaultImg: eqm3Default,
|
||||
activeImg: eqm3Active,
|
||||
isActive: true,
|
||||
type: '53', // 广播
|
||||
type: "53", // 广播
|
||||
},
|
||||
{
|
||||
defaultImg: eqm4Default,
|
||||
activeImg: eqm4Active,
|
||||
isActive: true,
|
||||
type: '15', // 情报板
|
||||
type: "15", // 情报板
|
||||
},
|
||||
]);
|
||||
|
||||
const toggleSelection = (index: number) => {
|
||||
items.value[index].isActive = !items.value[index].isActive;
|
||||
// 通知地图组件切换显示/隐藏
|
||||
window.dispatchEvent(new CustomEvent('toggle-map-device', {
|
||||
detail: { type: items.value[index].type, show: items.value[index].isActive }
|
||||
}));
|
||||
window.dispatchEvent(
|
||||
new CustomEvent("toggle-map-device", {
|
||||
detail: {
|
||||
type: items.value[index].type,
|
||||
show: items.value[index].isActive,
|
||||
},
|
||||
})
|
||||
);
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -370,28 +416,43 @@ const toggleSelection = (index: number) => {
|
|||
<div class="vehicle-item">
|
||||
<div class="vehicle-info">
|
||||
<span class="vehicle-name">小型车</span>
|
||||
<span class="percentage">{{ trafficData.car.percentage }}%</span>
|
||||
<span class="percentage" v-if="chartShow2"
|
||||
>{{ trafficData.car.percentage }}%</span
|
||||
>
|
||||
</div>
|
||||
<div class="vehicle-value car">
|
||||
<count-up :end-val="trafficData.car.value" :options="countupOptions" />
|
||||
<count-up
|
||||
:end-val="trafficData.car.value"
|
||||
:options="countupOptions"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vehicle-item">
|
||||
<div class="vehicle-info">
|
||||
<span class="vehicle-name">货车</span>
|
||||
<span class="percentage">{{ trafficData.truck.percentage }}%</span>
|
||||
<span class="percentage"
|
||||
>{{ trafficData.truck.percentage }}%</span
|
||||
>
|
||||
</div>
|
||||
<div class="vehicle-value truck">
|
||||
<count-up :end-val="trafficData.truck.value" :options="countupOptions" />
|
||||
<count-up
|
||||
:end-val="trafficData.truck.value"
|
||||
:options="countupOptions"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vehicle-item">
|
||||
<div class="vehicle-info">
|
||||
<span class="vehicle-name">客车</span>
|
||||
<span class="percentage">{{ trafficData.bus.percentage }}%</span>
|
||||
<span class="percentage"
|
||||
>{{ trafficData.bus.percentage }}%</span
|
||||
>
|
||||
</div>
|
||||
<div class="vehicle-value bus">
|
||||
<count-up :end-val="trafficData.bus.value" :options="countupOptions" />
|
||||
<count-up
|
||||
:end-val="trafficData.bus.value"
|
||||
:options="countupOptions"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -409,15 +470,26 @@ const toggleSelection = (index: number) => {
|
|||
<div class="traffic-flow-item">
|
||||
<div class="item-title">今日各监测点车流情况</div>
|
||||
<div class="item-content">
|
||||
<monitoring-points-chart :data="monitoringPointsData.points"></monitoring-points-chart>
|
||||
<monitoring-points-chart
|
||||
:data="monitoringPointsData"
|
||||
v-if="chartShow"
|
||||
></monitoring-points-chart>
|
||||
</div>
|
||||
</div>
|
||||
<div class="traffic-flow-item">
|
||||
<div class="item-title">
|
||||
交通流量趋势
|
||||
<div class="dropdown-container">
|
||||
<select v-model="selectedTimeRange" @change="handleTimeRangeChange" class="custom-select">
|
||||
<option v-for="option in timeRangeOptions" :key="option.value" :value="option.value">
|
||||
<select
|
||||
v-model="selectedTimeRange"
|
||||
@change="handleTimeRangeChange"
|
||||
class="custom-select"
|
||||
>
|
||||
<option
|
||||
v-for="option in timeRangeOptions"
|
||||
:key="option.value"
|
||||
:value="option.value"
|
||||
>
|
||||
{{ option.label }}
|
||||
</option>
|
||||
</select>
|
||||
|
|
@ -427,12 +499,20 @@ const toggleSelection = (index: number) => {
|
|||
<traffic-trend-chart :data="trafficTrendData"></traffic-trend-chart>
|
||||
</div>
|
||||
<div class="eqmMange">
|
||||
<div v-for="(item, index) in items" :key="index" class="eqm-item" :class="{ active: item.isActive }"
|
||||
<div
|
||||
v-for="(item, index) in items"
|
||||
:key="index"
|
||||
class="eqm-item"
|
||||
:class="{ active: item.isActive }"
|
||||
@click="toggleSelection(index)"
|
||||
:style="{ backgroundImage: `url(${item.isActive ? item.activeImg : item.defaultImg})` }"></div>
|
||||
:style="{
|
||||
backgroundImage: `url(${
|
||||
item.isActive ? item.activeImg : item.defaultImg
|
||||
})`,
|
||||
}"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -544,16 +624,16 @@ const toggleSelection = (index: number) => {
|
|||
&.car {
|
||||
border-radius: 8px 8px 8px 8px;
|
||||
background: rgba(253, 187, 103, 0.1);
|
||||
color: #FDBB67;
|
||||
color: #fdbb67;
|
||||
}
|
||||
|
||||
&.truck {
|
||||
color: #59A2FC;
|
||||
color: #59a2fc;
|
||||
background-color: rgba(0, 200, 255, 0.1);
|
||||
}
|
||||
|
||||
&.bus {
|
||||
color: #00FFFF;
|
||||
color: #00ffff;
|
||||
background-color: rgba(0, 255, 255, 0.1);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,28 +1,23 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, reactive, onMounted, defineProps } from "vue";
|
||||
import { ref, reactive, onMounted, defineProps, nextTick } from "vue";
|
||||
import useCharts from "@/hooks/useEcharts";
|
||||
import type { EChartsOption } from "echarts";
|
||||
|
||||
import { getPointTraffic } from "@/api/modules/index";
|
||||
// import { nextTick } from "process";
|
||||
// 定义数据点类型接口
|
||||
interface Point {
|
||||
name: string;
|
||||
weeklyAvg: number;
|
||||
dailyTotal: number;
|
||||
scope: string;
|
||||
totalTraffic: number;
|
||||
weekAvg: number;
|
||||
}
|
||||
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Array as () => Point[],
|
||||
default: () => [
|
||||
{ name: "连镇", weeklyAvg: 19500, dailyTotal: 16500 },
|
||||
{ name: "扬王", weeklyAvg: 12000, dailyTotal: 14500 },
|
||||
{ name: "小庄", weeklyAvg: 10800, dailyTotal: 12300 },
|
||||
{ name: "寨子", weeklyAvg: 21500, dailyTotal: 26800 },
|
||||
{ name: "盐山", weeklyAvg: 19700, dailyTotal: 22000 },
|
||||
],
|
||||
default: () => [],
|
||||
},
|
||||
});
|
||||
|
||||
const data = ref([]);
|
||||
// 图表容器引用
|
||||
const chartRef = ref<HTMLElement | null>(null);
|
||||
|
||||
|
|
@ -59,7 +54,7 @@ const chartOptions: EChartsOption = {
|
|||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
data: props.data.map((point: Point) => point.name),
|
||||
data: props.data.map((point: Point) => point.scope),
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#1e3d6f",
|
||||
|
|
@ -86,7 +81,7 @@ const chartOptions: EChartsOption = {
|
|||
color: "#fff",
|
||||
fontSize: 22,
|
||||
},
|
||||
max: 30000,
|
||||
// max: 30000,
|
||||
},
|
||||
series: [
|
||||
{
|
||||
|
|
@ -111,7 +106,7 @@ const chartOptions: EChartsOption = {
|
|||
],
|
||||
},
|
||||
},
|
||||
data: props.data.map((point: Point) => point.weeklyAvg),
|
||||
data: props.data.map((point: Point) => point.weekAvg),
|
||||
},
|
||||
{
|
||||
name: "当日累计",
|
||||
|
|
@ -135,7 +130,7 @@ const chartOptions: EChartsOption = {
|
|||
],
|
||||
},
|
||||
},
|
||||
data: props.data.map((point: Point) => point.dailyTotal),
|
||||
data: props.data.map((point: Point) => point.totalTraffic),
|
||||
},
|
||||
],
|
||||
};
|
||||
|
|
|
|||
|
|
@ -3,13 +3,19 @@ import { ref, onMounted, computed } from "vue";
|
|||
import EventStatus from "./EventStatus.vue";
|
||||
import EventTask from "./EventTask.vue";
|
||||
import RealTimeImage from "./RealTimeImage.vue";
|
||||
import { weatherForecast, weatherHourly, todayStatusCount, todayHourly, getDictData } from "@/api/modules/index";
|
||||
import { useTodayTime, } from "@/utils/packge";
|
||||
import {
|
||||
weatherForecast,
|
||||
weatherHourly,
|
||||
todayStatusCount,
|
||||
todayHourly,
|
||||
getDictData,
|
||||
} from "@/api/modules/index";
|
||||
import { useTodayTime } from "@/utils/packge";
|
||||
|
||||
const { todayTime, getTodayTime } = useTodayTime();
|
||||
// 模拟数据，实际项目中可能需要从API获取
|
||||
const pendingCount = ref<string>('');
|
||||
const processingCount = ref<string>('');
|
||||
const pendingCount = ref<string>("");
|
||||
const processingCount = ref<string>("");
|
||||
const serviceArea = ref<any[]>([]);
|
||||
const Hub = ref<any[]>([]);
|
||||
const Intercommunication = ref<any[]>([]);
|
||||
|
|
@ -30,38 +36,46 @@ const areaTypes = ref([
|
|||
|
||||
// 切换区域类型选中状态
|
||||
const toggleAreaType = (id: string) => {
|
||||
areaTypes.value.forEach((type) => {
|
||||
areaTypes.value.forEach((type) => {
|
||||
type.selected = type.id === id;
|
||||
});
|
||||
};
|
||||
onMounted(()=>{
|
||||
todayStatusCount({todayTime: todayTime.value}).then((res: any) => {
|
||||
if(res.code === 200){
|
||||
res.data.forEach((item: any) => {
|
||||
if(item.status == '0'){ //待处理
|
||||
pendingCount.value = item.count || 0
|
||||
} else if(item.status == '2'){ //处置中
|
||||
processingCount.value = item.count || 0
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
getDictData("hb_service_area").then((res: any) => { //服务区
|
||||
if (res.code === 200) {
|
||||
serviceArea.value = res.data || [];
|
||||
}
|
||||
});
|
||||
getDictData("hb_hub").then((res: any) => { //枢纽
|
||||
if (res.code === 200) {
|
||||
Hub.value = res.data || [];
|
||||
}
|
||||
});
|
||||
getDictData("hb_interchange").then((res: any) => { //互通
|
||||
if (res.code === 200) {
|
||||
Intercommunication.value = res.data || [];
|
||||
}
|
||||
});
|
||||
})
|
||||
onMounted(() => {
|
||||
todayStatusCount({ todayTime: todayTime.value }).then((res: any) => {
|
||||
// alert(".............");
|
||||
// alert(JSON.stringify(res.data));
|
||||
if (res.code === 200) {
|
||||
res.data.forEach((item: any) => {
|
||||
if (item.status == "0") {
|
||||
//待处理
|
||||
pendingCount.value = item.count || 0;
|
||||
// alert(pendingCount.value);
|
||||
} else if (item.status == "2") {
|
||||
//处置中
|
||||
processingCount.value = item.count || 0;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
getDictData("hb_service_area").then((res: any) => {
|
||||
//服务区
|
||||
if (res.code === 200) {
|
||||
serviceArea.value = res.data || [];
|
||||
}
|
||||
});
|
||||
getDictData("hb_hub").then((res: any) => {
|
||||
//枢纽
|
||||
if (res.code === 200) {
|
||||
Hub.value = res.data || [];
|
||||
}
|
||||
});
|
||||
getDictData("hb_interchange").then((res: any) => {
|
||||
//互通
|
||||
if (res.code === 200) {
|
||||
Intercommunication.value = res.data || [];
|
||||
}
|
||||
});
|
||||
});
|
||||
const currentAreaList = computed(() => {
|
||||
const selectedType = areaTypes.value.find((type) => type.selected);
|
||||
if (selectedType?.id === "service") {
|
||||
|
|
|
|||
|
|
@ -8,35 +8,34 @@
|
|||
*/
|
||||
|
||||
/// <reference types="vite/client" />
|
||||
import type { UserConfig, ConfigEnv } from 'vite';
|
||||
import { defineConfig, loadEnv } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import type { UserConfig, ConfigEnv } from "vite";
|
||||
import { defineConfig, loadEnv } from "vite";
|
||||
import vue from "@vitejs/plugin-vue";
|
||||
import { resolve } from "path";
|
||||
import AutoImport from 'unplugin-auto-import/vite'
|
||||
import Components from 'unplugin-vue-components/vite'
|
||||
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
|
||||
import AutoImport from "unplugin-auto-import/vite";
|
||||
import Components from "unplugin-vue-components/vite";
|
||||
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
|
||||
//https://github.com/element-plus/unplugin-element-plus/blob/HEAD/README.zh-CN.md
|
||||
import ElementPlus from 'unplugin-element-plus/vite'
|
||||
import {createHtmlPlugin} from 'vite-plugin-html';
|
||||
import ElementPlus from "unplugin-element-plus/vite";
|
||||
import { createHtmlPlugin } from "vite-plugin-html";
|
||||
export default defineConfig(({ command, mode }: ConfigEnv): UserConfig => {
|
||||
|
||||
const viteEnv = loadEnv(mode, process.cwd());
|
||||
|
||||
return {
|
||||
base: '/',
|
||||
base: "/",
|
||||
plugins: [
|
||||
vue(),
|
||||
AutoImport({ resolvers: [ElementPlusResolver()] }),
|
||||
Components({ resolvers: [ElementPlusResolver()] }),
|
||||
ElementPlus(),
|
||||
createHtmlPlugin({
|
||||
inject: {
|
||||
data: {
|
||||
injectMapScript: `<script src="./public/static/map_load.js"></script>`,
|
||||
},
|
||||
},
|
||||
minify: true,
|
||||
}),
|
||||
inject: {
|
||||
data: {
|
||||
injectMapScript: `<script src="./public/static/map_load.js"></script>`,
|
||||
},
|
||||
},
|
||||
minify: true,
|
||||
}),
|
||||
// Compression({
|
||||
// algorithm: 'gzip',
|
||||
// test: /\.(js|css|html|json|svg|jpe?g|png|gif)$/i,
|
||||
|
|
@ -47,32 +46,37 @@ export default defineConfig(({ command, mode }: ConfigEnv): UserConfig => {
|
|||
],
|
||||
publicDir: "public",
|
||||
build: {
|
||||
outDir: 'dist',
|
||||
assetsDir: 'static'
|
||||
outDir: "dist",
|
||||
assetsDir: "static",
|
||||
},
|
||||
server: {
|
||||
host: '0.0.0.0',
|
||||
host: "0.0.0.0",
|
||||
port: 8080,
|
||||
open: true,
|
||||
strictPort: false,
|
||||
proxy: {
|
||||
[viteEnv.VITE_APP_CONTROL_BASE_API]: {
|
||||
target: 'http://172.16.1.133:8081/xjIotApi',
|
||||
target: "http://172.16.1.128:8090/xjIotApi",
|
||||
changeOrigin: true,
|
||||
rewrite: (path) => path.replace(new RegExp(`^${viteEnv.VITE_APP_CONTROL_BASE_API}`), ''),
|
||||
rewrite: (path) =>
|
||||
path.replace(
|
||||
new RegExp(`^${viteEnv.VITE_APP_CONTROL_BASE_API}`),
|
||||
""
|
||||
),
|
||||
},
|
||||
[viteEnv.VITE_APP_BASE_API]: {
|
||||
target: 'http://172.16.1.128:8090/iotApi',
|
||||
target: "http://172.16.1.128:8090/iotApi",
|
||||
changeOrigin: true,
|
||||
rewrite: (path) => path.replace(new RegExp(`^${viteEnv.VITE_APP_BASE_API}`), ''),
|
||||
}
|
||||
rewrite: (path) =>
|
||||
path.replace(new RegExp(`^${viteEnv.VITE_APP_BASE_API}`), ""),
|
||||
},
|
||||
},
|
||||
},
|
||||
resolve: {
|
||||
alias: {
|
||||
"@": resolve(__dirname, "./src"),
|
||||
"components": resolve(__dirname, "./src/components"),
|
||||
"api": resolve(__dirname, "./src/api")
|
||||
components: resolve(__dirname, "./src/components"),
|
||||
api: resolve(__dirname, "./src/api"),
|
||||
},
|
||||
},
|
||||
css: {
|
||||
|
|
@ -81,6 +85,6 @@ export default defineConfig(({ command, mode }: ConfigEnv): UserConfig => {
|
|||
additionalData: `@use "./src/assets/css/variable.scss" as *;`,
|
||||
},
|
||||
},
|
||||
}
|
||||
},
|
||||
};
|
||||
});
|
||||
Loading…
Reference in New Issue