@fe6/water-pro
Version:
An enterprise-class UI design language and Vue-based implementation
252 lines (226 loc) • 9.42 kB
JavaScript
import { resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
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 _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 _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 _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; }
import { hasOwn } from '@fe6/shared';
import { PlusSquareOutlined, MinusSquareOutlined } from '@ant-design/icons-vue';
import Tree from '../../tree';
import Avatar from '../../avatar/index';
import Typography from '../../typography';
import Space from '../../space';
import Tag from '../../tag';
export var defaultFields = {
children: 'children',
title: 'name',
key: 'id',
value: 'userId',
nodeId: 'departmentId',
unionid: 'userId',
alias: 'alias',
position: 'position',
avatar: 'avatar',
roleName: 'roleName',
users: 'users'
}; // 通过挂载 userId 识别折叠节点，进行半选高亮的判断
// 节点挂载 value 是为了选择节点的时候全选或者反选子级所有用户
export var rendetUser = function rendetUser(showAlias, prefixClsNew, fields, userItem, beforeNode, afterNode, clickPanel) {
var titleNode = null;
if (showAlias) {
if (userItem[fields.title]) {
if (userItem[fields.alias]) {
titleNode = _createVNode(Typography.Text, {
"class": "".concat(prefixClsNew, "-user-title"),
"ellipsis": {
tooltip: "".concat(userItem[fields.title], "(").concat(userItem[fields.alias], ")")
},
"content": "".concat(userItem[fields.title], "(").concat(userItem[fields.alias], ")")
}, null);
} else {
titleNode = _createVNode(Typography.Text, {
"class": "".concat(prefixClsNew, "-user-title"),
"ellipsis": {
tooltip: userItem[fields.title]
},
"content": userItem[fields.title]
}, null);
}
} else if (userItem[fields.alias]) {
titleNode = _createVNode(Typography.Text, {
"class": "".concat(prefixClsNew, "-user-title"),
"ellipsis": {
tooltip: userItem[fields.alias]
},
"content": userItem[fields.alias]
}, null);
}
} else {
titleNode = _createVNode(Typography.Text, {
"class": "".concat(prefixClsNew, "-user-title"),
"ellipsis": {
tooltip: "".concat(userItem[fields.title])
},
"content": "".concat(userItem[fields.title])
}, null);
}
var positionNode = null;
if (userItem[fields.position]) {
positionNode = _createVNode(Typography.Paragraph, {
"type": "secondary",
"styleReset": true,
"size": "small",
"ellipsis": {
tooltip: userItem[fields.position]
},
"content": userItem[fields.position]
}, null);
}
var roleNode = null;
if (userItem[fields.roleName]) {
roleNode = _createVNode(Tag, {
"color": "blue"
}, {
default: function _default() {
return [userItem[fields.roleName]];
}
});
}
return function () {
return _createVNode(Space, {
"class": "".concat(prefixClsNew, "-user"),
"onClick": clickPanel
}, {
default: function _default() {
return [beforeNode && typeof beforeNode === 'function' && beforeNode(), _createVNode(Avatar, {
"shape": "square",
"class": "".concat(prefixClsNew, "-user-avatar"),
"size": 35,
"src": userItem[fields.avatar]
}, null), _createVNode(Space, {
"direction": "vertical",
"size": 0,
"class": "".concat(prefixClsNew, "-user-core")
}, {
default: function _default() {
return [titleNode, positionNode, roleNode];
}
}), afterNode && typeof afterNode === 'function' && afterNode()];
}
});
};
}; // 因为多级嵌套，有可能当前级没有用户，但子级有，所以就得遍历下面所有
var getAllChildUserIdList = function getAllChildUserIdList(targets, newUserIds, fields) {
targets.forEach(function (tItem) {
if (hasOwn(tItem, fields.users) && tItem[fields.users].length) {
tItem[fields.users].forEach(function (uItem) {
if (!newUserIds.includes(uItem[fields.value])) {
newUserIds.push(uItem[fields.value]);
}
});
}
if (hasOwn(tItem, fields.children) && tItem[fields.children].length) {
getAllChildUserIdList(tItem[fields.children], newUserIds, fields);
}
});
return newUserIds;
};
export function renderTreeNodes(showAlias, treeData, fields, prefixClsNew, mode, panelClick, theLocal) {
if (!treeData) {
return [];
}
var list = Array.isArray(treeData) ? treeData : [treeData];
var reseult = [];
var renderInner = function renderInner(item) {
var childNode = [];
if (hasOwn(item, fields.users) && item[fields.users].length) {
var userChildNodes = [];
item[fields.users].forEach(function (userItem) {
userChildNodes.push(_createVNode(Tree.TreeNode, {
"selectable": mode === 'radio',
"checkable": mode === 'checkbox',
"key": userItem[fields.value]
}, {
title: rendetUser(showAlias, prefixClsNew, fields, userItem, function () {}, function () {}, function () {
return panelClick(userItem);
})
}));
});
childNode.push(_createVNode(Tree.TreeNode, {
"selectable": false,
"checkable": false
}, {
default: function _default() {
return [userChildNodes];
},
title: function title(_ref) {
var expanded = _ref.expanded;
return _createVNode(Typography.Text, {
"class": "".concat(prefixClsNew, "-user-member"),
"type": "secondary",
"size": "small"
}, {
default: function _default() {
return [expanded ? theLocal.close : theLocal.open];
}
});
},
switcherIcon: function switcherIcon(_ref2) {
var expanded = _ref2.expanded;
return expanded ? _createVNode(MinusSquareOutlined, {
"class": "".concat(prefixClsNew, "-user-icon")
}, null) : _createVNode(PlusSquareOutlined, {
"class": "".concat(prefixClsNew, "-user-icon")
}, null);
}
}));
}
if (hasOwn(item, fields.children) && item[fields.children].length) {
item[fields.children].forEach(function (childItem) {
var userId = hasOwn(childItem, fields.users) && childItem[fields.users].length ? childItem[fields.users].map(function (uItem) {
return uItem[fields.value];
}) : []; // NOTE 拉取所有子节点用户，用于节点可选时候的高亮，但由于key匹配问题永远高亮不了，必须 key 设置为 userId （key={userId.join(',')}）
if (hasOwn(childItem, fields.children) && childItem[fields.children].length) {
userId = _toConsumableArray(new Set([].concat(userId, getAllChildUserIdList(childItem[fields.children], [], fields))));
} else {
userId = _toConsumableArray(new Set(userId));
}
childNode.push(_createVNode(Tree.TreeNode, {
"key": childItem[fields.key],
"selectable": false,
"checkable": mode === 'checkbox',
"title": "".concat(childItem[fields.title]),
"userId": userId,
"disabled": userId.length < 1,
"value": userId
}, {
default: function _default() {
return [renderInner(childItem)];
}
}));
});
}
return childNode;
};
list.forEach(function (item) {
var userId = item[fields.users].map(function (uItem) {
return uItem[fields.value];
}); // NOTE 拉取所有子节点用户，用于节点可选时候的高亮，但由于key匹配问题永远高亮不了，必须 key 设置为 userId （key={userId.join(',')}）
userId = _toConsumableArray(new Set([].concat(userId, getAllChildUserIdList(item[fields.children], [], fields))));
reseult.push(_createVNode(Tree.TreeNode, {
"selectable": false,
"checkable": mode === 'checkbox',
"key": item[fields.key],
"userId": userId,
"disabled": userId.length < 1,
"value": userId,
"title": "".concat(item[fields.title])
}, {
default: function _default() {
return [renderInner(item)];
}
}));
});
return reseult;
}