From 6824d558ca1b735dc4fdbee21559d5f80f2d0167 Mon Sep 17 00:00:00 2001 From: Yang Luo Date: Sat, 13 Feb 2021 17:34:32 +0800 Subject: [PATCH] Add HomePage. --- web/src/App.js | 4 +- web/src/HomePage.js | 32 ----------- web/src/Setting.js | 4 ++ web/src/basic/HomePage.js | 103 ++++++++++++++++++++++++++++++++++++ web/src/basic/SingleCard.js | 76 ++++++++++++++++++++++++++ 5 files changed, 185 insertions(+), 34 deletions(-) delete mode 100644 web/src/HomePage.js create mode 100644 web/src/basic/HomePage.js create mode 100644 web/src/basic/SingleCard.js diff --git a/web/src/App.js b/web/src/App.js index 23e00c09..bd9a616b 100644 --- a/web/src/App.js +++ b/web/src/App.js @@ -30,7 +30,7 @@ import ApplicationEditPage from "./ApplicationEditPage"; import Face from "./Face"; import AccountPage from "./account/AccountPage"; import LoginPage from "./account/LoginPage"; -import HomePage from "./HomePage"; +import HomePage from "./basic/HomePage"; import CustomGithubCorner from "./CustomGithubCorner"; const { Header, Footer } = Layout; @@ -270,7 +270,7 @@ class App extends Component { this.renderHomeIfLoggedIn()}/> - this.renderLoginIfNotLoggedIn()}/> + this.renderLoginIfNotLoggedIn()}/> this.renderLoginIfNotLoggedIn()}/> this.renderLoginIfNotLoggedIn()}/> this.renderLoginIfNotLoggedIn()}/> diff --git a/web/src/HomePage.js b/web/src/HomePage.js deleted file mode 100644 index e8ef5675..00000000 --- a/web/src/HomePage.js +++ /dev/null @@ -1,32 +0,0 @@ -// Copyright 2021 The casbin Authors. All Rights Reserved. -// -// Licensed under the Apache License, Version 2.0 (the "License"); -// you may not use this file except in compliance with the License. -// You may obtain a copy of the License at -// -// http://www.apache.org/licenses/LICENSE-2.0 -// -// Unless required by applicable law or agreed to in writing, software -// distributed under the License is distributed on an "AS IS" BASIS, -// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -// See the License for the specific language governing permissions and -// limitations under the License. - -import React from "react"; - -class HomePage extends React.Component { - constructor(props) { - super(props); - this.state = { - classes: props, - }; - } - - render() { - return ( - "home" - ) - } -} - -export default HomePage; diff --git a/web/src/Setting.js b/web/src/Setting.js index 8c267334..f4760602 100644 --- a/web/src/Setting.js +++ b/web/src/Setting.js @@ -58,6 +58,10 @@ export function showMessage(type, text) { } } +export function isAdminUser(account) { + return account.owner === "built-in"; +} + export function deepCopy(obj) { return Object.assign({}, obj); } diff --git a/web/src/basic/HomePage.js b/web/src/basic/HomePage.js new file mode 100644 index 00000000..aa9e0001 --- /dev/null +++ b/web/src/basic/HomePage.js @@ -0,0 +1,103 @@ +// Copyright 2021 The casbin Authors. All Rights Reserved. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import React from "react"; +import {Card, Col, Row} from "antd"; +import * as Setting from "../Setting"; +import SingleCard from "./SingleCard"; + +class HomePage extends React.Component { + constructor(props) { + super(props); + this.state = { + classes: props, + }; + } + + getItems() { + let items = []; + if (Setting.isAdminUser(this.props.account)) { + items = [ + {link: "/organizations", name: "Organizations", organizer: "User containers"}, + {link: "/users", name: "Users", organizer: "Users under all organizations"}, + {link: "/providers", name: "Providers", organizer: "OAuth providers"}, + {link: "/applications", name: "Applications", organizer: "Applications that requires authentication"}, + ]; + } + + for (let i = 0; i < items.length; i ++) { + items[i].logo = `https://cdn.casbin.com/static/img${items[i].link}.png`; + items[i].createdTime = ""; + } + + return items + } + + renderCards() { + const items = this.getItems(); + + if (Setting.isMobile()) { + return ( + + { + items.map(item => { + return ( + + ) + }) + } + + ) + } else { + return ( +
+ + + + + + { + items.map(item => { + return ( + + ) + }) + } + + + + + +
+ ) + } + } + + render() { + return ( +
+   + + + { + this.renderCards() + } + + +
+ ) + } +} + +export default HomePage; diff --git a/web/src/basic/SingleCard.js b/web/src/basic/SingleCard.js new file mode 100644 index 00000000..8efd8406 --- /dev/null +++ b/web/src/basic/SingleCard.js @@ -0,0 +1,76 @@ +// Copyright 2021 The casbin Authors. All Rights Reserved. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import React from "react"; +import {Card, Col, Row} from "antd"; +import * as Setting from "../Setting"; + +const { Meta } = Card; + +class SingleCard extends React.Component { + constructor(props) { + super(props); + this.state = { + classes: props, + }; + } + + renderCardMobile(logo, link, title, desc, time, isSingle) { + const gridStyle = { + width: '100vw', + textAlign: 'center', + cursor: 'pointer', + }; + + return ( + Setting.goToLink(link)}> + logo + + + ) + } + + renderCard(logo, link, title, desc, time, isSingle) { + return ( + + + } + onClick={() => Setting.goToLink(link)} + style={isSingle ? {width: "320px"} : null} + > + +
+
+ + + + ) + } + + render() { + if (Setting.isMobile()) { + return this.renderCardMobile(this.props.logo, this.props.link, this.props.title, this.props.desc, this.props.time, this.props.isSingle); + } else { + return this.renderCard(this.props.logo, this.props.link, this.props.title, this.props.desc, this.props.time, this.props.isSingle); + } + } +} + +export default SingleCard;