es-grid-template
Version:
es-grid-template
220 lines (210 loc) • 8.57 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.convertToTanStackColumns = convertToTanStackColumns;
exports.renderValueCell = void 0;
var _react = _interopRequireWildcard(require("react"));
var _ControlCheckbox = _interopRequireDefault(require("../components/ControlCheckbox"));
var _utils = require("./utils");
var _reactNumericComponent = require("react-numeric-component");
var _dayjs = _interopRequireDefault(require("dayjs"));
var _moment = _interopRequireDefault(require("moment"));
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
const renderValueCell = (column, value, record, rowIndex, colIndex, format, editAble) => {
switch (column?.type) {
case 'number':
const colFormat = typeof column.format === 'function' ? column.format(record) : column.format;
const cellFormat = (0, _utils.getFormat)(colFormat, format);
const thousandSeparator = cellFormat?.thousandSeparator;
const decimalSeparator = cellFormat?.decimalSeparator;
const dec = cellFormat?.decimalScale;
// const contentNumber = !isEmpty(value) ? ((dec || dec === 0) ? parseFloat(Number(value).toFixed(dec)).toString() : value.toString()) : '0'
const tmpval = typeof value === 'string' ? Number(value) : value;
const numericFormatProps = {
thousandSeparator: (0, _utils.checkThousandSeparator)(thousandSeparator, decimalSeparator),
decimalSeparator: (0, _utils.checkDecimalSeparator)(thousandSeparator, decimalSeparator),
allowNegative: cellFormat?.allowNegative ?? true,
prefix: cellFormat?.prefix,
suffix: cellFormat?.suffix,
decimalScale: dec,
fixedDecimalScale: cellFormat?.fixedDecimalScale ?? false
};
// if ( typeof value === "string") {
// const ttt = removeNumericFormat(value, undefined, numericFormatProps )
//
// }
const contentNumber = !(0, _utils.isEmpty)(value) ? dec || dec === 0 ? parseFloat(tmpval.toFixed(dec)).toString() : tmpval.toString() : '0';
// const contentNumber = !isEmpty(value) ? ((dec || dec === 0) ? tmpval.toString() : tmpval.toString()) : '0'
return !(0, _utils.isEmpty)(contentNumber) ? (0, _reactNumericComponent.numericFormatter)(contentNumber, numericFormatProps) : '';
case 'date':
return value ? (0, _dayjs.default)(value).format(format?.dateFormat ?? 'DD/MM/YYYY') : '';
case 'time':
return value ? value : '';
case 'year':
const year = value ? (0, _moment.default)(value).format('yyyy') : '';
return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, year);
case 'datetime':
return value ? (0, _moment.default)(value).format(format?.datetimeFormat ?? 'DD/MM/YYYY HH:mm') : '';
case 'boolean':
return value ? 'true' : 'false';
case 'color':
return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
className: 'w-100 h-100',
style: {
backgroundColor: (0, _utils.isColor)(value) ? value : '#fff',
border: '1px solid #f0f0f0',
height: '100%',
minHeight: 20
}
}));
case 'checkbox':
// return (
// <Checkbox
// checked={!!value}
//
// />
// )
return /*#__PURE__*/_react.default.createElement(_ControlCheckbox.default, {
column: column,
record: record,
rowIndex: rowIndex,
colIndex: colIndex,
checked: !!value,
checkValue: value,
editAble: editAble
});
case 'file':
const nameFile = typeof value === 'object' && !Array.isArray(value) ? value.name : Array.isArray(value) ? value.map(it => typeof it === 'object' ? it.name : it).filter(Boolean).join(", ") : '';
return value ? nameFile : '';
default:
if (Array.isArray(value)) {
return value.join(', ');
}
return value;
}
};
exports.renderValueCell = renderValueCell;
function convertToTanStackColumns({
columns,
expanded,
setExpanded,
expandable,
format,
editAble
}) {
const expandIconColumnIndex = expandable?.expandIconColumnIndex ?? 0;
return columns.map(col => {
const {
headerText,
headerTemplate,
field,
width,
allowResizing,
minWidth,
template,
allowSorter
} = col;
const {
children,
...restProps
} = col;
const newCol = {
header: () => {
if (headerTemplate) {
if (typeof headerTemplate === 'function') {
return headerTemplate(col);
} else {
return headerTemplate;
}
} else {
return headerText;
}
},
cell: props => {
const {
getValue,
cell,
row
} = props;
const cellValue = props.renderValue() ?? null;
const record = cell.row.original;
const colIndex = cell.column.getIndex();
const rowIndex = cell.row.index;
if (template) {
if (typeof template === 'function') {
return template({
field: field ?? '',
index: cell.row.index,
rowData: cell.row.original,
value: getValue()
});
} else {
return template;
}
} else {
return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, cell.column.getIndex() === expandIconColumnIndex && /*#__PURE__*/_react.default.createElement("div", {
className: "ui-rc-table-row-expand-trigger",
style: {
paddingLeft: `${row.depth * 25}px`
}
}, /*#__PURE__*/_react.default.createElement("div", null, row.getCanExpand() ? /*#__PURE__*/_react.default.createElement("button", {
// onClick: row.getToggleExpandedHandler(),
onClick: () => {
const keys = Object.keys(expanded);
// @ts-ignore
const tmp = {
...expanded
};
if (keys.includes(row.id)) {
delete tmp[row.id];
setExpanded(tmp);
} else {
setExpanded(old => ({
...old,
[row.id]: true
}));
}
},
style: {
cursor: "pointer"
},
className: "ui-rc-table-row-expand"
}, row.getIsExpanded() ? /*#__PURE__*/_react.default.createElement("span", {
className: "ui-rc-table-row-expand-icon ui-rc-table-row-expand-icon-expanded"
}) : /*#__PURE__*/_react.default.createElement("span", {
className: "ui-rc-table-row-expand-icon ui-rc-table-row-expand-icon-collapsed"
})) : /*#__PURE__*/_react.default.createElement("span", {
className: "ui-rc-table-row-expand-icon ui-rc-table-row-expand-icon-spaced"
}))), renderValueCell(col, cellValue, record, rowIndex, colIndex, format, editAble));
}
},
enableResizing: allowResizing !== false,
// enableResizing: true,
id: field,
size: width,
accessorKey: field ?? '',
sortDescFirst: false,
minSize: minWidth,
// maxSize: maxWidth,
enableSorting: allowSorter !== false || col.sorter !== false
};
// if (field) {
// // @ts-ignore
// newCol.accessorKey = field;
// }
if (children) {
// @ts-ignore
newCol.columns = convertToTanStackColumns(children);
}
const meta = {
...restProps
};
if (Object.keys(meta).length > 0) {
newCol.meta = meta;
}
return newCol;
});
}