-
Notifications
You must be signed in to change notification settings - Fork 21
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Add user, dev, isv, admin portal routes * feat: Portal architecture * chore: Admin portal (#690) * chore: Developer portal (#691) * fix: TopNav switch link in different portals (#692) * feat: Add cluster, cluster detail to user portal * Refine entry file * Refine Layout comp, remove socket listen * feat: Add runtimes, runtime create page for user portal * Fix all routes links * Refactor: Cluster, runtime pages suit user and non-user portal
- Loading branch information
Showing
86 changed files
with
1,592 additions
and
986 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,104 +1,63 @@ | ||
| import React from 'react'; | ||
| import PropTypes from 'prop-types'; | ||
| import _ from 'lodash'; | ||
|
|
||
| import { Provider } from 'mobx-react'; | ||
| import React, { lazy } from 'react'; | ||
| import { | ||
| Router, Switch, Route, Redirect | ||
| } from 'react-router-dom'; | ||
| import { I18nextProvider } from 'react-i18next'; | ||
|
|
||
| import LazyLoad from 'components/LazyLoad'; | ||
| import Header from 'components/Header'; | ||
| import Footer from 'components/Footer'; | ||
| import ErrorBoundary from 'components/ErrorBoundary'; | ||
| import Wrapper from 'routes/wrapper'; | ||
| import history from './createHistory'; | ||
|
|
||
| import './scss/index.scss'; | ||
|
|
||
| // fixme | ||
| const noHeaderPath = ['/dashboard/provider/submit']; | ||
|
|
||
| const WrapRoute = ({ component: Comp, ...rest }) => { | ||
| const { | ||
| path, store, computedMatch, needAuth, noMatch | ||
| } = rest; | ||
| const user = store.user || {}; | ||
|
|
||
| // todo | ||
| const hasHeader = path !== '/login' | ||
| && !noHeaderPath.includes(path) | ||
| && (user.isNormal || !user.accessToken); | ||
|
|
||
| if (noMatch) { | ||
| return <Redirect to="/" />; | ||
| } | ||
| import NotFound from 'components/NotFound'; | ||
|
|
||
| if (needAuth && !user.isLoggedIn()) { | ||
| return <Redirect to={`/login?redirect_url=${computedMatch.url || ''}`} />; | ||
| } | ||
|
|
||
| const isHome = rest.applyHome || Comp.isHome; | ||
| let { acl } = rest; | ||
|
|
||
| if (!_.isEmpty(acl)) { | ||
| acl = [].concat(acl); | ||
| if (!_.some(acl, role => user[`is${role}`])) { | ||
| return <Redirect to="/" />; | ||
| } | ||
| } | ||
| import Home from 'pages/Home'; | ||
| import { Account } from 'pages/Dashboard'; | ||
| import { | ||
| UserRoutes, DevRoutes, IsvRoutes, AdminRoutes | ||
| } from 'routes'; | ||
| import WrapRoute from 'routes/WrapRoute'; | ||
|
|
||
| return ( | ||
| <Route | ||
| {...rest} | ||
| render={props => ( | ||
| <ErrorBoundary> | ||
| {(hasHeader || isHome) && <Header />} | ||
| <Wrapper comp={Comp} {...props} rootStore={store} /> | ||
| {(hasHeader || isHome) && <Footer />} | ||
| </ErrorBoundary> | ||
| )} | ||
| /> | ||
| ); | ||
| }; | ||
| import history from './createHistory'; | ||
|
|
||
| class App extends React.Component { | ||
| static propTypes = { | ||
| i18n: PropTypes.object, | ||
| routes: PropTypes.array.isRequired, | ||
| store: PropTypes.object.isRequired | ||
| }; | ||
| import './scss/index.scss'; | ||
|
|
||
| static defaultProps = { | ||
| routes: [], | ||
| store: {}, | ||
| i18n: {} | ||
| }; | ||
| const Login = lazy(() => import('./pages/Login')); | ||
| const AppDetail = lazy(() => import('./pages/AppDetail')); | ||
|
|
||
| export default class App extends React.Component { | ||
| render() { | ||
| const { | ||
| routes, store, sock, i18n | ||
| } = this.props; | ||
|
|
||
| return ( | ||
| <I18nextProvider i18n={i18n}> | ||
| <Provider rootStore={store} sock={sock}> | ||
| <Router history={history}> | ||
| <div className="main"> | ||
| <LazyLoad> | ||
| <Switch> | ||
| {routes.map(route => ( | ||
| <WrapRoute {...route} store={store} key={route.path} /> | ||
| ))} | ||
| </Switch> | ||
| </LazyLoad> | ||
| </div> | ||
| </Router> | ||
| </Provider> | ||
| </I18nextProvider> | ||
| <Router history={history}> | ||
| <LazyLoad> | ||
| <div className="main"> | ||
| <Switch> | ||
| <WrapRoute path="/" component={Home} /> | ||
| <WrapRoute path="/login" component={Login} /> | ||
| <WrapRoute path="/apps/:appId" component={AppDetail} /> | ||
| <WrapRoute path="/profile" component={Account} /> | ||
|
|
||
| <Route | ||
| path="/user" | ||
| render={({ match }) => <UserRoutes prefix={match.path} />} | ||
| /> | ||
|
|
||
| <Route | ||
| path="/dev" | ||
| render={({ match }) => <DevRoutes prefix={match.path} />} | ||
| /> | ||
|
|
||
| <Route | ||
| path="/isv" | ||
| render={({ match }) => <IsvRoutes prefix={match.path} />} | ||
| /> | ||
|
|
||
| <Route | ||
| path="/admin" | ||
| render={({ match }) => <AdminRoutes prefix={match.path} />} | ||
| /> | ||
|
|
||
| <Redirect from="/apps" exact to="/" /> | ||
| <WrapRoute component={NotFound} /> | ||
| </Switch> | ||
| </div> | ||
| </LazyLoad> | ||
| </Router> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| export default App; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,117 @@ | ||
| @import "~scss/vars"; | ||
|
|
||
| .banner { | ||
| //position: sticky; | ||
| position: fixed; | ||
| width: 100%; | ||
| z-index: 2; | ||
| top: $header-height; | ||
| padding: 30px 0; | ||
| background-color: $N500; | ||
| transition: height .3s ease-in-out; | ||
|
|
||
| &.stretch { | ||
| padding: 64px 0; | ||
| .search { | ||
| float: none; | ||
| top: 0; | ||
| } | ||
| } | ||
|
|
||
| &.shrink { | ||
| padding: 30px 0 !important; | ||
| .search { | ||
| transition: all .3s ease-in-out; | ||
| float: right; | ||
| top: -15px; | ||
| } | ||
| } | ||
|
|
||
| .wrapper { | ||
| width: $content-width; | ||
| margin: 0 auto; | ||
|
|
||
| .words { | ||
| display: inline-block; | ||
| } | ||
| } | ||
|
|
||
| .image, | ||
| .icon { | ||
| float: left; | ||
| margin-right: 12px; | ||
| width: 48px; | ||
| height: 48px; | ||
| } | ||
|
|
||
| .image { | ||
| line-height: 48px; | ||
|
|
||
| img { | ||
| max-width: 100%; | ||
| max-height: 100%; | ||
| vertical-align: middle; | ||
| } | ||
| } | ||
|
|
||
| .icon { | ||
| box-sizing: border-box; | ||
| padding: 12px; | ||
| background-color: $N400; | ||
| border-radius: 3px; | ||
| } | ||
|
|
||
| .name { | ||
| margin-bottom: 4px; | ||
| font-size: 20px; | ||
| font-weight: 500; | ||
| line-height: 24px; | ||
| letter-spacing: 0; | ||
| color: $N0; | ||
| } | ||
|
|
||
| .description { | ||
| display: inline-block; | ||
| height: 20px; | ||
| line-height: 20px; | ||
| font-size: 12px; | ||
| color: $N65; | ||
| overflow: hidden; | ||
| } | ||
|
|
||
| .search { | ||
| position: relative; | ||
| width: 303px; | ||
|
|
||
| input { | ||
| color: $N0; | ||
| padding-left: 36px; | ||
| border-radius: 16px; | ||
| border: 1px solid transparent; | ||
| background-color: rgba(255, 255, 255, 0.1); | ||
| transition: all 0.3s ease-in-out; | ||
|
|
||
| &::placeholder { | ||
| font-size: 12px; | ||
| color: $N65; | ||
| line-height: 1; | ||
| letter-spacing: 0; | ||
| } | ||
|
|
||
| &:focus, &:hover { | ||
| border: solid 1px $P75; | ||
| } | ||
| } | ||
|
|
||
| svg { | ||
| --primary-color: #{$N0}; | ||
| --secondary-color: #{$N0}; | ||
| opacity: 0.5; | ||
|
|
||
| &:hover, | ||
| &:focus { | ||
| opacity: 1; | ||
| } | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.