master
lion 3 years ago
parent a191f0c985
commit b56635c199

@ -1,74 +1,70 @@
<template>
<el-row :gutter="40" class="panel-group">
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #8163f9; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #5565ec, #8163f9); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #5565ec, #8163f9); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
">
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #FDC830; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #F37335, #FDC830); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #F37335, #FDC830); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */">
<div class="card-panel">
<div class="card-panel-icon-wrapper icon-people">
<svg-icon icon-class="peoples" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text">
<div class="card-panel-text" style="font-family: '微软雅黑'">
234
</div>
<div class="card-panel-text" style="color: #fff;font-size:18px">
<div class="card-panel-text" style="color: #fff;font-size:16px">
预约参观总人次
</div>
</div>
</div>
</el-col>
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #02d2b0; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #0fc4cb, #02d2b0); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #0fc4cb, #02d2b0); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
">
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #FFB75E; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #ED8F03, #FFB75E); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #ED8F03, #FFB75E); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */">
<div class="card-panel" style="background-color: transparent;" @click="handleRoute('box')">
<div class="card-panel-icon-wrapper icon-message">
<svg-icon icon-class="user-group" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text">
<div class="card-panel-text" style="font-family: '微软雅黑'">
204
</div>
<div class="card-panel-text" style="color: #fff;font-size:18px">
<div class="card-panel-text" style="color: #fff;font-size:16px">
入场参观总人次
</div>
<!-- <count-to :start-val="0" :end-val="countsData.client_count" :duration="3000" class="card-panel-num" /> -->
</div>
</div>
</el-col>
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #3464ec; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #3f86fa, #3464ec); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #3f86fa, #3464ec); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
">
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #ffe259; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #ffa751, #ffe259); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #ffa751, #ffe259); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */">
<div class="card-panel" @click="handleRoute('tool')">
<div class="card-panel-icon-wrapper icon-money">
<svg-icon icon-class="peoples" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text">
<div class="card-panel-text" style="font-family: '微软雅黑'">
305
</div>
<div class="card-panel-text" style="color: #fff;font-size:18px">
<div class="card-panel-text" style="color: #fff;font-size:16px">
预约活动总人次
</div>
<!-- <count-to :start-val="0" :end-val="countsData.tool_count" :duration="3200" class="card-panel-num" /> -->
</div>
</div>
</el-col>
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #1289d9; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #17b8ee, #1289d9); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #17b8ee, #1289d9); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
">
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #fe8c00; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #f83600, #fe8c00); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #f83600, #fe8c00); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */">
<div class="card-panel" @click="handleRoute('user')">
<div class="card-panel-icon-wrapper icon-shopping">
<svg-icon icon-class="user-group" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text">
<div class="card-panel-text" style="font-family: '微软雅黑'">
267
</div>
<div class="card-panel-text" style="color: #fff;font-size:18px">
<div class="card-panel-text" style="color: #fff;font-size:16px">
参与活动总人次
</div>
<!-- <count-to :start-val="0" :end-val="countsData.user_count" :duration="3600" class="card-panel-num" /> -->
@ -146,19 +142,19 @@ background: linear-gradient(to right, #17b8ee, #1289d9); /* W3C, IE 10+/ Edge, F
}
.icon-people {
color: #40c9c6;
color: #fff;
}
.icon-message {
color: #36a3f7;
color: #fff;
}
.icon-money {
color: #f4516c;
color: #fff;
}
.icon-shopping {
color: #34bfa3
color: #fff
}
.card-panel-icon-wrapper {
@ -171,7 +167,7 @@ background: linear-gradient(to right, #17b8ee, #1289d9); /* W3C, IE 10+/ Edge, F
.card-panel-icon {
float: left;
font-size: 48px;
font-size: 42px;
}
.card-panel-description {
@ -182,9 +178,9 @@ background: linear-gradient(to right, #17b8ee, #1289d9); /* W3C, IE 10+/ Edge, F
.card-panel-text {
line-height: 25px;
color: rgb(255, 255, 255);
font-size: 22px;
font-size: 28px;
margin-bottom: 12px;
font-family: "微软雅黑";
}
.card-panel-num {

@ -125,7 +125,7 @@
name: '25岁以上'
}
],
radiusArr: ['30%', '60%'],
radiusArr: ['30%', '50%'],
dateRange: [{
checked: true,
type: "week",

Loading…
Cancel
Save