<pro-header [title]="'安装用户列表'"></pro-header> 
 | 
<nz-card [nzBordered]="false"> 
 | 
  <form nz-form (ngSubmit)="load(true)" [nzLayout]="'inline'"> 
 | 
    <div nz-row [nzGutter]="24"> 
 | 
      <div nz-col [nzSpan]="8" class="mb-md"> 
 | 
        <div nz-form-item class="d-flex"> 
 | 
          <div nz-form-label><label for="u_name">姓名</label></div> 
 | 
          <div nz-form-control class="flex-1"> 
 | 
            <nz-input [(ngModel)]="q.u_name" name="u_name" [nzSize]="'large'" [nzPlaceHolder]="'请输入姓名'" nzId="u_name"></nz-input> 
 | 
          </div> 
 | 
        </div> 
 | 
      </div> 
 | 
      <div nz-col [nzSpan]="8" class="mb-md"> 
 | 
        <div nz-form-item class="d-flex"> 
 | 
          <div nz-form-label><label for="u_mobile">账号/电话</label></div> 
 | 
          <div nz-form-control class="flex-1"> 
 | 
            <nz-input [(ngModel)]="q.u_mobile" name="u_mobile" [nzSize]="'large'" [nzPlaceHolder]="'请输入账号'" nzId="u_mobile"></nz-input> 
 | 
          </div> 
 | 
        </div> 
 | 
      </div> 
 | 
      <div nz-col [nzSpan]="8" class="mb-md"> 
 | 
                <div nz-form-item class="d-flex"> 
 | 
                    <div nz-form-label> 
 | 
                        <label>是否删除</label> 
 | 
                    </div> 
 | 
                    <div nz-form-control class="flex-1"> 
 | 
                        <nz-select [(ngModel)]="q.isDelete" name="isDelete" [nzSize]="'large'"> 
 | 
                            <nz-option *ngFor="let option of isDeleteOptions" [nzLabel]="option.label" [nzValue]="option.value" ></nz-option> 
 | 
                        </nz-select> 
 | 
                    </div> 
 | 
                </div> 
 | 
            </div> 
 | 
      <div nz-col [nzSpan]="8" class="mb-md"> 
 | 
        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="loading" [nzSize]="'large'">查询</button> 
 | 
        <button nz-button type="reset" [nzSize]="'large'" class="mx-sm">重置</button> 
 | 
      </div> 
 | 
    </div> 
 | 
  </form> 
 | 
  <div class="mb-md"> 
 | 
    <button nz-button (click)="add()" [nzType]="'primary'" [nzSize]="'large'"> 
 | 
      <i class="anticon anticon-plus"></i><span>新建</span> 
 | 
    </button> 
 | 
    <ng-container *ngIf="selectedRows.length > 0"> 
 | 
       <button nz-button [nzSize]="'large'" (click)="remove()">批量删除</button> 
 | 
    </ng-container> 
 | 
  </div> 
 | 
  <div class="mb-md"> 
 | 
    <nz-alert [nzType]="'info'" [nzShowIcon]="true"> 
 | 
        <span alert-body> 
 | 
            已选择 <strong class="text-primary">{{selectedRows.length}}</strong> 项 
 | 
        </span> 
 | 
    </nz-alert> 
 | 
  </div> 
 | 
  <nz-table #nzTable 
 | 
            [nzAjaxData]="data" 
 | 
            [nzLoading]="loading" 
 | 
            [nzTotal]="total" 
 | 
            [(nzPageIndex)]="q.pi" 
 | 
            [nzPageSize]="q.ps" 
 | 
            [nzShowTotal]="true" 
 | 
            (nzPageIndexChange)="load()"> 
 | 
    <thead nz-thead> 
 | 
    <tr> 
 | 
      <th nz-th [nzCheckbox]="true"> 
 | 
        <label nz-checkbox [(ngModel)]="allChecked" [nzIndeterminate]="indeterminate" (ngModelChange)="checkAll($event)"></label> 
 | 
      </th> 
 | 
      <th nz-th><span>姓名</span></th> 
 | 
      <th nz-th><span>账号/电话</span></th> 
 | 
      <th nz-th><span>电子邮件</span></th> 
 | 
      <th nz-th><span>微信号</span></th> 
 | 
      <th nz-th><span>组织</span></th> 
 | 
      <th nz-th><span>创建日期</span></th> 
 | 
      <th nz-th> 
 | 
        <span>过期日期</span> 
 | 
        <nz-table-sort [(nzValue)]="sortMap.updatedAt" (nzValueChange)="sort('expire_time', $event)"></nz-table-sort> 
 | 
      </th> 
 | 
      <th nz-th><span>操作</span></th> 
 | 
    </tr> 
 | 
    </thead> 
 | 
    <tbody nz-tbody> 
 | 
    <tr nz-tbody-tr *ngFor="let i of nzTable.data"> 
 | 
      <td nz-td [nzCheckbox]="true"> 
 | 
        <label nz-checkbox [(ngModel)]="i.checked" (ngModelChange)="refreshStatus($event)"> 
 | 
        </label> 
 | 
      </td> 
 | 
      <td nz-td>{{i.name}}</td> 
 | 
      <td nz-td>{{i.mobile}}</td> 
 | 
      <td nz-td>{{i.email}}</td> 
 | 
      <td nz-td>{{i.weixin}}</td> 
 | 
      <td nz-td>{{i.organizationId}}</td> 
 | 
      <td nz-td>{{format_date(i.createTime)}}</td> 
 | 
      <td nz-td>{{format_date(i.expireTime)}}</td> 
 | 
      <td nz-td> 
 | 
        <a (click)="edit(i)">编辑</a> 
 | 
        <span nz-table-divider></span> 
 | 
          <nz-popconfirm [nzTitle]="'确定要删除该用户吗?'" [nzOkText]="'Yes'" [nzCancelText]="'No'" (nzOnConfirm)="delete(i)" > 
 | 
            <a nz-popconfirm>删除</a> 
 | 
          </nz-popconfirm> 
 | 
          <span nz-table-divider></span> 
 | 
          <nz-dropdown> 
 | 
              <a class="ant-dropdown-link" nz-dropdown> 
 | 
                  更多 
 | 
                  <i class="anticon anticon-down"></i> 
 | 
              </a> 
 | 
              <ul nz-menu> 
 | 
                  <li nz-menu-item> 
 | 
                      <a (click)="showResetPwdWindow(i)">修改密码</a> 
 | 
                  </li> 
 | 
              </ul> 
 | 
          </nz-dropdown> 
 | 
      </td> 
 | 
    </tr> 
 | 
    </tbody> 
 | 
  </nz-table> 
 | 
