<nz-card [nzBordered]="false">
|
<form nz-form [nzLayout]="'inline'">
|
<standard-form-row [title]="'所属类目'" block style="padding-bottom: 11px;">
|
<nz-form-item>
|
<nz-form-control>
|
<tag-select>
|
<nz-tag *ngFor="let i of categories; let idx = index" nzMode="checkable" [nzChecked]="i.value" (nzCheckedChange)="changeCategory($event, idx)">
|
{{i.text}}
|
</nz-tag>
|
</tag-select>
|
</nz-form-control>
|
</nz-form-item>
|
</standard-form-row>
|
<standard-form-row [title]="'owner'" grid>
|
<nz-form-item>
|
<nz-form-control>
|
<nz-select [(ngModel)]="q.owners" name="owners" [nzMode]="'tags'" style="width: 286px;">
|
<nz-option *ngFor="let i of owners" [nzLabel]="i.name" [nzValue]="i.id"></nz-option>
|
</nz-select>
|
<a class="ml-sm" (click)="setOwner()">只看自己的</a>
|
</nz-form-control>
|
</nz-form-item>
|
</standard-form-row>
|
<standard-form-row [title]="'其它选项'" grid last>
|
<nz-row [nzGutter]="16">
|
<nz-col nzXl="8" nzLg="10" nzMd="12" nzSm="24" nzXs="24">
|
<nz-form-item>
|
<nz-form-label nzFor="rate">活跃用户</nz-form-label>
|
<nz-form-control>
|
<nz-select [(ngModel)]="q.user" name="user" [nzPlaceHolder]="'不限'" [nzShowSearch]="true" style="width: 200px;">
|
<nz-option [nzLabel]="'李三'" [nzValue]="'lisa'"></nz-option>
|
</nz-select>
|
</nz-form-control>
|
</nz-form-item>
|
</nz-col>
|
<nz-col nzXl="8" nzLg="10" nzMd="12" nzSm="24" nzXs="24">
|
<nz-form-item>
|
<nz-form-label nzFor="rate">好评度</nz-form-label>
|
<nz-form-control>
|
<nz-select [(ngModel)]="q.rate" name="rate" [nzPlaceHolder]="'不限'" [nzShowSearch]="true" style="width: 200px;">
|
<nz-option [nzLabel]="'优秀'" [nzValue]="'good'"></nz-option>
|
</nz-select>
|
</nz-form-control>
|
</nz-form-item>
|
</nz-col>
|
</nz-row>
|
</standard-form-row>
|
</form>
|
</nz-card>
|
<nz-card [nzBordered]="false">
|
<nz-list nzItemLayout="vertical" [nzLoading]="loading" [nzDataSource]="list" [nzRenderItem]="item" [nzLoadMore]="loadMore">
|
<ng-template #item let-item>
|
<nz-list-item [nzContent]="nzContent" [nzExtra]="nzExtra" [nzActions]="[op1,op2,op3]">
|
<ng-template #op1>
|
<i class="anticon anticon-star-o mr-sm"></i>{{item.star}}</ng-template>
|
<ng-template #op2>
|
<i class="anticon anticon-like-o mr-sm"></i>{{item.like}}</ng-template>
|
<ng-template #op3>
|
<i class="anticon anticon-message mr-sm"></i>{{item.message}}</ng-template>
|
<ng-template #nzExtra>
|
<div style="width: 272px; height: 1px;"></div>
|
</ng-template>
|
<nz-list-item-meta [nzTitle]="nzTitle" [nzDescription]="nzDescription">
|
<ng-template #nzTitle>
|
<a href="{{item.href}}" target="_blank">{{item.title}}</a>
|
</ng-template>
|
<ng-template #nzDescription>
|
<nz-tag>Alain</nz-tag>
|
<nz-tag>ng-zorro-antd</nz-tag>
|
<nz-tag>Ant Design</nz-tag>
|
</ng-template>
|
</nz-list-item-meta>
|
<ng-template #nzContent>
|
<p>{{item.content}}</p>
|
<div class="mt-md d-flex">
|
<nz-avatar [nzSrc]="item.avatar" [nzSize]="'small'" class="mr-sm"></nz-avatar>
|
<a href="{{item.href}}" target="_blank">{{item.owner}}</a>
|
<span class="px-sm">发布在</span>
|
<a href="{{item.href}}" target="_blank">{{item.href}}</a>
|
<time class="pl-md text-grey" title="{{item.updatedAt}}">{{item.updatedAt | _date}}</time>
|
</div>
|
</ng-template>
|
</nz-list-item>
|
</ng-template>
|
<ng-template #loadMore>
|
<div class="text-center mt-md">
|
<button nz-button (click)="getData(true)" [nzLoading]="loading" [nzType]="'dashed'" style="min-width:200px;">加载更多</button>
|
</div>
|
</ng-template>
|
</nz-list>
|
</nz-card>
|
