yoyo-ng-modulewindy
Version:
服务于52ABP模板的前端开源的相关组件内容。整合了ng-alain和你NG ZORRO的内容
1,002 lines • 45.7 kB
JavaScript
import { Component, Inject, Input, Output, EventEmitter, Renderer2, ElementRef, TemplateRef, ContentChild, } from '@angular/core';
import { DecimalPipe, DOCUMENT } from '@angular/common';
import { HttpClient } from '@angular/common/http';
import { Router } from '@angular/router';
import { of } from 'rxjs';
import { tap, map, filter } from 'rxjs/operators';
import { CNCurrencyPipe, DatePipe, YNPipe, ModalHelper, } from 'yoyo-ng-module/theme';
import { deepGet, deepCopy, toBoolean, toNumber } from 'yoyo-ng-module/util';
import { AdSimpleTableConfig } from './simple-table.config';
import { SimpleTableExport } from './simple-table-export';
var SimpleTableComponent = /** @class */ (function () {
// endregion
function SimpleTableComponent(defConfig, http, router, el, renderer, exportSrv, modal, currenty, date, yn, number, doc) {
this.defConfig = defConfig;
this.http = http;
this.router = router;
this.el = el;
this.renderer = renderer;
this.exportSrv = exportSrv;
this.modal = modal;
this.currenty = currenty;
this.date = date;
this.yn = yn;
this.number = number;
this.doc = doc;
this._inited = false;
this._data = [];
this._isAjax = false;
this._isPagination = true;
this._classMap = [];
this._allChecked = false;
this._indeterminate = false;
this._columns = [];
/** 请求方法 */
this.reqMethod = 'GET';
this._reqReName = { pi: 'pi', ps: 'ps' };
/** 请求异常时回调 */
this.reqError = new EventEmitter();
this._resReName = { total: ['total'], list: ['list'] };
/** 列描述 */
this.columns = [];
this._ps = 10;
this._pi = 1;
this._total = 0;
this._loading = false;
this._loadingDelay = 0;
this._bordered = false;
/** table大小 */
this.size = 'default';
this._showSizeChanger = false;
this._showQuickJumper = false;
/** 是否显示总数据量 */
this._totalTpl = "";
this._isPageIndexReset = true;
/** 分页方向 */
this.pagePlacement = 'right';
this._toTopInChange = true;
this._toTopOffset = 100;
/** 页码、每页数量变化时回调 */
this.change = new EventEmitter();
/** checkbox变化时回调，参数为当前所选清单 */
this.checkboxChange = new EventEmitter();
/** radio变化时回调，参数为当前所选 */
this.radioChange = new EventEmitter();
/** 排序回调 */
this.sortChange = new EventEmitter();
/** Filter回调 */
this.filterChange = new EventEmitter();
this._zeroIndexedOnPage = false;
// endregion
// region: sort
this._sortMap = {};
this._sortColumn = null;
Object.assign(this, deepCopy(defConfig));
}
Object.defineProperty(SimpleTableComponent.prototype, "reqReName", {
get: function () {
return this._reqReName;
},
/**
* 重命名请求参数 `pi`、`ps`
* - `{ pi: 'Page' }` => `pi` 会被替换成 Page
*/
set: function (value) {
this._reqReName = Object.assign(this._reqReName, value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "resReName", {
get: function () {
return this._resReName;
},
/**
* 重命名返回参数 `total`、`list`
* - `{ total: 'Total' }` => Total 会被当作 `total`
*/
set: function (cur) {
var ret = {};
if (cur) {
if (cur.list)
ret.list = Array.isArray(cur.list) ? cur.list : cur.list.split('.');
else
ret.list = ['list'];
if (cur.total)
ret.total = Array.isArray(cur.total) ? cur.total : cur.total.split('.');
else
ret.total = ['total'];
}
else {
ret = { total: ['total'], list: ['list'] };
}
this._resReName = ret;
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "ps", {
/** 每页数量，当设置为 `0` 表示不分页，默认：`10` */
get: function () {
return this._ps;
},
set: function (value) {
this._ps = toNumber(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "pi", {
/** 当前页码 */
get: function () {
return this._pi;
},
set: function (value) {
this._pi = toNumber(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "total", {
/** 数据总量 */
get: function () {
return this._total;
},
set: function (value) {
this._total = toNumber(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "showPagination", {
/** 是否显示分页器 */
get: function () {
return this._showPagination;
},
set: function (value) {
this._showPagination = toBoolean(value, true);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "loading", {
/** 是否显示Loading */
get: function () {
return this._loading;
},
set: function (value) {
this._loading = toBoolean(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "loadingDelay", {
/** 延迟显示加载效果的时间（防止闪烁） */
get: function () {
return this._loadingDelay;
},
set: function (value) {
this._loadingDelay = toNumber(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "bordered", {
/** 是否显示边框 */
get: function () {
return this._bordered;
},
set: function (value) {
this._bordered = toBoolean(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "showSizeChanger", {
/** 是否显示pagination中改变页数 */
get: function () {
return this._showSizeChanger;
},
set: function (value) {
this._showSizeChanger = toBoolean(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "showQuickJumper", {
/** 是否显示pagination中快速跳转 */
get: function () {
return this._showQuickJumper;
},
set: function (value) {
this._showQuickJumper = toBoolean(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "showTotal", {
set: function (value) {
if (typeof value === 'string' && value.length) {
this._totalTpl = value;
}
else if (toBoolean(value)) {
this._totalTpl = "\u5171 {{total}} \u6761";
}
else {
this._totalTpl = '';
}
},
enumerable: true,
configurable: true
});
SimpleTableComponent.prototype.renderTotal = function (total, range) {
return this._totalTpl
? this._totalTpl
.replace('{{total}}', total)
.replace('{{range[0]}}', range[0])
.replace('{{range[1]}}', range[1])
: '';
};
Object.defineProperty(SimpleTableComponent.prototype, "frontPagination", {
/**
* 前端分页，当 `data` 为`any[]` 或 `Observable<any[]>` 有效，默认：`true`
* - `true` 由 `simple-table` 根据 `data` 长度受控分页，包括：排序、过滤等
* - `false` 由用户通过 `total` 和 `data` 参数受控分页，并维护 `(change)` 当分页变更时重新加载数据
*/
get: function () {
return this._frontPagination;
},
set: function (value) {
this._frontPagination = toBoolean(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "isPageIndexReset", {
/** 数据变更后是否保留在数据变更前的页码 */
get: function () {
return this._isPageIndexReset;
},
set: function (value) {
this._isPageIndexReset = toBoolean(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "toTopInChange", {
/** 切换分页时返回顶部 */
get: function () {
return this._toTopInChange;
},
set: function (value) {
this._toTopInChange = toBoolean(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "toTopOffset", {
/** 返回顶部偏移值 */
get: function () {
return this._toTopOffset;
},
set: function (value) {
this._toTopOffset = toNumber(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "multiSort", {
/** 是否多排序，当 `sort` 多个相同值时自动合并，建议后端支持时使用 */
get: function () {
return this._multiSort;
},
set: function (value) {
if (typeof value === 'object') {
this._multiSort = Object.assign({
key: 'sort',
separator: '-',
name_separator: '.',
}, value);
}
else {
this._multiSort = toBoolean(value);
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(SimpleTableComponent.prototype, "zeroIndexedOnPage", {
/** 后端分页是否采用`1`基索引，只在`data`类型为`string`时有效 */
get: function () {
return this._zeroIndexedOnPage;
},
set: function (value) {
this._zeroIndexedOnPage = toBoolean(value);
},
enumerable: true,
configurable: true
});
// region: data
/**
* 根据页码重新加载数据
*
* @param pi 指定当前页码，默认：`1`
* @param extraParams 重新指定 `extraParams` 值
*/
SimpleTableComponent.prototype.load = function (pi, extraParams) {
if (pi === void 0) { pi = 1; }
if (pi !== -1)
this.pi = pi;
if (typeof extraParams !== 'undefined') {
this.extraParams = extraParams;
}
this._change('pi');
};
/**
* 重新刷新当前页
* @param extraParams 重新指定 `extraParams` 值
*/
SimpleTableComponent.prototype.reload = function (extraParams) {
this.load(-1, extraParams);
};
/**
* 重置且重新设置 `pi` 为 `1`
*
* @param extraParams 重新指定 `extraParams` 值
*/
SimpleTableComponent.prototype.reset = function (extraParams) {
this.load(1, extraParams);
};
SimpleTableComponent.prototype.getAjaxData = function (url) {
var _this = this;
var params = Object.assign((_a = {},
_a[this.reqReName.pi] = this._zeroIndexedOnPage ? this.pi - 1 : this.pi,
_a[this.reqReName.ps] = this.ps,
_a), this.extraParams, this.getReqSortMap(), this.getReqFilterMap());
return this.http
.request(this.reqMethod || 'GET', url || this._url, {
params: params,
body: this.reqBody,
headers: this.reqHeaders,
})
.pipe(map(function (res) {
// list
var ret = deepGet(res, _this.resReName.list, []);
if (ret == null || !Array.isArray(ret)) {
ret = [];
}
// total
var retTotal = _this.resReName.total &&
deepGet(res, _this.resReName.total, null);
_this.total = retTotal == null ? _this.total || 0 : +retTotal;
return ret;
}));
var _a;
};
SimpleTableComponent.prototype._genAjax = function (forceRefresh) {
var _this = this;
if (forceRefresh === void 0) { forceRefresh = false; }
if (!this._isAjax)
return;
this.loading = true;
if (forceRefresh === true)
this.pi = 1;
this.getAjaxData().subscribe(function (res) { return _this.checkPaged().subscribeData(res); }, function (err) {
_this.loading = false;
_this.reqError.emit(err);
});
};
SimpleTableComponent.prototype._genData = function (forceRefresh) {
if (forceRefresh === void 0) { forceRefresh = false; }
if (this._isAjax)
return;
var data = this.data.slice(0);
// sort
var sorterFn = this.getSorterFn();
if (sorterFn) {
data = data.sort(sorterFn);
}
// filter
this._columns.filter(function (w) { return w.filters && w.filters.length; }).forEach(function (c) {
var values = c.filters.filter(function (w) { return w.checked; });
if (values.length === 0)
return;
var onFilter = c.filter;
data = data.filter(function (record) { return values.some(function (v) { return onFilter(v, record); }); });
});
if (forceRefresh) {
if (this.isPageIndexReset) {
this.pi = 1;
}
else {
var maxPageIndex = Math.ceil(data.length / this.ps);
this.pi = !this.pi
? 1
: this.pi > maxPageIndex
? maxPageIndex
: this.pi;
}
}
this.total = this.frontPagination
? data.length
: this.total <= 0
? data.length
: this.total;
this.checkPaged().subscribeData(this._isPagination && this.frontPagination
? data.slice((this.pi - 1) * this.ps, this.pi * this.ps)
: data);
};
SimpleTableComponent.prototype._toTop = function () {
if (!this.toTopInChange)
return;
if (this.scroll) {
this.el.nativeElement
.querySelector('.ant-table-body')
.scrollTo(0, 0);
return;
}
this.el.nativeElement.scrollIntoView();
// fix header height
this.doc.documentElement.scrollTop -= this.toTopOffset;
};
SimpleTableComponent.prototype.checkPaged = function () {
this._isPagination =
typeof this.showPagination === 'undefined'
? this.ps > 0 && this.total > this.ps
: this.showPagination;
return this;
};
SimpleTableComponent.prototype.processData = function () {
var _this = this;
if (!this.data) {
this._isAjax = false;
this.data = [];
return;
}
this._isAjax = false;
if (typeof this.data === 'string') {
this._url = this.data;
this._isAjax = true;
this._genAjax(true);
}
else if (Array.isArray(this.data)) {
this._genData(this.frontPagination);
}
else {
if (this.data$) {
this.data$.unsubscribe();
}
this.data$ = this.data
.pipe(tap(function () { return (_this.loading = true); }))
.subscribe(function (res) {
_this.data = res;
_this._genData(_this.frontPagination);
});
}
};
SimpleTableComponent.prototype.subscribeData = function (res) {
var _this = this;
if (this.preDataChange)
res = this.preDataChange(res);
this.loading = false;
var _loop_1 = function (i) {
i._values = this_1._columns.map(function (c) { return _this._get(i, c); });
};
var this_1 = this;
for (var _i = 0, res_1 = res; _i < res_1.length; _i++) {
var i = res_1[_i];
_loop_1(i);
}
this._data = res;
this._refCheck();
};
SimpleTableComponent.prototype._change = function (type) {
if (!this._inited)
return;
this._genAjax();
if (this.frontPagination)
this._genData();
this._toTop();
this.change.emit({
type: type,
pi: this.pi,
ps: this.ps,
total: this.total,
});
};
SimpleTableComponent.prototype._get = function (item, col) {
if (col.format)
return col.format(item, col);
var value = deepGet(item, col.index, col.default);
var ret = value;
switch (col.type) {
case 'img':
ret = value ? "<img src=\"" + value + "\" class=\"img\">" : '';
break;
case 'number':
ret = this.number.transform(value, col.numberDigits);
break;
case 'currency':
ret = this.currenty.transform(value);
break;
case 'date':
ret = this.date.transform(value, col.dateFormat);
break;
case 'yn':
ret = this.yn.transform(value === col.ynTruth, col.ynYes, col.ynNo);
break;
}
return ret;
};
SimpleTableComponent.prototype._click = function (e, item, col) {
e.preventDefault();
e.stopPropagation();
var res = col.click(item, this);
if (typeof res === 'string') {
this.router.navigateByUrl(res);
}
return false;
};
SimpleTableComponent.prototype.getReqSortMap = function () {
var _this = this;
var ret = {};
if (!this._sortOrder)
return ret;
var ms = this.multiSort;
if (ms) {
Object.keys(this._sortMap).forEach(function (key) {
var item = _this._sortMap[key];
ret[item.key] =
(item.column.sortReName || _this.sortReName || {})[item.v] || item.v;
});
// 合并处理
if (typeof ms === 'object') {
ret = (_a = {},
_a[ms.key] = Object.keys(ret)
.map(function (key) { return key + ms.name_separator + ret[key]; })
.join(ms.separator),
_a);
}
}
else {
var mapData = this._sortMap[this._sortIndex];
ret[mapData.key] =
(this._sortColumn.sortReName || this.sortReName || {})[mapData.v] ||
mapData.v;
}
return ret;
var _a;
};
SimpleTableComponent.prototype.getSorterFn = function () {
var _this = this;
if (!this._sortOrder || !this._sortColumn) {
return;
}
return function (a, b) {
var result = _this._sortColumn.sorter(a, b);
if (result !== 0) {
return _this._sortOrder === 'descend' ? -result : result;
}
return 0;
};
};
SimpleTableComponent.prototype.sort = function (index, value) {
var _this = this;
this._sortColumn = this._columns[index];
this._sortOrder = value;
this._sortIndex = index;
if (this.multiSort) {
this._sortMap[index].v = value;
}
else {
Object.keys(this._sortMap).forEach(function (key) { return (_this._sortMap[key].v = +key === index ? value : null); });
}
this._genAjax(true);
this._genData(true);
this.sortChange.emit({
value: value,
map: this.getReqSortMap(),
column: this._sortColumn,
});
};
// endregion
// region: filter
SimpleTableComponent.prototype.getReqFilterMap = function () {
var ret = {};
this._columns.filter(function (w) { return w.filtered === true; }).forEach(function (col) {
var values = col.filters.filter(function (f) { return f.checked === true; });
var obj = {};
if (col.filterReName) {
obj = col.filterReName(col.filters, col);
}
else {
obj[col.filterKey || col.indexKey] = values.map(function (i) { return i.value; }).join(',');
}
ret = Object.assign(ret, obj);
});
return ret;
};
SimpleTableComponent.prototype.handleFilter = function (col) {
col.filtered = col.filters.findIndex(function (w) { return w.checked; }) !== -1;
this._genAjax(true);
this._genData(true);
this.filterChange.emit(col);
};
SimpleTableComponent.prototype.filterConfirm = function (col) {
this.handleFilter(col);
};
SimpleTableComponent.prototype.filterClear = function (col) {
col.filters.forEach(function (i) { return (i.checked = false); });
this.handleFilter(col);
};
SimpleTableComponent.prototype.filterRadio = function (col, item, checked) {
col.filters.forEach(function (i) { return (i.checked = false); });
item.checked = checked;
};
// endregion
// region: checkbox
/** 清除所有 `checkbox` */
SimpleTableComponent.prototype.clearCheck = function () {
return this._checkAll(false);
};
SimpleTableComponent.prototype._checkAll = function (checked) {
checked = typeof checked === 'undefined' ? this._allChecked : checked;
this._data.filter(function (w) { return !w.disabled; }).forEach(function (i) { return (i.checked = checked); });
return this._refCheck()._checkNotify();
};
SimpleTableComponent.prototype._checkSelection = function (i, value) {
i.checked = value;
return this._refCheck()._checkNotify();
};
SimpleTableComponent.prototype._refCheck = function () {
var validData = this._data.filter(function (w) { return !w.disabled; });
var checkedList = validData.filter(function (w) { return w.checked === true; });
this._allChecked =
checkedList.length > 0 && checkedList.length === validData.length;
var allUnChecked = validData.every(function (value) { return !value.checked; });
this._indeterminate = !this._allChecked && !allUnChecked;
return this;
};
SimpleTableComponent.prototype._rowSelection = function (row) {
row.select(this._data);
return this._refCheck()._checkNotify();
};
SimpleTableComponent.prototype._checkNotify = function () {
this.checkboxChange.emit(this._data.filter(function (w) { return !w.disabled && w.checked === true; }));
return this;
};
// endregion
// region: radio
/** 清除所有 `radio` */
SimpleTableComponent.prototype.clearRadio = function () {
this._data.filter(function (w) { return w.checked; }).forEach(function (item) { return (item.checked = false); });
this.radioChange.emit(null);
return this;
};
SimpleTableComponent.prototype._refRadio = function (checked, item) {
// if (item.disabled === true) return;
this._data.filter(function (w) { return !w.disabled; }).forEach(function (i) { return (i.checked = false); });
item.checked = checked;
this.radioChange.emit(item);
return this;
};
// endregion
// region: buttons
SimpleTableComponent.prototype.btnCoerce = function (list) {
if (!list)
return [];
var ret = [];
for (var _i = 0, list_1 = list; _i < list_1.length; _i++) {
var item = list_1[_i];
if (item.type === 'del' && typeof item.pop === 'undefined')
item.pop = true;
if (item.pop === true) {
item._type = 2;
if (typeof item.popTitle === 'undefined')
item.popTitle = "\u786E\u8BA4\u5220\u9664\u5417\uFF1F";
}
if (item.children && item.children.length > 0) {
item._type = 3;
item.children = this.btnCoerce(item.children);
}
if (!item._type)
item._type = 1;
ret.push(item);
}
this.btnCoerceIf(ret);
return ret;
};
SimpleTableComponent.prototype.btnCoerceIf = function (list) {
for (var _i = 0, list_2 = list; _i < list_2.length; _i++) {
var item = list_2[_i];
if (!item.iif)
item.iif = function () { return true; };
if (!item.children) {
item.children = [];
}
else {
this.btnCoerceIf(item.children);
}
}
};
SimpleTableComponent.prototype.btnClick = function (record, btn) {
var _this = this;
if (btn.type === 'modal' || btn.type === 'static') {
var obj = {};
obj[btn.paramName || this.defConfig.modalParamsName || 'record'] = record;
var options = Object.assign({}, btn.modal);
// TODO: deprecated
if (btn.size)
options.size = btn.size;
if (btn.modalOptions)
options.modalOptions = btn.modalOptions;
this.modal[btn.type === 'modal' ? 'create' : 'createStatic'](btn.component, Object.assign(obj, btn.params && btn.params(record)), options)
.pipe(filter(function (w) { return typeof w !== 'undefined'; }))
.subscribe(function (res) { return _this.btnCallback(record, btn, res); });
return;
}
else if (btn.type === 'link') {
var clickRes = this.btnCallback(record, btn);
if (typeof clickRes === 'string') {
this.router.navigateByUrl(clickRes);
}
return;
}
this.btnCallback(record, btn);
};
SimpleTableComponent.prototype.btnCallback = function (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);
}
};
SimpleTableComponent.prototype.btnText = function (record, btn) {
if (btn.format)
return btn.format(record, btn);
return btn.text;
};
// endregion
// region: fixed
SimpleTableComponent.prototype.fixedCoerce = function (list) {
list.forEach(function (item, idx) {
if (item.fixed && item.width) {
if (item.fixed === 'left') {
item._left = idx === 0 ? '0px' : list[idx - 1].width;
}
else {
item._right = idx === list.length - 1 ? '0px' : list[idx + 1].width;
}
}
});
};
// endregion
// region: export
/**
* 导出Excel，确保已经注册 `AdXlsxModule`
* @param urlOrData 重新指定数据，例如希望导出所有数据非常有用
* @param opt 额外参数
*/
SimpleTableComponent.prototype.export = function (urlOrData, opt) {
var _this = this;
(urlOrData
? typeof urlOrData === 'string'
? this.getAjaxData(urlOrData)
: of(urlOrData)
: this._isAjax
? this.getAjaxData()
: of(this.data)).subscribe(function (res) {
return _this.exportSrv.export(Object.assign({}, opt, {
_d: res,
_c: _this._columns,
}));
});
};
// endregion
SimpleTableComponent.prototype.ngOnInit = function () {
this._inited = true;
this.updateColumns();
this.processData();
};
SimpleTableComponent.prototype.setClass = function () {
var _this = this;
this._classMap.forEach(function (cls) {
return _this.renderer.removeClass(_this.el.nativeElement, cls);
});
this._classMap = [];
if (this.pagePlacement)
this._classMap.push('ad-st__p' + this.pagePlacement);
this._classMap.forEach(function (cls) {
return _this.renderer.addClass(_this.el.nativeElement, cls);
});
};
SimpleTableComponent.prototype.updateColumns = function () {
this._columns = [];
if (!this.columns || this.columns.length === 0)
throw new Error("the columns property muse be define!");
var checkboxCount = 0;
var radioCount = 0;
var sortMap = {};
var idx = 0;
var newColumns = [];
var copyColumens = deepCopy(this.columns);
for (var _i = 0, copyColumens_1 = copyColumens; _i < copyColumens_1.length; _i++) {
var item = copyColumens_1[_i];
if (item.index) {
if (!Array.isArray(item.index))
item.index = item.index.split('.');
item.indexKey = item.index.join('.');
}
// rowSelection
if (!item.selections)
item.selections = [];
if (item.type === 'checkbox') {
++checkboxCount;
if (!item.width) {
item.width = (item.selections.length > 0 ? 60 : 50) + "px";
}
}
if (item.type === 'radio') {
++radioCount;
item.selections = [];
if (!item.width)
item.width = '50px';
}
if (item.type === 'yn' && typeof item.ynTruth === 'undefined') {
item.ynTruth = true;
}
if ((item.type === 'link' && typeof item.click !== 'function') ||
(item.type === 'badge' && typeof item.badge === 'undefined') ||
(item.type === 'tag' && typeof item.tag === 'undefined')) {
item.type = '';
}
if (!item.className) {
item.className = {
// 'checkbox': 'text-center',
// 'radio': 'text-center',
number: 'text-right',
currency: 'text-right',
date: 'text-center',
}[item.type];
}
// sorter
if (item.sorter && typeof item.sorter === 'function') {
sortMap[idx] = {
enabled: true,
v: item.sort,
key: item.sortKey || item.indexKey,
column: item,
};
if (item.sort && !this._sortColumn) {
this._sortColumn = item;
this._sortOrder = item.sort;
this._sortIndex = idx;
}
}
else {
sortMap[idx] = {
enabled: false,
};
}
// filter
if (!item.filter || !item.filters)
item.filters = [];
if (typeof item.filterMultiple === 'undefined')
item.filterMultiple = true;
if (!item.filterConfirmText)
item.filterConfirmText = "\u786E\u8BA4";
if (!item.filterClearText)
item.filterClearText = "\u91CD\u7F6E";
if (!item.filterIcon)
item.filterIcon = "anticon anticon-filter";
item.filtered = item.filters.findIndex(function (w) { return w.checked; }) !== -1;
// buttons
item.buttons = this.btnCoerce(item.buttons);
// i18n
++idx;
newColumns.push(item);
}
if (checkboxCount > 1)
throw new Error("just only one column checkbox");
if (radioCount > 1)
throw new Error("just only one column radio");
this.fixedCoerce(newColumns);
this._columns = newColumns;
this._sortMap = sortMap;
};
SimpleTableComponent.prototype.ngOnChanges = function (changes) {
if (changes.columns && this._inited)
this.updateColumns();
if (changes.data && this._inited)
this.processData();
this.setClass();
};
SimpleTableComponent.prototype.ngOnDestroy = function () {
if (this.data$) {
this.data$.unsubscribe();
this.data$ = null;
}
};
SimpleTableComponent.decorators = [
{ type: Component, args: [{
selector: 'simple-table',
template: "\n <nz-table [nzData]=\"_data\" [(nzPageIndex)]=\"pi\" (nzPageIndexChange)=\"_change('pi')\" [(nzPageSize)]=\"ps\" (nzPageSizeChange)=\"_change('ps')\"\n [nzTotal]=\"total\" [nzShowPagination]=\"_isPagination\" [nzFrontPagination]=\"false\" [nzBordered]=\"bordered\" [nzSize]=\"size\"\n [nzLoading]=\"loading\" [nzLoadingDelay]=\"loadingDelay\" [nzScroll]=\"scroll\" [nzTitle]=\"header\" [nzFooter]=\"footer\" [nzNoResult]=\"noResult\"\n [nzPageSizeOptions]=\"pageSizeOptions\" [nzShowQuickJumper]=\"showQuickJumper\" [nzShowSizeChanger]=\"showSizeChanger\" [nzShowTotal]=\"totalTpl\">\n <thead class=\"ad-st-head\">\n <tr>\n <th *ngIf=\"expand\" [nzShowExpand]=\"expand\"></th>\n <th *ngFor=\"let c of _columns; let index=index\" [nzWidth]=\"c.width\" [nzLeft]=\"c._left\" [nzRight]=\"c._right\" [ngClass]=\"c.className\"\n [attr.colspan]=\"c.colSpan\" [attr.data-col]=\"c.indexKey\" [nzShowSort]=\"_sortMap[index].enabled\" [nzSort]=\"_sortMap[index].v\"\n (nzSortChange)=\"sort(index, $event)\">\n <ng-template #renderTitle [ngTemplateOutlet]=\"c.__renderTitle\" [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 <label nz-checkbox class=\"ad-st-checkall\" [(ngModel)]=\"_allChecked\" [nzIndeterminate]=\"_indeterminate\" (ngModelChange)=\"_checkAll()\"></label>\n <nz-dropdown *ngIf=\"c.selections.length\" class=\"ad-st-checkselection\">\n <span nz-dropdown>\n <i class=\"anticon anticon-down\"></i>\n </span>\n <ul nz-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>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <span [innerHTML]=\"c.title\"></span>\n </ng-container>\n </ng-container>\n <nz-dropdown class=\"ad-st-filter\" *ngIf=\"c.filters.length > 0\" nzTrigger=\"click\" [hasFilterButton]=\"true\" [nzClickHide]=\"false\"\n [(nzVisible)]=\"c.filterVisible\">\n <i class=\"{{c.filterIcon}}\" [ngClass]=\"{'ant-table-filter-selected': c.filtered}\" nz-dropdown></i>\n <ul nz-menu>\n <ng-container *ngIf=\"c.filterMultiple\">\n <li nz-menu-item *ngFor=\"let filter of c.filters\">\n <label nz-checkbox [(ngModel)]=\"filter.checked\">{{filter.text}}</label>\n </li>\n </ng-container>\n <ng-container *ngIf=\"!c.filterMultiple\">\n <li nz-menu-item *ngFor=\"let filter of c.filters\">\n <label nz-radio [ngModel]=\"filter.checked\" (ngModelChange)=\"filterRadio(c, filter, $event)\">{{filter.text}}</label>\n </li>\n </ng-container>\n </ul>\n <div class=\"ant-table-filter-dropdown-btns\">\n <a class=\"ant-table-filter-dropdown-link confirm\" (click)=\"c.filterVisible = false\">\n <span (click)=\"filterConfirm(c)\">{{c.filterConfirmText}}</span>\n </a>\n <a class=\"ant-table-filter-dropdown-link clear\" (click)=\"c.filterVisible = false\">\n <span (click)=\"filterClear(c)\">{{c.filterClearText}}</span>\n </a>\n </div>\n </nz-dropdown>\n </ng-container>\n </th>\n </tr>\n </thead>\n <tbody class=\"ad-st-body\">\n <ng-container *ngFor=\"let i of _data; let index=index\">\n <tr [attr.data-index]=\"index\">\n <td *ngIf=\"expand\" [nzShowExpand]=\"expand\" [(nzExpand)]=\"i.expand\"></td>\n <td *ngFor=\"let c of _columns; let cIdx=index\" [nzLeft]=\"c._left\" [nzRight]=\"c._right\" [nzCheckbox]=\"c.type === 'checkbox'\" [ngClass]=\"c.className\"\n [attr.colspan]=\"c.colSpan\">\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 *ngIf=\"c.index\" [ngSwitch]=\"c.type\">\n <ng-container *ngSwitchCase=\"'checkbox'\">\n <label nz-checkbox [nzDisabled]=\"i.disabled\" [ngModel]=\"i.checked\" (ngModelChange)=\"_checkSelection(i, $event)\"></label>\n </ng-container>\n <ng-container *ngSwitchCase=\"'radio'\">\n <label nz-radio [nzDisabled]=\"i.disabled\" [ngModel]=\"i.checked\" (ngModelChange)=\"_refRadio($event, i)\"></label>\n </ng-container>\n <ng-container *ngSwitchCase=\"'link'\">\n <a (click)=\"_click($event, i, c)\" [innerHTML]=\"i._values[cIdx]\"></a>\n </ng-container>\n <ng-container *ngSwitchCase=\"'tag'\">\n <nz-tag [nzColor]=\"c.tag[i._values[cIdx]].color\">{{c.tag[i._values[cIdx]].text || i._values[cIdx]}}</nz-tag>\n </ng-container>\n <ng-container *ngSwitchCase=\"'badge'\">\n <nz-badge [nzStatus]=\"c.badge[i._values[cIdx]].color\" [nzText]=\"c.badge[i._values[cIdx]].text || i._values[cIdx]\"></nz-badge>\n </ng-container>\n <span *ngSwitchDefault [innerHTML]=\"i._values[cIdx]\"></span>\n </ng-container>\n <ng-container *ngFor=\"let btn of c.buttons; let last=last\">\n <ng-container *ngIf=\"btn.iif(i, btn, c)\" [ngSwitch]=\"btn._type\">\n <ng-container *ngSwitchCase=\"2\">\n <nz-popconfirm [nzTitle]=\"btn.popTitle\" (nzOnConfirm)=\"btnClick(i, btn)\">\n <a nz-popconfirm [innerHTML]=\"btnText(i, btn)\"></a>\n </nz-popconfirm>\n </ng-container>\n <ng-container *ngSwitchCase=\"3\">\n <nz-dropdown>\n <a class=\"ant-dropdown-link\" nz-dropdown>\n <span [innerHTML]=\"btnText(i, btn)\"></span>\n <i class=\"anticon anticon-down\"></i>\n </a>\n <ul nz-menu>\n <ng-container *ngFor=\"let subBtn of btn.children\">\n <li nz-menu-item *ngIf=\"subBtn.iif(i, subBtn, c)\">\n <nz-popconfirm *ngIf=\"subBtn._type === 2\" [nzTitle]=\"subBtn.popTitle\" (nzOnConfirm)=\"btnClick(i, subBtn)\">\n <a nz-popconfirm [innerHTML]=\"btnText(i, subBtn)\"></a>\n </nz-popconfirm>\n <a *ngIf=\"subBtn._type !== 2\" (click)=\"btnClick(i, subBtn)\" [innerHTML]=\"btnText(i, subBtn)\"></a>\n </li>\n </ng-container>\n </ul>\n </nz-dropdown>\n </ng-container>\n <a *ngSwitchDefault (click)=\"btnClick(i, btn)\" [innerHTML]=\"btnText(i, btn)\"></a>\n <nz-divider *ngIf=\"!last\" nzType=\"vertical\"></nz-divider>\n </ng-container>\n </ng-container>\n <ng-template [ngIf]=\"!c.__renderExpanded\" [ngTemplateOutlet]=\"c.__renderExpanded\" [ngTemplateOutletContext]=\"{$implicit: i, index: index, column: c }\"></ng-template>\n </ng-container>\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, column: c }\"></ng-template>\n </td>\n </tr>\n </ng-container>\n <ng-template [ngIf]=\"!loading\" [ngTemplateOutlet]=\"body\"></ng-template>\n </tbody>\n <ng-template #totalTpl let-range=\"range\" let-total>{{ renderTotal(total, range) }}</ng-template>\n</nz-table>\n\n ",
// templateUrl: './simple-table.component.html',
host: { '[class.ad-st]': 'true' },
providers: [SimpleTableExport, CNCurrencyPipe, DatePipe, YNPipe, DecimalPipe],
preserveWhitespaces: false,
},] },
];
/** @nocollapse */
SimpleTableComponent.ctorParameters = function () { return [
{ type: AdSimpleTableConfig },
{ type: HttpClient },
{ type: Router },
{ type: ElementRef },
{ type: Renderer2 },
{ type: SimpleTableExport },
{ type: ModalHelper },
{ type: CNCurrencyPipe },
{ type: DatePipe },
{ type: YNPipe },
{ type: DecimalPipe },
{ type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
]; };
SimpleTableComponent.propDecorators = {
data: [{ type: Input }],
extraParams: [{ type: Input }],
reqMethod: [{ type: Input }],
reqBody: [{ type: Input }],
reqHeaders: [{ type: Input }],
reqReName: [{ type: Input }],
reqError: [{ type: Output }],
resReName: [{ type: Input }],
columns: [{ type: Input }],
ps: [{ type: Input }],
pi: [{ type: Input }],
total: [{ type: Input }],
showPagination: [{ type: Input }],
loading: [{ type: Input }],
loadingDelay: [{ type: Input }],
bordered: [{ type: Input }],
size: [{ type: Input }],
scroll: [{ type: Input }],
showSizeChanger: [{ type: Input }],
pageSizeOptions: [{ type: Input }],
showQuickJumper: [{ type: Input }],
showTotal: [{ type: Input }],
frontPagination: [{ type: Input }],
isPageIndexReset: [{ type: Input }],
pagePlacement: [{ type: Input }],
toTopInChange: [{ type: Input }],
toTopOffset: [{ type: Input }],
sortReName: [{ type: Input }],
multiSort: [{ type: Input }],
preDataChange: [{ type: Input }],
header: [{ type: ContentChild, args: ['header',] }],
body: [{ type: ContentChild, args: ['body',] }],
footer: [{ type: ContentChild, args: ['footer',] }],
expand: [{ type: ContentChild, args: ['expand',] }],
noResult: [{ type: Input }],
widthConfig: [{ type: Input }],
change: [{ type: Output }],
checkboxChange: [{ type: Output }],
radioChange: [{ type: Output }],
sortChange: [{ type: Output }],
filterChange: [{ type: Output }],
zeroIndexedOnPage: [{ type: Input }]
};
return SimpleTableComponent;
}());
export { SimpleTableComponent };
//# sourceMappingURL=simple-table.component.js.map