@lxlib/seed
Version:
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.1.1.
1,274 lines • 121 kB
JavaScript
/**
* @fileoverview added by tsickle
* Generated from: st.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { __awaiter, __decorate, __metadata } from "tslib";
import { DecimalPipe, DOCUMENT } from '@angular/common';
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Inject, Input, Optional, Output, Renderer2, TemplateRef, ViewChild, ViewEncapsulation, } from '@angular/core';
import { Router } from '@angular/router';
import { LXLIB_I18N_TOKEN, CNCurrencyPipe, DatePipe, LxlibLocaleService, DrawerHelper, ModalHelper, YNPipe, } from '@lxlib/theme';
import { deepMerge, deepMergeKey, InputBoolean, InputNumber, toBoolean, updateHostClass } from '@lxlib/util';
import { NzTableComponent, NzTableStyleService } from 'ng-zorro-antd/table';
import { from, of, Subject } from 'rxjs';
import { filter, takeUntil } from 'rxjs/operators';
import { STColumnSource } from './st-column-source';
import { STDataSource } from './st-data-source';
import { STExport } from './st-export';
import { STRowSource } from './st-row.directive';
import { STConfig } from './st.config';
export class STComponent {
/**
* @param {?} i18nSrv
* @param {?} cdr
* @param {?} cog
* @param {?} router
* @param {?} el
* @param {?} renderer
* @param {?} exportSrv
* @param {?} modalHelper
* @param {?} drawerHelper
* @param {?} doc
* @param {?} columnSource
* @param {?} dataSource
* @param {?} lxlibI18n
*/
constructor(i18nSrv, cdr, cog, router, el, renderer, exportSrv, modalHelper, drawerHelper, doc, columnSource, dataSource, lxlibI18n) {
this.cdr = cdr;
this.cog = cog;
this.router = router;
this.el = el;
this.renderer = renderer;
this.exportSrv = exportSrv;
this.modalHelper = modalHelper;
this.drawerHelper = drawerHelper;
this.doc = doc;
this.columnSource = columnSource;
this.dataSource = dataSource;
this.lxlibI18n = lxlibI18n;
this.unsubscribe$ = new Subject();
this.totalTpl = ``;
this.rowClickCount = 0;
this.locale = {};
this._data = [];
this._statistical = {};
this._isPagination = true;
this._allChecked = false;
this._allCheckedDisabled = false;
this._indeterminate = false;
this._columns = [];
this.columns = [];
this.ps = 10;
this.pi = 1;
this.total = 0;
this._loading = false;
/**
* 是否显示Loading
*/
this.loading = null;
/**
* 延迟显示加载效果的时间（防止闪烁）
*/
this.loadingDelay = 0;
/**
* 是否显示边框
*/
this.bordered = false;
/**
* 单排序规则
* - 若不指定，则返回：`columnName=ascend|descend`
* - 若指定，则返回：`sort=columnName.(ascend|descend)`
*/
this.singleSort = null;
this.expandRowByClick = false;
this.expandAccordion = false;
/**
* 行单击多少时长之类为双击（单位：毫秒），默认：`200`
*/
this.rowClickTime = 200;
this.responsive = true;
/**
* 请求异常时回调
*/
// tslint:disable-next-line:no-output-native
this.error = new EventEmitter();
/**
* 变化时回调，包括：`pi`、`ps`、`checkbox`、`radio`、`sort`、`filter`、`click`、`dblClick` 变动
*/
// tslint:disable-next-line:no-output-native
this.change = new EventEmitter();
this.virtualScroll = false;
this.virtualItemSize = 54;
this.virtualMaxBufferPx = 200;
this.virtualMinBufferPx = 100;
this.virtualForTrackBy = (/**
* @param {?} index
* @return {?}
*/
index => index);
this.lxlibI18n.change.pipe(takeUntil(this.unsubscribe$)).subscribe((/**
* @return {?}
*/
() => {
this.locale = this.lxlibI18n.getData('st');
if (this._columns.length > 0) {
this.page = this.clonePage;
this.cd();
}
}));
this.copyCog = deepMergeKey(new STConfig(), true, cog);
delete this.copyCog.multiSort;
Object.assign(this, this.copyCog);
if (cog.multiSort && cog.multiSort.global !== false) {
this.multiSort = Object.assign({}, cog.multiSort);
}
i18nSrv.change
.pipe(takeUntil(this.unsubscribe$), filter((/**
* @return {?}
*/
() => this._columns.length > 0)))
.subscribe((/**
* @template THIS
* @this {THIS}
* @return {THIS}
*/
() => this.refreshColumns()));
}
/**
* 请求体配置
* @return {?}
*/
get req() {
return this._req;
}
/**
* @param {?} value
* @return {?}
*/
set req(value) {
this._req = deepMerge({}, this._req, this.cog.req, value);
}
/**
* 返回体配置
* @return {?}
*/
get res() {
return this._res;
}
/**
* @param {?} value
* @return {?}
*/
set res(value) {
/** @type {?} */
const item = deepMergeKey({}, true, this.cog.res, value);
/** @type {?} */
const reName = item.reName;
if (!Array.isArray(reName.list))
reName.list = reName.list.split('.');
if (!Array.isArray(reName.total))
reName.total = reName.total.split('.');
this._res = item;
}
/**
* 分页器配置
* @return {?}
*/
get page() {
return this._page;
}
/**
* @param {?} value
* @return {?}
*/
set page(value) {
this.clonePage = value;
/** @type {?} */
const item = deepMergeKey({}, true, new STConfig().page, this.cog.page, value);
const { total } = item;
if (typeof total === 'string' && total.length) {
this.totalTpl = total;
}
else if (toBoolean(total)) {
this.totalTpl = this.locale.total;
}
else {
this.totalTpl = '';
}
this._page = item;
}
/**
* 是否多排序，当 `sort` 多个相同值时自动合并，建议后端支持时使用
* @return {?}
*/
get multiSort() {
return this._multiSort;
}
/**
* @param {?} value
* @return {?}
*/
set multiSort(value) {
if (typeof value === 'boolean' && !toBoolean(value)) {
this._multiSort = null;
return;
}
this._multiSort = Object.assign({}, (typeof value === 'object' ? value : {}));
}
/**
* @param {?} value
* @return {?}
*/
set widthMode(value) {
this._widthMode = Object.assign({ type: 'default', strictBehavior: 'truncate' }, value);
}
/**
* @return {?}
*/
get widthMode() {
return this._widthMode;
}
/**
* @private
* @return {?}
*/
get routerState() {
const { pi, ps, total } = this;
return { pi, ps, total };
}
/**
* Get the number of the current page
* @return {?}
*/
get count() {
return this._data.length;
}
/**
* Get the data of the current page
* @return {?}
*/
get list() {
return this._data;
}
/**
* @template THIS
* @this {THIS}
* @return {THIS}
*/
cd() {
(/** @type {?} */ (this)).cdr.detectChanges();
return (/** @type {?} */ (this));
}
/**
* @param {?} total
* @param {?} range
* @return {?}
*/
renderTotal(total, range) {
return this.totalTpl
? this.totalTpl.replace('{{total}}', total).replace('{{range[0]}}', range[0]).replace('{{range[1]}}', range[1])
: '';
}
/**
* @param {?} column
* @return {?}
*/
isTruncate(column) {
return !!column.width && this.widthMode.strictBehavior === 'truncate' && column.type !== 'img';
}
/**
* @param {?} column
* @return {?}
*/
columnClass(column) {
return column.className || (this.isTruncate(column) ? 'text-truncate' : null);
}
/**
* @private
* @param {?} type
* @param {?=} data
* @return {?}
*/
changeEmit(type, data) {
/** @type {?} */
const res = {
type,
pi: this.pi,
ps: this.ps,
total: this.total,
};
if (data != null) {
res[type] = data;
}
this.change.emit(res);
}
// #region data
/**
* 获取过滤后所有数据
* - 本地数据：包含排序、过滤后不分页数据
* - 远程数据：不传递 `pi`、`ps` 两个参数
* @return {?}
*/
get filteredData() {
return this.loadData((/** @type {?} */ ({ paginator: false }))).then((/**
* @param {?} res
* @return {?}
*/
res => res.list));
}
/**
* @private
* @param {?} val
* @return {?}
*/
setLoading(val) {
if (this.loading == null) {
this._loading = val;
}
}
/**
* @private
* @param {?=} options
* @return {?}
*/
loadData(options) {
const { pi, ps, data, req, res, page, total, singleSort, multiSort, rowClassName } = this;
return new Promise((/**
* @param {?} resolvePromise
* @param {?} rejectPromise
* @return {?}
*/
(resolvePromise, rejectPromise) => {
if (this.data$) {
this.data$.unsubscribe();
}
this.data$ = this.dataSource
.process(Object.assign({ pi,
ps,
total,
data,
req,
res,
page, columns: this._columns, singleSort,
multiSort,
rowClassName, paginator: true }, options))
.pipe(takeUntil(this.unsubscribe$))
.subscribe((/**
* @param {?} result
* @return {?}
*/
result => resolvePromise(result)), (/**
* @param {?} error
* @return {?}
*/
error => rejectPromise(error)));
}));
}
/**
* @private
* @return {?}
*/
loadPageData() {
return __awaiter(this, void 0, void 0, function* () {
this.setLoading(true);
try {
/** @type {?} */
const result = yield this.loadData();
this.setLoading(false);
if (typeof result.pi !== 'undefined') {
this.pi = result.pi;
}
if (typeof result.ps !== 'undefined') {
this.ps = result.ps;
}
if (typeof result.total !== 'undefined') {
this.total = result.total;
}
if (typeof result.pageShow !== 'undefined') {
this._isPagination = result.pageShow;
}
this._data = (/** @type {?} */ (result.list));
this._statistical = (/** @type {?} */ (result.statistical));
this.changeEmit('loaded', result.list);
return this._refCheck();
}
catch (error) {
this.setLoading(false);
if (!this.unsubscribe$.isStopped) {
this.cdr.detectChanges();
this.error.emit({ type: 'req', error });
}
return this;
}
});
}
/**
* 清空所有数据
* @template THIS
* @this {THIS}
* @param {?=} cleanStatus
* @return {THIS}
*/
clear(cleanStatus = true) {
if (cleanStatus) {
(/** @type {?} */ (this)).clearStatus();
}
(/** @type {?} */ (this))._data = [];
return (/** @type {?} */ (this)).cd();
}
/**
* 清空所有状态
* @template THIS
* @this {THIS}
* @return {THIS}
*/
clearStatus() {
return (/** @type {?} */ (this)).clearCheck().clearRadio().clearFilter().clearSort();
}
/**
* 根据页码重新加载数据
*
* @template THIS
* @this {THIS}
* @param {?=} pi 指定当前页码，默认：`1`
* @param {?=} extraParams 重新指定 `extraParams` 值
* @param {?=} options 选项
* @return {THIS}
*/
load(pi = 1, extraParams, options) {
if (pi !== -1)
(/** @type {?} */ (this)).pi = pi;
if (typeof extraParams !== 'undefined') {
(/** @type {?} */ (this))._req.params = options && options.merge ? Object.assign(Object.assign({}, (/** @type {?} */ (this))._req.params), extraParams) : extraParams;
}
(/** @type {?} */ (this))._change('pi', options);
return (/** @type {?} */ (this));
}
/**
* 重新刷新当前页
* @template THIS
* @this {THIS}
* @param {?=} extraParams 重新指定 `extraParams` 值
* @param {?=} options
* @return {THIS}
*/
reload(extraParams, options) {
return (/** @type {?} */ (this)).load(-1, extraParams, options);
}
/**
* 重置且重新设置 `pi` 为 `1`，包含以下值：
* - `check` 数据
* - `radio` 数据
* - `sort` 数据
* - `fileter` 数据
*
* @template THIS
* @this {THIS}
* @param {?=} extraParams 重新指定 `extraParams` 值
* @param {?=} options
* @return {THIS}
*/
reset(extraParams, options) {
(/** @type {?} */ (this)).clearStatus().load(1, extraParams, options);
return (/** @type {?} */ (this));
}
/**
* @private
* @param {?=} enforce
* @return {?}
*/
_toTop(enforce) {
if (!(enforce == null ? this.page.toTop : enforce))
return;
/** @type {?} */
const el = (/** @type {?} */ (this.el.nativeElement));
if (this.scroll) {
(/** @type {?} */ (el.querySelector('.ant-table-body'))).scrollTo(0, 0);
return;
}
el.scrollIntoView();
// fix header height
this.doc.documentElement.scrollTop -= (/** @type {?} */ (this.page.toTopOffset));
}
/**
* @param {?} type
* @param {?=} options
* @return {?}
*/
_change(type, options) {
if (type === 'pi' || (type === 'ps' && this.pi <= Math.ceil(this.total / this.ps))) {
this.loadPageData().then((/**
* @return {?}
*/
() => this._toTop(options === null || options === void 0 ? void 0 : options.toTop)));
}
this.changeEmit(type);
}
/**
* @param {?} e
* @param {?} item
* @param {?} col
* @return {?}
*/
_click(e, item, col) {
e.preventDefault();
e.stopPropagation();
/** @type {?} */
const res = (/** @type {?} */ (col.click))(item, this);
if (typeof res === 'string') {
this.router.navigateByUrl(res, { state: this.routerState });
}
return false;
}
/**
* @private
* @param {?} item
* @return {?}
*/
closeOtherExpand(item) {
if (this.expandAccordion === false)
return;
this._data.filter((/**
* @param {?} i
* @return {?}
*/
i => i !== item)).forEach((/**
* @param {?} i
* @return {?}
*/
i => (i.expand = false)));
}
/**
* @param {?} e
* @param {?} item
* @param {?} index
* @return {?}
*/
_rowClick(e, item, index) {
if (((/** @type {?} */ (e.target))).nodeName === 'INPUT')
return;
const { expand, expandRowByClick, rowClickTime } = this;
if (!!expand && item.showExpand !== false && expandRowByClick) {
item.expand = !item.expand;
this.closeOtherExpand(item);
this.changeEmit('expand', item);
return;
}
++this.rowClickCount;
if (this.rowClickCount !== 1)
return;
setTimeout((/**
* @return {?}
*/
() => {
/** @type {?} */
const data = { e, item, index };
if (this.rowClickCount === 1) {
this.changeEmit('click', data);
}
else {
this.changeEmit('dblClick', data);
}
this.rowClickCount = 0;
}), rowClickTime);
}
/**
* @param {?} item
* @return {?}
*/
_expandChange(item) {
this.closeOtherExpand(item);
this.changeEmit('expand', item);
}
/**
* Remove a row in the table, like this:
*
* ```
* this.st.removeRow(0)
* this.st.removeRow(stDataItem)
* ```
* @template THIS
* @this {THIS}
* @param {?} data
* @return {THIS}
*/
removeRow(data) {
if (typeof data === 'number') {
(/** @type {?} */ (this))._data.splice(data, 1);
}
else {
if (!Array.isArray(data)) {
data = [data];
}
((/** @type {?} */ (data)))
.map((/**
* @param {?} item
* @return {?}
*/
item => (/** @type {?} */ (this))._data.indexOf(item)))
.filter((/**
* @param {?} pos
* @return {?}
*/
pos => pos !== -1))
.forEach((/**
* @param {?} pos
* @return {?}
*/
pos => (/** @type {?} */ (this))._data.splice(pos, 1)));
}
// recalculate no
(/** @type {?} */ (this))._columns
.filter((/**
* @param {?} w
* @return {?}
*/
w => w.type === 'no'))
.forEach((/**
* @param {?} c
* @return {?}
*/
c => (/** @type {?} */ (this))._data.forEach((/**
* @param {?} i
* @param {?} idx
* @return {?}
*/
(i, idx) => (i._values[c.__point] = { text: (/** @type {?} */ (this)).dataSource.getNoIndex(i, c, idx), org: idx })))));
return (/** @type {?} */ (this)).cd();
}
/**
* Sets the row value for the `index` in the table, like this:
*
* ```
* this.st.setRow(0, { price: 100 })
* this.st.setRow(0, { price: 100, name: 'asdf' })
* ```
* @template THIS
* @this {THIS}
* @param {?} index
* @param {?} item
* @return {THIS}
*/
setRow(index, item) {
(/** @type {?} */ (this))._data[index] = deepMergeKey((/** @type {?} */ (this))._data[index], false, item);
(/** @type {?} */ (this))._data = (/** @type {?} */ (this)).dataSource.optimizeData({ columns: (/** @type {?} */ (this))._columns, result: (/** @type {?} */ (this))._data, rowClassName: (/** @type {?} */ (this)).rowClassName });
(/** @type {?} */ (this)).cdr.detectChanges();
return (/** @type {?} */ (this));
}
// #endregion
// #region sort
/**
* @param {?} col
* @param {?} idx
* @param {?} value
* @return {?}
*/
sort(col, idx, value) {
if (this.multiSort) {
(/** @type {?} */ (col._sort)).default = value;
(/** @type {?} */ (col._sort)).tick = this.dataSource.nextSortTick;
}
else {
this._columns.forEach((/**
* @param {?} item
* @param {?} index
* @return {?}
*/
(item, index) => ((/** @type {?} */ (item._sort)).default = index === idx ? value : null)));
}
this.loadPageData();
/** @type {?} */
const res = {
value,
map: this.dataSource.getReqSortMap(this.singleSort, this.multiSort, this._columns),
column: col,
};
this.changeEmit('sort', res);
}
/**
* @template THIS
* @this {THIS}
* @return {THIS}
*/
clearSort() {
(/** @type {?} */ (this))._columns.forEach((/**
* @param {?} item
* @return {?}
*/
item => ((/** @type {?} */ (item._sort)).default = null)));
return (/** @type {?} */ (this));
}
// #endregion
// #region filter
/**
* @private
* @param {?} col
* @return {?}
*/
handleFilter(col) {
this.columnSource.updateDefault((/** @type {?} */ (col.filter)));
this.loadPageData();
this.changeEmit('filter', col);
}
/**
* @param {?} col
* @return {?}
*/
_filterConfirm(col) {
this.handleFilter(col);
}
/**
* @param {?} col
* @param {?} item
* @param {?} checked
* @return {?}
*/
_filterRadio(col, item, checked) {
(/** @type {?} */ ((/** @type {?} */ (col.filter)).menus)).forEach((/**
* @param {?} i
* @return {?}
*/
i => (i.checked = false)));
item.checked = checked;
}
/**
* @param {?} col
* @return {?}
*/
_filterClear(col) {
this.columnSource.cleanFilter(col);
this.handleFilter(col);
}
/**
* @template THIS
* @this {THIS}
* @return {THIS}
*/
clearFilter() {
(/** @type {?} */ (this))._columns.filter((/**
* @param {?} w
* @return {?}
*/
w => w.filter && w.filter.default === true)).forEach((/**
* @param {?} col
* @return {?}
*/
col => (/** @type {?} */ (this)).columnSource.cleanFilter(col)));
return (/** @type {?} */ (this));
}
// #endregion
// #region checkbox
/**
* 清除所有 `checkbox`
* @template THIS
* @this {THIS}
* @return {THIS}
*/
clearCheck() {
return (/** @type {?} */ (this))._checkAll(false);
}
/**
* @private
* @template THIS
* @this {THIS}
* @return {THIS}
*/
_refCheck() {
/** @type {?} */
const validData = (/** @type {?} */ (this))._data.filter((/**
* @param {?} w
* @return {?}
*/
w => !w.disabled));
/** @type {?} */
const checkedList = validData.filter((/**
* @param {?} w
* @return {?}
*/
w => w.checked === true));
(/** @type {?} */ (this))._allChecked = checkedList.length > 0 && checkedList.length === validData.length;
/** @type {?} */
const allUnChecked = validData.every((/**
* @param {?} value
* @return {?}
*/
value => !value.checked));
(/** @type {?} */ (this))._indeterminate = !(/** @type {?} */ (this))._allChecked && !allUnChecked;
(/** @type {?} */ (this))._allCheckedDisabled = (/** @type {?} */ (this))._data.length === (/** @type {?} */ (this))._data.filter((/**
* @param {?} w
* @return {?}
*/
w => w.disabled)).length;
return (/** @type {?} */ (this)).cd();
}
/**
* @template THIS
* @this {THIS}
* @param {?=} checked
* @return {THIS}
*/
_checkAll(checked) {
checked = typeof checked === 'undefined' ? (/** @type {?} */ (this))._allChecked : checked;
(/** @type {?} */ (this))._data.filter((/**
* @param {?} w
* @return {?}
*/
w => !w.disabled)).forEach((/**
* @param {?} i
* @return {?}
*/
i => (i.checked = checked)));
return (/** @type {?} */ (this))._refCheck()._checkNotify();
}
/**
* @template THIS
* @this {THIS}
* @param {?} i
* @param {?} value
* @return {THIS}
*/
_checkSelection(i, value) {
i.checked = value;
return (/** @type {?} */ (this))._refCheck()._checkNotify();
}
/**
* @template THIS
* @this {THIS}
* @param {?} row
* @return {THIS}
*/
_rowSelection(row) {
row.select((/** @type {?} */ (this))._data);
return (/** @type {?} */ (this))._refCheck()._checkNotify();
}
/**
* @template THIS
* @this {THIS}
* @return {THIS}
*/
_checkNotify() {
/** @type {?} */
const res = (/** @type {?} */ (this))._data.filter((/**
* @param {?} w
* @return {?}
*/
w => !w.disabled && w.checked === true));
(/** @type {?} */ (this)).changeEmit('checkbox', res);
return (/** @type {?} */ (this));
}
// #endregion
// #region radio
/**
* 清除所有 `radio`
* @template THIS
* @this {THIS}
* @return {THIS}
*/
clearRadio() {
(/** @type {?} */ (this))._data.filter((/**
* @param {?} w
* @return {?}
*/
w => w.checked)).forEach((/**
* @param {?} item
* @return {?}
*/
item => (item.checked = false)));
(/** @type {?} */ (this)).changeEmit('radio', null);
return (/** @type {?} */ (this));
}
/**
* @template THIS
* @this {THIS}
* @param {?} checked
* @param {?} item
* @return {THIS}
*/
_refRadio(checked, item) {
// if (item.disabled === true) return;
(/** @type {?} */ (this))._data.filter((/**
* @param {?} w
* @return {?}
*/
w => !w.disabled)).forEach((/**
* @param {?} i
* @return {?}
*/
i => (i.checked = false)));
item.checked = checked;
(/** @type {?} */ (this)).changeEmit('radio', item);
return (/** @type {?} */ (this));
}
// #endregion
// #region buttons
/**
* @param {?} record
* @param {?} btn
* @param {?=} e
* @return {?}
*/
_btnClick(record, btn, e) {
// should be stop propagation when expandRowByClick is true
if (e && this.expandRowByClick === true) {
e.stopPropagation();
}
if (btn.type === 'modal' || btn.type === 'static') {
const { modal } = btn;
/** @type {?} */
const obj = { [(/** @type {?} */ ((/** @type {?} */ (modal)).paramsName))]: record };
((/** @type {?} */ (this.modalHelper[btn.type === 'modal' ? 'create' : 'createStatic'])))((/** @type {?} */ (modal)).component, Object.assign(Object.assign({}, obj), ((/** @type {?} */ (modal)).params && (/** @type {?} */ ((/** @type {?} */ (modal)).params))(record))), deepMergeKey({}, true, this.copyCog.modal, modal))
.pipe(filter((/**
* @param {?} w
* @return {?}
*/
w => typeof w !== 'undefined')))
.subscribe((/**
* @param {?} res
* @return {?}
*/
(res) => this.btnCallback(record, btn, res)));
return;
}
else if (btn.type === 'drawer') {
const { drawer } = btn;
/** @type {?} */
const obj = { [(/** @type {?} */ ((/** @type {?} */ (drawer)).paramsName))]: record };
this.drawerHelper
.create((/** @type {?} */ ((/** @type {?} */ (drawer)).title)), (/** @type {?} */ (drawer)).component, Object.assign(Object.assign({}, obj), ((/** @type {?} */ (drawer)).params && (/** @type {?} */ ((/** @type {?} */ (drawer)).params))(record))), deepMergeKey({}, true, this.copyCog.drawer, drawer))
.pipe(filter((/**
* @param {?} w
* @return {?}
*/
w => typeof w !== 'undefined')))
.subscribe((/**
* @param {?} res
* @return {?}
*/
res => this.btnCallback(record, btn, res)));
return;
}
else if (btn.type === 'link') {
/** @type {?} */
const clickRes = this.btnCallback(record, btn);
if (typeof clickRes === 'string') {
this.router.navigateByUrl(clickRes, { state: this.routerState });
}
return;
}
this.btnCallback(record, btn);
}
/**
* @private
* @param {?} record
* @param {?} btn
* @param {?=} modal
* @return {?}
*/
btnCallback(record, btn, modal) {
if (!btn.click)
return;
if (typeof btn.click === 'string') {
switch (btn.click) {
case 'load':
this.load();
break;
case 'reload':
this.reload();
break;
}
}
else {
return btn.click(record, modal, this);
}
}
/**
* @param {?} record
* @param {?} btn
* @return {?}
*/
_btnText(record, btn) {
return typeof btn.text === 'function' ? btn.text(record, btn) : btn.text || '';
}
/**
* @param {?} btns
* @param {?} item
* @param {?} col
* @return {?}
*/
_validBtns(btns, item, col) {
return btns.filter((/**
* @param {?} btn
* @return {?}
*/
btn => {
/** @type {?} */
const result = (/** @type {?} */ (btn.iif))(item, btn, col);
/** @type {?} */
const isRenderDisabled = btn.iifBehavior === 'disabled';
btn._result = result;
btn._disabled = !result && isRenderDisabled;
return result || isRenderDisabled;
}));
}
// #endregion
// #region export
/**
* 导出当前页，确保已经注册 `XlsxModule`
* @param {?=} newData 重新指定数据；若为 `true` 表示使用 `filteredData` 数据
* @param {?=} opt 额外参数
* @return {?}
*/
export(newData, opt) {
(newData === true ? from(this.filteredData) : of(newData || this._data)).subscribe((/**
* @param {?} res
* @return {?}
*/
(res) => this.exportSrv.export(Object.assign(Object.assign({}, opt), { _d: res, _c: this._columns }))));
}
// #endregion
/**
* @return {?}
*/
get cdkVirtualScrollViewport() {
return this.orgTable.cdkVirtualScrollViewport;
}
/**
* @param {?=} options
* @return {?}
*/
resetColumns(options) {
options = Object.assign({ emitReload: true }, options);
if (typeof options.columns !== 'undefined') {
this.columns = options.columns;
}
if (typeof options.pi !== 'undefined') {
this.pi = options.pi;
}
if (typeof options.ps !== 'undefined') {
this.ps = options.ps;
}
this.refreshColumns();
if (options.emitReload === true) {
return this.loadPageData();
}
else {
this.cd();
return Promise.resolve(this);
}
}
/**
* @private
* @template THIS
* @this {THIS}
* @return {THIS}
*/
refreshColumns() {
(/** @type {?} */ (this))._columns = (/** @type {?} */ (this)).columnSource.process((/** @type {?} */ (this)).columns);
return (/** @type {?} */ (this));
}
/**
* @private
* @return {?}
*/
setClass() {
const { type, strictBehavior } = this.widthMode;
updateHostClass(this.el.nativeElement, this.renderer, {
[`st`]: true,
[`st__p-${this.page.placement}`]: this.page.placement,
[`st__width-${type}`]: true,
[`st__width-strict-${strictBehavior}`]: type === 'strict',
[`ant-table-rep`]: this.responsive,
[`ant-table-rep__hide-header-footer`]: this.responsiveHideHeaderFooter,
});
}
/**
* @return {?}
*/
ngAfterViewInit() {
this.columnSource.restoreAllRender(this._columns);
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes.columns) {
this.refreshColumns();
}
/** @type {?} */
const changeData = changes.data;
if (changeData && changeData.currentValue && !(this.req.lazyLoad && changeData.firstChange)) {
this.loadPageData();
}
if (changes.loading) {
this._loading = changes.loading.currentValue;
}
this.setClass();
}
/**
* @return {?}
*/
ngOnDestroy() {
const { unsubscribe$ } = this;
unsubscribe$.next();
unsubscribe$.complete();
}
}
STComponent.decorators = [
{ type: Component, args: [{
selector: 'st',
exportAs: 'st',
template: " <ng-template #btnTpl let-i let-btn=\"btn\">\n <ng-container *ngIf=\"!btn.tooltip\">\n <ng-template [ngTemplateOutlet]=\"btnItemTpl\" [ngTemplateOutletContext]=\"{ $implicit: i, btn: btn }\"></ng-template>\n </ng-container>\n <span *ngIf=\"btn.tooltip\" nz-tooltip [nzTooltipTitle]=\"btn.tooltip\">\n <ng-template [ngTemplateOutlet]=\"btnItemTpl\" [ngTemplateOutletContext]=\"{ $implicit: i, btn: btn }\"></ng-template>\n </span>\n</ng-template>\n<ng-template #btnItemTpl let-i let-btn=\"btn\">\n <a *ngIf=\"btn.pop\" nz-popconfirm [nzPopconfirmTitle]=\"btn.pop.title\" [nzIcon]=\"btn.pop.icon\"\n [nzCondition]=\"btn.pop.condition(i)\" [nzCancelText]=\"btn.pop.cancelText\" [nzOkText]=\"btn.pop.okText\"\n [nzOkType]=\"btn.pop.okType\" (nzOnConfirm)=\"_btnClick(i, btn, $event)\" class=\"st__btn-text\">\n <ng-template [ngTemplateOutlet]=\"btnTextTpl\" [ngTemplateOutletContext]=\"{ $implicit: i, btn: btn }\"></ng-template>\n </a>\n <a *ngIf=\"!btn.pop\" (click)=\"_btnClick(i, btn, $event)\" class=\"st__btn-text\">\n <ng-template [ngTemplateOutlet]=\"btnTextTpl\" [ngTemplateOutletContext]=\"{ $implicit: i, btn: btn }\"></ng-template>\n </a>\n</ng-template>\n<ng-template #btnTextTpl let-i let-btn=\"btn\">\n <ng-container *ngIf=\"btn.icon\">\n <i *ngIf=\"!btn.icon.iconfont\" nz-icon [nzType]=\"btn.icon.type\" [nzTheme]=\"btn.icon.theme\" [nzSpin]=\"btn.icon.spin\"\n [nzTwotoneColor]=\"btn.icon.twoToneColor\"></i>\n <i *ngIf=\"btn.icon.iconfont\" nz-icon [nzIconfont]=\"btn.icon.iconfont\"></i>\n </ng-container>\n <span [innerHTML]=\"_btnText(i, btn)\" [ngClass]=\"{'pl-xs': btn.icon}\"></span>\n</ng-template>\n<ng-template #titleTpl let-i>\n <span [innerHTML]=\"i._text\"></span>\n <small *ngIf=\"i.optional\" class=\"st__head-optional\" [innerHTML]=\"i.optional\"></small>\n <i *ngIf=\"i.optionalHelp\" class=\"st__head-tip\" nz-tooltip [nzTooltipTitle]=\"i.optionalHelp\" nz-icon nzType=\"question-circle\"></i>\n</ng-template>\n<ng-template #bodyTpl let-i let-index=\"index\">\n <tr [attr.data-index]=\"index\" (click)=\"_rowClick($event, i, index)\" [class]=\"i._rowClassName\">\n <td *ngIf=\"expand\" [nzShowExpand]=\"expand && i.showExpand !== false\" [(nzExpand)]=\"i.expand\"\n (nzExpandChange)=\"_expandChange(i)\" nzWidth=\"50px\"></td>\n <td *ngFor=\"let c of _columns; let cIdx=index\" [nzLeft]=\"c._left\" [nzRight]=\"c._right\" [ngClass]=\"columnClass(c)\" [attr.colspan]=\"c.colSpan\">\n <span *ngIf=\"responsive\" class=\"ant-table-rep__title\">\n <ng-template [ngTemplateOutlet]=\"titleTpl\" [ngTemplateOutletContext]=\"{$implicit: c.title }\"></ng-template>\n </span>\n <span>\n <ng-template #render [ngTemplateOutlet]=\"c.__render\" [ngTemplateOutletContext]=\"{$implicit: i, index: index, column: c }\"></ng-template>\n <ng-container *ngIf=\"!c.__render; else render\">\n <ng-container [ngSwitch]=\"c.type\">\n <label *ngSwitchCase=\"'checkbox'\" nz-checkbox [nzDisabled]=\"i.disabled\" [ngModel]=\"i.checked\"\n (ngModelChange)=\"_checkSelection(i, $event)\"></label>\n <label *ngSwitchCase=\"'radio'\" nz-radio [nzDisabled]=\"i.disabled\" [ngModel]=\"i.checked\"\n (ngModelChange)=\"_refRadio($event, i)\"></label>\n <a *ngSwitchCase=\"'link'\" (click)=\"_click($event, i, c)\" [innerHTML]=\"i._values[cIdx]._text\"></a>\n <ng-conntainer *ngIf=\"i._values[cIdx].text\">\n <nz-tag *ngSwitchCase=\"'tag'\" [nzColor]=\"i._values[cIdx].color\">\n <span [innerHTML]=\"i._values[cIdx]._text\"></span>\n </nz-tag>\n <nz-badge *ngSwitchCase=\"'badge'\" [nzStatus]=\"i._values[cIdx].color\" [nzText]=\"i._values[cIdx].text\">\n </nz-badge>\n </ng-conntainer>\n <span *ngSwitchDefault [innerHTML]=\"i._values[cIdx]._text\" [attr.title]=\"isTruncate(c) ? i._values[cIdx].text : null\"></span>\n </ng-container>\n <ng-container *ngFor=\"let btn of _validBtns(c.buttons, i, c); let last=last\">\n <a *ngIf=\"btn.children.length > 0\" nz-dropdown [nzDropdownMenu]=\"btnMenu\" nzOverlayClassName=\"st__btn-sub\">\n <span [innerHTML]=\"_btnText(i, btn)\"></span>\n <i nz-icon nzType=\"down\"></i>\n </a>\n <nz-dropdown-menu #btnMenu=\"nzDropdownMenu\">\n <ul nz-menu>\n <ng-container *ngFor=\"let subBtn of _validBtns(btn.children, i, c)\">\n <li *ngIf=\"subBtn.type !== 'divider'\" nz-menu-item [class.st__btn-disabled]=\"subBtn._disabled\">\n <ng-template [ngTemplateOutlet]=\"btnTpl\" [ngTemplateOutletContext]=\"{ $implicit: i, btn: subBtn }\">\n </ng-template>\n </li>\n <li *ngIf=\"subBtn.type === 'divider'\" nz-menu-divider></li>\n </ng-container>\n </ul>\n </nz-dropdown-menu>\n <span *ngIf=\"btn.children.length == 0\" [class.st__btn-disabled]=\"btn._disabled\">\n <ng-template [ngTemplateOutlet]=\"btnTpl\" [ngTemplateOutletContext]=\"{ $implicit: i, btn: btn }\">\n </ng-template>\n </span>\n <nz-divider *ngIf=\"!last\" nzType=\"vertical\"></nz-divider>\n </ng-container>\n <ng-template [ngIf]=\"!c.__renderExpanded\" [ngTemplateOutlet]=\"c.__renderExpanded\"\n [ngTemplateOutletContext]=\"{$implicit: i, index: index, column: c }\"></ng-template>\n </ng-container>\n </span>\n </td>\n </tr>\n <tr [nzExpand]=\"i.expand\">\n <td></td>\n <td [attr.colspan]=\"_columns.length\">\n <ng-template [ngTemplateOutlet]=\"expand\" [ngTemplateOutletContext]=\"{$implicit: i, index: index }\"></ng-template>\n </td>\n </tr>\n</ng-template>\n<ng-template #chkAllTpl let-custom>\n <label nz-checkbox class=\"st__checkall\" [nzDisabled]=\"_allCheckedDisabled\" [(ngModel)]=\"_allChecked\"\n [nzIndeterminate]=\"_indeterminate\" (ngModelChange)=\"_checkAll()\"\n [class.ant-table-selection-select-all-custom]=\"custom\"></label>\n</ng-template>\n<nz-table #table [nzData]=\"_data\" [(nzPageIndex)]=\"pi\" (nzPageIndexChange)=\"_change('pi')\" [(nzPageSize)]=\"ps\"\n (nzPageSizeChange)=\"_change('ps')\" [nzTotal]=\"total\" [nzShowPagination]=\"_isPagination\" [nzFrontPagination]=\"false\"\n [nzBordered]=\"bordered\" [nzSize]=\"size\" [nzLoading]=\"_loading\" [nzLoadingDelay]=\"loadingDelay\"\n [nzLoadingIndicator]=\"loadingIndicator\" [nzTitle]=\"header\" [nzFooter]=\"footer\" [nzScroll]=\"scroll\"\n [nzVirtualItemSize]=\"virtualItemSize\" [nzVirtualMaxBufferPx]=\"virtualMaxBufferPx\" [nzVirtualMinBufferPx]=\"virtualMinBufferPx\" [nzVirtualForTrackBy]=\"virtualForTrackBy\"\n [nzNoResult]=\"noResult\" [nzPageSizeOptions]=\"page.pageSizes\" [nzShowQuickJumper]=\"page.showQuickJumper\" [nzShowSizeChanger]=\"page.showSize\" [nzPaginationPosition]=\"page.position\" [nzShowTotal]=\"totalTpl\">\n <thead class=\"st__head\">\n <tr>\n <th *ngIf=\"expand\" [nzShowExpand]=\"expand\" nzWidth=\"50px\"></th>\n <th *ngFor=\"let c of _columns; let index=index\" [nzWidth]=\"c.width\" [nzLeft]=\"c._left\" [nzRight]=\"c._right\"\n [ngClass]=\"c.className\" [attr.colspan]=\"c.colSpan\" [attr.data-col]=\"c.indexKey\" [nzShowSort]=\"c._sort.enabled\"\n [nzSortOrder]=\"c._sort.default\" (nzSortOrderChange)=\"sort(c, index, $event)\" [nzCustomFilter]=\"c.filter\">\n <ng-template #renderTitle [ngTemplateOutlet]=\"c.__renderTitle\"\n [ngTemplateOutletContext]=\"{$implicit: c, index: index }\"></ng-template>\n <ng-container *ngIf=\"!c.__renderTitle; else renderTitle\">\n <ng-container [ngSwitch]=\"c.type\">\n <ng-container *ngSwitchCase=\"'checkbox'\">\n <ng-container *ngIf=\"c.selections.length === 0\">\n <ng-template [ngTemplateOutlet]=\"chkAllTpl\" [ngTemplateOutletContext]=\"{$implicit: false }\">\n </ng-template>\n </ng-container>\n <div *ngIf=\"c.selections.length > 0\" class=\"ant-table-selection\">\n <ng-template [ngTemplateOutlet]=\"chkAllTpl\" [ngTemplateOutletContext]=\"{$implicit: true }\">\n </ng-template>\n <div *ngIf=\"c.selections.length\" nz-dropdown nzPlacement=\"bottomLeft\" [nzDropdownMenu]=\"selectionMenu\" class=\"ant-table-selection-down st__checkall-selection\">\n <i nz-icon nzType=\"down\"></i>\n </div>\n <nz-dropdown-menu #selectionMenu=\"nzDropdownMenu\">\n <ul nz-menu class=\"ant-table-selection-menu\">\n <li nz-menu-item *ngFor=\"let rw of c.selections\" (click)=\"_rowSelection(rw)\" [innerHTML]=\"rw.text\">\n </li>\n </ul>\n </nz-dropdown-menu>\n </div>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <ng-template [ngTemplateOutlet]=\"titleTpl\" [ngTemplateOutletContext]=\"{$implicit: c.title }\">\n </ng-template>\n </ng-container>\n </ng-container>\n </ng-container>\n <div nz-th-extra *ngIf=\"c.filter\" class=\"ant-table-filter-trigger-container st__filter\" [class.ant-table-filter-trigger-container-open]=\"c.filter.visible\">\n <span class=\"ant-table-filter-trigger\" [class.ant-table-filter-open]=\"c.filter.default\" [class.active]=\"c.filter.visible\"\n nz-dropdown [nzDropdownMenu]=\"filterMenu\" nzTrigger=\"click\" [nzClickHide]=\"false\" [(nzVisible)]=\"c.filter.visible\" nzOverlayClassName=\"st__filter-wrap\">\n <i nz-icon [nzType]=\"c.filter.icon.type\" [nzTheme]=\"c.filter.icon.theme\"></i>\n </span>\n <nz-dropdown-menu #filterMenu=\"nzDropdownMenu\">\n <div class=\"ant-table-filter-dropdown\">\n <ng-container [ngSwitch]=\"c.filter.type\">\n <div *ngSwitchCase=\"'keyword'\" class=\"st__filter-keyword\">\n <input type=\"text\" nz-input [attr.placeholder]=\"c.filter.menus[0].text\"\n [(ngModel)]=\"c.filter.menus[0].value\" />\n </div>\n <ul *ngSwitchDefault nz-menu>\n <ng-container *ngIf=\"c.filter.multiple\">\n <li nz-menu-item *ngFor=\"let filter of c.filter.menus\">\n <label nz-checkbox [(ngModel)]=\"filter.checked\">{{filter.text}}</label>\n </li>\n </ng-container>\n <ng-container *ngIf=\"!c.filter.multiple\">\n <li nz-menu-item *ngFor=\"let filter of c.filter.menus\">\n <label nz-radio [ngModel]=\"filter.checked\"\n (ngModelChange)=\"_filterRadio(c, filter, $event)\">{{filter.text}}</label>\n </li>\n </ng-container>\n </ul>\n </ng-container>\n <div class=\"ant-table-filter-dropdown-btns\">\n <a class=\"ant-table-filter-dropdown-link confirm\" (click)=\"c.filter.visible = false\">\n <span (click)=\"_filterConfirm(c)\">{{c.filter.confirmText || locale.filterConfirm}}</span>\n </a>\n <a class=\"ant-table-filter-dropdown-link clear\" (click)=\"c.filter.visible = false\">\n <span (click)=\"_filterClear(c)\">{{c.filter.clearText || locale.filterReset}}</span>\n </a>\n </div>\n </div>\n </nz-dropdown-menu>\n </div>\n </th>\n </tr>\n </thead>\n <tbody class=\"st__body\">\n <ng-container *ngIf=\"!_loading\">\n <ng-template [ngTemplateOutlet]=\"bodyHeader\" [ngTemplateOutletContext]=\"{$implicit: _statistical }\"></ng-template>\n </ng-container>\n <ng-container *ngIf=\"!virtualScroll\">\n <ng-container *ngFor=\"let i of _data; let index=index\">\n <ng-template [ngTemplateOutlet]=\"bodyTpl\" [ngTemplateOutletContext]=\"{$implicit: i, index: index }\">\n </ng-template>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"virtualScroll\">\n <ng-template nz-virtual-scroll let-i let-index=\"index\">\n <ng-template [ngTemplateOutlet]=\"bodyTpl\" [ngTemplateOutletContext]=\"{$implicit: i, index: index }\">\n </ng-template>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"!_loading\">\n <ng-template [ngTemplateOutlet]=\"body\" [ngTemplateOutletContext]=\"{$implicit: _statistical }\"></ng-template>\n </ng-container>\n </tbody>\n <ng-template #totalTpl let-range=\"range\" let-total>{{ renderTotal(total, range) }}</ng-template>\n</nz-table>\n",
providers: [NzTableStyleService, STDataSource, STRowSource, STColumnSource, STExport, CNCurrencyPipe, DatePipe, YNPipe, DecimalPipe],
preserveWhitespaces: false,
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None
}] }
];
/** @nocollapse */
STComponent.ctorParameters = () => [
{ type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [LXLIB_I18N_TOKEN,] }] },
{ type: ChangeDetectorRef },
{ type: STConfig },
{ type: Router },
{ type: ElementRef },
{ type: Renderer2 },
{ type: STExport },
{ type: ModalHelper },
{ type: DrawerHelper },
{ type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
{ type: STColumnSource },
{ type: STDataSource },
{ type: LxlibLocaleService }
];
STComponent.propDecorators = {
orgTable: [{ type: ViewChild, args: ['table', { static: false },] }],
req: [{ type: Input }],
res: [{ type: Input }],
page: [{ type: Input }],
multiSort: [{ type: Input }],
widthMode: [{ type: Input }],
data: [{ type: Input }],
columns: [{ type: Input }],
ps: [{ type: Input }],
pi: [{ type: Input }],
total: [{ type: Input }],
loading: [{ type: Input }],
loadingDelay: [{ type: Input }],
loadingIndicator: [{ type: Input }],
bordered: [{ type: Input }],
size: [{ type: Input }],
scroll: [{ type: Input }],
singleSort: [{ type: Input }],
rowClassName: [{ type: Input }],
header: [{ type: Input }],
footer: [{ type: Input }],
bodyHeader: [{ type: Input }],
body: [{ type: Input }],
expandRowByClick: [{ type: Input }],
expandAccordion: [{ type: Input }],
expand: [{ type: Input }],
noResult: [{ type: Input }],
widthConfig: [{ type: Input }],
rowClickTime: [{ type: Input }],
responsive: [{ type: Input }],
responsiveHideHeaderFooter: [{ type: Input }],
error: [{ type: Output }],
change: [{ type: Output }],
virtualScroll: [{ type: Input }],
virtualItemSize: [{ type: Input }],
virtualMaxBufferPx: [{ type: Input }],
virtualMinBufferPx: [{ type: Input }],
virtualForTrackBy: [{ type: Input }]
};
__decorate([
InputNumber(),
__metadata("design:type", Object)
], STComponent.prototype, "ps", void 0);
__decorate([
InputNumber(),
__metadata("design:type", Object)
], STComponent.prototype, "pi", void 0);
__decorate([
InputNumber(),
__metadata("design:type", Object)
], STComponent.prototype, "total", void 0);
__decorate([
InputNumber(),
__metadata("design:type", Object)
], STComponent.prototype, "loadingDelay", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Object)
], STComponent.prototype, "bordered", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Object)
], STComponent.prototype, "expandRowByClick", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Object)
], STComponent.prototype, "expandAccordion", void 0);
__decorate([
InputNumber(),
__metadata("design:type", Object)
], STComponent.prototype, "rowClickTime", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], STComponent.prototype, "responsive", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], STComponent.prototype, "responsiveHideHeaderFooter", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Object)
], STComponent.prototype, "virtualScroll", void 0);
__decorate([
InputNumber(),
__metadata("design:type", Object)
], STComponent.prototype, "virtualItemSize", void 0);
__decorate([
InputNumber(),
__metadata("design:type", Object)
], STComponent.prototype, "virtualMaxBufferPx", void 0);
__decorate([
InputNumber(),
__metadata("design:type", Object)
], STComponent.prototype, "virtualMinBufferPx", void 0);
if (false) {
/**
* @type {?}
* @private
*/
STComponent.prototype.unsubscribe$;
/**
* @type {?}
* @private
*/
STComponent.prototype.data$;
/**
* @type {?}
* @private
*/
STComponent.prototype.totalTpl;
/**
* @type {?}
* @private
*/
STComponent.prototype.clonePage;
/**
* @type {?}
* @private
*/
STComponent.prototype.copyCog;
/**
* @type {?}
* @private
*/
STComponent.prototype.rowClickCount;
/** @type {?} */
STComponent.prototype.locale;
/** @type {?} */
STComponent