phx-react
Version:
PHX REACT
38 lines • 2.34 kB
JavaScript
;
exports.__esModule = true;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var Checkbox_1 = require("../../Checkbox");
var Button_1 = require("../../Button");
function BulkAction(_a) {
var dataSelected = _a.dataSelected, list = _a.list, setDataSelected = _a.setDataSelected, onBulkActions = _a.onBulkActions, setFilteredItems = _a.setFilteredItems, content = _a.content;
// khi click chọn tất cả
var handleSelectAll = function (checked) {
if (checked) {
var newSelected = tslib_1.__spreadArray([], list, true);
setDataSelected(newSelected);
setFilteredItems(list);
onBulkActions === null || onBulkActions === void 0 ? void 0 : onBulkActions(newSelected);
}
else {
setDataSelected([]);
setFilteredItems(list);
onBulkActions === null || onBulkActions === void 0 ? void 0 : onBulkActions([]);
}
};
// khi click nút hành động
var handleBulkActions = function () {
onBulkActions === null || onBulkActions === void 0 ? void 0 : onBulkActions(dataSelected);
};
// luôn sync ra ngoài khi dataSelected thay đổi (kể cả chọn riêng lẻ bên ngoài)
(0, react_1.useEffect)(function () {
onBulkActions === null || onBulkActions === void 0 ? void 0 : onBulkActions(dataSelected);
}, [dataSelected]);
var allSelected = list.length > 0 && dataSelected.length === list.length;
var isIndeterminate = dataSelected.length > 0 && !allSelected;
return (react_1["default"].createElement("div", { className: 'flex flex-1 items-center gap-x-2 text-xs' },
react_1["default"].createElement(Checkbox_1.PHXCheckbox, { checked: allSelected, type: allSelected ? 'default' : isIndeterminate ? 'not-all' : 'default', onChange: function (e) { return handleSelectAll(e.target.checked); } }),
dataSelected.length === 0 ? (react_1["default"].createElement("span", { className: 'cursor-pointer leading-7', onClick: function () { return handleSelectAll(true); } }, "Ch\u1ECDn danh s\u00E1ch")) : (react_1["default"].createElement(Button_1.PHXButton, { secondary: true, size: 'micro', onClick: handleBulkActions }, content))));
}
exports["default"] = BulkAction;
//# sourceMappingURL=bulkAction.js.map