@uiw-admin/components
Version:
295 lines (288 loc) • 11.5 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireWildcard(require("react"));
var _uiw = require("uiw");
var _hooks = require("./hooks");
var _useSelections = _interopRequireDefault(require("./useSelections"));
var _request = require("@kkt/request");
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["style", "columns", "rowSelection", "onPageChange", "scroll", "paginationProps"],
_excluded2 = ["props"];
var BaseTable = function BaseTable(_ref) {
var style = _ref.style,
columns = _ref.columns,
_ref$rowSelection = _ref.rowSelection,
rowSelection = _ref$rowSelection === void 0 ? {
selectKey: undefined,
type: 'checkbox',
defaultSelected: []
} : _ref$rowSelection,
pageChange = _ref.onPageChange,
_ref$scroll = _ref.scroll,
scroll = _ref$scroll === void 0 ? {} : _ref$scroll,
_ref$paginationProps = _ref.paginationProps,
paginationProps = _ref$paginationProps === void 0 ? {} : _ref$paginationProps,
tableProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
var _useState = (0, _react.useState)(1),
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
pageIndex = _useState2[0],
setPageIndex = _useState2[1];
var _useState3 = (0, _react.useState)((paginationProps === null || paginationProps === void 0 ? void 0 : paginationProps.pageSize) || 10),
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
pgSize = _useState4[0],
setPgSize = _useState4[1];
var _useState5 = (0, _react.useState)({
data: [],
total: 0
}),
_useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
prevData = _useState6[0],
setPrevData = _useState6[1];
var store = (0, _hooks.useStore)();
var _ref2 = store,
formatData = _ref2.formatData,
updateStore = _ref2.updateStore,
query = _ref2.query,
key = _ref2.key,
searchValues = _ref2.searchValues,
requestOptions = _ref2.requestOptions,
mutationOptions = _ref2.mutationOptions;
var selectKey = rowSelection.selectKey,
_rowSelection$type = rowSelection.type,
type = _rowSelection$type === void 0 ? 'checkbox' : _rowSelection$type,
_rowSelection$default = rowSelection.defaultSelected,
defaultSelected = _rowSelection$default === void 0 ? [] : _rowSelection$default;
var x = scroll.x;
var isCheckbox = type === 'checkbox';
// 提出表单属性
var defaultColumns = function defaultColumns() {
return columns.map(function (item) {
var props = item.props,
others = (0, _objectWithoutProperties2["default"])(item, _excluded2);
return others;
});
};
// 表单默认值
var defaultValues = (0, _react.useMemo)(function () {
var defaultSearchValues = {};
columns.forEach(function (col) {
var _col$props;
if (col !== null && col !== void 0 && (_col$props = col.props) !== null && _col$props !== void 0 && _col$props.initialValue) {
var name = col.props.key || col.key;
defaultSearchValues[name] = col.props.initialValue;
}
if (Array.isArray(col.props)) {
col.props.forEach(function (form) {
var name = form.key || col.key;
if (form.initialValue) {
defaultSearchValues[name] = form.initialValue;
}
});
}
});
return defaultSearchValues;
}, [JSON.stringify(columns)]);
// 是否首次调取数据
var isFirstMountRef = (0, _react.useRef)(false);
// 格式化接口查询参数
var formatQuery = function formatQuery() {
if (query) {
var params = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, defaultValues), searchValues);
return query(pageIndex, pgSize, params);
} else {
// 默认传参
return {
page: 1,
pageSize: 10
};
}
};
var pageSize = formatQuery().pageSize || 10;
// 调接口
var _useReactMutation = (0, _request.useReactMutation)((0, _objectSpread2["default"])({
mutationFn: function () {
var _mutationFn = (0, _asyncToGenerator2["default"])( /*#__PURE__*/(0, _regeneratorRuntime2["default"])().mark(function _callee() {
var url, query, params, searchParams;
return (0, _regeneratorRuntime2["default"])().wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
url = key;
query = formatQuery();
params = (0, _objectSpread2["default"])({
method: 'POST',
body: JSON.stringify(query)
}, requestOptions);
if (['get', 'GET'].includes(params.method)) {
searchParams = new URLSearchParams(query);
url += '?' + searchParams.toString();
delete params.body;
}
return _context.abrupt("return", (0, _request.fetchFn)(url, params));
case 5:
case "end":
return _context.stop();
}
}, _callee);
}));
function mutationFn() {
return _mutationFn.apply(this, arguments);
}
return mutationFn;
}()
}, mutationOptions)),
mutate = _useReactMutation.mutate,
data = _useReactMutation.data,
isLoading = _useReactMutation.isLoading;
(0, _react.useEffect)(function () {
// 第一次加载
mutate();
}, [mutate]);
// table数据
var tableData = formatData && data ? formatData(data).data : (data === null || data === void 0 ? void 0 : data.data) || (prevData === null || prevData === void 0 ? void 0 : prevData.data);
var selection = (0, _useSelections["default"])(
// 有枚举值的话 设置枚举值
selectKey ? tableData ? tableData.map(function (itm) {
return itm[selectKey];
}) : [] : [], defaultSelected, type === 'radio');
// 总数
var total = formatData && data ? formatData(data).total : (data === null || data === void 0 ? void 0 : data.total) || (prevData === null || prevData === void 0 ? void 0 : prevData.total);
// 分页
var onPageChange = (0, _react.useCallback)( /*#__PURE__*/function () {
var _ref3 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/(0, _regeneratorRuntime2["default"])().mark(function _callee2(page) {
return (0, _regeneratorRuntime2["default"])().wrap(function _callee2$(_context2) {
while (1) switch (_context2.prev = _context2.next) {
case 0:
if (pageChange) {
pageChange(page);
}
_context2.next = 3;
return setPageIndex(page);
case 3:
mutate(false);
case 4:
case "end":
return _context2.stop();
}
}, _callee2);
}));
return function (_x) {
return _ref3.apply(this, arguments);
};
}(), [setPageIndex, pageChange]);
(0, _react.useEffect)(function () {
// 获取表单默认值
var defaultSearchValues = {};
columns.forEach(function (col) {
var _col$props2;
if (col !== null && col !== void 0 && (_col$props2 = col.props) !== null && _col$props2 !== void 0 && _col$props2.initialValue) {
var name = col.props.key || col.key;
defaultSearchValues[name] = col.props.initialValue;
}
if (Array.isArray(col.props)) {
col.props.forEach(function (form) {
var name = form.key || col.key;
if (form.initialValue) {
defaultSearchValues[name] = form.initialValue;
}
});
}
});
var stores = {
data: tableData,
total: total,
loading: isLoading,
// onSearch,
selection: selection,
pageIndex: pageIndex,
setPageIndex: setPageIndex,
mutate: mutate
};
if (!isFirstMountRef.current) {
isFirstMountRef.current = true;
// 默认表单值
stores.searchValues = defaultSearchValues;
}
updateStore(stores);
// 上一次请求数据
if (data) {
setPrevData(tableData);
}
}, [JSON.stringify(tableData), isLoading, JSON.stringify(columns), pageIndex, JSON.stringify(selection), setPageIndex, mutate, total]);
var selectionCol = [{
title: isCheckbox ? function () {
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_uiw.Checkbox, {
checked: selection.allSelected,
indeterminate: !selection.allSelected && selection.partiallySelected,
onClick: function onClick() {
selection.toggleAll();
}
});
} : null,
key: 'checked',
width: 35,
render: function render(text, key, rowData) {
if (!selectKey) return null;
return isCheckbox ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_uiw.Checkbox, {
checked: selection.isSelected(rowData[selectKey]),
onClick: function onClick() {
selection.toggle(rowData[selectKey]);
}
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_uiw.Radio, {
onChange: function onChange() {
selection.toggle(rowData[selectKey]);
},
checked: selection.isSelected(rowData[selectKey])
});
}
}];
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
style: {
overflow: x ? 'scroll' : 'hidden'
},
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
style: {
width: x || '100%'
},
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_uiw.Table
// 判断是否添加选择框
, (0, _objectSpread2["default"])({
columns: selectKey ? selectionCol.concat(defaultColumns()) : defaultColumns(),
data: tableData,
empty: /*#__PURE__*/(0, _jsxRuntime.jsx)(_uiw.Empty, {
style: {
padding: '40px 0'
}
}),
footer: tableData && tableData.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_uiw.Pagination, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
divider: true
}, paginationProps), {}, {
current: pageIndex,
pageSize: pageSize,
total: total,
onChange: function onChange(page) {
onPageChange(page);
},
onShowSizeChange: function onShowSizeChange(current, pageSize) {
var _paginationProps$onSh;
setPgSize(pageSize);
onPageChange(1);
paginationProps === null || paginationProps === void 0 ? void 0 : (_paginationProps$onSh = paginationProps.onShowSizeChange) === null || _paginationProps$onSh === void 0 ? void 0 : _paginationProps$onSh.call(paginationProps, current, pageSize);
}
}))
}, tableProps))
})
});
};
var _default = BaseTable;
exports["default"] = _default;
module.exports = exports.default;