fbs-mes-two-web/src/app/routes/efficiency-report/list/list.component.html

<page-header [action]="phActionTpl">
  <ng-template #phActionTpl>
    <button (click)="export()" nz-button nzType="primary" [nzLoading]="exportLoading">导出</button>
  </ng-template>
</page-header>
<nz-card>
  <form nz-form>
    <!-- 查询条件 -->
    <div nz-row [nzGutter]="{xs:12,sm:15,md:29,lg: 36, xl: 40}">

      <!-- 派工时间 -->
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="8">时间</nz-form-label>
          <nz-form-control [nzSpan]="16">
            <!-- <input [(ngModel)]="fbsWorkshopDispatchList.name" name="name" nz-input
              placeholder="请输入" /> -->
            <nz-date-picker name="fbsWorkshopDispatchList.start" [(ngModel)]="fbsWorkingStatistics.start"
              nzPlaceHolder="请选择">
            </nz-date-picker>
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="8" [nzNoColon]="true"></nz-form-label>
          <nz-form-control [nzSpan]="16">
            <!-- <input [(ngModel)]="fbsWorkshopDispatchList.name" name="name" nz-input
              placeholder="请输入" /> -->
            <nz-date-picker name="fbsWorkshopDispatchList.end" [(ngModel)]="fbsWorkingStatistics.end"
              nzPlaceHolder="请选择">
            </nz-date-picker>
          </nz-form-control>
        </nz-form-item>
      </div>
      <!-- 按钮 -->
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="4" [nzNoColon]="true"></nz-form-label>
          <nz-form-control [nzSpan]="20" >
            <!-- 查询 -->
            <button nz-button nzType="primary" (click)="query()">查询</button>
            &nbsp;&nbsp;
            <a *ngIf="!isShow" (click)="getShow()">展开&nbsp;<i nz-icon nzType="down" nzTheme="outline"></i></a>
            <a *ngIf="isShow" (click)="getShow()">收起&nbsp;<i nz-icon nzType="up" nzTheme="outline"></i></a>
          </nz-form-control>
        </nz-form-item>
      </div>
    </div>
    <div *ngIf="isShow">
    <div  nz-row [nzGutter]="{xs:12,sm:15,md:29,lg: 36, xl: 40}">
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="8">项目编号</nz-form-label>
          <nz-form-control [nzSpan]="16">
            <input [(ngModel)]="fbsWorkingStatistics.costItemCode" name="costItemCode" nz-input placeholder="请输入" />
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="8">项目名称</nz-form-label>
          <nz-form-control [nzSpan]="16">
            <input [(ngModel)]="fbsWorkingStatistics.projectName" name="projectName" nz-input placeholder="请输入" />
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="8">工作中心</nz-form-label>
          <nz-form-control [nzSpan]="16">
            <input [(ngModel)]="fbsWorkingStatistics.workCenter" name="workCenter" nz-input placeholder="请输入" />
          </nz-form-control>
        </nz-form-item>
      </div>
    </div>
    <div nz-row [nzGutter]="{xs:12,sm:15,md:29,lg: 36, xl: 40}">
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="8">订单编号</nz-form-label>
          <nz-form-control [nzSpan]="16">
            <input [(ngModel)]="fbsWorkingStatistics.orderNumber" name="orderNumber" nz-input placeholder="请输入" />
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="8">物料编码</nz-form-label>
          <nz-form-control [nzSpan]="16">
            <input [(ngModel)]="fbsWorkingStatistics.materielCode" name="materielCode" nz-input placeholder="请输入" />
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="8">物料名称</nz-form-label>
          <nz-form-control [nzSpan]="16">
            <input [(ngModel)]="fbsWorkingStatistics.materielName" name="materielName" nz-input placeholder="请输入" />
          </nz-form-control>
        </nz-form-item>
      </div>
    </div>
    <div nz-row [nzGutter]="{xs:12,sm:15,md:29,lg: 36, xl: 40}">
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="8">工序</nz-form-label>
          <nz-form-control [nzSpan]="16">
            <input [(ngModel)]="fbsWorkingStatistics.fbsTechnologicalProcessItemName" name="fbsTechnologicalProcessItemName" nz-input placeholder="请输入" />
          </nz-form-control>
        </nz-form-item>
      </div>
      <!-- 名称 -->
      <div nz-col nzXs="24" nzSm="4" nzLg="8">
        <nz-form-item class="nz-form-item">
          <nz-form-label [nzSpan]="8">姓名</nz-form-label>
          <nz-form-control [nzSpan]="16">
            <nz-select [(ngModel)]="fbsWorkingStatistics.personnelCode" name="personnelCode" style="width: 100%"
              nzShowSearch nzAllowClear nzPlaceHolder="请选择">
              <ng-container *ngFor="let proper of properList">
                <nz-option [nzLabel]="proper.personnelName" [nzValue]="proper.personnelCode"> </nz-option>
              </ng-container>
            </nz-select>
          </nz-form-control>
        </nz-form-item>
      </div>
    </div>
  </div>
  </form>
  <!-- 数据表 -->
  <nz-table nzSize="small" class="buttonDistance" [nzData]="dataList" [nzLoading]="isLoading"
    [nzFrontPagination]="false" #borderedTable [nzTotal]="page.total" [nzPageIndex]="page.current"
    (nzPageIndexChange)="pageIndexChange($event)">
    <thead>
      <tr>
        <th>项目编号</th>
        <th>项目名称</th>
        <th>工作中心</th>
        <th>订单编号</th>
        <th>物料编码</th>
        <th>物料名称</th>
        <th>工序</th>
       
        <th>人员编码</th>
        <th>姓名</th>
        <!-- <th>上岗时间</th>
        <th>下岗时间</th> -->
         <th nzAlign="center">工艺标准工时</th>
        <th nzAlign="center">实际工时</th>
        <th nzAlign="center">效率</th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let item of  borderedTable.data">
        <td>{{item.costItemCode}}</td>
        <td>{{item.projectName}}</td>
        <td>{{item.workCenter}}</td>
        <td>{{item.orderNumber}}</td>
        <td>{{item.materielCode}}</td>
        <td>{{item.materielName}}</td>
        <td>{{item.fbsTechnologicalProcessItemName}}</td>
       
        <td>{{item.personnelCode}}</td>
        <td>{{item.personnelName}}</td>
        <!-- <td>{{item.firstTime}}</td>
        <td>{{item.finalTime}}</td> -->
         <td nzAlign="center">{{item.standardWorkingHoursProcess}}</td>
        <td nzAlign="center">{{item.workingHours}}</td>
        <td nzAlign="center">{{item.efficiency}}%</td>
      </tr>
      <tr style="font-weight:bolder">
        <td>总计</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <!-- <td></td> -->
        <!-- <td></td> -->
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td nzAlign="center">{{totalList.standardWorkingHoursProcess}}</td>
        <td nzAlign="center">{{totalList.workingHoursTotal}}</td>
        <td nzAlign="center">{{totalList.efficiency}}%</td>

      </tr>
    </tbody>
  </nz-table>
</nz-card>