Skip to content

Commit

Permalink
chore: fix
Browse files Browse the repository at this point in the history
  • Loading branch information
@cipchk
cipchk committed Nov 24, 2023
1 parent 66c85ff commit 002f803
Show file tree
Hide file tree
Showing 9 changed files with 397 additions and 343 deletions.
62 changes: 34 additions & 28 deletions packages/abc/st/st-td.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -87,36 +87,42 @@
<cell *ngSwitchCase="'cell'" [value]="i._values[cIdx].text" [options]="i._values[cIdx].cell ?? c.cell" />
<ng-template *ngSwitchCase="'widget'" st-widget-host [record]="i" [column]="c" />
<ng-container *ngSwitchDefault>
<span
*ngIf="c.safeType !== 'text'"
[innerHTML]="i._values[cIdx]._text"
[attr.title]="c._isTruncate ? i._values[cIdx].text : null"
></span>
<span
*ngIf="c.safeType === 'text'"
[innerText]="i._values[cIdx]._text"
[attr.title]="c._isTruncate ? i._values[cIdx].text : null"
></span>
@if (c.safeType === 'text') {
<span [innerText]="i._values[cIdx]._text" [attr.title]="c._isTruncate ? i._values[cIdx].text : null"></span>
} @else {
<span [innerHTML]="i._values[cIdx]._text" [attr.title]="c._isTruncate ? i._values[cIdx].text : null"></span>
}
</ng-container>
</ng-container>
<ng-container *ngFor="let btn of i._values[cIdx].buttons; let last = last">
<a *ngIf="btn.children!.length > 0" nz-dropdown [nzDropdownMenu]="btnMenu" nzOverlayClassName="st__btn-sub">
<span [innerHTML]="btn._text"></span>
<i nz-icon nzType="down"></i>
</a>
<nz-dropdown-menu #btnMenu="nzDropdownMenu">
<ul nz-menu>
<ng-container *ngFor="let subBtn of btn.children!">
<li *ngIf="subBtn.type !== 'divider'" nz-menu-item [class.st__btn-disabled]="subBtn._disabled">
<ng-template [ngTemplateOutlet]="btnTpl" [ngTemplateOutletContext]="{ $implicit: subBtn, child: true }" />
</li>
<li *ngIf="subBtn.type === 'divider'" nz-menu-divider></li>
</ng-container>
</ul>
</nz-dropdown-menu>
<span *ngIf="btn.children!.length === 0" [class.st__btn-disabled]="btn._disabled">
<ng-template [ngTemplateOutlet]="btnTpl" [ngTemplateOutletContext]="{ $implicit: btn, child: false }" />
</span>
<nz-divider *ngIf="!last" nzType="vertical" />
@if (btn.children!.length > 0) {
<a nz-dropdown [nzDropdownMenu]="btnMenu" nzOverlayClassName="st__btn-sub">
<span [innerHTML]="btn._text"></span>
<i nz-icon nzType="down"></i>
</a>
<nz-dropdown-menu #btnMenu="nzDropdownMenu">
<ul nz-menu>
<ng-container *ngFor="let subBtn of btn.children!">
@if (subBtn.type === 'divider') {
<li nz-menu-divider></li>
} @else {
<li nz-menu-item [class.st__btn-disabled]="subBtn._disabled">
<ng-template
[ngTemplateOutlet]="btnTpl"
[ngTemplateOutletContext]="{ $implicit: subBtn, child: true }"
/>
</li>
}
</ng-container>
</ul>
</nz-dropdown-menu>
} @else {
<span [class.st__btn-disabled]="btn._disabled">
<ng-template [ngTemplateOutlet]="btnTpl" [ngTemplateOutletContext]="{ $implicit: btn, child: false }" />
</span>
}
@if (!last) {
<nz-divider nzType="vertical" />
}
</ng-container>
</ng-container>
273 changes: 142 additions & 131 deletions packages/abc/st/st.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,11 @@
<ng-template #titleTpl let-i>
<span [innerHTML]="i._text"></span>
<small *ngIf="i.optional" class="st__head-optional" [innerHTML]="i.optional"></small>
<i
*ngIf="i.optionalHelp"
class="st__head-tip"
nz-tooltip
[nzTooltipTitle]="i.optionalHelp"
nz-icon
nzType="question-circle"
></i>
@if (i.optional) {
<small class="st__head-optional" [innerHTML]="i.optional"></small>
}
@if (i.optionalHelp) {
<i class="st__head-tip" nz-tooltip [nzTooltipTitle]="i.optionalHelp" nz-icon nzType="question-circle"></i>
}
</ng-template>
<ng-template #chkAllTpl let-custom>
<label
Expand Down Expand Up @@ -56,155 +53,169 @@
(contextmenu)="onContextmenu($event)"
[class.st__no-column]="noColumns"
>
<thead *ngIf="showHeader">
<tr *ngFor="let row of _headers; let rowFirst = first">
<th *ngIf="rowFirst && expand" nzWidth="50px" [rowSpan]="_headers.length"></th>
<ng-container *ngFor="let h of row; let index = index; let last = last">
<th
*let="h.column as _c"
[colSpan]="h.colSpan"
[rowSpan]="h.rowSpan"
[nzWidth]="$any(_c).width"
[nzLeft]="_c._left!"
[nzRight]="_c._right!"
[ngClass]="_c._className"
[attr.data-col]="_c.indexKey"
[attr.data-col-index]="index"
[nzShowSort]="_c._sort.enabled"
[nzSortOrder]="$any(_c)._sort.default"
(nzSortOrderChange)="sort(_c, index, $event)"
[nzCustomFilter]="!!_c.filter"
[class.st__has-filter]="_c.filter"
nz-resizable
[nzDisabled]="last || $any(_c).resizable.disabled"
[nzMaxWidth]="$any(_c).resizable.maxWidth"
[nzMinWidth]="$any(_c).resizable.minWidth"
[nzBounds]="$any(_c).resizable.bounds"
[nzPreview]="$any(_c).resizable.preview"
(nzResizeEnd)="colResize($event, _c)"
>
<nz-resize-handle *ngIf="$any(!last && !$any(_c).resizable.disabled)" nzDirection="right">
<i></i>
</nz-resize-handle>
<ng-template
#renderTitle
[ngTemplateOutlet]="_c.__renderTitle!"
[ngTemplateOutletContext]="{ $implicit: h.column, index: index }"
/>
<ng-container *ngIf="!_c.__renderTitle; else renderTitle">
<ng-container [ngSwitch]="_c.type">
<ng-container *ngSwitchCase="'checkbox'">
<ng-container *ngIf="_c.selections!.length === 0">
<ng-template [ngTemplateOutlet]="chkAllTpl" [ngTemplateOutletContext]="{ $implicit: false }" />
</ng-container>
<div *ngIf="_c.selections!.length > 0" class="ant-table-selection">
<ng-template [ngTemplateOutlet]="chkAllTpl" [ngTemplateOutletContext]="{ $implicit: true }" />
<div *ngIf="_c.selections!.length" class="ant-table-selection-extra">
<div
nz-dropdown
nzPlacement="bottomLeft"
[nzDropdownMenu]="selectionMenu"
class="ant-table-selection-down st__checkall-selection"
>
<i nz-icon nzType="down"></i>
@if (showHeader) {
<thead>
<tr *ngFor="let row of _headers; let rowFirst = first">
@if (rowFirst && expand) {
<th nzWidth="50px" [rowSpan]="_headers.length"></th>
}
<ng-container *ngFor="let h of row; let index = index; let last = last">
<th
*let="h.column as _c"
[colSpan]="h.colSpan"
[rowSpan]="h.rowSpan"
[nzWidth]="$any(_c).width"
[nzLeft]="_c._left!"
[nzRight]="_c._right!"
[ngClass]="_c._className"
[attr.data-col]="_c.indexKey"
[attr.data-col-index]="index"
[nzShowSort]="_c._sort.enabled"
[nzSortOrder]="$any(_c)._sort.default"
(nzSortOrderChange)="sort(_c, index, $event)"
[nzCustomFilter]="!!_c.filter"
[class.st__has-filter]="_c.filter"
nz-resizable
[nzDisabled]="last || $any(_c).resizable.disabled"
[nzMaxWidth]="$any(_c).resizable.maxWidth"
[nzMinWidth]="$any(_c).resizable.minWidth"
[nzBounds]="$any(_c).resizable.bounds"
[nzPreview]="$any(_c).resizable.preview"
(nzResizeEnd)="colResize($event, _c)"
>
@if ($any(!last && !$any(_c).resizable.disabled)) {
<nz-resize-handle nzDirection="right">
<i></i>
</nz-resize-handle>
}
<ng-template
#renderTitle
[ngTemplateOutlet]="_c.__renderTitle!"
[ngTemplateOutletContext]="{ $implicit: h.column, index: index }"
/>
<ng-container *ngIf="!_c.__renderTitle; else renderTitle">
<ng-container [ngSwitch]="_c.type">
<ng-container *ngSwitchCase="'checkbox'">
@if (_c.selections!.length === 0) {
<ng-template [ngTemplateOutlet]="chkAllTpl" [ngTemplateOutletContext]="{ $implicit: false }" />
} @else {
<div class="ant-table-selection">
<ng-template [ngTemplateOutlet]="chkAllTpl" [ngTemplateOutletContext]="{ $implicit: true }" />
@if (_c.selections!.length) {
<div class="ant-table-selection-extra">
<div
nz-dropdown
nzPlacement="bottomLeft"
[nzDropdownMenu]="selectionMenu"
class="ant-table-selection-down st__checkall-selection"
>
<i nz-icon nzType="down"></i>
</div>
</div>
}
<nz-dropdown-menu #selectionMenu="nzDropdownMenu">
<ul nz-menu class="ant-table-selection-menu">
@for (rw of _c.selections; track $index) {
<li nz-menu-item (click)="_rowSelection(rw)" [innerHTML]="rw.text"></li>
}
</ul>
</nz-dropdown-menu>
</div>
</div>
<nz-dropdown-menu #selectionMenu="nzDropdownMenu">
<ul nz-menu class="ant-table-selection-menu">
<li
nz-menu-item
*ngFor="let rw of _c.selections"
(click)="_rowSelection(rw)"
[innerHTML]="rw.text"
></li>
</ul>
</nz-dropdown-menu>
</div>
</ng-container>
<ng-container *ngSwitchDefault>
<ng-template [ngTemplateOutlet]="titleTpl" [ngTemplateOutletContext]="{ $implicit: _c.title }" />
}
</ng-container>
<ng-container *ngSwitchDefault>
<ng-template [ngTemplateOutlet]="titleTpl" [ngTemplateOutletContext]="{ $implicit: _c.title }" />
</ng-container>
</ng-container>
</ng-container>
</ng-container>
<ng-container *ngIf="_c.filter">
<st-filter
nz-th-extra
[col]="h.column"
[f]="_c.filter"
[locale]="locale"
(n)="handleFilterNotify($event)"
(handle)="_handleFilter(_c, $event)"
/>
</ng-container>
</th>
</ng-container>
</tr>
</thead>
@if (_c.filter) {
<st-filter
nz-th-extra
[col]="h.column"
[f]="_c.filter"
[locale]="locale"
(n)="handleFilterNotify($event)"
(handle)="_handleFilter(_c, $event)"
/>
}
</th>
</ng-container>
</tr>
</thead>
}
<tbody class="st__body">
<ng-container *ngIf="!_loading">
@if (!_loading) {
<ng-template [ngTemplateOutlet]="bodyHeader!" [ngTemplateOutletContext]="{ $implicit: _statistical }" />
</ng-container>
}
<ng-template #bodyTpl let-i let-index="index">
<tr
[attr.data-index]="index"
(click)="_rowClick($event, i, index, false)"
(dblclick)="_rowClick($event, i, index, true)"
[ngClass]="i._rowClassName"
>
<td
*ngIf="expand"
[nzShowExpand]="expand && i.showExpand !== false"
[nzExpand]="i.expand"
(nzExpandChange)="_expandChange(i, $event)"
(click)="_stopPropagation($event)"
nzWidth="50px"
></td>
<ng-container *ngFor="let c of _columns; let cIdx = index">
@if (expand) {
<td
*ngIf="i._values[cIdx].props?.colSpan > 0 && i._values[cIdx].props?.rowSpan > 0"
[nzLeft]="!!c._left"
[nzRight]="!!c._right"
[attr.data-col-index]="cIdx"
[ngClass]="c._className"
[attr.colspan]="i._values[cIdx].props?.colSpan === 1 ? null : i._values[cIdx].props?.colSpan"
[attr.rowspan]="i._values[cIdx].props?.rowSpan === 1 ? null : i._values[cIdx].props?.rowSpan"
>
<span *ngIf="responsive" class="ant-table-rep__title">
<ng-template [ngTemplateOutlet]="titleTpl" [ngTemplateOutletContext]="{ $implicit: c.title }" />
</span>
<st-td [data]="_data" [i]="i" [index]="index" [c]="c" [cIdx]="cIdx" (n)="_handleTd($event)" />
</td>
[nzShowExpand]="expand && i.showExpand !== false"
[nzExpand]="i.expand"
(nzExpandChange)="_expandChange(i, $event)"
(click)="_stopPropagation($event)"
nzWidth="50px"
></td>
}
<ng-container *ngFor="let c of _columns; let cIdx = index">
@if (i._values[cIdx].props?.colSpan > 0 && i._values[cIdx].props?.rowSpan > 0) {
<td
[nzLeft]="!!c._left"
[nzRight]="!!c._right"
[attr.data-col-index]="cIdx"
[ngClass]="c._className"
[attr.colspan]="i._values[cIdx].props?.colSpan === 1 ? null : i._values[cIdx].props?.colSpan"
[attr.rowspan]="i._values[cIdx].props?.rowSpan === 1 ? null : i._values[cIdx].props?.rowSpan"
>
@if (responsive) {
<span class="ant-table-rep__title">
<ng-template [ngTemplateOutlet]="titleTpl" [ngTemplateOutletContext]="{ $implicit: c.title }" />
</span>
}
<st-td [data]="_data" [i]="i" [index]="index" [c]="c" [cIdx]="cIdx" (n)="_handleTd($event)" />
</td>
}
</ng-container>
</tr>
<tr [nzExpand]="i.expand">
<ng-template [ngTemplateOutlet]="expand" [ngTemplateOutletContext]="{ $implicit: i, index: index }" />
</tr>
</ng-template>
<ng-container *ngIf="!virtualScroll">
<ng-container *ngFor="let i of _data; let index = index">
<ng-template [ngTemplateOutlet]="bodyTpl" [ngTemplateOutletContext]="{ $implicit: i, index: index }" />
</ng-container>
</ng-container>
<ng-container *ngIf="virtualScroll">
@if (virtualScroll) {
<ng-template nz-virtual-scroll let-i let-index="index">
<ng-template [ngTemplateOutlet]="bodyTpl" [ngTemplateOutletContext]="{ $implicit: i, index: index }" />
</ng-template>
</ng-container>
<ng-container *ngIf="!_loading">
} @else {
<ng-container *ngFor="let i of _data; let index = index">
<ng-template [ngTemplateOutlet]="bodyTpl" [ngTemplateOutletContext]="{ $implicit: i, index: index }" />
</ng-container>
}
@if (!_loading) {
<ng-template [ngTemplateOutlet]="body!" [ngTemplateOutletContext]="{ $implicit: _statistical }" />
</ng-container>
}
</tbody>
<ng-template #totalTpl let-range="range" let-total>{{ renderTotal(total, range) }}</ng-template>
</nz-table>
<nz-dropdown-menu #contextmenuTpl="nzDropdownMenu">
<ul nz-menu class="st__contextmenu">
<ng-container *ngFor="let i of contextmenuList">
<li nz-menu-item *ngIf="i.children!.length === 0" (click)="i.fn!(i)" [innerHTML]="i.text"></li>
<li nz-submenu *ngIf="i.children!.length > 0" [nzTitle]="i.text">
<ul>
<li nz-menu-item *ngFor="let ci of i.children" (click)="ci.fn!(ci)" [innerHTML]="ci.text"></li>
</ul>
</li>
</ng-container>
@for (i of contextmenuList; track $index) {
@if (i.children!.length === 0) {
<li nz-menu-item (click)="i.fn!(i)" [innerHTML]="i.text"></li>
} @else {
<li nz-submenu [nzTitle]="i.text">
<ul>
@for (ci of i.children; track $index) {
<li nz-menu-item (click)="ci.fn!(ci)" [innerHTML]="ci.text"></li>
}
</ul>
</li>
}
}
</ul>
</nz-dropdown-menu>
Loading

0 comments on commit 002f803

Please sign in to comment.