You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
52 lines
1.2 KiB
52 lines
1.2 KiB
<template>
|
|
<div class='roadNet'>
|
|
<div class="summary">
|
|
<div class="unit" v-for="item in summary">
|
|
<p class="p01">
|
|
{{ item.dataAll.title }}<em class="blue">{{ item.dataAll.value }}</em><span>{{ item.dataAll.unit }}</span>
|
|
</p>
|
|
<p class="p02">
|
|
{{ item.dataGreen.title }}<em class="green">{{ item.dataGreen.value }}</em><span>{{ item.dataGreen.unit }}</span>
|
|
{{ item.dataRed.title }}<em class="red">{{ item.dataRed.value }}</em><span>{{ item.dataRed.unit }}</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
|
|
export default {
|
|
name: 'dataVRoadNet',
|
|
data(){
|
|
return {
|
|
summary:[]
|
|
}
|
|
},
|
|
components: {
|
|
},
|
|
mounted(){
|
|
this.initData();
|
|
},
|
|
methods: {
|
|
initData() {
|
|
this.summary = [
|
|
{
|
|
|
|
}
|
|
]
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang='scss' scoped>
|
|
.roadNet{
|
|
.summary{
|
|
display: flex; justify-content: space-between;
|
|
.unit{ border-left: 2px solid #00D1FF; background: linear-gradient( 180deg, rgba(6,66,88,0) 0%, #064258 93%);}
|
|
}
|
|
}
|
|
</style>
|
|
|