<template>
|
<div id="warp">
|
<el-row>
|
<el-col :span="6">
|
<div class="city-warp">
|
<div class="city">
|
<div class="title">
|
自流井
|
</div>
|
<div class="score-warp">
|
<div class="score-item">
|
<div>视频:</div>
|
<div class="score">99.5</div>
|
</div>
|
<div class="score-item">
|
<div>人脸:</div>
|
<div class="score">87</div>
|
</div>
|
<div class="score-item">
|
<div>监控:</div>
|
<div class="score">94</div>
|
</div>
|
</div>
|
<div class="bottom-publish">
|
<el-button size="medium" type="success">发布</el-button>
|
<el-button size="medium" @click="jumpDetail" type="info">详情</el-button>
|
</div>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="6">
|
<div class="city-warp">
|
<div class="city">
|
<div class="title">
|
富顺
|
</div>
|
<div class="score-warp">
|
<div class="score-item">
|
<div>视频:</div>
|
<div class="score">99.5</div>
|
</div>
|
<div class="score-item">
|
<div>人脸:</div>
|
<div class="score">87</div>
|
</div>
|
<div class="score-item">
|
<div>监控:</div>
|
<div class="score">94</div>
|
</div>
|
</div>
|
<div class="bottom-publish">
|
<el-button size="medium" type="success">发布</el-button>
|
<el-button size="medium" @click="jumpDetail" type="info">详情</el-button>
|
</div>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="6">
|
<div class="city-warp">
|
<div class="city">
|
<div class="title">
|
荣县
|
</div>
|
<div class="score-warp">
|
<div class="score-item">
|
<div>视频:</div>
|
<div class="score">99.5</div>
|
</div>
|
<div class="score-item">
|
<div>人脸:</div>
|
<div class="score">87</div>
|
</div>
|
<div class="score-item">
|
<div>监控:</div>
|
<div class="score">94</div>
|
</div>
|
</div>
|
<div class="bottom-publish">
|
<el-button size="medium" type="success">发布</el-button>
|
<el-button size="medium" @click="jumpDetail" type="info">详情</el-button>
|
</div>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="6">
|
<div class="city-warp">
|
<div class="city">
|
<div class="title">
|
沿滩区
|
</div>
|
<div class="score-warp">
|
<div class="score-item">
|
<div>视频:</div>
|
<div class="score">99.5</div>
|
</div>
|
<div class="score-item">
|
<div>人脸:</div>
|
<div class="score">87</div>
|
</div>
|
<div class="score-item">
|
<div>监控:</div>
|
<div class="score">94</div>
|
</div>
|
</div>
|
<div class="bottom-publish">
|
<el-button size="medium" type="success">发布</el-button>
|
<el-button size="medium" @click="jumpDetail" type="info">详情</el-button>
|
</div>
|
</div>
|
</div>
|
</el-col>
|
|
|
</el-row>
|
|
<el-row style="margin-top: 30px">
|
<el-col :span="6">
|
<div class="city-warp">
|
<div class="city">
|
<div class="title">
|
高新区
|
</div>
|
<div class="score-warp">
|
<div class="score-item">
|
<div>视频:</div>
|
<div class="score">99.5</div>
|
</div>
|
<div class="score-item">
|
<div>人脸:</div>
|
<div class="score">87</div>
|
</div>
|
<div class="score-item">
|
<div>监控:</div>
|
<div class="score">94</div>
|
</div>
|
</div>
|
<div class="bottom-publish">
|
<el-button size="medium" type="success">发布</el-button>
|
<el-button size="medium" @click="jumpDetail" type="info">详情</el-button>
|
</div>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="6">
|
<div class="city-warp">
|
<div class="city">
|
<div class="title">
|
大安区
|
</div>
|
<div class="score-warp">
|
<div class="score-item">
|
<div>视频:</div>
|
<div class="score">99.5</div>
|
</div>
|
<div class="score-item">
|
<div>人脸:</div>
|
<div class="score">87</div>
|
</div>
|
<div class="score-item">
|
<div>监控:</div>
|
<div class="score">94</div>
|
</div>
|
</div>
|
<div class="bottom-publish">
|
<el-button size="medium" type="success">发布</el-button>
|
<el-button size="medium" @click="jumpDetail" type="info">详情</el-button>
|
</div>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="6">
|
<div class="city-warp">
|
<div class="city">
|
<div class="title">
|
贡井区
|
</div>
|
<div class="score-warp">
|
<div class="score-item">
|
<div>视频:</div>
|
<div class="score">99.5</div>
|
</div>
|
<div class="score-item">
|
<div>人脸:</div>
|
<div class="score">87</div>
|
</div>
|
<div class="score-item">
|
<div>监控:</div>
|
<div class="score">94</div>
|
</div>
|
</div>
|
<div class="bottom-publish">
|
<el-button size="medium" type="success">发布</el-button>
|
<el-button size="medium" @click="jumpDetail" type="info">详情</el-button>
|
</div>
|
</div>
|
</div>
|
</el-col>
|
</el-row>
|
</div>
|
|
</template>
|
|
<script>
|
export default {
|
name: 'index',
|
data() {
|
return {
|
|
}
|
},
|
methods: {
|
jumpDetail() {
|
this.$router.push("/examine/detail")
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.score-warp {
|
display: flex;
|
flex-direction: column;
|
justify-content: center;
|
align-items: center;
|
color: #797777
|
}
|
.score-item {
|
display: flex;
|
flex-direction: row;
|
}
|
.score {
|
width: 60px;
|
text-align: right;
|
}
|
#warp {
|
padding: 20px;
|
}
|
.city-warp {
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
height: 210px;
|
}
|
.city {
|
width: 240px;
|
height: 100%;
|
box-shadow: 0 2px 6px hsla(0, 0%, 7%, .1);
|
border-radius: 10px;
|
position: relative;
|
text-align: center;
|
padding: 10px 0px;
|
}
|
.bottom-publish {
|
width: 100%;
|
position: absolute;
|
bottom: 10px;
|
}
|
.title {
|
font-size: larger;
|
margin-bottom: 25px;
|
}
|
</style>
|