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.

44 lines
1.6 KiB

<template>
<div class="card">
<div class="title">
<div class="title__icon">
<svg viewBox="0 0 1024 1024" width="83" height="83"><path d="M450.1 501c118.8 0 215.5-98.4 215.5-219.3S568.9 62.5 450.1 62.5c-118.9 0-215.5 98.4-215.5 219.2S331.2 501 450.1 501zM524.9 522.1H377.4c-150 0-272.1 124.1-272.1 276.6v16.4c0 79.8 120.1 79.8 272.1 79.8h83.5c-26.8-43.6-42.6-94.8-42.6-149.8 0.1-90.1 41.7-170.4 106.6-223z" fill="#fff"></path><path d="M702.8 528.6c-119.2 0-215.9 96.9-215.9 216.4s96.6 216.4 215.9 216.4S918.7 864.5 918.7 745s-96.6-216.4-215.9-216.4z m96.1 270.3H691.3c-19.8 0-35.9-16.1-35.9-35.9V655.5c0-19.8 16.1-35.9 35.9-35.9s35.9 16.1 35.9 35.9v71.7h71.7c19.8 0 35.9 16.1 35.9 35.9 0 19.8-16.1 35.8-35.9 35.8z" fill="#fff"></path></svg>
</div>
<div class="title__text">
<div class="title__text--name">访客量</div>
<div class="title__text--sub">描述文字</div>
</div>
</div>
<div class="title__data">
<div class="title__data-item">
<div class="title__data-item__num">2000</div>
<div class="title__data-item__text">今日访客</div>
</div>
<div class="title__data-item">
<div class="title__data-item__num">100000</div>
<div class="title__data-item__text">总计访客</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {}
},
methods: {},
computed: {},
}
</script>
<style scoped lang="scss">
.card {
border-radius: 7px;
filter: drop-shadow(0 0 7.5px rgba(211,215,221,0.4));
background-color: #ffffff;
border: 1px solid #d8e2f0;
}
</style>