Finished admin navbar and added empty pages for admin panel
This commit is contained in:
parent
b45d71b7e6
commit
a898140108
@ -1,7 +1,7 @@
|
||||
.admin-start-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
gap: 50px;
|
||||
|
||||
|
@ -10,3 +10,12 @@ body {
|
||||
justify-content: center;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.admin-page-container {
|
||||
padding-top: 110px;
|
||||
padding-left: 200px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
75
css/components/admin_nav_bar.css
Normal file
75
css/components/admin_nav_bar.css
Normal file
@ -0,0 +1,75 @@
|
||||
.admin-navbar-background {
|
||||
/*border-top: 3px solid #04B2D9;*/
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: stretch;
|
||||
background-color: #02114A;
|
||||
min-width: 170px;
|
||||
border-right: solid 0.5px #d8d8d8;
|
||||
padding: 0px 15px
|
||||
}
|
||||
.admin-navbar-image {
|
||||
object-fit: cover;
|
||||
width: 80%;
|
||||
height: 130px;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.admin-navbar-elements-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
|
||||
width: 100%;
|
||||
}
|
||||
.admin-navbar-element {
|
||||
width: 100%;
|
||||
height: 35px;
|
||||
color: white;
|
||||
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
font-family: Source Sans Pro;
|
||||
font-weight: 500;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.admin-navbar-element:hover {
|
||||
cursor: pointer;
|
||||
background-color: #ffffff14;
|
||||
border-radius: 3px;
|
||||
transition-duration: 0.3s;
|
||||
}
|
||||
.admin-navbar-element-selected {
|
||||
width: 100%;
|
||||
height: 35px;
|
||||
color: rgb(27, 27, 27);
|
||||
background-color: white;
|
||||
border-radius: 3px;
|
||||
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
font-family: Source Sans Pro;
|
||||
font-weight: 500;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.admin-navbar-element-selected { cursor: default; }
|
||||
.admin-navbar-divider {
|
||||
width: 100%;
|
||||
height: 0.5px;
|
||||
background-color: #d8d8d8;
|
||||
}
|
@ -14,13 +14,14 @@
|
||||
<link data-trunk type="text/css" href="css/contact.css" rel="css" />
|
||||
<link data-trunk type="text/css" href="css/admin-login.css" rel="css" />
|
||||
<link data-trunk type="text/css" href="css/admin-start.css" rel="css" />
|
||||
|
||||
|
||||
<link data-trunk type="text/css" href="css/components/loading.css" rel="css" />
|
||||
<link data-trunk type="text/css" href="css/components/media_slideshow.css" rel="css" />
|
||||
<link data-trunk type="text/css" href="css/components/floating_widget.css" rel="css" />
|
||||
<link data-trunk type="text/css" href="css/components/footer.css" rel="css" />
|
||||
<link data-trunk type="text/css" href="css/components/agent_card.css" rel="css" />
|
||||
|
||||
<link data-trunk type="text/css" href="css/components/admin_nav_bar.css" rel="css" />
|
||||
|
||||
|
||||
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet">
|
||||
|
34
src/components/admin_nav_bar.rs
Normal file
34
src/components/admin_nav_bar.rs
Normal file
@ -0,0 +1,34 @@
|
||||
use yew::prelude::*;
|
||||
use yew_router::prelude::{use_navigator, use_route};
|
||||
|
||||
use crate::{routes::main_router::Route};
|
||||
//use yew_router::prelude::use_navigator;
|
||||
|
||||
|
||||
#[function_component(AdminNavigationBar)]
|
||||
pub fn admin_navigation_bar() -> Html {
|
||||
let current_route: Option<Route> = use_route();
|
||||
let navigator = use_navigator().unwrap();
|
||||
let cloned_navigator_1 = navigator.clone();
|
||||
let cloned_navigator_2 = navigator.clone();
|
||||
let cloned_navigator_3 = navigator.clone();
|
||||
let cloned_navigator_4 = navigator.clone();
|
||||
|
||||
html! {
|
||||
<div class={"admin-navbar-background"}>
|
||||
<div class={"admin-navbar-image"}>
|
||||
<img class={"navbar-image"} src={"images/logo-white.png"} alt="logo"/>
|
||||
</div>
|
||||
<div class={"admin-navbar-elements-container"}>
|
||||
<div class={"admin-navbar-divider"}></div>
|
||||
<div class={ if current_route.is_some() && matches!(current_route.clone().unwrap(), Route::AdminStart) {"admin-navbar-element-selected"} else {"admin-navbar-element"} } onclick={move |_| cloned_navigator_1.push(&Route::AdminStart)}>{"Inicio"}</div>
|
||||
<div class={ if current_route.is_some() && matches!(current_route.clone().unwrap(), Route::AdminProjects) {"admin-navbar-element-selected"} else {"admin-navbar-element"} } onclick={move |_| cloned_navigator_2.push(&Route::AdminProjects)}>{"Proyectos"}</div>
|
||||
<div class={ if current_route.is_some() && matches!(current_route.clone().unwrap(), Route::AdminAgents) {"admin-navbar-element-selected"} else {"admin-navbar-element"} } onclick={move |_| cloned_navigator_3.push(&Route::AdminAgents)}>{"Agentes"}</div>
|
||||
<div class={ if current_route.is_some() && matches!(current_route.clone().unwrap(), Route::AdminContacts) {"admin-navbar-element-selected"} else {"admin-navbar-element"} } onclick={move |_| cloned_navigator_4.push(&Route::AdminContacts)}>{"Mensajes"}</div>
|
||||
<div class={"admin-navbar-divider"}></div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
}
|
||||
}
|
@ -1,8 +1,8 @@
|
||||
pub mod nav_bar;
|
||||
pub mod search_filter;
|
||||
pub mod project_card;
|
||||
pub mod media_slideshow;
|
||||
pub mod floating_widget;
|
||||
pub mod feature;
|
||||
pub mod footer;
|
||||
pub mod agent_card;
|
||||
pub mod agent_card;
|
||||
pub mod admin_nav_bar;
|
17
src/pages/admin/agents.rs
Normal file
17
src/pages/admin/agents.rs
Normal file
@ -0,0 +1,17 @@
|
||||
use yew::prelude::*;
|
||||
|
||||
use crate::components::admin_nav_bar::AdminNavigationBar;
|
||||
|
||||
#[function_component(AdminAgents)]
|
||||
pub fn admin_agents() -> Html {
|
||||
html! {
|
||||
<>
|
||||
<AdminNavigationBar/>
|
||||
<div class={"page-container"}>
|
||||
<div class={"admin-start-container"}>
|
||||
{""}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
}
|
17
src/pages/admin/contacts.rs
Normal file
17
src/pages/admin/contacts.rs
Normal file
@ -0,0 +1,17 @@
|
||||
use yew::prelude::*;
|
||||
|
||||
use crate::components::admin_nav_bar::AdminNavigationBar;
|
||||
|
||||
#[function_component(AdminContacts)]
|
||||
pub fn admin_contacts() -> Html {
|
||||
html! {
|
||||
<>
|
||||
<AdminNavigationBar/>
|
||||
<div class={"page-container"}>
|
||||
<div class={"admin-start-container"}>
|
||||
{""}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
}
|
@ -5,6 +5,7 @@ use crate::{utils::input::get_value_from_input_event, routes::main_router::Route
|
||||
|
||||
#[function_component(AdminLoginPage)]
|
||||
pub fn login_page() -> Html {
|
||||
// TODO: If logged in go to start
|
||||
let navigator = use_navigator().unwrap();
|
||||
let error = use_state(|| false);
|
||||
let username = use_state(|| String::new());
|
||||
|
@ -1,2 +1,5 @@
|
||||
pub mod login;
|
||||
pub mod start;
|
||||
pub mod start;
|
||||
pub mod projects;
|
||||
pub mod contacts;
|
||||
pub mod agents;
|
17
src/pages/admin/projects.rs
Normal file
17
src/pages/admin/projects.rs
Normal file
@ -0,0 +1,17 @@
|
||||
use yew::prelude::*;
|
||||
|
||||
use crate::components::admin_nav_bar::AdminNavigationBar;
|
||||
|
||||
#[function_component(AdminProjects)]
|
||||
pub fn admin_projects() -> Html {
|
||||
html! {
|
||||
<>
|
||||
<AdminNavigationBar/>
|
||||
<div class={"page-container"}>
|
||||
<div class={"admin-start-container"}>
|
||||
{""}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
}
|
@ -1,12 +1,17 @@
|
||||
use yew::prelude::*;
|
||||
|
||||
use crate::components::admin_nav_bar::AdminNavigationBar;
|
||||
|
||||
#[function_component(AdminStart)]
|
||||
pub fn admin_start() -> Html {
|
||||
html! {
|
||||
<div class={"page-container"}>
|
||||
<div class={"admin-start-container"}>
|
||||
{""}
|
||||
<>
|
||||
<AdminNavigationBar/>
|
||||
<div class={"admin-page-container"}>
|
||||
<div class={"admin-start-container"}>
|
||||
{"a"}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
}
|
@ -3,7 +3,7 @@ use yew::prelude::*;
|
||||
|
||||
use uuid::Uuid;
|
||||
|
||||
use crate::{pages::{landing::LandingPage, search::{SearchPage}, details::DetailsPage, not_found::NotFoundPage, contact::ContactPage, admin::{login::AdminLoginPage, start::AdminStart}, agents::AgentsPage}};
|
||||
use crate::{pages::{landing::LandingPage, search::{SearchPage}, details::DetailsPage, not_found::NotFoundPage, contact::ContactPage, admin::{login::AdminLoginPage, start::AdminStart, projects::AdminProjects, agents::AdminAgents, contacts::AdminContacts}, agents::AgentsPage}};
|
||||
|
||||
#[derive(Clone, Routable, PartialEq)]
|
||||
pub enum Route {
|
||||
@ -22,6 +22,12 @@ pub enum Route {
|
||||
Admin,
|
||||
#[at("/admin/start")]
|
||||
AdminStart,
|
||||
#[at("/admin/projects")]
|
||||
AdminProjects,
|
||||
#[at("/admin/agents")]
|
||||
AdminAgents,
|
||||
#[at("/admin/contacts")]
|
||||
AdminContacts,
|
||||
|
||||
#[not_found]
|
||||
#[at("/404")]
|
||||
@ -39,6 +45,10 @@ pub fn switch(routes: Route) -> Html {
|
||||
|
||||
Route::Admin => html! { <AdminLoginPage/> },
|
||||
Route::AdminStart => html! { <AdminStart/>},
|
||||
Route::AdminProjects => html! { <AdminProjects/> },
|
||||
Route::AdminAgents => html! { <AdminAgents/> },
|
||||
Route::AdminContacts => html! { <AdminContacts/> },
|
||||
|
||||
|
||||
}
|
||||
}
|
12
src/utils/admin_panel.rs
Normal file
12
src/utils/admin_panel.rs
Normal file
@ -0,0 +1,12 @@
|
||||
use super::storage;
|
||||
|
||||
|
||||
pub fn get_admin_token_from_storage() -> Option<String> {
|
||||
match storage::get_from_local_storage(storage::StorageKey::AdminUser) {
|
||||
Ok(opt) => opt,
|
||||
Err(_) => {
|
||||
log::error!("No user stored when attempting to use admin panel. Redirect to admin panel.");
|
||||
None
|
||||
},
|
||||
}
|
||||
}
|
@ -1,3 +1,4 @@
|
||||
pub mod get_value;
|
||||
pub mod input;
|
||||
pub mod storage;
|
||||
pub mod storage;
|
||||
pub mod admin_panel;
|
@ -1,15 +1,17 @@
|
||||
use std::fmt::Display;
|
||||
use std::fmt::{Display};
|
||||
|
||||
use err::{MessageResource, Error};
|
||||
use web_sys::window;
|
||||
|
||||
pub enum StorageKey {
|
||||
AgentShortcode,
|
||||
AdminUser,
|
||||
}
|
||||
impl Display for StorageKey {
|
||||
fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
|
||||
match self {
|
||||
StorageKey::AgentShortcode => write!(f, "agentshortcode"),
|
||||
StorageKey::AdminUser => write!(f, "adminuser"),
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user