wangyifang
/
dangxingjiaoyujidi-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

up

Browse Source
master
刘翔宇-旅管家 3 years ago
parent eb33096928
commit ab801d4a0b
1 changed files with 42 additions and 41 deletions
Show Stats Download Patch File Download Diff File

83
src/views/dashboard/components/PanelGroup.vue
Unescape View File

@ -1,8 +1,8 @@
<template> <template>
<el-row :gutter="40" class="panel-group"> <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 */ <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: -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+ */ background: linear-gradient(to right, #5565ec, #8163f9); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
"> ">
<div class="card-panel"> <div class="card-panel">
<div class="card-panel-icon-wrapper icon-people"> <div class="card-panel-icon-wrapper icon-people">
@ -18,61 +18,61 @@ background: linear-gradient(to right, #5565ec, #8163f9); /* W3C, IE 10+/ Edge, F
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #02d2b0; /* fallback for old browsers */ <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: -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+ */ background: linear-gradient(to right, #0fc4cb, #02d2b0); /* 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" style="background-color: transparent;" @click="handleRoute('box')">
<div class="card-panel-icon-wrapper icon-message"> <div class="card-panel-icon-wrapper icon-message">
<svg-icon icon-class="user-group" class-name="card-panel-icon" /> <svg-icon icon-class="user-group" class-name="card-panel-icon" />
</div> </div>
<div class="card-panel-description"> <div class="card-panel-description">
<div class="card-panel-text"> <div class="card-panel-text">
204 204
</div> </div>
<div class="card-panel-text" style="color: #fff;font-size:18px"> <div class="card-panel-text" style="color: #fff;font-size:18px">
入场参观总人次 入场参观总人次
</div> </div>
<!-- <count-to :start-val="0" :end-val="countsData.client_count" :duration="3000" class="card-panel-num" /> --> <!-- <count-to :start-val="0" :end-val="countsData.client_count" :duration="3000" class="card-panel-num" /> -->
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #3464ec; /* fallback for old browsers */ <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: -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+ */ background: linear-gradient(to right, #3f86fa, #3464ec); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
"> ">
<div class="card-panel" @click="handleRoute('tool')"> <div class="card-panel" @click="handleRoute('tool')">
<div class="card-panel-icon-wrapper icon-money"> <div class="card-panel-icon-wrapper icon-money">
<svg-icon icon-class="peoples" class-name="card-panel-icon" /> <svg-icon icon-class="peoples" class-name="card-panel-icon" />
</div> </div>
<div class="card-panel-description"> <div class="card-panel-description">
<div class="card-panel-text"> <div class="card-panel-text">
305 305
</div> </div>
<div class="card-panel-text" style="color: #fff;font-size:18px"> <div class="card-panel-text" style="color: #fff;font-size:18px">
预约活动总人次 预约活动总人次
</div> </div>
<!-- <count-to :start-val="0" :end-val="countsData.tool_count" :duration="3200" class="card-panel-num" /> --> <!-- <count-to :start-val="0" :end-val="countsData.tool_count" :duration="3200" class="card-panel-num" /> -->
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="background: #1289d9; /* fallback for old browsers */ <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: -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+ */ background: linear-gradient(to right, #17b8ee, #1289d9); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
"> ">
<div class="card-panel" @click="handleRoute('user')"> <div class="card-panel" @click="handleRoute('user')">
<div class="card-panel-icon-wrapper icon-shopping"> <div class="card-panel-icon-wrapper icon-shopping">
<svg-icon icon-class="user-group" class-name="card-panel-icon" /> <svg-icon icon-class="user-group" class-name="card-panel-icon" />
</div> </div>
<div class="card-panel-description"> <div class="card-panel-description">
<div class="card-panel-text"> <div class="card-panel-text">
267 267
</div> </div>
<div class="card-panel-text" style="color: #fff;font-size:18px"> <div class="card-panel-text" style="color: #fff;font-size:18px">
参与活动总人次 参与活动总人次
</div> </div>
<!-- <count-to :start-val="0" :end-val="countsData.user_count" :duration="3600" class="card-panel-num" /> --> <!-- <count-to :start-val="0" :end-val="countsData.user_count" :duration="3600" class="card-panel-num" /> -->
</div> </div>
</div> </div>
</el-col> </el-col>
@ -99,15 +99,16 @@ background: linear-gradient(to right, #17b8ee, #1289d9); /* W3C, IE 10+/ Edge, F
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.panel-group { .panel-group {
// margin-top: 18px; // margin-top: 18px;
margin-left:-2%!important; margin-left: -2% !important;
margin-right:-3%!important; margin-right: -3% !important;
.card-panel-col {
.card-panel-col {
// margin:0 2%; // margin:0 2%;
margin: 32px 2%; margin: 0 2%;
margin-bottom: 32px;
} }
.card-panel { .card-panel {
@ -116,7 +117,7 @@ background: linear-gradient(to right, #17b8ee, #1289d9); /* W3C, IE 10+/ Edge, F
font-size: 12px; font-size: 12px;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
color: #666; color: #666;
text-align: center; text-align: center;
// background: #fff; // background: #fff;
// box-shadow: 4px 4px 40px rgba(0, 0, 0, .05); // box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
@ -182,7 +183,7 @@ background: linear-gradient(to right, #17b8ee, #1289d9); /* W3C, IE 10+/ Edge, F
line-height: 25px; line-height: 25px;
color: rgb(255, 255, 255); color: rgb(255, 255, 255);
font-size: 22px; font-size: 22px;
margin-bottom: 12px; margin-bottom: 12px;
font-family: "微软雅黑"; font-family: "微软雅黑";
} }

Write Preview
Loading…
Cancel
Save