107 lines
4.7 KiB
HTML
107 lines
4.7 KiB
HTML
<!--
|
|
* @Description :
|
|
* @Version : 1.0
|
|
* @Author : Shiming
|
|
* @Date : 2022-04-28 20:27:07
|
|
* @LastEditors : Shiming
|
|
* @LastEditTime : 2022-04-29 18:03:04
|
|
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\dataindex\\dataindex.component.html
|
|
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
|
-->
|
|
<div nz-row [nzGutter]="16">
|
|
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
<g2-card [title]="AdvanceDepositTitle" [bordered]="true" [total]="totalAdvanceDeposit?.totalAmount || '¥ 0.00万'"
|
|
[footer]="AdvanceDepositFooter" contentHeight="46">
|
|
<ng-template #AdvanceDepositTitle>
|
|
<p class="mini_area_title">
|
|
<span class="title">客户预存款总额</span>
|
|
<span class="subtitle">完成率 <span class="percent">32.12%</span></span>
|
|
</p>
|
|
</ng-template>
|
|
<ng-template #AdvanceDepositFooter>
|
|
<g2-custom #AdvanceDeposit delay="100"></g2-custom>
|
|
<!-- <g2-mini-area line color="#cceafe" height="45" [data]="totalAdvanceDeposit?.list || []"
|
|
(clickItem)="handleClick($event)">
|
|
</g2-mini-area> -->
|
|
</ng-template>
|
|
</g2-card>
|
|
</div>
|
|
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
<g2-card [title]="PerformanceVolumeTitle" [bordered]="true"
|
|
[total]="totalPerformanceVolume?.totalAmount || '¥ 0.00万'" [footer]="PerformanceVolumeFooter" contentHeight="46">
|
|
<ng-template #PerformanceVolumeTitle>
|
|
<p class="mini_area_title">
|
|
<span class="title">业绩量总额</span>
|
|
<span class="subtitle">完成率 <span class="percent">32.12%</span></span>
|
|
</p>
|
|
</ng-template>
|
|
<ng-template #PerformanceVolumeFooter>
|
|
<g2-mini-area line color="#cceafe" height="45" [data]="totalPerformanceVolume?.list || []"
|
|
(clickItem)="handleClick($event)">
|
|
</g2-mini-area>
|
|
</ng-template>
|
|
</g2-card>
|
|
</div>
|
|
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
<g2-card [title]="FreightTitle" [bordered]="true" [total]="totalFreight?.totalAmount || '¥ 0.00万'"
|
|
[footer]="Freightfooter" contentHeight="46">
|
|
<ng-template #FreightTitle>
|
|
<p class="mini_area_title">
|
|
<span class="title">司机应付总额</span>
|
|
</p>
|
|
</ng-template>
|
|
<ng-template #Freightfooter>
|
|
<g2-mini-area line borderColor="#E60012" color="#F09896" height="45" [data]="totalFreight?.list || []"
|
|
(clickItem)="handleClick($event)">
|
|
</g2-mini-area>
|
|
</ng-template>
|
|
</g2-card>
|
|
</div>
|
|
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
<g2-card [title]="SurchargeTitle" [bordered]="true" [total]="totalSurcharge?.totalAmount || '¥ 0.00万'"
|
|
[footer]="SurchargeFooter" contentHeight="46">
|
|
<ng-template #SurchargeTitle>
|
|
<p class="mini_area_title">
|
|
<span class="title">附加费总额</span>
|
|
</p>
|
|
</ng-template>
|
|
<ng-template #SurchargeFooter>
|
|
<g2-mini-area line borderColor="#E60012" color="#F09896" height="45" [data]="totalSurcharge?.list || []"
|
|
(clickItem)="handleClick($event)">
|
|
</g2-mini-area>
|
|
</ng-template>
|
|
</g2-card>
|
|
</div>
|
|
</div>
|
|
<div nz-row [nzGutter]="16">
|
|
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
<nz-card acl [acl-ability]="['dataindex-getBillTypeProportion']"><label class="chart_title">订单类型比例</label>
|
|
<g2-custom #g2custom delay="100"></g2-custom>
|
|
</nz-card>
|
|
</div>
|
|
<div nz-col class="gutter-row" [nzSpan]="18">
|
|
<nz-card acl [acl-ability]="['dataindex-getBillAmount']"><label class="chart_title">大区业绩完成情况</label>
|
|
<!-- <g2-timeline [data]="chartData" [titleMap]="{ y1: '订单金额（元）', y2: '' }" [height]="200" mask="MM月DD日"
|
|
[slider]="false"></g2-timeline> -->
|
|
<g2-custom #RegionalPerforman delay="100"></g2-custom>
|
|
</nz-card>
|
|
</div>
|
|
</div>
|
|
<div nz-row [nzGutter]="16">
|
|
<div nz-col class="gutter-row" [nzSpan]="6">
|
|
<nz-card acl [acl-ability]="['dataindex-getWayBillDirectProportion']"> <label class="chart_title">运单直付比例</label>
|
|
<!-- <g2-pie #pie title="销售额" subTitle="销售额" [total]="total" [valueFormat]="format" [data]="salesPieData" height="294"
|
|
(clickItem)="handleClick($event)" [lineWidth]="10">
|
|
</g2-pie> -->
|
|
<g2-custom #BillDirectProportion delay="100"></g2-custom>
|
|
</nz-card>
|
|
</div>
|
|
<div nz-col class="gutter-row" [nzSpan]="18">
|
|
<nz-card acl [acl-ability]="['dataindex-getBillPaymentAmount']">
|
|
<label class="chart_title">业绩完成情况</label>
|
|
<!-- <g2-bar [data]="salesData" (clickItem)="handleClick($event)" height="400"></g2-bar> -->
|
|
<g2-custom #SaleProportion delay="100"></g2-custom>
|
|
|
|
</nz-card>
|
|
</div>
|
|
</div> |