|
@ -22,81 +22,85 @@
|
|
<body style="margin: 0;">
|
|
<body style="margin: 0;">
|
|
<div id="main" class="c-hide" v-loading.fullscreen.lock="isloading">
|
|
<div id="main" class="c-hide" v-loading.fullscreen.lock="isloading">
|
|
<header-tab :appname="appname" :isback="isback" :isrefresh="isrefresh" :isopen="isopen"></header-tab>
|
|
<header-tab :appname="appname" :isback="isback" :isrefresh="isrefresh" :isopen="isopen"></header-tab>
|
|
<!-- 年份选择 -->
|
|
|
|
<div class="bgc-f2f3f5 selectYear">
|
|
|
|
<label class="c-333 c-f14" for="">时间:</label>
|
|
|
|
<el-select v-model="chooseYear" @change="selectChange">
|
|
|
|
<el-option v-for="(item , index) in years" :label="item" :value="item"></el-option>
|
|
|
|
</el-select>
|
|
|
|
|
|
<div class="plr20 pb20 bgc-f2f3f5">
|
|
|
|
<!-- 年份选择 -->
|
|
|
|
<div class="bgc-f2f3f5 pt20 pb10">
|
|
|
|
<label class="c-333 c-f14" for="">时间:</label>
|
|
|
|
<el-select v-model="chooseYear" @change="selectChange">
|
|
|
|
<el-option v-for="(item , index) in years" :label="item" :value="item"></el-option>
|
|
|
|
</el-select>
|
|
|
|
</div>
|
|
|
|
<!-- 百分比 折线图-->
|
|
|
|
<div class="flex-box">
|
|
|
|
<div class="">
|
|
|
|
<div class="flex-box mainBlocktop">
|
|
|
|
<div class="leftBlock" style="position: relative;">
|
|
|
|
<div class="pl20">发送率
|
|
|
|
<img @mouseenter="jumpTip(1)" @mouseleave="leaveTip(1)" src="../../../images/wenhao.png" alt="" class="tip">
|
|
|
|
</div>
|
|
|
|
<div id="shadow1" class="shadow shadowTop">发送率=已发送生日祝福的居民量/生日居民量</div>
|
|
|
|
<div class="c-f28 c-t-center percent">{{sendRate}}</div>
|
|
|
|
</div>
|
|
|
|
<div class="rightBlock">
|
|
|
|
<div class="top bottomBorder">
|
|
|
|
<div class="pt20 pl20">
|
|
|
|
已发送量
|
|
|
|
</div>
|
|
|
|
<div class="c-t-center c-f22">
|
|
|
|
{{sendCount}}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="bottom">
|
|
|
|
<div class="pt20 pl20">
|
|
|
|
生日居民量
|
|
|
|
</div>
|
|
|
|
<div class="c-t-center c-f22">{{total}}</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="flex-box mainBlockbottom mt10">
|
|
|
|
<div class="leftBlock" style="position: relative;">
|
|
|
|
<div class="pl20">未发送率
|
|
|
|
<img @mouseenter="jumpTip(2)" @mouseleave="leaveTip(2)" src="../../../images/wenhao.png" alt="" class="tip">
|
|
|
|
</div>
|
|
|
|
<div id="shadow2" class="shadow">未发送率=未发送生日祝福的居民量/生日居民量</div>
|
|
|
|
<div class="c-f28 c-t-center percent">{{noSendRate}}</div>
|
|
|
|
</div>
|
|
|
|
<div class="rightBlock">
|
|
|
|
<div class="top bottomBorder">
|
|
|
|
<div class="pt20 pl20">
|
|
|
|
未发送量
|
|
|
|
</div>
|
|
|
|
<div class="c-t-center c-f22">
|
|
|
|
{{noSendCount}}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="bottom">
|
|
|
|
<div class="pt20 pl20">
|
|
|
|
生日居民量
|
|
|
|
</div>
|
|
|
|
<div class="c-t-center c-f22">{{total}}</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- 折线图 -->
|
|
|
|
<line-chart v-on:getlinedata="getNewLineData" lineid="lineChart" class="mlr20"></line-chart>
|
|
|
|
</div>
|
|
|
|
<!-- 底部表格 -->
|
|
|
|
<div class="c-border bottomTable mtb10 mb0 bgc-fff">
|
|
|
|
<div class="c-f16 c-333 title ptb10">未发送生日祝福分析</div>
|
|
|
|
<!-- 底部区域图 -->
|
|
|
|
<area-data-panel v-on:getnewdata="getAreaData"></area-data-panel>
|
|
|
|
<div class="tableBlock">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!--模态框组件-->
|
|
|
|
<vuedals></vuedals>
|
|
</div>
|
|
</div>
|
|
<!-- 百分比 折线图-->
|
|
|
|
<div class="flex-box">
|
|
|
|
<div class="ml20">
|
|
|
|
<div class="flex-box mainBlocktop">
|
|
|
|
<div class="leftBlock" style="position: relative;">
|
|
|
|
<div class="pl20">发送率
|
|
|
|
<img @mouseenter="jumpTip(1)" @mouseleave="leaveTip(1)" src="../../../images/wenhao.png" alt="" class="tip">
|
|
|
|
</div>
|
|
|
|
<div id="shadow1" class="shadow shadowTop">发送率=已发送生日祝福的居民量/生日居民量</div>
|
|
|
|
<div class="c-f28 c-t-center percent">{{sendRate}}</div>
|
|
|
|
</div>
|
|
|
|
<div class="rightBlock">
|
|
|
|
<div class="top bottomBorder">
|
|
|
|
<div class="pt20 pl20">
|
|
|
|
已发送量
|
|
|
|
</div>
|
|
|
|
<div class="c-t-center c-f22">
|
|
|
|
{{sendCount}}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="bottom">
|
|
|
|
<div class="pt20 pl20">
|
|
|
|
生日居民量
|
|
|
|
</div>
|
|
|
|
<div class="c-t-center c-f22">{{total}}</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="flex-box mainBlockbottom mt10">
|
|
|
|
<div class="leftBlock" style="position: relative;">
|
|
|
|
<div class="pl20">未发送率
|
|
|
|
<img @mouseenter="jumpTip(2)" @mouseleave="leaveTip(2)" src="../../../images/wenhao.png" alt="" class="tip">
|
|
|
|
</div>
|
|
|
|
<div id="shadow2" class="shadow">未发送率=未发送生日祝福的居民量/生日居民量</div>
|
|
|
|
<div class="c-f28 c-t-center percent">{{noSendRate}}</div>
|
|
|
|
</div>
|
|
|
|
<div class="rightBlock">
|
|
|
|
<div class="top bottomBorder">
|
|
|
|
<div class="pt20 pl20">
|
|
|
|
未发送量
|
|
|
|
</div>
|
|
|
|
<div class="c-t-center c-f22">
|
|
|
|
{{noSendCount}}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="bottom">
|
|
|
|
<div class="pt20 pl20">
|
|
|
|
生日居民量
|
|
|
|
</div>
|
|
|
|
<div class="c-t-center c-f22">{{total}}</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- 折线图 -->
|
|
|
|
<line-chart v-on:getlinedata="getNewLineData" lineid="lineChart" class="mlr8"></line-chart>
|
|
|
|
</div>
|
|
|
|
<!-- 底部表格 -->
|
|
|
|
<div class="c-border bottomTable m20 mb0">
|
|
|
|
<div class="c-f16 c-333 title ptb20">未发送生日祝福分析</div>
|
|
|
|
<!-- 底部区域图 -->
|
|
|
|
<area-data-panel v-on:getnewdata="getAreaData"></area-data-panel>
|
|
|
|
<div class="tableBlock">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!--模态框组件-->
|
|
|
|
<vuedals></vuedals>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
|
|
<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
|