工作台数据统计页面

沈斌

2018-03-13 032ca75e238cc2f2a96b3bf27532b5a243d9a24a

 src/app/routes/dashboard/workplace/workplace.component.html

@@ -113,7 +113,7 @@
                <div nz-row>
                    <div nz-col nzXs="24" nzSm="24" nzMd="12" nzLg="16">
                        <div class="bar">
                            <bar height="295" [title]="'2018年月度所有警报统计'" [data]="data.alarmData" color="purple"></bar>
                            <bar height="295" [title]="'所有警报月度统计'" [data]="data.alarmData" color="purple"></bar>
                        </div>
                    </div>
                    <div nz-col nzXs="24" nzSm="24" nzMd="12" nzLg="8">
@@ -138,7 +138,7 @@
                <div nz-row>
                    <div nz-col nzXs="24" nzSm="24" nzMd="12" nzLg="16">
                        <div class="bar">
                            <bar height="295" [title]="'2018年月度一级警报统计'" [data]="data.alarmData" color="yellow"></bar>
                            <bar height="295" [title]="'一级警报月度统计'" [data]="data.alarmData_1" color="yellow"></bar>
                        </div>
                    </div>
                    <div nz-col nzXs="24" nzSm="24" nzMd="12" nzLg="8">
@@ -163,7 +163,7 @@
                <div nz-row>
                    <div nz-col nzXs="24" nzSm="24" nzMd="12" nzLg="16">
                        <div class="bar">
                            <bar height="295" [title]="'2018年月度二级警报统计'" [data]="data.alarmData" color="orange"></bar>
                            <bar height="295" [title]="'二级警报月度统计'" [data]="data.alarmData_2" color="orange"></bar>
                        </div>
                    </div>
                    <div nz-col nzXs="24" nzSm="24" nzMd="12" nzLg="8">
@@ -188,7 +188,7 @@
                <div nz-row>
                    <div nz-col nzXs="24" nzSm="24" nzMd="12" nzLg="16">
                        <div class="bar">
                            <bar height="295" [title]="'2018年月度三级警报统计'" [data]="data.alarmData" color="red"></bar>
                            <bar height="295" [title]="'三级警报月度统计'" [data]="data.alarmData_3" color="red"></bar>
                        </div>
                    </div>
                    <div nz-col nzXs="24" nzSm="24" nzMd="12" nzLg="8">
@@ -272,36 +272,22 @@
        </nz-card>
    </div>
    <div nz-col nzXs="24" nzSm="24" nzMd="24" nzLg="12">
        <nz-card [nzLoading]="loading" [nzBordered]="false" nzTitle="销售额类别占比" [nzBodyStyle]="{'padding.px': 24}" class="sales-card" style="min-height: 482px;">
        <nz-card [nzLoading]="loading" [nzBordered]="false" nzTitle="警报类别占比" [nzBodyStyle]="{'padding.px': 24}" class="sales-card" style="min-height: 482px;">
            <ng-template #extra>
                <div class="sales-card-extra">
                    <nz-dropdown>
                        <nz-icon class="icon-group" nz-dropdown nzType="ellipsis"></nz-icon>
                        <ul nz-menu>
                            <li nz-menu-item>操作一</li>
                            <li nz-menu-item>操作二</li>
                        </ul>
                    </nz-dropdown>
                    <div class="sales-type-radio">
                        <nz-radio-group [(ngModel)]="salesType" (ngModelChange)="changeSaleType()" [nzSize]="'large'">
                            <label nz-radio-button [nzValue]="'all'"><span>全部渠道</span></label>
                            <label nz-radio-button [nzValue]="'online'"><span>线上</span></label>
                            <label nz-radio-button [nzValue]="'offline'"><span>门店</span></label>
                            <label nz-radio-button [nzValue]="'0'"><span>全部</span></label>
                            <label nz-radio-button [nzValue]="'1'"><span>一级</span></label>
                            <label nz-radio-button [nzValue]="'2'"><span>二级</span></label>
                            <label nz-radio-button [nzValue]="'3'"><span>三级</span></label>
                        </nz-radio-group>
                    </div>
                </div>
            </ng-template>
            <ng-template #body>
                <h4 class="margin:8px 0 32px 0;">销售额</h4>
                <pie
                    [hasLegend]="true"
                    subTitle="销售额"
                    [height]="248"
                    [lineWidth]="4"
                    [total]="salesTotal"
                    [data]="salesPieData"
                    [valueFormat]="handlePieValueFormat">
                </pie>
                <h4 class="margin:8px 0 32px 0;">警报占比</h4>
                <pie [hasLegend]="true" subTitle="警报数量" [height]="248" [lineWidth]="4" [total]="salesTotal" [data]="salesPieData" [valueFormat]="handlePieValueFormat"></pie>
            </ng-template>
        </nz-card>
    </div>