<!-- 交通安全形势研判分析 -->
|
<template>
|
<RightTitle title="交通安全形势研判分析">
|
<template #top>
|
<div class="select-container flex">
|
<div class="item whitespace-no-wrap cursor-pointer" v-for="item in selectItems" :key="item.itemIndex">
|
{{ item.name }}
|
</div>
|
</div>
|
</template>
|
<template #content>
|
<div id="analysisChart"></div>
|
</template>
|
</RightTitle>
|
</template>
|
|
<script setup>
|
import RightTitle from "@/components/right-title";
|
import { ref } from 'vue';
|
|
const selectItems = ref([
|
{ itemIndex: 1, name: '时间统计', isActive: false },
|
{ itemIndex: 2, name: '街道统计', isActive: true },
|
]);
|
</script>
|
|
<style lang="scss" scoped>
|
.select-container {
|
flex-shrink: 0;
|
}
|
|
.item {
|
margin: 0 8px;
|
padding: 10px 14px;
|
font-size: 12px;
|
background: rgba(67, 102, 155, 0.4);
|
border: 1px solid rgba(47, 91, 157, 0.8);
|
flex-shrink: 0;
|
}
|
|
.item:last-child {
|
margin-right: 0;
|
}
|
</style>
|
