@doreamonjs/gate/lib/common/layout/header/user.js

gate for doreamonjs

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importStar(require("react"));
const dva_1 = require("dva");
const components_1 = require("@doreamonjs/components");
require("./index.less");
class User extends react_1.Component {
    render() {
        const { menus, username, nickname, short, avatar } = this.props;
        return (react_1.default.createElement(components_1.Dropdown.HeaderDropdownMenu, { className: 'dropMenu', menus: menus, onMenuClick: this.props.onMenuClick },
            react_1.default.createElement("span", { className: 'barIcon' },
                avatar && (react_1.default.createElement("img", { alt: "avatar", className: 'avatar', "data-tips": username, src: avatar })),
                !avatar && short && (react_1.default.createElement("span", { className: 'forShort' }, short)),
                react_1.default.createElement("span", { "data-username": username, className: 'name' }, nickname))));
    }
}
const changeFullScreenMenuIcon = (fullscreen, menus, enables) => {
    return menus
        .filter((menu) => {
        if (!(menu.key in enables))
            return true;
        return enables[menu.key];
    })
        .map((menu) => {
        if (menu.key === 'fullscreen') {
            return {
                ...menu,
                icon: fullscreen ? 'fullscreen-exit' : 'fullscreen',
            };
        }
        return menu;
    });
};
const changeAppearanceMenuTitle = (theme, menus) => {
    return menus.map((menu) => {
        if (menu.key === 'appearance') {
            const themeName = theme === 'dark' ? '暗黑' : '明亮';
            return {
                ...menu,
                // dark：暗黑
                // light：明亮
                title: `主题：${themeName}`,
                // icon: theme === 'dark' ? 'moon' : 'sun',
            };
        }
        return menu;
    });
};
const mapState = ({ applications, functions, user, screens }) => {
    const { attributes, values } = user;
    const { theme } = applications;
    const { menus } = attributes;
    const fullscreen = screens.full;
    const enables = {
        appearance: functions['global.system.settings.appearance'],
        profile: functions['global.system.settings.profile'],
        setting: functions['global.system.settings.setting'],
        fullscreen: functions['global.system.settings.fullscreen'],
        lockscreen: functions['global.system.settings.lockscreen'],
    };
    let compositeMenus = changeFullScreenMenuIcon(fullscreen, menus, enables);
    compositeMenus = changeAppearanceMenuTitle(theme, compositeMenus);
    return {
        ...values,
        menus: compositeMenus,
    };
};
const mapActions = (dispatch) => ({
    onMenuClick: (menu) => dispatch({ type: 'user/header/menu/navigate', payload: menu }),
});
exports.default = dva_1.connect(mapState, mapActions)(User);
//# sourceMappingURL=user.js.map