fastlion-amis
Version:
一种MIS页面生成工具
110 lines (109 loc) • 7.55 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var antd_1 = require("antd");
var icons_1 = require("@ant-design/icons");
require("./index.scss");
var PcContacts_1 = (0, tslib_1.__importDefault)(require("../PcContacts"));
var TreeSelectModal = function (props) {
var visible = props.visible, contacts = props.contacts, nodeMap = props.nodeMap, excludeKeys = props.excludeKeys, defaultCheckedKeys = props.defaultCheckedKeys, onConfirm = props.onConfirm, onCancel = props.onCancel, env = props.env, _a = props.quantity, quantity = _a === void 0 ? 20 : _a;
var _b = (0, react_1.useState)([]), checkedKeys = _b[0], setCheckedKeys = _b[1];
var maxCount = (0, react_1.useRef)(quantity - defaultCheckedKeys.length);
var getChildKeys = function (id) {
var result = [id];
var addKeys = function (id, result) {
var nodes = nodeMap.get(id);
if (nodes) {
nodes.forEach(function (node) {
result.push(node.id);
if (!node.isLeaf) {
addKeys(node.id, result);
}
});
}
};
addKeys(id, result);
return result;
};
var buildTreeData = function (key, datas, children) {
return datas.map(function (node) {
if (node.key === key) {
return (0, tslib_1.__assign)((0, tslib_1.__assign)({}, node), { children: children });
}
if (node.children) {
return (0, tslib_1.__assign)((0, tslib_1.__assign)({}, node), { children: buildTreeData(key, node.children, children) });
}
return node;
});
};
var handleTreeChecked = function (checked, _a) {
var nodeType = _a.nodeType, id = _a.id;
if (nodeType == 1) {
if (checked) {
var selectedKeys = checkedKeys.filter(function (key) { return !defaultCheckedKeys.concat(excludeKeys).includes(key); }).concat(id);
if (selectedKeys.length > maxCount.current) {
antd_1.message.warning("\u6700\u591A\u9009\u62E9" + maxCount.current + "\u4E2A\u7528\u6237");
}
else {
setCheckedKeys(function (keys) { return keys.concat(id); });
}
}
else {
setCheckedKeys(function (keys) { return keys.filter(function (key) { return key != id; }); });
}
}
else {
var resultKeys_1 = getChildKeys(id);
if (checked) {
var selectedKeys = ((resultKeys_1.filter(function (key) { return !checkedKeys.includes(key); })).concat(checkedKeys)).filter(function (key) { return !defaultCheckedKeys.concat(excludeKeys).includes(key); });
if (selectedKeys.length > maxCount.current) {
antd_1.message.warning("\u6700\u591A\u9009\u62E9" + maxCount.current + "\u4E2A\u7528\u6237");
}
else {
setCheckedKeys(function (keys) { return keys.concat(resultKeys_1); });
}
}
else {
setCheckedKeys(function (keys) { return keys.filter(function (key) { return !resultKeys_1.includes(key); }); });
}
}
};
var handleChecked = function (checked, _a) {
var id = _a.id;
if (checked) {
var keys = checkedKeys.filter(function (key) { return !defaultCheckedKeys.concat(excludeKeys).includes(key); }).concat(id);
if (keys.length > maxCount.current) {
antd_1.message.warning("\u6700\u591A\u9009\u62E9" + maxCount.current + "\u4E2A\u7528\u6237");
}
else {
setCheckedKeys(function (keys) { return keys.concat(id); });
}
}
else {
setCheckedKeys(function (keys) { return keys.filter(function (key) { return id != key; }); });
}
};
return (react_1.default.createElement(antd_1.Modal, { width: 800, closable: false, maskClosable: false, footer: null, visible: visible, keyboard: false, bodyStyle: { padding: 0 }, style: { position: 'fixed', top: '100px', right: 0, left: 0, bottom: 0 }, maskStyle: { position: 'fixed', top: '54px', right: 0, left: 0, bottom: 0 }, getContainer: document.getElementById('amis-modal-container-flowing') || env.getModalContainer, zIndex: 1000 },
react_1.default.createElement("div", { className: 'select-user-container' },
react_1.default.createElement(PcContacts_1.default, { className: 'select-user-item select-user-item-left', mode: 'select', height: 530, contacts: contacts, checkedKeys: checkedKeys, defaultCheckedKeys: defaultCheckedKeys, onCheckedKeysChange: function (keys) { return setCheckedKeys(keys); }, onListChecked: handleChecked, onTreeChecked: handleTreeChecked }),
react_1.default.createElement("div", { className: 'select-user-item select-user-item-right' },
react_1.default.createElement("div", { className: 'right-header' },
"\u5DF2\u9009\u62E9 \u00B7 ",
checkedKeys.filter(function (key) { return !defaultCheckedKeys.concat(excludeKeys).includes(key); }).length),
react_1.default.createElement("div", { className: 'right-content' }, checkedKeys.filter(function (key) { return !defaultCheckedKeys.concat(excludeKeys).includes(key); }).map(function (id) {
var data = contacts.find(function (data) { return data.id === id; });
return (react_1.default.createElement("div", { key: id, className: 'right-item' },
react_1.default.createElement("span", null, (data === null || data === void 0 ? void 0 : data.name) + " (" + (data === null || data === void 0 ? void 0 : data.id) + ")"),
react_1.default.createElement(icons_1.CloseCircleFilled, { style: { color: '#ccc' }, onClick: function () { return setCheckedKeys(function (keys) { return keys.filter(function (key) { return id !== key; }); }); } })));
})),
react_1.default.createElement("div", { className: 'right-button' },
react_1.default.createElement(antd_1.Button, { type: 'primary', block: true, onClick: function () { return onConfirm(checkedKeys.filter(function (key) { return !defaultCheckedKeys.concat(excludeKeys).includes(key); }).map(function (id) {
var _a, _b, _c;
var data = contacts.find(function (data) { return data.id === id; });
return { id: (_a = data === null || data === void 0 ? void 0 : data.id) !== null && _a !== void 0 ? _a : id, name: "" + ((_b = data === null || data === void 0 ? void 0 : data.name) !== null && _b !== void 0 ? _b : id), nodeType: (_c = data === null || data === void 0 ? void 0 : data.nodeType) !== null && _c !== void 0 ? _c : 1, parId: data === null || data === void 0 ? void 0 : data.parId };
})); } }, "\u786E\u5B9A"),
react_1.default.createElement(antd_1.Button, { block: true, onClick: function () { return onCancel(); } }, "\u53D6\u6D88"))))));
};
exports.default = TreeSelectModal;
//# sourceMappingURL=./components/Communication/TreeSelectModal/index.js.map