www.gusucode.com > Flarum中文优化论坛PHP源码程序 > FlarumChina-master/vendor/flarum/core/js/forum/src/components/UserPage.js
import Page from 'flarum/components/Page'; import ItemList from 'flarum/utils/ItemList'; import affixSidebar from 'flarum/utils/affixSidebar'; import UserCard from 'flarum/components/UserCard'; import LoadingIndicator from 'flarum/components/LoadingIndicator'; import SelectDropdown from 'flarum/components/SelectDropdown'; import LinkButton from 'flarum/components/LinkButton'; import Separator from 'flarum/components/Separator'; import listItems from 'flarum/helpers/listItems'; /** * The `UserPage` component shows a user's profile. It can be extended to show * content inside of the content area. See `ActivityPage` and `SettingsPage` for * examples. * * @abstract */ export default class UserPage extends Page { init() { super.init(); /** * The user this page is for. * * @type {User} */ this.user = null; app.history.push('user'); this.bodyClass = 'App--user'; } view() { return ( <div className="UserPage"> {this.user ? [ UserCard.component({ user: this.user, className: 'Hero UserHero', editable: this.user.canEdit() || this.user === app.session.user, controlsButtonClassName: 'Button' }), <div className="container"> <nav className="sideNav UserPage-nav" config={affixSidebar}> <ul>{listItems(this.sidebarItems().toArray())}</ul> </nav> <div className="sideNavOffset UserPage-content"> {this.content()} </div> </div> ] : [ LoadingIndicator.component({className: 'LoadingIndicator--block'}) ]} </div> ); } /** * Get the content to display in the user page. * * @return {VirtualElement} */ content() { } /** * Initialize the component with a user, and trigger the loading of their * activity feed. * * @param {User} user * @protected */ show(user) { this.user = user; app.history.push('user', user.username()); app.setTitle(user.username()); m.redraw(); } /** * Given a username, load the user's profile from the store, or make a request * if we don't have it yet. Then initialize the profile page with that user. * * @param {String} username */ loadUser(username) { const lowercaseUsername = username.toLowerCase(); app.store.all('users').some(user => { if (user.username().toLowerCase() === lowercaseUsername && user.joinTime()) { this.show(user); return true; } }); if (!this.user) { app.store.find('users', username).then(this.show.bind(this)); } } /** * Build an item list for the content of the sidebar. * * @return {ItemList} */ sidebarItems() { const items = new ItemList(); items.add('nav', SelectDropdown.component({ children: this.navItems().toArray(), className: 'App-titleControl', buttonClassName: 'Button' }) ); return items; } /** * Build an item list for the navigation in the sidebar. * * @return {ItemList} */ navItems() { const items = new ItemList(); const user = this.user; items.add('posts', LinkButton.component({ href: app.route('user.posts', {username: user.username()}), children: [app.translator.trans('core.forum.user.posts_link'), <span className="Button-badge">{user.commentsCount()}</span>], icon: 'comment-o' }), 100 ); items.add('discussions', LinkButton.component({ href: app.route('user.discussions', {username: user.username()}), children: [app.translator.trans('core.forum.user.discussions_link'), <span className="Button-badge">{user.discussionsCount()}</span>], icon: 'reorder' }), 90 ); if (app.session.user === user) { items.add('separator', Separator.component(), -90); items.add('settings', LinkButton.component({ href: app.route('settings'), children: app.translator.trans('core.forum.user.settings_link'), icon: 'cog' }), -100 ); } return items; } }