<!--
|
* @Author: qiminghui
|
* @Date: 2023-05-12 16:51:16
|
* @LastEditors: qiminghui
|
* @LastEditTime: 2023-05-12 20:11:17
|
* @FilePath: \bigScreen\src\components\riskMonitor\integrated\leftCharts\RiskAssessment.vue
|
* @Description:
|
*
|
* Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
|
-->
|
<template>
|
<div class="riskAssessmentContainer">
|
<div class="titles clearfix tc">
|
<div class="left fl">事故高发月份</div>
|
<div class="middle fl">评估得分</div>
|
<div class="right fl">事故高发类别</div>
|
</div>
|
<div class="main clearfix">
|
<div class="left fl">
|
<HighMonth />
|
</div>
|
<div class="middle fl">
|
<Score />
|
</div>
|
<div class="right fl">
|
<HighType />
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import HighMonth from "./HighMonth";
|
import Score from "./Score";
|
import HighType from "./HighType";
|
export default {
|
name: "riskAssessment",
|
components: {
|
HighMonth,
|
Score,
|
HighType,
|
},
|
data() {
|
return {};
|
},
|
methods: {},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.riskAssessmentContainer {
|
height: 100%;
|
padding: 110px 0 30px 30px;
|
box-sizing: border-box;
|
position: relative;
|
|
.left {
|
width: 230px;
|
height: 100%;
|
}
|
|
.middle {
|
width: 204px;
|
margin: 0 40px;
|
height: 100%;
|
}
|
|
.right {
|
width: 276px;
|
height: 100%;
|
}
|
|
.titles {
|
position: absolute;
|
top: 60px;
|
height: 50px;
|
line-height: 50px;
|
color: #fff;
|
font-size: 12px;
|
}
|
|
.main {
|
height: 100%;
|
background: no-repeat url("./dotBg.png");
|
background-size: auto 100%;
|
}
|
}
|
</style>
|
