@cainiaofe/cn-ui-m
Version:
40 lines (39 loc) • 3.21 kB
JavaScript
import $i18n from "../../locales/i18n";
import React from 'react';
import { getAvatarImgUrl, } from '@cainiaofe/cn-ui-common';
import { CnListItem } from "../cn-list";
import classNames from 'classnames';
import { CnPopover } from "../cn-popover";
import { CnButton } from "../cn-button";
var CnEmployeeItem = function (props) {
var defaultAvatarImgUrl = props.defaultAvatarImgUrl, data = props.data, _a = props.showDepartTag, showDepartTag = _a === void 0 ? false : _a;
var _b = data.name, name = _b === void 0 ? '' : _b, _c = data.nickName, nickName = _c === void 0 ? '' : _c, workNo = data.workNo, _d = data.prefix, prefix = _d === void 0 ? 'cn-ui-m-' : _d, department = data.department, _e = data.workStatus, workStatus = _e === void 0 ? true : _e;
var clsPrefix = "".concat(prefix, "employee-item");
var avatarImgUrl = getAvatarImgUrl({
workNo: workNo,
personalPhotoUrl: data.personalPhotoUrl,
defaultAvatarImgUrl: defaultAvatarImgUrl,
});
if (props.mini) {
var showName = "".concat(name).concat(nickName ? "(".concat(nickName, ")") : '');
var buttonText = $i18n.get({
id: 'CainiaoInsideAndOutside',
dm: '菜鸟内外',
});
var buttonHref = "https://work.alibaba-inc.com/nwpipe/u/".concat(workNo);
var cardContent = (React.createElement("div", { className: classNames(CN_UI_HASH_CLASS_NAME, "".concat(clsPrefix, "-popover")) },
React.createElement("div", { className: "".concat(clsPrefix, "-popover-body") },
React.createElement(CnListItem, { title: "".concat(name).concat(nickName ? "(".concat(nickName, ")") : ''), media: React.createElement("img", { src: avatarImgUrl, className: "".concat(clsPrefix, "-avatar") }), subTitle: "".concat(workNo) }),
React.createElement("div", { className: "".concat(clsPrefix, "-popover-department") }, department)),
React.createElement("div", { className: "".concat(clsPrefix, "-popover-footer") },
React.createElement(CnButton, { type: "secondary", component: "a", href: buttonHref, target: "_blank" }, buttonText))));
return (React.createElement(CnPopover, { content: cardContent, trigger: "click", placement: "bottom", style: { padding: 0 }, className: "".concat(clsPrefix, "-popover-wrapper") },
React.createElement("div", { className: classNames(CN_UI_HASH_CLASS_NAME, clsPrefix, "".concat(clsPrefix, "-mini")) },
React.createElement("img", { src: avatarImgUrl, className: "".concat(clsPrefix, "-avatar") }),
React.createElement("div", null,
showName || workNo,
showDepartTag && workStatus === false ? (React.createElement("span", { className: "".concat(clsPrefix, "-depart") }, "\u5DF2\u79BB\u804C")) : (React.createElement(React.Fragment, null))))));
}
return (React.createElement(CnListItem, { className: clsPrefix, title: "".concat(name).concat(nickName ? "(".concat(nickName, ")") : '', " ").concat(workNo), media: React.createElement("img", { src: avatarImgUrl, className: "".concat(clsPrefix, "-avatar") }), subTitle: department }));
};
export default CnEmployeeItem;