<!-- start 面包屑 -->
<app-breadcrumb></app-breadcrumb>
<!-- end 面包屑 -->
<!--条件搜索-->

<nz-spin [nzSpinning]="loadingObject.spinning" nzTip="{{loadingObject.msg}}">
  <div class="inner-content">
    <form nz-form [formGroup]="searchForm" (ngSubmit)="search(searchForm.value)">
      <div nz-row>
        <div nz-col nzSpan="8">
          <nz-form-item>
            <nz-form-label [nzSpan]="8">订单号</nz-form-label>
            <nz-form-control [nzSpan]="14">
              <input nz-input formControlName="orderNo" />
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col nzSpan="8">
          <nz-form-item>
            <nz-form-label [nzSpan]="8">订单类型</nz-form-label>
            <nz-form-control [nzSpan]="14">
              <nz-select nzAllowClear formControlName="orderType">
                <nz-option *ngFor="let item of deviceOrderTypeArray" nzLabel="{{item.codeName}}" nzValue="{{item.codeValue}}"></nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col nzSpan="8">
          <nz-form-item>
            <nz-form-label [nzSpan]="8">设备类型</nz-form-label>
            <nz-form-control [nzSpan]="14">
              <nz-select nzAllowClear formControlName="deviceType">
                <nz-option *ngFor="let item of deviceTypeArray" nzLabel="{{item.codeName}}" nzValue="{{item.codeValue}}"></nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
        </div>
      </div>
      <div nz-row *ngIf="isCollapse">
        <div nz-col nzSpan="8">
          <nz-form-item>
            <nz-form-label [nzSpan]="8">订单状态</nz-form-label>
            <nz-form-control [nzSpan]="14">
              <nz-select nzAllowClear formControlName="status">
                <nz-option *ngFor="let item of deviceOrderStatusArray" nzLabel="{{item.codeName}}" nzValue="{{item.codeValue}}"></nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col nzSpan="8" *ngIf="roleType == 1">
          <nz-form-item>
            <nz-form-label [nzSpan]="8">公司</nz-form-label>
            <nz-form-control [nzSpan]="14">
              <input nz-input formControlName="companyName" />
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col nzSpan="8" *ngIf="roleType == 1 || roleType == 6">
          <nz-form-item>
            <nz-form-label [nzSpan]="8">代理商</nz-form-label>
            <nz-form-control [nzSpan]="14">
              <input nz-input formControlName="agentName" />
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col nzSpan="8" *ngIf="roleType == 1 || roleType == 2 || roleType == 6">
          <nz-form-item>
            <nz-form-label [nzSpan]="8">业务员</nz-form-label>
            <nz-form-control [nzSpan]="14">
              <input nz-input formControlName="salesmanName" />
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col nzSpan="8">
          <nz-form-item>
            <nz-form-label [nzSpan]="8">商户</nz-form-label>
            <nz-form-control [nzSpan]="14">
              <input nz-input formControlName="merName" />
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col nzSpan="8">
          <nz-form-item>
            <nz-form-label [nzSpan]="8">门店</nz-form-label>
            <nz-form-control [nzSpan]="14">
              <input nz-input formControlName="storeName" />
            </nz-form-control>
          </nz-form-item>
        </div>
      </div>

      <div nz-row>
        <div nz-col nzSpan="24" class="search-button">
          <button nz-button nzType="primary"><i nz-icon nzType="search" nzTheme="outline"></i>搜索</button>
          <button nz-button nzType="default" (click)="resetForm()"><i nz-icon nzType="reload" nzTheme="outline"></i>重置</button>
          <a class="collapse" (click)="toggleCollapse()">更多条件
            <i nz-icon [nzType]="isCollapse ? 'down' : 'up'"></i>
          </a>
        </div>
      </div>
    </form>
  </div>

  <div class="inner-content">
    <span>共计 {{dataObject.total?dataObject.total:0}} 条数据</span>
    <div class="operating-button">
    </div>

    <!--数组表格 -->
    <nz-table #basicTable
              [nzData]="dataObject.list"
              [nzTotal]="dataObject.total"
              [nzFrontPagination]="false"
              [nzLoading]="tableLoading"
              [nzPageIndex]="whereObject.pageNum"
              (nzPageIndexChange)="requestData($event)"
              [nzScroll]="{ x: '1150px'}">
      <thead>
      <tr>
        <th nzWidth="200px">商户</th>
        <th nzWidth="150px">门店</th>
        <th nzWidth="200px">订单编号</th>
        <th nzWidth="100px">订单类型</th>
        <th nzWidth="130px">设备类型</th>
        <th nzWidth="100px">需求数量</th>
        <th nzWidth="100px">支付金额</th>
        <th nzWidth="100px">支付方式</th>
        <th nzWidth="160px">创建时间</th>
        <th nzWidth="160px">支付时间</th>
        <th nzWidth="100px">订单状态</th>
        <th nzWidth="120px" nzRight="0px">操作</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let data of basicTable.data;let i = index">
        <td>{{data.merName}}</td>
        <td>{{data.storeName}}</td>
        <td>{{data.orderNo}}</td>
        <td>{{data.orderType | deviceOrderType}}</td>
        <td>{{data.deviceType | deviceType}}</td>
        <td>{{data.deviceNum}}</td>
        <td>{{data.payPrice}}</td>
        <td>{{data.payType | deviceOrderPayType}}</td>
        <td>{{data.createTime | date : 'yyyy-MM-dd HH:mm:ss'}}</td>
        <td>{{data.payTime | date : 'yyyy-MM-dd HH:mm:ss'}}</td>
        <td>{{data.status | deviceOrderStatus}}</td>
        <td nzRight="0px" class="table-td-operation">
          <a nz-dropdown [nzDropdownMenu]="menu">操作列表  <i nz-icon nzType="down"></i> </a>
          <nz-dropdown-menu #menu="nzDropdownMenu">
            <ul nz-menu nzSelectable>
              <li (click)="showDeviceListModal(data.orderAssignList)"  nz-menu-item>设备列表</li>
            </ul>
          </nz-dropdown-menu>
        </td>
      </tr>
      </tbody>
    </nz-table>
  </div>
</nz-spin>
<nz-modal [(nzVisible)]="deviceListModal" nzTitle="已分配设备" (nzOnCancel)="closeDeviceListModal()" nzWidth="700px" [nzFooter]="null">
  <nz-table #errorStudentTable [nzData]="orderAssignList">
    <thead>
    <tr>
      <th nzWidth="150px">订单类型</th>
      <th nzWidth="150px">设备类型</th>
      <th nzWidth="150px">设备编号</th>
      <th nzWidth="150px">状态</th>
    </tr>
    </thead>
    <tbody>
    <tr *ngFor="let data of errorStudentTable.data;let i = index">
      <td>{{data.orderType | deviceOrderType}}</td>
      <td>{{data.deviceType | deviceType}}</td>
      <td>{{data.deviceNo}}</td>
      <td>
        <span *ngIf="data.status == 1">使用中</span>
        <span *ngIf="data.status == 2">退款中</span>
        <span *ngIf="data.status == 3">已退款</span>
      </td>
    </tr>
    </tbody>
  </nz-table>
</nz-modal>