</nz-card> 
 | 
<!-- 修改密码弹窗 --> 
 | 
<nz-modal [nzVisible]="resetPwdWindowIsVisible" [nzTitle]="'修改密码'" [nzContent]="modalContent" (nzOnCancel)="resetPwdCancel()" 
 | 
    (nzOnOk)="resetPwdOk()" [nzConfirmLoading]="isResetPwdLoading"> 
 | 
    <ng-template #modalContent> 
 | 
        <form nz-form [formGroup]="resetPwdForm"> 
 | 
            <div nz-form-item nz-row> 
 | 
                <div nz-form-label nz-col [nzSm]="6" [nzXs]="24"> 
 | 
                    <label for="name" >账号</label> 
 | 
                </div> 
 | 
                <div nz-form-control nz-col [nzSm]="14" [nzXs]="24"> 
 | 
                    <h4 class="h4">{{ getFormControl('name').value }}</h4> 
 | 
                </div> 
 | 
            </div> 
 | 
            <div nz-form-item nz-row> 
 | 
                <div nz-form-label nz-col [nzSm]="6" [nzXs]="24"> 
 | 
                    <label for="password" nz-form-item-required>密码</label> 
 | 
                </div> 
 | 
                <div nz-form-control nz-col [nzSm]="14" [nzXs]="24" nzHasFeedback> 
 | 
                    <nz-input [nzSize]="'large'" formControlName="password" [nzType]="'password'" [nzId]="'password'" (ngModelChange)="updateConfirmValidator()"></nz-input> 
 | 
                    <div nz-form-explain *ngIf="getFormControl('password').dirty&&getFormControl('password').hasError('required')">请输入密码!</div> 
 | 
                </div> 
 | 
            </div> 
 | 
            <div nz-form-item nz-row> 
 | 
                <div nz-form-label nz-col [nzSm]="6" [nzXs]="24"> 
 | 
                    <label for="checkPassword" nz-form-item-required>确认密码</label> 
 | 
                </div> 
 | 
                <div nz-form-control nz-col [nzSm]="14" [nzXs]="24" nzHasFeedback> 
 | 
                    <nz-input [nzSize]="'large'" formControlName="checkPassword" [nzType]="'password'" [nzId]="'checkPassword'"></nz-input> 
 | 
                    <div nz-form-explain *ngIf="getFormControl('checkPassword').dirty&&getFormControl('checkPassword').hasError('required')">请确认密码!</div> 
 | 
                    <div nz-form-explain *ngIf="getFormControl('checkPassword').dirty&&getFormControl('checkPassword').hasError('confirm')">两次输入不一致!</div> 
 | 
                </div> 
 | 
            </div> 
 | 
        </form> 
 | 
    </ng-template> 
 | 
</nz-modal> 
 |