@wufengteam/inputs
Version:
平台提供的右侧属性编辑器，需要在主工程中注册
371 lines • 16.2 kB
JavaScript
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import React, { useState, useEffect } from 'react';
import { Modal, Space, Row, Col, Empty, Tag, Tabs, Checkbox, Tooltip } from 'antd';
import { CloseOutlined, QuestionCircleOutlined } from '@ant-design/icons';
import { wufengController } from '@wufengteam/core';
import { TAG_STYLE, TAG_ICON_STYLE } from './constants';
// @ts-ignore
import departIcon from '../../img/depart.png';
import ZeroCodeOrgTree from '../ZeroCodeOrgTree';
import { buildPcUrl } from '../../../utils/tool';
import { formateTreeData, getFirstChar, recursionOrgIds } from '../../tool';
import "./index.css";
import { COLOR_DATA } from '../../constants';
var prefixCls = 'inputs-default-member';
var TabPane = Tabs.TabPane;
var AddDepartModal = function AddDepartModal(_ref) {
var visible = _ref.visible,
departListed = _ref.departListed,
checkedList = _ref.checkedList,
onCancel = _ref.onCancel,
_onOk = _ref.onOk,
enableCheckList = _ref.enableCheckList,
sRecursive = _ref.sRecursive,
isDefaultDepart = _ref.isDefaultDepart,
selectType = _ref.selectType;
if (!window.appId) {
window.appId = sessionStorage.getItem('appId');
}
var _useState = useState([]),
_useState2 = _slicedToArray(_useState, 2),
departTreeData = _useState2[0],
setDepartTreeData = _useState2[1];
var _useState3 = useState([]),
_useState4 = _slicedToArray(_useState3, 2),
sDepartList = _useState4[0],
setSDepartList = _useState4[1]; // 选中的部门信息
var _useState5 = useState('depart'),
_useState6 = _slicedToArray(_useState5, 2),
activeKey = _useState6[0],
setActiveKey = _useState6[1];
// 是否展示需要查询的组织的下级组织
var _useState7 = useState(sRecursive),
_useState8 = _slicedToArray(_useState7, 2),
recursive = _useState8[0],
setRecursive = _useState8[1];
// 预览态是包含基础管理模块
var _useState9 = useState(false),
_useState10 = _slicedToArray(_useState9, 2),
hasPriviewBasic = _useState10[0],
setHasPriviewBasic = _useState10[1];
var _useState11 = useState([]),
_useState12 = _slicedToArray(_useState11, 2),
dynamicCheckedList = _useState12[0],
setDynamicCheckedList = _useState12[1];
var _useState13 = useState([]),
_useState14 = _slicedToArray(_useState13, 2),
childIdFilterList = _useState14[0],
setChildIdFilterList = _useState14[1];
useEffect(function () {
setSDepartList(departListed);
var initOrgIds = [];
departListed.forEach(function (item) {
var isSonOrg = item.isSonOrg,
children = item.children,
orgId = item.orgId;
initOrgIds.push(orgId);
if ("".concat(isSonOrg) === '1') {
var checkes = recursionOrgIds(children, recursive === 'T');
initOrgIds = [].concat(_toConsumableArray(initOrgIds), _toConsumableArray(checkes));
}
});
setChildIdFilterList(initOrgIds);
}, [departListed]);
useEffect(function () {
setDynamicCheckedList(checkedList);
}, [checkedList]);
var modalCancel = function modalCancel() {
onCancel();
};
var updateTreeData = function updateTreeData(list, key, children) {
return list.map(function (node) {
if ("".concat(node.key) === "".concat(key)) {
return Object.assign(Object.assign({}, node), {
children: children
});
}
if (node.children) {
return Object.assign(Object.assign({}, node), {
children: updateTreeData(node.children, key, children)
});
}
return node;
});
};
/**
* 获取部门数据
*/
var getOrgInfoByAsync = function getOrgInfoByAsync(orgId) {
wufengController.getAction('getOrgInfoByAsync', orgId).then(function (res) {
var data = formateTreeData(res);
setDepartTreeData(data);
});
};
// 获取预览态是否有基础管理模块
var getIsBasicPriview = function getIsBasicPriview() {
wufengController.getAction('getBasicPreviewEnabled').then(function (res) {
setHasPriviewBasic(res || false);
});
};
useEffect(function () {
getOrgInfoByAsync('0');
getIsBasicPriview();
}, []);
var loadOrgData = function loadOrgData(_ref2) {
var key = _ref2.key,
children = _ref2.children;
return new Promise(function (resolve) {
if (children) {
resolve();
return;
}
wufengController.getAction('getOrgInfoByAsync', key).then(function (res) {
var data = formateTreeData(res);
setDepartTreeData(function (origin) {
return updateTreeData(origin, key, data);
});
setTimeout(function () {
resolve();
}, 500);
});
});
};
// 根据选中的tab页不同拼接不同的地址
var dealPathByTabKey = function dealPathByTabKey() {
var retSelectedPage = {};
// 若是预览态无基础管理模块，则无需拼接默认页的路劲了
if ("".concat(hasPriviewBasic) === 'false') {
return retSelectedPage;
}
switch (activeKey) {
case 'depart':
retSelectedPage.pagePath = '/_frame/base/orgMgr';
retSelectedPage.basicPath = '/orgMgr';
break;
case 'member':
retSelectedPage.pagePath = '/_frame/base/orgStaff';
retSelectedPage.basicPath = '/orgStaff';
break;
case 'part':
retSelectedPage.pagePath = '/_frame/base/roleMgr';
retSelectedPage.basicPath = '/roleMgr';
break;
default:
break;
}
return retSelectedPage;
};
// 跳转到预览页面
var goPriview = function goPriview() {
wufengController.getAction('findPreviewUrl', {
appId: window === null || window === void 0 ? void 0 : window.appId
}).then(function (res) {
var resultCode = res.resultCode,
resultObject = res.resultObject;
if ("".concat(resultCode) === '0') {
// PC 端预览地址
// dealPathByTabKey();
var selectedPage = dealPathByTabKey();
var webUrl = buildPcUrl({
urlData: resultObject,
appId: window === null || window === void 0 ? void 0 : window.appId,
selectedPage: selectedPage
});
window.open(webUrl);
}
});
};
var renderCommonEmpty = function renderCommonEmpty() {
var hasSearch = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : undefined;
return typeof hasSearch === 'undefined' ? ( /*#__PURE__*/React.createElement(Empty, {
description: "\u5F53\u524D\u6682\u672A\u7EF4\u62A4\u7EC4\u7EC7\u4EBA\u5458\u6570\u636E",
className: "".concat(prefixCls, "-emptyStyle")
}, "".concat(hasPriviewBasic) === 'true' && ( /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-emptyCusText"),
onClick: goPriview
}, "\u524D\u5F80\u6DFB\u52A0")))) : ( /*#__PURE__*/React.createElement(Empty, {
description: "\u6682\u65E0\u6570\u636E",
className: "".concat(prefixCls, "-emptyStyle")
}));
};
// 绘制tooltip的头部信息
var renderTooltipTitle = function renderTooltipTitle() {
return /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-tooltipLayout")
}, /*#__PURE__*/React.createElement("div", null, "\u6DFB\u52A0\u4EBA\u5458\uFF1A\u652F\u6301\u6DFB\u52A0\u7EC4\u7EC7\u3001\u4EBA\u5458\u3001\u89D2\u8272\u3001\u7FA4\u7EC4\u76F8\u5173\u7684\u6570\u636E\uFF0C\u53EF\u4F5C\u4E3A\u5E94\u7528\u6743\u9650\u5206\u914D\u4EE5\u53CA\u6D41\u7A0B\u73AF\u8282\u5904\u7406\u4EBA\u7B49\u76F8\u5173\u9A8C\u8BC1\u8C03\u8BD5\u4F7F\u7528\u3002\u8C03\u8BD5\u5B8C\u6210\u5E76\u6295\u5165\u4F7F\u7528\u65F6\u9700\u5C06\u6B64\u5904\u6DFB\u52A0\u7684\u7EC4\u7EC7\u3001\u4EBA\u5458\u3001\u89D2\u8272\u7B49\u76F8\u5173\u6570\u636E\u540C\u6B65\u81F3\u4F7F\u7528\u5E73\u53F0\uFF0C\u4FDD\u8BC1\u9875\u9762\u4EE5\u53CA\u6D41\u7A0B\u7684\u6B63\u5E38\u4F7F\u7528\u3002"), /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-toolTipText")
}, '注：组织人员添加入口也可通过：应用预览>>基础管理（组织管理/员工管理等）'));
};
// 自定义modal的头部
var renderTitle = function renderTitle() {
return /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-mTitleLayout")
}, /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-mTitle")
}, "\u6DFB\u52A0\u90E8\u95E8"), /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-mTitleRight")
}, "".concat(hasPriviewBasic) === 'true' && ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-mRightText")
}, /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-mRightMargin"),
onClick: goPriview
}, '>>添加调试数据'), /*#__PURE__*/React.createElement(Tooltip, {
title: renderTooltipTitle()
}, /*#__PURE__*/React.createElement(QuestionCircleOutlined, null))))), /*#__PURE__*/React.createElement(CloseOutlined, {
className: "".concat(prefixCls, "-mRightClose"),
onClick: modalCancel
})));
};
var onDynamicChange = function onDynamicChange(checkedValues) {
if (isDefaultDepart && selectType === 'single' && (sDepartList === null || sDepartList === void 0 ? void 0 : sDepartList.length) > 0) {
setSDepartList([]);
}
// 确保只有一个被选中
if (checkedValues.length > 1) {
// 如果用户尝试选中多个，只保留最后一个选中的
var data = checkedValues.filter(function (item) {
return !dynamicCheckedList.includes(item);
});
setDynamicCheckedList(data);
} else {
setDynamicCheckedList(checkedValues);
}
};
return /*#__PURE__*/React.createElement(Modal, {
className: "".concat(prefixCls, "-addMember-modal"),
title: renderTitle(),
closable: false,
width: 1041,
bodyStyle: {
padding: '0',
height: '510px'
},
visible: visible,
onCancel: modalCancel,
maskClosable: false,
onOk: function onOk() {
if (_onOk) {
_onOk({
sDepartList: sDepartList,
dynamicCheckedList: dynamicCheckedList,
recursive: recursive,
childIdFilterList: childIdFilterList
});
}
}
}, /*#__PURE__*/React.createElement(Row, {
style: {
height: '100%'
}
}, /*#__PURE__*/React.createElement(Col, {
span: 16,
className: "".concat(prefixCls, "-itemPadding")
}, /*#__PURE__*/React.createElement(Tabs, {
activeKey: activeKey,
onChange: function onChange(sKey) {
return setActiveKey(sKey);
}
}, /*#__PURE__*/React.createElement(TabPane, {
tab: "\u90E8\u95E8",
key: "depart"
}, /*#__PURE__*/React.createElement(ZeroCodeOrgTree, {
hasSearch: false,
emptyNode: renderCommonEmpty(),
initValues: sDepartList,
loadData: loadOrgData,
treeData: departTreeData,
recursive: recursive,
onCheck: function onCheck(orgData, checkedKeys) {
if (isDefaultDepart && selectType === 'single' && (dynamicCheckedList === null || dynamicCheckedList === void 0 ? void 0 : dynamicCheckedList.length) > 0) {
setDynamicCheckedList([]);
}
if (isDefaultDepart && selectType === 'single') {
var departTemp = orgData[(orgData === null || orgData === void 0 ? void 0 : orgData.length) - 1];
setSDepartList(departTemp !== undefined ? [departTemp] : []);
} else {
setSDepartList(orgData);
}
setChildIdFilterList(checkedKeys);
},
checkAllChange: function checkAllChange(checkAll) {
setRecursive(checkAll ? 'T' : 'F');
},
enableCheckList: enableCheckList
})), /*#__PURE__*/React.createElement(TabPane, {
tab: "\u52A8\u6001\u53C2\u6570",
key: "dynamic"
}, /*#__PURE__*/React.createElement(Checkbox.Group, {
onChange: onDynamicChange,
value: dynamicCheckedList,
className: "dynamicCheckWrap"
}, /*#__PURE__*/React.createElement(Space, {
direction: "vertical"
}, /*#__PURE__*/React.createElement(Checkbox, {
value: "T"
}, "\u5F53\u524D\u7528\u6237\u6240\u5904\u90E8\u95E8")))))), /*#__PURE__*/React.createElement(Col, {
span: 8,
className: "".concat(prefixCls, "-colItem"),
style: {
paddingTop: '16px'
}
}, /*#__PURE__*/React.createElement(Row, {
justify: "end"
}, /*#__PURE__*/React.createElement("a", {
onClick: function onClick() {
setSDepartList([]);
setDynamicCheckedList([]);
}
}, "\u6E05\u9664")), console.log('sDepartList', sDepartList), /*#__PURE__*/React.createElement(Space, {
size: 4,
wrap: true,
style: {
maxHeight: '100%',
overflow: 'auto',
alignItems: 'start'
}
}, sDepartList.map(function (dItem, posIndex) {
var orgId = dItem.orgId,
orgName = dItem.orgName,
isSonOrg = dItem.isSonOrg;
return /*#__PURE__*/React.createElement(Tag, {
key: orgId,
icon: /*#__PURE__*/React.createElement("div", {
style: {
background: COLOR_DATA[posIndex % 8]
},
className: "".concat(prefixCls, "-iconBg")
}, getFirstChar(orgName)),
closable: true,
style: TAG_STYLE,
onClose: function onClose() {
var otherDepartInfo = sDepartList.filter(function (it) {
return it.orgId !== orgId;
});
setSDepartList(otherDepartInfo);
}
}, "".concat(isSonOrg) === '1' ? "".concat(orgName, "(\u542B\u5B50\u90E8\u95E8)") : orgName);
}), dynamicCheckedList === null || dynamicCheckedList === void 0 ? void 0 : dynamicCheckedList.map(function (_) {
return /*#__PURE__*/React.createElement(Tag, {
icon: /*#__PURE__*/React.createElement("img", {
src: departIcon,
alt: "",
style: TAG_ICON_STYLE
}),
closable: true,
style: TAG_STYLE,
onClose: function onClose() {
setDynamicCheckedList([]);
}
}, "\u5F53\u524D\u7528\u6237\u6240\u5904\u90E8\u95E8");
})))));
};
export default AddDepartModal;