<div nz-row [nzGutter]="24" class="pt-lg">
|
<div nz-col nzXs="24" nzSm="24" nzMd="24" nzLg="18">
|
<nz-card nzTitle="活动实时交易情况" [nzBordered]="false" class="mb-lg">
|
<div nz-row>
|
<div nz-col nzXs="24" nzSm="12" nzMd="6">
|
<number-info subTitle="今日交易总额" [total]="'124,543,233'" suffix="元"></number-info>
|
</div>
|
<div nz-col nzXs="24" nzSm="12" nzMd="6">
|
<number-info subTitle="销售目标完成率" [total]="'92%'"></number-info>
|
</div>
|
<div nz-col nzXs="24" nzSm="12" nzMd="6">
|
<number-info subTitle="活动剩余时间" [total]="lastTotalTime">
|
<ng-template #lastTotalTime>
|
<count-down [target]="30"></count-down>
|
</ng-template>
|
</number-info>
|
</div>
|
<div nz-col nzXs="24" nzSm="12" nzMd="6">
|
<number-info subTitle="每秒交易总额" [total]="234" suffix="元"></number-info>
|
</div>
|
</div>
|
<div class="map-chart">
|
<nz-tooltip [nzTitle]="'等待后期实现'">
|
<img nz-tooltip src="https://gw.alipayobjects.com/zos/rmsportal/HBWnDEUXCnGnGrRfrpKa.png" alt="map" />
|
</nz-tooltip>
|
</div>
|
</nz-card>
|
</div>
|
<div nz-col nzXs="24" nzSm="24" nzMd="24" nzLg="6">
|
<nz-card nzTitle="活动情况预测" [nzBordered]="false" class="mb-lg">
|
<div class="active-chart">
|
<number-info subTitle="目标评估" total="有望达到预期"></number-info>
|
<g2-mini-area [animate]="false" [line]="true" [borderWidth]="2" [height]="84" [yAxis]="activeYAxis" [data]="activeData"></g2-mini-area>
|
<ng-container *ngIf="activeData?.length > 0">
|
<div class="active-grid">
|
<p>{{activeStat.max}} 亿元</p>
|
<p>{{activeStat.min}} 亿元</p>
|
</div>
|
<div class="active-legend">
|
<span>00:00</span>
|
<span>{{activeStat.t1}}</span>
|
<span>{{activeStat.t2}}</span>
|
</div>
|
</ng-container>
|
</div>
|
</nz-card>
|
<nz-card nzTitle="券核效率" [nzBordered]="false" [nzBodyStyle]="{'text-align': 'center'}" class="mb-lg">
|
<g2-gauge [title]="'跳出率'" [height]="180" [percent]="87" [format]="couponFormat"></g2-gauge>
|
</nz-card>
|
</div>
|
</div>
|
<div nz-row [nzGutter]="24">
|
<div nz-col nzXs="24" nzSm="24" nzLg="12" class="mb-lg">
|
<nz-card nzTitle="各品类占比" [nzBordered]="false" class="pie-card">
|
<div nz-row [nzGutter]="4" style="padding:16px 0">
|
<div nz-col [nzSpan]="8">
|
<g2-pie [animate]="false" [percent]="28" subTitle="中式快餐" total="28%" [height]="128" [lineWidth]="2"></g2-pie>
|
</div>
|
<div nz-col [nzSpan]="8">
|
<g2-pie [animate]="false" color="#5DDECF" [percent]="22" subTitle="西餐" total="22%" [height]="128" [lineWidth]="2"></g2-pie>
|
</div>
|
<div nz-col [nzSpan]="8">
|
<g2-pie [animate]="false" color="#2FC25B" [percent]="32" subTitle="火锅" total="32%" [height]="128" [lineWidth]="2"></g2-pie>
|
</div>
|
</div>
|
</nz-card>
|
</div>
|
<div nz-col nzXs="24" nzSm="24" nzLg="6" class="mb-lg">
|
<nz-card nzTitle="热门搜索" [nzBordered]="false" [nzBodyStyle]="{'overflow': 'hidden'}">
|
<g2-tag-cloud [data]="tags" [height]="165"></g2-tag-cloud>
|
</nz-card>
|
</div>
|
<div nz-col nzXs="24" nzSm="24" nzLg="6" class="mb-lg">
|
<nz-card nzTitle="资源剩余" [nzBordered]="false" [nzBodyStyle]="{'overflow': 'hidden'}">
|
<g2-water-wave [title]="'补贴资金剩余'" [percent]="34" [height]="165"></g2-water-wave>
|
</nz-card>
|
</div>
|
</div>
|
