<div nz-row class="breadcrumbs">
  <div nz-col nzSpan="16">
    <nz-breadcrumb class="padding-8-0">
      <nz-breadcrumb-item>
        首页
      </nz-breadcrumb-item>
      <nz-breadcrumb-item>
        <a>项目管理</a>
      </nz-breadcrumb-item>
      <nz-breadcrumb-item>
        运维费用
      </nz-breadcrumb-item>
    </nz-breadcrumb>
  </div>
  <div nz-col nzSpan="8" class="text-right">
    <button (click)="ngOnInit()" nz-button nzType="primary"><i class="anticon anticon-sync"></i></button>
    <smart-full-screen></smart-full-screen>
  </div>
</div>
<div nz-row [nzGutter]="4" class="search-form">
  <div nz-col nzSpan="6">
    <nz-select nzAllowClear style="width: 100%;" [(ngModel)]="obj.name" nzPlaceHolder="所在项目">
      <ng-container *ngFor="let item of statusList">
        <nz-option [nzLabel]="item.key" [nzValue]="item.value"></nz-option>
      </ng-container>
    </nz-select>
  </div>
  <div nz-col nzSpan="8">
    <input type="text" (keyup.enter)="search()" nz-input [(ngModel)]="obj.people" placeholder="填 报 人">
  </div>
  <div nz-col nzSpan="2">
    <button (click)="search()"
            nz-button nzType="default"><i class="anticon anticon-search" style="color: #6097b7"></i>搜索
    </button>
  </div>
</div>
<div nz-row [nzGutter]="4" class="padding-15-0">
  <div nz-col nzSpan="12">
    时&nbsp;&nbsp;&nbsp;&nbsp;间:
    <nz-radio-group [(ngModel)]="obj.startTime">
      <label *ngFor="let item of statusList" (click)="search()" nz-radio-button
             [nzValue]="item.key">{{item.value}}</label>
    </nz-radio-group>
  </div>
  <div nz-col nzSpan="12">
    <nz-date-picker
            [nzFormat]="timeFormat"
            [(ngModel)]="obj.startTime"
            nzPlaceHolder="开始时间"></nz-date-picker>
    <nz-date-picker
            [nzFormat]="timeFormat"
            [(ngModel)]="obj.endTime"
            nzPlaceHolder="结束时间"></nz-date-picker>
  </div>
</div>

<div nz-row [nzGutter]="4" class="padding-15-0">
  <div nz-col nzSpan="18">
    费用类型:
    <nz-radio-group [(ngModel)]="obj.type">
      <label *ngFor="let item of costType" (click)="search()" nz-radio-button
             [nzValue]="item.key">{{item.value}}</label>
    </nz-radio-group>
  </div>
  <div nz-col nzSpan="3">
    <button (click)="search()"
            nz-button nzType="default"><i class="anticon anticon-search" style="color: #6097b7"></i>新增运维费用
    </button>
  </div>
</div>

<nz-table #nzTable [nzData]="page.list" [nzLoading]="page.isLoading" [nzFrontPagination]="false"
          [nzTotal]="page.totalNum"
          [nzPageIndex]="page.pageNum" [nzPageSize]="page.pageCount" (nzPageIndexChange)="change($event)">
  <thead>
  <tr>
    <th>维护项目</th>
    <th>填报时间</th>
    <th>填报人</th>
    <th>费用说明</th>
    <th>总费用</th>
    <th>备件采购</th>
    <th>委外费用</th>
    <th>其他费用</th>
    <th>操作</th>
  </tr>
  </thead>
  <tbody>
  <tr *ngFor="let data of nzTable.data">
    <td>{{data.name}}</td>
    <td>{{data.timeStr | date:'yyyy-MM-dd HH:mm:ss'}}</td>
    <td>{{data.people}}</td>
    <td>{{data.costdescribe}}</td>
    <td>{{data.total}}</td>
    <td>{{data.purchasenum}}项/{{data.purchasemoney}}元</td>
    <td>{{data.outsourcingnum}}项/{{data.outsourcingmoney}}元</td>
    <td>{{data.othernum}}项/{{data.othermoney}}元</td>
    <td class="handle text-center main-color">
      <span>查看</span>
    </td>
  </tr>
  </tbody>
</nz-table>
