master
lion 4 years ago
parent a34ad27504
commit b35f2be138

@ -9,7 +9,6 @@
<img src="../../../assets/logo.png?v=1" <img src="../../../assets/logo.png?v=1"
class="sidebar-name-logo" /> --> class="sidebar-name-logo" /> -->
中共苏州独立支部旧址预约管理系统 中共苏州独立支部旧址预约管理系统
</router-link> </router-link>
</transition> </transition>

@ -1,78 +1,79 @@
<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="margin-right:3%;background: #FDC830; /* 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, #F37335, #FDC830); /* 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, #F37335, #FDC830); /* 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">
<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">
预约参观 234
</div> </div>
<div class="card-panel-text" style="color: #fff;"> <div class="card-panel-text" style="color: #fff;font-size:18px">
234 人次 预约参观总人次
</div> </div>
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :xs="12" :sm="12" :lg="5" class="card-panel-col" style="margin-right:10.5%;background: #FFE000; /* 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, #799F0C, #FFE000); /* 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, #799F0C, #FFE000); /* 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="toolbox" 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
</div> </div>
<div class="card-panel-text" style="color: #fff;"> <div class="card-panel-text" style="color: #fff;font-size:18px">
194 人次 入场参观总人次
</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="margin-right:3%;background: #F2994A; /* 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, #F2C94C, #F2994A); /* 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, #F2C94C, #F2994A); /* 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="tool" 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
</div> </div>
<div class="card-panel-text" style="color: #fff;"> <div class="card-panel-text" style="color: #fff;font-size:18px">
305 人次 预约活动总人次
</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: #FFB75E; /* 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, #ED8F03, #FFB75E); /* 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, #ED8F03, #FFB75E); /* 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
</div> </div>
<div class="card-panel-text" style="color: #fff;"> <div class="card-panel-text" style="color: #fff;font-size:18px">
267 人次 参与活动总人次
</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>
</el-row> </el-row>
@ -101,16 +102,16 @@ background: linear-gradient(to right, #ED8F03, #FFB75E); /* W3C, IE 10+/ Edge, F
<style lang="scss" scoped> <style lang="scss" scoped>
.panel-group { .panel-group {
margin-top: 18px; // margin-top: 18px;
margin-left:0px!important; margin-left:-2%!important;
margin-right:0px!important; margin-right:-3%!important;
.card-panel-col { .card-panel-col {
// margin:0 2%; // margin:0 2%;
margin-bottom: 32px; margin: 32px 2%;
} }
.card-panel { .card-panel {
height: 108px; height: 130px;
cursor: pointer; cursor: pointer;
font-size: 12px; font-size: 12px;
position: relative; position: relative;
@ -126,21 +127,21 @@ background: linear-gradient(to right, #ED8F03, #FFB75E); /* W3C, IE 10+/ Edge, F
color: #fff; color: #fff;
} }
.icon-people { // .icon-people {
background: #40c9c6; // background: #40c9c6;
} // }
.icon-message { // .icon-message {
background: #36a3f7; // background: #36a3f7;
} // }
.icon-money { // .icon-money {
background: #f4516c; // background: #f4516c;
} // }
.icon-shopping { // .icon-shopping {
background: #34bfa3 // background: #34bfa3
} // }
} }
.icon-people { .icon-people {
@ -160,8 +161,8 @@ background: linear-gradient(to right, #ED8F03, #FFB75E); /* W3C, IE 10+/ Edge, F
} }
.card-panel-icon-wrapper { .card-panel-icon-wrapper {
float: left; float: right;
margin: 14px 0 0 14px; margin: 22px 0 0 14px;
padding: 16px; padding: 16px;
transition: all 0.38s ease-out; transition: all 0.38s ease-out;
border-radius: 6px; border-radius: 6px;
@ -175,13 +176,12 @@ background: linear-gradient(to right, #ED8F03, #FFB75E); /* W3C, IE 10+/ Edge, F
.card-panel-description { .card-panel-description {
// float: right; // float: right;
font-weight: bold; font-weight: bold;
margin: 26px; margin: 33px 0;
margin-left: 0px;
.card-panel-text { .card-panel-text {
line-height: 25px; line-height: 25px;
color: rgba(0, 0, 0, 0.45); color: rgb(255, 255, 255);
font-size: 25px; font-size: 22px;
margin-bottom: 12px; margin-bottom: 12px;
font-family: "微软雅黑"; font-family: "微软雅黑";
} }

@ -6,7 +6,7 @@
<el-col :xs="24" :sm="24" :lg="8"> <el-col :xs="24" :sm="24" :lg="8">
<div class="chart-wrapper"> <div class="chart-wrapper">
<div class="chart-title"> <div class="chart-title">
<router-link to="/toolbox/warning">参观男女统计</router-link> <router-link to="/toolbox/warning">观众性别</router-link>
<!-- <div> <!-- <div>
<el-tag @click="changeDate('warning',item.type,index)" :type="(item.checked?'success':'info')" <el-tag @click="changeDate('warning',item.type,index)" :type="(item.checked?'success':'info')"
style="margin-right: 10px;cursor: pointer;" v-for="(item,index) in stat.warning.dateRange"> style="margin-right: 10px;cursor: pointer;" v-for="(item,index) in stat.warning.dateRange">
@ -20,7 +20,7 @@
<el-col :xs="24" :sm="24" :lg="8"> <el-col :xs="24" :sm="24" :lg="8">
<div class="chart-wrapper"> <div class="chart-wrapper">
<div class="chart-title"> <div class="chart-title">
<router-link to="/toolbox/exception">观年龄段统计</router-link> <router-link to="/toolbox/exception">年龄</router-link>
<!-- <div> <!-- <div>
<el-tag @click="changeDate('exception',item.type,index)" :type="(item.checked?'success':'info')" <el-tag @click="changeDate('exception',item.type,index)" :type="(item.checked?'success':'info')"
style="margin-right: 10px;cursor: pointer;" v-for="(item,index) in stat.exception.dateRange"> style="margin-right: 10px;cursor: pointer;" v-for="(item,index) in stat.exception.dateRange">
@ -34,7 +34,7 @@
<el-col :xs="24" :sm="24" :lg="8"> <el-col :xs="24" :sm="24" :lg="8">
<div class="chart-wrapper"> <div class="chart-wrapper">
<div class="chart-title"> <div class="chart-title">
<router-link to="/toolbox/exception">参观时长统计</router-link> <router-link to="/toolbox/exception">城市分布</router-link>
<!-- <div> <!-- <div>
<el-tag @click="changeDate('exception',item.type,index)" :type="(item.checked?'success':'info')" <el-tag @click="changeDate('exception',item.type,index)" :type="(item.checked?'success':'info')"
style="margin-right: 10px;cursor: pointer;" v-for="(item,index) in stat.exception.dateRange"> style="margin-right: 10px;cursor: pointer;" v-for="(item,index) in stat.exception.dateRange">
@ -96,7 +96,7 @@
}, },
], ],
radiusArr: "60%", radiusArr: "50%",
dateRange: [{ dateRange: [{
checked: true, checked: true,
type: "week", type: "week",
@ -125,7 +125,7 @@
name: '25岁以上' name: '25岁以上'
} }
], ],
radiusArr: ['40%', '70%'], radiusArr: ['30%', '60%'],
dateRange: [{ dateRange: [{
checked: true, checked: true,
type: "week", type: "week",
@ -137,18 +137,26 @@
}] }]
}, },
times: { times: {
radiusArr: "60%", radiusArr: "50%",
yArr: [{ yArr: [{
value: 240, value: 240,
name: '最长时长' name: '苏州'
}, },
{ {
value: 20, value: 20,
name: '最短时长' name: '无锡'
}, },
{ {
value: 130, value: 130,
name: '平均值' name: '常州'
},
{
value: 120,
name: '泰州'
},
{
value: 120,
name: '宿迁'
} }
], ],
} }

Loading…
Cancel
Save