刘翔宇-旅管家 3 years ago
parent 2c15fb82d4
commit 0057b4ebbd

@ -5,11 +5,12 @@
<div class="boxtitle">
预约参观
</div>
<div class="boxcontentsubtitle">总预约人数/总入场人数</div>
<div class="bline"></div>
<div class="boxcontentsubtitle">总预约人数 / 总入场人数</div>
<div class="boxcontent">
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.visit_list.total.appointment.total" :duration="3600" />
<count-to separator="" :start-val="0" :end-val="totaldata.visit_list.total.appointment.total" :duration="3600" />
</div>
<div class="boxcontentitem-small">团队{{totaldata.visit_list.total.appointment.team}}</div>
<div class="boxcontentitem-small">个人{{totaldata.visit_list.total.appointment.person}}</div>
@ -17,7 +18,7 @@
<div class="boxline"></div>
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.visit_list.total.enter.total" :duration="3600" />
<count-to separator="" :start-val="0" :end-val="totaldata.visit_list.total.enter.total" :duration="3600" />
</div>
<div class="boxcontentitem-small">团队{{totaldata.visit_list.total.enter.team}}</div>
<div class="boxcontentitem-small">个人{{totaldata.visit_list.total.enter.person}}</div>
@ -27,11 +28,14 @@
核销比{{toCaculateper(totaldata.visit_list.total.enter.total,totaldata.visit_list.total.appointment.total)}}
</div>
<div class="boxcontentsubtitle">今日预约人数/今日入场人数</div>
<div class="boxcline"></div>
<div class="boxcontentsubtitle">今日预约人数 / 今日入场人数</div>
<div class="boxcontent">
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.visit_list.today.appointment.total" :duration="3600" />
<count-to separator="" :start-val="0" :end-val="totaldata.visit_list.today.appointment.total" :duration="3600" />
</div>
<div class="boxcontentitem-small">团队{{totaldata.visit_list.today.appointment.team}}</div>
<div class="boxcontentitem-small">个人{{totaldata.visit_list.today.appointment.person}}</div>
@ -39,7 +43,7 @@
<div class="boxline"></div>
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.visit_list.today.enter.total" :duration="3600" />
<count-to separator="" :start-val="0" :end-val="totaldata.visit_list.today.enter.total" :duration="3600" />
</div>
<div class="boxcontentitem-small">团队{{totaldata.visit_list.today.enter.team}}</div>
<div class="boxcontentitem-small">个人{{totaldata.visit_list.today.enter.person}}</div>
@ -55,12 +59,13 @@
<div class="boxtitle">
活动参加
</div>
<div class="bline"></div>
<div class="boxcontentsubtitle">总报名人数/总核销人数</div>
<div class="boxcontentsubtitle">总报名人数 / 总核销人数</div>
<div class="boxcontent">
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.activity_list.total.appointment.total" :duration="3600" />
<count-to separator="" :start-val="0" :end-val="totaldata.activity_list.total.appointment.total" :duration="3600" />
</div>
<div class="boxcontentitem-small">团队{{totaldata.activity_list.total.appointment.team}}</div>
<div class="boxcontentitem-small">个人{{totaldata.activity_list.total.appointment.person}}</div>
@ -68,7 +73,7 @@
<div class="boxline"></div>
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.activity_list.total.enter.total" :duration="3600" />
<count-to separator="" :start-val="0" :end-val="totaldata.activity_list.total.enter.total" :duration="3600" />
</div>
<div class="boxcontentitem-small">团队{{totaldata.activity_list.total.enter.team}}</div>
<div class="boxcontentitem-small">个人{{totaldata.activity_list.total.enter.person}}</div>
@ -78,24 +83,25 @@
核销比{{toCaculateper(totaldata.activity_list.total.enter.total,totaldata.activity_list.total.appointment.total)}}
</div>
<div class="boxcontentsubtitle">今日报名人数/今日核销人数</div>
<div class="boxcline"></div>
<div class="boxcontentsubtitle">今日报名人数 / 今日核销人数</div>
<div class="boxcontent">
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.activity_list.today.appointment.total" :duration="3600" />
</div>
<div class="boxcontentitem-small">团队{{totaldata.activity_list.today.appointment.team}}</div>
<div class="boxcontentitem-small">个人{{totaldata.activity_list.today.appointment.person}}</div>
</div>
<div class="boxline"></div>
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.activity_list.today.enter.total" :duration="3600" />
</div>
<div class="boxcontentitem-small">团队{{totaldata.activity_list.today.enter.team}}</div>
<div class="boxcontentitem-small">个人{{totaldata.activity_list.today.enter.person}}</div>
</div>
</div>
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to separator="" :start-val="0" :end-val="totaldata.activity_list.today.appointment.total" :duration="3600" />
</div>
<div class="boxcontentitem-small">团队{{totaldata.activity_list.today.appointment.team}}</div>
<div class="boxcontentitem-small">个人{{totaldata.activity_list.today.appointment.person}}</div>
</div>
<div class="boxline"></div>
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to separator="" :start-val="0" :end-val="totaldata.activity_list.today.enter.total" :duration="3600" />
</div>
<div class="boxcontentitem-small">团队{{totaldata.activity_list.today.enter.team}}</div>
<div class="boxcontentitem-small">个人{{totaldata.activity_list.today.enter.person}}</div>
</div>
</div>
<div class="boxfooter"></div>
<img src="../../../assets/imgs/index_icon_2.png" class="index_icon" />
<img src="../../../assets/imgs/index_icon_bg_1-21.png" class="index_bg" />
@ -104,40 +110,48 @@
<div class="boxtitle">
停车预约
</div>
<div class="boxcontentsubtitle">总预约数/总核销数</div>
<div class="bline"></div>
<div class="boxcontentsubtitle">总预约数 / 总核销数</div>
<div class="boxcontent">
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.park_list.total.appointment" :duration="3600" />
<count-to separator="" :start-val="0" :end-val="totaldata.park_list.total.appointment" :duration="3600" />
</div>
<div class="boxcontentitem-small"> </div>
<div class="boxcontentitem-small"> </div>
<div class="boxcontentitem-small"><span style="visibility: hidden;">0</span></div>
<div class="boxcontentitem-small"><span style="visibility: hidden;">0</span></div>
</div>
<div class="boxline"></div>
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.park_list.total.enter" :duration="3600" />
<count-to separator="" :start-val="0" :end-val="totaldata.park_list.total.enter" :duration="3600" />
</div>
<div class="boxcontentitem-small"><span style="visibility: hidden;">0</span></div>
<div class="boxcontentitem-small"><span style="visibility: hidden;">0</span></div>
</div>
</div>
<div class="boxfooter">核销比{{toCaculateper(totaldata.park_list.total.enter,totaldata.park_list.total.appointment)}}</div>
<div class="boxcontentsubtitle">今日预约数/今日核销数</div>
<div class="boxfooter">
核销比{{toCaculateper(totaldata.park_list.total.enter,totaldata.park_list.total.appointment)}}</div>
<div class="boxcline"></div>
<div class="boxcontentsubtitle">今日预约数 / 今日核销数</div>
<div class="boxcontent">
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.park_list.today.appointment" :duration="3600" />
<count-to separator="" :start-val="0" :end-val="totaldata.park_list.today.appointment" :duration="3600" />
</div>
<div class="boxcontentitem-small"> </div>
<div class="boxcontentitem-small"> </div>
<div class="boxcontentitem-small"><span style="visibility: hidden;">0</span></div>
<div class="boxcontentitem-small"><span style="visibility: hidden;">0</span></div>
</div>
<div class="boxline"></div>
<div class="boxcontentitem">
<div class="boxcontentitem-big">
<count-to :start-val="0" :end-val="totaldata.park_list.today.enter" :duration="3600" />
<count-to separator="" :start-val="0" :end-val="totaldata.park_list.today.enter" :duration="3600" />
</div>
<div class="boxcontentitem-small"><span style="visibility: hidden;">0</span></div>
<div class="boxcontentitem-small"><span style="visibility: hidden;">0</span></div>
</div>
</div>
<div class="boxfooter">核销比{{toCaculateper(totaldata.park_list.today.enter,totaldata.park_list.today.appointment)}}</div>
<div class="boxfooter">
核销比{{toCaculateper(totaldata.park_list.today.enter,totaldata.park_list.today.appointment)}}</div>
<img src="../../../assets/imgs/index_icon_4.png" class="index_icon" />
<img src="../../../assets/imgs/index_icon_bg_4.png" class="index_bg" />
</div>
@ -227,9 +241,9 @@
methods: {
handleRoute(type) {
this.$emit('handleRoute', type)
},
toCaculateper(f1,f2){
return ((f1 / (f2 == 0 ? 1 : f2)) * 100).toFixed(2) + "%"
},
toCaculateper(f1, f2) {
return ((f1 / (f2 == 0 ? 1 : f2)) * 100).toFixed(2) + "%"
}
}
}
@ -254,6 +268,8 @@
width: 100%;
}
.box {
position: relative;
width: 33%;
@ -263,8 +279,8 @@
box-shadow: 0px 8px 15px 0px rgba(212, 84, 32, 0.3100);
border-radius: 8px;
box-sizing: border-box;
padding: 1.25rem;
opacity: 0.8;
padding: 1.25rem 0;
.boxcontentsubtitle {
color: #FFFFFF;
@ -289,6 +305,7 @@
font-family: Source Han Sans CN;
font-weight: 400;
color: #FFFFFF;
padding: 0 1.25rem;
}
.boxcontent {
@ -299,12 +316,14 @@
.boxline {
width: 1px;
height: 4.0625rem;
background: #FFFFFF;
background: #FFFFFF00;
opacity: 0.3;
margin-left: 2.0625rem;
margin-right: 2.0625rem;
}
.boxcontentitem {
display: flex;
flex-direction: column;
@ -329,20 +348,59 @@
.box1 {
background: linear-gradient(134deg, #D1AC7B, #DFC69C);
.boxcline {
width: 100%;
background: #DFC69C;
height: 0.125rem;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
}
.bline {
background: linear-gradient(to right, rgba(255,255,255,0.3), rgba(255,255,255,0) 60%);
height: 0.25rem;
width: 100%;
margin-top: 1.25rem;
}
.box2 {
background: linear-gradient(134deg, #9193BC, #B7B9D4);
.boxcline {
width: 100%;
background: #B7B9D4;
height: 0.125rem;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
}
.box3 {
background: linear-gradient(-55deg, #F6A868, #F4C59E);
.boxcline {
width: 100%;
background: #F4C59E;
height: 0.125rem;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
}
.box4 {
background: linear-gradient(-55deg, #64A48E, #9ECABB);
.boxcline {
width: 100%;
background: #9ECABB;
height: 0.125rem;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
}
.panel-group {

@ -33,7 +33,7 @@
</el-table-column>
<el-table-column prop="cancel_total" label="取消人数" sortable>
</el-table-column>
<el-table-column prop="expire_total" label="超时人数" sortable>
<el-table-column prop="expire_total" label="过期人数" sortable>
</el-table-column>
<el-table-column prop="per" label="核销比" sortable>
</el-table-column>

@ -33,7 +33,7 @@
</el-table-column>
<el-table-column prop="cancel_total" label="取消车辆数" sortable>
</el-table-column>
<el-table-column prop="expire_total" label="超时车辆数" sortable>
<el-table-column prop="expire_total" label="过期车辆数" sortable>
</el-table-column>
</el-table>
</div>

Loading…
Cancel
Save