@aliretail/react-material-selector
Version:
173 lines (153 loc) • 7.43 kB
JavaScript
;
exports.__esModule = true;
exports["default"] = void 0;
var _react = _interopRequireWildcard(require("react"));
require("./index.scss");
var _config = require("./config");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var SideBar = function SideBar(_ref) {
var openList = _ref.openList,
setOpenList = _ref.setOpenList,
setInputValue = _ref.setInputValue,
setTitleName = _ref.setTitleName,
setSideBarIdFn = _ref.setSideBarIdFn,
sidebarData = _ref.sidebarData,
activeId = _ref.activeId,
setActiveId = _ref.setActiveId,
treeTotal = _ref.treeTotal,
setcontentPage = _ref.setcontentPage;
// console.log('sidebarData',sidebarData);
// 右键操作的目录id,控制显示
var _useState = (0, _react.useState)(-1),
rightClickId = _useState[0],
setRightClickId = _useState[1]; // 右键操作的目录id,留作上传入参
var _useState2 = (0, _react.useState)(''),
renameOrDelId = _useState2[0],
setRenameOrDelId = _useState2[1]; // 删除目录时，是否勾选了 同时删除子类目， 勾选="2" 不勾选="1"
// 默认选中展开目录树
// const expandTree=()=>{
// let List = []
// if(sidebarData&&sidebarData[0]){
// List.push(sidebarData[0].id);
// if(sidebarData[0].children&&sidebarData[0].children[0]){
// List.push(sidebarData[0].children[0].id);
// if(sidebarData[0].children[0].children&&sidebarData[0].children[0].children[0]){
// List.push(sidebarData[0].children[0].children[0].id);
// }
// }
// }
// setOpenList(List);
// }
// useEffect(()=>{
// expandTree();
// },[])
var clickThreeTitle = function clickThreeTitle(e, id, name) {
// console.log('3级id',id);
// 点击三级素材目录
setActiveId(id);
setcontentPage(1); // 父组件获取 选中信息
// setTitleName(name);
setSideBarIdFn(id);
e.stopPropagation();
};
var clickOneOrTwoTitle = function clickOneOrTwoTitle(e, id, child, name) {
// console.log('12级id',id);
// 点击一级或二级标题
var index = openList.indexOf(id);
if (child) {
if (index === -1) {
setOpenList([].concat(openList, [id]));
} else {
openList.splice(index, 1);
setOpenList([].concat(openList));
}
} else {
setActiveId(id); // 父组件获取 选中信息
// setTitleName(name);
setSideBarIdFn(id);
setcontentPage(1);
}
e.stopPropagation();
};
var handleRightClick = function handleRightClick(e, id) {
setRightClickId(id);
setRenameOrDelId(id);
e.stopPropagation();
e.preventDefault();
};
return /*#__PURE__*/_react["default"].createElement("div", {
className: "sidebar"
}, /*#__PURE__*/_react["default"].createElement("div", {
className: "top"
}), /*#__PURE__*/_react["default"].createElement("div", {
className: "bottom"
}, sidebarData.map(function (item) {
return /*#__PURE__*/_react["default"].createElement("div", {
className: "one",
key: item.id
}, /*#__PURE__*/_react["default"].createElement("div", {
onClick: function onClick(e) {
return clickOneOrTwoTitle(e, item.id, item.children, item.title);
},
className: "one-title " + (activeId === item.id && 'active1'),
id: item.id,
onContextMenu: function onContextMenu(e) {
return handleRightClick(e, item.id);
}
}, item.children && /*#__PURE__*/_react["default"].createElement("i", {
className: "iconfont iconsanjiaodown " + (openList.indexOf(item.id) === -1 && 'closed'),
id: item.id
}), !item.children && /*#__PURE__*/_react["default"].createElement("span", null, "\xA0\xA0\xA0\xA0"), item.title, !item.children && item.materialNumbers !== 0 && /*#__PURE__*/_react["default"].createElement("span", {
className: "material-num"
}, item.materialNumbers)), /*#__PURE__*/_react["default"].createElement("div", null, item.children && item.children.map(function (item1) {
return /*#__PURE__*/_react["default"].createElement("div", {
key: item1.id
}, /*#__PURE__*/_react["default"].createElement("div", {
className: "two-title " + (activeId === item1.id && 'active1'),
style: {
display: openList.indexOf(item.id) === -1 ? 'none' : ''
},
onClick: function onClick(e) {
return clickOneOrTwoTitle(e, item1.id, item1.children, item1.title);
},
key: item1.id,
id: item1.id,
onContextMenu: function onContextMenu(e) {
return handleRightClick(e, item1.id);
}
}, item1.children && /*#__PURE__*/_react["default"].createElement("i", {
className: "iconfont iconsanjiaodown " + (openList.indexOf(item1.id) === -1 && 'closed')
}), !item1.children && /*#__PURE__*/_react["default"].createElement("span", null, "\xA0\xA0\xA0\xA0"), item1.title, !item1.children && item1.materialNumbers !== 0 && /*#__PURE__*/_react["default"].createElement("span", {
className: "material-num"
}, item1.materialNumbers)), /*#__PURE__*/_react["default"].createElement("div", null, item1.children && item1.children.map(function (item2) {
return (
/*#__PURE__*/
// 三级标题
_react["default"].createElement("div", {
className: "three-title " + (activeId === item2.id ? 'active' : ''),
style: {
display: openList.indexOf(item1.id) === -1 || openList.indexOf(item.id) === -1 ? 'none' : ''
},
onClick: function onClick(e) {
return clickThreeTitle(e, item2.id, item2.title);
},
key: item2.id,
id: item2.id,
onContextMenu: function onContextMenu(e) {
return handleRightClick(e, item2.id);
}
}, /*#__PURE__*/_react["default"].createElement("div", {
className: "title",
id: item2.id
}, item2.title), /*#__PURE__*/_react["default"].createElement("div", {
className: "number",
id: item2.id
}, item2.materialNumbers))
);
})));
})));
})));
};
var _default = SideBar;
exports["default"] = _default;