<div class="modal-header">
  <div *ngIf="!area">省份【{{currentEntity.province_name}}】地市列表</div>
  <div *ngIf="area">地区【{{area.area_name}}】县市列表</div>
</div>
<div class="modal-body">
  <div class=" table-responsive bg-white" [hidden]="area">
    <table class="table table-striped table-hover table-bordered">
      <thead>
      <tr>
        <th><span (click)="pager.sort('area_id')">地区代码</span></th>
        <th><span (click)="pager.sort('area_name')">地区名称</span></th>
        <th class="th-b-1"></th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let v of ResponseArray; let i = index">
        <td>{{v.area_id}}</td>
        <td>{{v.area_name}}</td>
        <td>
          <span class="table-button" title="查看下属县市" (click)="showCity(v)">
            <em class="fa-lg fas fa-list"></em>
          </span>
        </td>
      </tr>
      </tbody>
    </table>
  </div>

  <div class=" table-responsive bg-white" *ngIf="area">
    <table class="table table-striped table-hover table-bordered">
      <thead>
      <tr>
        <th><span (click)="pager.sort('city_id')">县市代码</span></th>
        <th><span (click)="pager.sort('city_name')">县市名称</span></th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let v of ajax.getArray(); let i = index">
        <td>{{v.city_id}}</td>
        <td>{{v.city_name}}</td>
      </tr>
      </tbody>
    </table>
  </div>
</div>

<div class="modal-footer justify-content-between">
  <div>
    <button class="btn btn-info" type="button" (click)="area = undefined" *ngIf="area === undefined">返回地区列表</button>
    <frame-ajax url="frame/region/city/area.htm" [autoRequest]="false" ajaxDataType="array" #ajax></frame-ajax>
  </div>
  <div>
    <button class="btn btn-secondary" type="button" (click)="closeWindow()">关闭窗口</button>
  </div>
</div>


