| New file | 
|  |  |  | 
|---|
|  |  |  | <div class="content__title"> | 
|---|
|  |  |  | <h1> | 
|---|
|  |  |  | Fullscreen Table | 
|---|
|  |  |  | <small>使用 | 
|---|
|  |  |  | <a href="//ng-alain.com/components/simple-table" target="_blank">simple-table</a>、 | 
|---|
|  |  |  | <a href="//ng-alain.com/components/full-content" target="_blank">full-content</a> 组合,由于 nz-table 固定表头暂不支持自适应,因此表格的展示的效果在响应式里面效果并不是特别好。</small> | 
|---|
|  |  |  | </h1> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <full-content (fullscreenChange)="fullChange($event)"> | 
|---|
|  |  |  | <nz-card> | 
|---|
|  |  |  | <div nz-row class="mb-md"> | 
|---|
|  |  |  | <div nz-col nzSpan="12"> | 
|---|
|  |  |  | <form nz-form [nzLayout]="'inline'"> | 
|---|
|  |  |  | <nz-form-item> | 
|---|
|  |  |  | <nz-form-label nzFor="userid">User ID</nz-form-label> | 
|---|
|  |  |  | <nz-form-control> | 
|---|
|  |  |  | <input nz-input [(ngModel)]="args.userid" name="userid" id="userid"> | 
|---|
|  |  |  | </nz-form-control> | 
|---|
|  |  |  | </nz-form-item> | 
|---|
|  |  |  | <nz-form-item> | 
|---|
|  |  |  | <nz-form-control> | 
|---|
|  |  |  | <button nz-button [nzType]="'primary'" (click)="st.load()" [nzLoading]="http.loading">Search</button> | 
|---|
|  |  |  | <button nz-button (click)="st.load({_allow_anonymous: true})" [disabled]="http.loading">Clear</button> | 
|---|
|  |  |  | </nz-form-control> | 
|---|
|  |  |  | </nz-form-item> | 
|---|
|  |  |  | </form> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div nz-col nzSpan="12"> | 
|---|
|  |  |  | <div class="text-right"> | 
|---|
|  |  |  | <nz-dropdown> | 
|---|
|  |  |  | <button nz-button nz-dropdown> | 
|---|
|  |  |  | <span>Export</span> | 
|---|
|  |  |  | <i class="anticon anticon-down"></i> | 
|---|
|  |  |  | </button> | 
|---|
|  |  |  | <ul nz-menu> | 
|---|
|  |  |  | <li nz-menu-item>Excel</li> | 
|---|
|  |  |  | <li nz-menu-item>JSON</li> | 
|---|
|  |  |  | <li nz-menu-item>PNG</li> | 
|---|
|  |  |  | </ul> | 
|---|
|  |  |  | </nz-dropdown> | 
|---|
|  |  |  | <button nz-button [nzType]="'default'" full-toggle class="ml-sm">Full</button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <simple-table #st [data]="url" [extraParams]="args" [resReName]="{list: 'results' }" [total]="total" [ps]="ps" [columns]="columns" | 
|---|
|  |  |  | [scroll]="scroll"> | 
|---|
|  |  |  | <ng-template st-row="events" let-item let-index="index"> | 
|---|
|  |  |  | <g2-mini-bar height="15" theme="mini" color="#999" borderWidth="3" [padding]="[0, 0, 0, 0]" [data]="events"></g2-mini-bar> | 
|---|
|  |  |  | </ng-template> | 
|---|
|  |  |  | </simple-table> | 
|---|
|  |  |  | </nz-card> | 
|---|
|  |  |  | </full-content> | 
|---|