@doreamonjs/page-list
Version:
103 lines • 8.29 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ListPage = void 0;
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importStar(require("react"));
const doreamon_1 = tslib_1.__importDefault(require("@zodash/doreamon"));
const components_1 = require("@doreamonjs/components");
const antd_1 = require("antd");
const icons_1 = require("@ant-design/icons");
require("./index.less");
const isMobile = () => { var _a, _b; return (_b = (_a = window.matchMedia) === null || _a === void 0 ? void 0 : _a.call(window, '(max-width: 767px)')) === null || _b === void 0 ? void 0 : _b.matches; };
class ListPage extends react_1.Component {
constructor() {
super(...arguments);
this.renderTitle = () => {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
const attributes = (_a = this.props.attributes) !== null && _a !== void 0 ? _a : {};
if (((_c = (_b = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _b === void 0 ? void 0 : _b.search) === null || _c === void 0 ? void 0 : _c.mode) === 'simple') {
const searchKey = (_g = (_f = (_e = (_d = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _d === void 0 ? void 0 : _d.search) === null || _e === void 0 ? void 0 : _e.simple) === null || _f === void 0 ? void 0 : _f.searchKey) !== null && _g !== void 0 ? _g : 'q';
const isFuzzy = (_l = (_k = (_j = (_h = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _h === void 0 ? void 0 : _h.search) === null || _j === void 0 ? void 0 : _j.simple) === null || _k === void 0 ? void 0 : _k.isFuzzy) !== null && _l !== void 0 ? _l : true;
const placeholder = (_q = (_p = (_o = (_m = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _m === void 0 ? void 0 : _m.search) === null || _o === void 0 ? void 0 : _o.simple) === null || _p === void 0 ? void 0 : _p.placeholder) !== null && _q !== void 0 ? _q : '搜索';
//
const hideInMobile = (_u = (_t = (_s = (_r = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _r === void 0 ? void 0 : _r.search) === null || _s === void 0 ? void 0 : _s.simple) === null || _t === void 0 ? void 0 : _t.hideInMobile) !== null && _u !== void 0 ? _u : false;
if (hideInMobile && isMobile()) {
return null;
}
if ((_x = (_w = (_v = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _v === void 0 ? void 0 : _v.search) === null || _w === void 0 ? void 0 : _w.simple) === null || _x === void 0 ? void 0 : _x.render) {
return (_0 = (_z = (_y = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _y === void 0 ? void 0 : _y.search) === null || _z === void 0 ? void 0 : _z.simple) === null || _0 === void 0 ? void 0 : _0.render(this.props, (value) => {
var _a, _b;
(_b = (_a = this.props).onFilterChange) === null || _b === void 0 ? void 0 : _b.call(_a, searchKey, value, {
[searchKey]: !isFuzzy ? value : `${value}:*`,
});
}, this);
}
return (react_1.default.createElement(antd_1.Input, { placeholder: placeholder, allowClear: true, prefix: react_1.default.createElement(icons_1.SearchOutlined, null), onChange: (event) => {
var _a, _b;
const value = event.target.value;
(_b = (_a = this.props).onFilterChange) === null || _b === void 0 ? void 0 : _b.call(_a, searchKey, value, {
[searchKey]: !isFuzzy ? value : `${value}:*`,
});
} }));
}
return attributes.title;
};
}
componentDidUpdate(prevProps) {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
const attributes = (_a = this.props.attributes) !== null && _a !== void 0 ? _a : {};
if ((_d = (_c = (_b = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _b === void 0 ? void 0 : _b.page) === null || _c === void 0 ? void 0 : _c.watch) === null || _d === void 0 ? void 0 : _d.reset) {
const resetX = (_g = (_f = (_e = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _e === void 0 ? void 0 : _e.page) === null || _f === void 0 ? void 0 : _f.watch) === null || _g === void 0 ? void 0 : _g.reset;
if (typeof resetX === 'function') {
if (resetX(this.props, prevProps)) {
this.props.onReset();
return;
}
}
else if (resetX === null || resetX === void 0 ? void 0 : resetX.key) {
const currentValue = doreamon_1.default.object.get(this.props, resetX === null || resetX === void 0 ? void 0 : resetX.key);
const prevValue = doreamon_1.default.object.get(prevProps, resetX === null || resetX === void 0 ? void 0 : resetX.key);
if (!doreamon_1.default.object.equal(currentValue, prevValue)) {
this.props.onReset();
return;
}
}
}
if ((_k = (_j = (_h = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _h === void 0 ? void 0 : _h.page) === null || _j === void 0 ? void 0 : _j.watch) === null || _k === void 0 ? void 0 : _k.refresh) {
const refreshX = (_o = (_m = (_l = attributes === null || attributes === void 0 ? void 0 : attributes.configs) === null || _l === void 0 ? void 0 : _l.page) === null || _m === void 0 ? void 0 : _m.watch) === null || _o === void 0 ? void 0 : _o.refresh;
if (typeof refreshX === 'function') {
if (refreshX(this.props, prevProps)) {
this.props.onRefresh();
return;
}
}
else if (refreshX === null || refreshX === void 0 ? void 0 : refreshX.key) {
const currentValue = doreamon_1.default.object.get(this.props, refreshX === null || refreshX === void 0 ? void 0 : refreshX.key);
const prevValue = doreamon_1.default.object.get(prevProps, refreshX === null || refreshX === void 0 ? void 0 : refreshX.key);
if (!doreamon_1.default.object.equal(currentValue, prevValue)) {
this.props.onRefresh();
return;
}
}
}
}
render() {
var _a, _b, _c;
const props = this.props;
const attributes = (_a = props.attributes) !== null && _a !== void 0 ? _a : {};
const datasets = (_b = props.datasets) !== null && _b !== void 0 ? _b : {};
const constraints = (_c = props.constraints) !== null && _c !== void 0 ? _c : {};
return (react_1.default.createElement("div", { style: {
// backgroundColor: '#fff',
// padding: '16px 16px',
...props.style,
}, className: doreamon_1.default.classnames(props.className, {
'page-list': true,
'type-component': true,
}) },
react_1.default.createElement(components_1.Table.Filter, { headerStyle: props.headerStyle, bodyStyle: props.bodyStyle, loading: props.loading, ...attributes, ...attributes === null || attributes === void 0 ? void 0 : attributes.table, title: this.renderTitle(), description: attributes.description, filters: attributes.filters, columns: attributes.columns, categories: attributes.categories, search: attributes.configs.search, filterValues: constraints.where, dataSource: datasets.table, onActionTrigger: props.onActionTrigger, onTableChange: props.onTableChange, onFilterChange: props.onFilterChange, onCategoryChange: props.onCategoryChange })));
}
}
exports.ListPage = ListPage;
exports.default = ListPage;
//# sourceMappingURL=index.js.map