ui imrpovement, system parameter, navbar
This commit is contained in:
Harish Sargar
parent
1ce1c27f8c
commit
a7965fc12f
@ -9,9 +9,9 @@ export const getSysParameter = async (id) => {
|
||||
}
|
||||
}
|
||||
|
||||
export const addSysParameter = async (id) => {
|
||||
export const addSysParameter = async (formdata) => {
|
||||
try {
|
||||
const response = await apiService.post(`/sysparam/addSysParams`);
|
||||
const response = await apiService.put(`/sysparam/updateSysParams/${1}`,formdata);
|
||||
console.log("add response data ",response.data)
|
||||
return response.data; // Return only the data part of the response
|
||||
} catch (error) {
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
|
||||
|
||||
import React from "react";
|
||||
import { SystemParameterProvider } from './context/SystemParameterContext';
|
||||
import {
|
||||
BrowserRouter,
|
||||
Route,
|
||||
@ -62,11 +63,12 @@ import DashboardRunner from "components/Dashboard/dashboardRunner/dashboardRunne
|
||||
|
||||
const App = () => {
|
||||
return (
|
||||
<SystemParameterProvider>
|
||||
<div>
|
||||
{/* ToastContainer should be placed in the root component */}
|
||||
<ToastContainer
|
||||
position="top-right"
|
||||
autoClose={3000}
|
||||
autoClose={1500}
|
||||
hideProgressBar={false}
|
||||
newestOnTop
|
||||
closeOnClick
|
||||
@ -140,6 +142,7 @@ const App = () => {
|
||||
</Routes>
|
||||
</BrowserRouter>
|
||||
</div>
|
||||
</SystemParameterProvider>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@ -1,3 +1,5 @@
|
||||
|
||||
|
||||
.table-responsive{
|
||||
box-shadow: 2px 2px 6px -1px grey;
|
||||
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -559,7 +559,7 @@ function MenuMaintenance() {
|
||||
console.log("sliced menu", slicedMenus); // Verify the data in slicedMenus
|
||||
|
||||
return (
|
||||
<div style={{ marginTop: "11rem" }}>
|
||||
<div style={{ marginTop: "-20px" }}>
|
||||
{loading ? (
|
||||
<Spinner />
|
||||
) : (
|
||||
@ -852,7 +852,7 @@ function MenuMaintenance() {
|
||||
</Table>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
{/* Manage Columns & Records Per Page */}
|
||||
<Row className="mt-4">
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import React,{useState,useEffect} from "react";
|
||||
import React, { useState, useEffect } from "react";
|
||||
import "../Dashboard/CSS/CSS/SetupView.css"; // Assuming you have a CSS file for styling
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import Spinner from '../../UIComponants/Spinner';
|
||||
@ -38,75 +38,75 @@ function SetupView({
|
||||
<Spinner /> // Display the spinner while loading
|
||||
) : (
|
||||
<div className="usercards-container">
|
||||
<div className="usercards">
|
||||
<div
|
||||
className="usercard"
|
||||
onClick={() => {
|
||||
console.log("User Maintenance card clicked");
|
||||
console.log("Navigating to:", "/admin/user-maintenance");
|
||||
<div className="usercards">
|
||||
<div
|
||||
className="usercard"
|
||||
onClick={() => {
|
||||
console.log("User Maintenance card clicked");
|
||||
console.log("Navigating to:", "/admin/user-maintenance");
|
||||
|
||||
navigate("/admin/user-maintenance");
|
||||
}}
|
||||
// onClick={onUserMaintenanceClick}
|
||||
>
|
||||
<i className="fa fa-user-cog card-icon"></i>
|
||||
<h3>User Maintenance</h3>
|
||||
<p>Content for Card 1</p>
|
||||
</div>
|
||||
<div
|
||||
className="usercard"
|
||||
onClick={() => {
|
||||
navigate("/admin/menu-access-control");
|
||||
// navigate("/admin/menu-access-control2")
|
||||
}}
|
||||
>
|
||||
<i className="fa-solid fa-lock"></i>
|
||||
<h3>Menu Access Control</h3>
|
||||
<p>Content for Card 2</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/user-Group-Maintenance");
|
||||
}}>
|
||||
<i className="fa-solid fa-users"></i>
|
||||
<h3>User Group Maintenance</h3>
|
||||
<p>Content for Card 3</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/system-parameter");
|
||||
}}>
|
||||
<i className="fa-solid fa-gears"></i>
|
||||
<h3>System Parameter</h3>
|
||||
<p>Content for Card 4</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/menu-maintenance");
|
||||
}}>
|
||||
<i className="fa-solid fa-utensils"></i>
|
||||
<h3>Menu Maintenance</h3>
|
||||
<p>Content for Card 5</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/access-type");
|
||||
}}>
|
||||
<i className="fa-solid fa-key"></i>
|
||||
<h3>Access Type</h3>
|
||||
<p>Content for Card 6</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={()=>{
|
||||
navigate("/admin/api-registry")
|
||||
}}>
|
||||
<i className="fas fa-database"></i>
|
||||
<h3>API Registry</h3>
|
||||
<p>Content for Card 7</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={()=>{
|
||||
navigate("/admin/token-registry")
|
||||
}}>
|
||||
<i className="fas fa-key"></i>
|
||||
<h3>Token Registry</h3>
|
||||
<p>Content for Card 8</p>
|
||||
</div>
|
||||
{/* <div className="usercard" onClick={()=>{
|
||||
navigate("/admin/user-maintenance");
|
||||
}}
|
||||
// onClick={onUserMaintenanceClick}
|
||||
>
|
||||
<i className="fa fa-user-cog card-icon"></i>
|
||||
<h3>User Maintenance</h3>
|
||||
<p>Content for Card 1</p>
|
||||
</div>
|
||||
<div
|
||||
className="usercard"
|
||||
onClick={() => {
|
||||
navigate("/admin/menu-access-control");
|
||||
// navigate("/admin/menu-access-control2")
|
||||
}}
|
||||
>
|
||||
<i className="fa-solid fa-lock"></i>
|
||||
<h3>Menu Access Control</h3>
|
||||
<p>Content for Card 2</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/user-Group-Maintenance");
|
||||
}}>
|
||||
<i className="fa-solid fa-users"></i>
|
||||
<h3>User Group Maintenance</h3>
|
||||
<p>Content for Card 3</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/system-parameter");
|
||||
}}>
|
||||
<i className="fa-solid fa-gears"></i>
|
||||
<h3>System Parameter</h3>
|
||||
<p>Content for Card 4</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/menu-maintenance");
|
||||
}}>
|
||||
<i className="fa-solid fa-utensils"></i>
|
||||
<h3>Menu Maintenance</h3>
|
||||
<p>Content for Card 5</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/access-type");
|
||||
}}>
|
||||
<i className="fa-solid fa-key"></i>
|
||||
<h3>Access Type</h3>
|
||||
<p>Content for Card 6</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/api-registry")
|
||||
}}>
|
||||
<i className="fas fa-database"></i>
|
||||
<h3>API Registry</h3>
|
||||
<p>Content for Card 7</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/token-registry")
|
||||
}}>
|
||||
<i className="fas fa-key"></i>
|
||||
<h3>Token Registry</h3>
|
||||
<p>Content for Card 8</p>
|
||||
</div>
|
||||
{/* <div className="usercard" onClick={()=>{
|
||||
navigate("/admin/datatype-1")
|
||||
}}>
|
||||
<i className="fa fa-file"></i>
|
||||
@ -176,27 +176,27 @@ function SetupView({
|
||||
<h3>Premium Datatypes</h3>
|
||||
<p>Content for Card 18</p>
|
||||
</div> */}
|
||||
<div className="usercard" onClick={()=>{
|
||||
navigate("/admin/user-report")
|
||||
}}>
|
||||
<i className="fa fa-file"></i>
|
||||
<h3>Reports</h3>
|
||||
<p>Report Description</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={()=>{
|
||||
navigate("/admin/dynamic-form")
|
||||
}}>
|
||||
<i className="fa fa-file"></i>
|
||||
<h3>DynamicForm</h3>
|
||||
<p>Content for Card 16</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/user-report")
|
||||
}}>
|
||||
<i className="fa fa-file"></i>
|
||||
<h3>Reports</h3>
|
||||
<p>Report Description</p>
|
||||
</div>
|
||||
<div className="usercard" onClick={() => {
|
||||
navigate("/admin/dynamic-form")
|
||||
}}>
|
||||
<i className="fa fa-file"></i>
|
||||
<h3>DynamicForm</h3>
|
||||
<p>Content for Card 16</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@ -154,32 +154,32 @@ import {getSysParameter,addSysParameter} from "../../APIServices/Systemparameter
|
||||
|
||||
const SystemParameterForm = () => {
|
||||
const [formData, setFormData] = useState({
|
||||
schedulerTimer: "",
|
||||
schedulerTime: "",
|
||||
leaseTaxCode: "",
|
||||
vesselConfirmationProcessLimit: "",
|
||||
vesselConfProcessLimit: "",
|
||||
rowToDisplay: "",
|
||||
linkToDisplay: "",
|
||||
rowToAdd: "",
|
||||
lovRowToDisplay: "",
|
||||
lovLinkToDisplay: "",
|
||||
oldServerName: "",
|
||||
oldBase: "",
|
||||
oldAdminUser: "",
|
||||
oldServerPort: "",
|
||||
oidserverName: "",
|
||||
oidBase: "",
|
||||
oidAdminUser: "",
|
||||
oidServerPort: "",
|
||||
userDefaultGroup: "",
|
||||
defaultDepartment: "",
|
||||
defaultPosition: "",
|
||||
singleCharge: "",
|
||||
firstDayOfWeek: "",
|
||||
firstDayOftheWeek: "",
|
||||
hourPerShift: "",
|
||||
cnBillingFrequency: "",
|
||||
billingDepartmentCode: "",
|
||||
basePriceList: "",
|
||||
nonContainerServiceOrderAutoApprovalDeptCode: "",
|
||||
ediMAESchedulerOnOff: "",
|
||||
ediSchedulerOnOff: "",
|
||||
logo: null,
|
||||
companyDisplayName: "",
|
||||
nonContainerServiceOrder: "",
|
||||
ediMaeSchedulerONOFF: "",
|
||||
ediSchedulerONOFF: "",
|
||||
upload_Logo: null,
|
||||
company_Display_Name: "",
|
||||
});
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
@ -216,6 +216,7 @@ const SystemParameterForm = () => {
|
||||
event.preventDefault();
|
||||
|
||||
try {
|
||||
console.log("Form Data:", formData);
|
||||
const sysParamData = await addSysParameter(formData);
|
||||
console.log("API Response:", sysParamData);
|
||||
|
||||
@ -290,7 +291,7 @@ const SystemParameterForm = () => {
|
||||
</Row>
|
||||
|
||||
{Object.keys(formData).map((key, index) =>
|
||||
key !== "logo" ? (
|
||||
key !== "upload_Logo" ? (
|
||||
<Row className="mb-3" key={index}>
|
||||
<Col xs={6} className="d-flex align-items-center">
|
||||
<Form.Label className="mb-0">
|
||||
|
||||
@ -579,23 +579,23 @@ function UserMaintenanceView() {
|
||||
.slice((currentPage - 1) * recordsPerPage, currentPage * recordsPerPage);
|
||||
|
||||
return (
|
||||
<div style={{marginTop:"11rem"}}>
|
||||
<div style={{marginTop:"8rem"}}>
|
||||
{loading ? (
|
||||
<Spinner/>
|
||||
):(
|
||||
<div className="container-fluid mt-5">
|
||||
{/* Header */}
|
||||
<div className="d-flex justify-content-between align-items-center mb-4">
|
||||
<div className="d-flex justify-content-between align-items-center mb-0">
|
||||
<h1 className="title_main">User Maintenance</h1>
|
||||
</div>
|
||||
|
||||
<Row className="align-items-center my-3">
|
||||
<Row className="align-items-center my-1">
|
||||
{/* Left: Search Bar */}
|
||||
<Col
|
||||
xs={12}
|
||||
md={8}
|
||||
lg={6}
|
||||
className="d-flex justify-content-center my-3"
|
||||
className="d-flex justify-content-center my-2"
|
||||
>
|
||||
<InputGroup
|
||||
className="search-bar"
|
||||
|
||||
@ -1,4 +1,8 @@
|
||||
import { useNavigate, Link } from "react-router-dom";
|
||||
import { removeCurrentUser,getCurrentUser } from "../../utils/tokenService";
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { faUser } from "@fortawesome/free-solid-svg-icons";
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownItem,
|
||||
@ -18,9 +22,22 @@ import "./AdminNavbar.css";
|
||||
import "bootstrap-icons/font/bootstrap-icons.css";
|
||||
|
||||
const AdminNavbar = ({ brandText }) => {
|
||||
const[currentUser,setCurrentUser]=useState();
|
||||
useEffect(() => {
|
||||
const user = getCurrentUser();
|
||||
console.log(user);
|
||||
setCurrentUser(user);
|
||||
console.log(currentUser);
|
||||
if (!user) {
|
||||
navigate("/login");
|
||||
}
|
||||
}, []);
|
||||
|
||||
console.log(brandText);
|
||||
const navigate = useNavigate();
|
||||
|
||||
const handleLogout = () => {
|
||||
removeCurrentUser();
|
||||
// localStorage.removeItem("authToken"); // Uncomment if needed
|
||||
navigate("/login");
|
||||
};
|
||||
@ -55,7 +72,7 @@ const AdminNavbar = ({ brandText }) => {
|
||||
{/* Search and Profile */}
|
||||
<div className="nav-right d-flex align-items-center">
|
||||
<Form className="navbar-search navbar-search-dark form-inline">
|
||||
<FormGroup className="mb-0">
|
||||
{/* <FormGroup className="mb-0">
|
||||
<InputGroup className="input-group-alternative search-input-group">
|
||||
<InputGroupAddon addonType="prepend">
|
||||
<InputGroupText className="search-icon">
|
||||
@ -64,7 +81,7 @@ const AdminNavbar = ({ brandText }) => {
|
||||
</InputGroupAddon>
|
||||
<Input placeholder="Search" type="text" className="search-input" />
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
</FormGroup> */}
|
||||
</Form>
|
||||
|
||||
<Nav className="align-items-center" navbar>
|
||||
@ -72,14 +89,15 @@ const AdminNavbar = ({ brandText }) => {
|
||||
<DropdownToggle className="pr-0" nav>
|
||||
<Media className="align-items-center">
|
||||
<span className="avatar avatar-sm rounded-circle">
|
||||
<img
|
||||
{/* <img
|
||||
alt="Profile"
|
||||
src={require("../../assets/img/theme/team-4-800x800.jpg")}
|
||||
/>
|
||||
/> */}
|
||||
<FontAwesomeIcon icon={faUser} />
|
||||
</span>
|
||||
<Media className="ml-2 d-none d-lg-block">
|
||||
<span className="brand_name mb-0 text-sm font-weight-bold text-white-50">
|
||||
Jessica Jones
|
||||
{currentUser ? currentUser.fullname : "Guest"}
|
||||
</span>
|
||||
</Media>
|
||||
</Media>
|
||||
|
||||
61
src/context/SystemParameterContext.js
Normal file
61
src/context/SystemParameterContext.js
Normal file
@ -0,0 +1,61 @@
|
||||
import React, { createContext, useContext, useState, useEffect } from 'react';
|
||||
import { getSysParameter } from '../APIServices/SystemparameterApi';
|
||||
|
||||
const SystemParameterContext = createContext();
|
||||
|
||||
export const useSystemParameters = () => {
|
||||
const context = useContext(SystemParameterContext);
|
||||
if (!context) {
|
||||
throw new Error('useSystemParameters must be used within a SystemParameterProvider');
|
||||
}
|
||||
return context;
|
||||
};
|
||||
|
||||
export const SystemParameterProvider = ({ children }) => {
|
||||
const [systemParameters, setSystemParameters] = useState(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchSystemParameters = async () => {
|
||||
try {
|
||||
const data = await getSysParameter(1); // Assuming 1 is the default ID for system parameters
|
||||
setSystemParameters(data);
|
||||
console.log("system parameters data ",data)
|
||||
setError(null);
|
||||
} catch (err) {
|
||||
setError('Failed to fetch system parameters');
|
||||
console.error('Error fetching system parameters:', err);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
fetchSystemParameters();
|
||||
}, []);
|
||||
|
||||
const value = {
|
||||
systemParameters,
|
||||
loading,
|
||||
error,
|
||||
refetch: async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
const data = await getSysParameter(1);
|
||||
setSystemParameters(data);
|
||||
setError(null);
|
||||
} catch (err) {
|
||||
setError('Failed to fetch system parameters');
|
||||
console.error('Error fetching system parameters:', err);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<SystemParameterContext.Provider value={value}>
|
||||
{children}
|
||||
</SystemParameterContext.Provider>
|
||||
);
|
||||
};
|
||||
@ -3,7 +3,7 @@ import { useLocation } from "react-router-dom";
|
||||
import AdminNavbar from "components/Navbars/AdminNavbar.js";
|
||||
import AdminFooter from "components/Footers/AdminFooter.js";
|
||||
import Sidebar from "components/Sidebar/Sidebar.js";
|
||||
|
||||
import { useSystemParameters } from "../context/SystemParameterContext";
|
||||
import { Outlet } from "react-router-dom"; // Import Outlet for nested routing
|
||||
import routes from "routes.js";
|
||||
|
||||
@ -39,7 +39,7 @@ const Admin = (props) => {
|
||||
|
||||
// Check if the current page is an admin page
|
||||
const isAdminPage = location.pathname.startsWith("/admin");
|
||||
|
||||
const { systemParameters, loading, error } = useSystemParameters();
|
||||
return (
|
||||
<>
|
||||
{/* Render Navbar only on admin pages */}
|
||||
@ -47,7 +47,7 @@ const Admin = (props) => {
|
||||
<div className="navbar-container">
|
||||
<AdminNavbar
|
||||
{...props}
|
||||
brandText={getBrandText(location.pathname)}
|
||||
brandText={systemParameters ? systemParameters.company_Display_Name : "Loading..."}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -1,19 +1,23 @@
|
||||
|
||||
|
||||
const TOKEN_KEY = 'authToken';
|
||||
const TOKEN_KEY = 'CurrentUser';
|
||||
|
||||
|
||||
export const setToken = (token) => {
|
||||
localStorage.setItem(TOKEN_KEY, token);
|
||||
export const setCurrentUser = (user) => {
|
||||
localStorage.setItem(TOKEN_KEY, user);
|
||||
};
|
||||
|
||||
export const getCurrentUser = () => {
|
||||
return JSON.parse(localStorage.getItem(TOKEN_KEY));
|
||||
};
|
||||
|
||||
export const getToken = () => {
|
||||
return localStorage.getItem(TOKEN_KEY);
|
||||
const userData = localStorage.getItem(TOKEN_KEY);
|
||||
return userData ? JSON.parse(userData).token : null;
|
||||
};
|
||||
|
||||
|
||||
export const removeToken = () => {
|
||||
export const removeCurrentUser = () => {
|
||||
localStorage.removeItem(TOKEN_KEY);
|
||||
};
|
||||
|
||||
@ -21,3 +25,7 @@ export const removeToken = () => {
|
||||
export const isTokenAvailable = () => {
|
||||
return !!localStorage.getItem(TOKEN_KEY); // Returns true if token exists
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -81,284 +81,285 @@ const Index = (props) => {
|
||||
setChartExample1Data("data" + index);
|
||||
};
|
||||
return (
|
||||
<div >
|
||||
<>Home Page</>
|
||||
// <div >
|
||||
|
||||
<Header />
|
||||
<Sidebar menuData={menuData} />
|
||||
// <Header />
|
||||
// <Sidebar menuData={menuData} />
|
||||
|
||||
|
||||
{/* Page content */}
|
||||
<Container className="mt--7" fluid style={{ marginTop: "-4rem" }}>
|
||||
<Row>
|
||||
<Col className="mb-5 mb-xl-0" xl="8">
|
||||
<Card className="bg-gradient-default shadow">
|
||||
<CardHeader className="bg-transparent">
|
||||
<Row className="align-items-center">
|
||||
<div className="col">
|
||||
<h6 className="text-uppercase text-light ls-1 mb-1">
|
||||
Overview
|
||||
</h6>
|
||||
<h2 className="text-white mb-0">Sales value</h2>
|
||||
</div>
|
||||
<div className="col">
|
||||
<Nav className="justify-content-end" pills>
|
||||
<NavItem>
|
||||
<NavLink
|
||||
className={classnames("py-2 px-3", {
|
||||
active: activeNav === 1,
|
||||
})}
|
||||
href="#pablo"
|
||||
onClick={(e) => toggleNavs(e, 1)}
|
||||
>
|
||||
<span className="d-none d-md-block">Month</span>
|
||||
<span className="d-md-none">M</span>
|
||||
</NavLink>
|
||||
</NavItem>
|
||||
<NavItem>
|
||||
<NavLink
|
||||
className={classnames("py-2 px-3", {
|
||||
active: activeNav === 2,
|
||||
})}
|
||||
data-toggle="tab"
|
||||
href="#pablo"
|
||||
onClick={(e) => toggleNavs(e, 2)}
|
||||
>
|
||||
<span className="d-none d-md-block">Week</span>
|
||||
<span className="d-md-none">W</span>
|
||||
</NavLink>
|
||||
</NavItem>
|
||||
</Nav>
|
||||
</div>
|
||||
</Row>
|
||||
</CardHeader>
|
||||
<CardBody>
|
||||
{/* Chart */}
|
||||
<div className="chart">
|
||||
{chartExample1[chartExample1Data] ? (
|
||||
<Line
|
||||
data={chartExample1[chartExample1Data]}
|
||||
options={chartExample1.options}
|
||||
/>
|
||||
) : (
|
||||
<p>Loading chart...</p>
|
||||
)}
|
||||
// {/* Page content */}
|
||||
// <Container className="mt--7" fluid style={{ marginTop: "-4rem" }}>
|
||||
// <Row>
|
||||
// <Col className="mb-5 mb-xl-0" xl="8">
|
||||
// <Card className="bg-gradient-default shadow">
|
||||
// <CardHeader className="bg-transparent">
|
||||
// <Row className="align-items-center">
|
||||
// <div className="col">
|
||||
// <h6 className="text-uppercase text-light ls-1 mb-1">
|
||||
// Overview
|
||||
// </h6>
|
||||
// <h2 className="text-white mb-0">Sales value</h2>
|
||||
// </div>
|
||||
// <div className="col">
|
||||
// <Nav className="justify-content-end" pills>
|
||||
// <NavItem>
|
||||
// <NavLink
|
||||
// className={classnames("py-2 px-3", {
|
||||
// active: activeNav === 1,
|
||||
// })}
|
||||
// href="#pablo"
|
||||
// onClick={(e) => toggleNavs(e, 1)}
|
||||
// >
|
||||
// <span className="d-none d-md-block">Month</span>
|
||||
// <span className="d-md-none">M</span>
|
||||
// </NavLink>
|
||||
// </NavItem>
|
||||
// <NavItem>
|
||||
// <NavLink
|
||||
// className={classnames("py-2 px-3", {
|
||||
// active: activeNav === 2,
|
||||
// })}
|
||||
// data-toggle="tab"
|
||||
// href="#pablo"
|
||||
// onClick={(e) => toggleNavs(e, 2)}
|
||||
// >
|
||||
// <span className="d-none d-md-block">Week</span>
|
||||
// <span className="d-md-none">W</span>
|
||||
// </NavLink>
|
||||
// </NavItem>
|
||||
// </Nav>
|
||||
// </div>
|
||||
// </Row>
|
||||
// </CardHeader>
|
||||
// <CardBody>
|
||||
// {/* Chart */}
|
||||
// <div className="chart">
|
||||
// {chartExample1[chartExample1Data] ? (
|
||||
// <Line
|
||||
// data={chartExample1[chartExample1Data]}
|
||||
// options={chartExample1.options}
|
||||
// />
|
||||
// ) : (
|
||||
// <p>Loading chart...</p>
|
||||
// )}
|
||||
|
||||
</div>
|
||||
</CardBody>
|
||||
</Card>
|
||||
</Col>
|
||||
<Col xl="4">
|
||||
<Card className="shadow">
|
||||
<CardHeader className="bg-transparent">
|
||||
<Row className="align-items-center">
|
||||
<div className="col">
|
||||
<h6 className="text-uppercase text-muted ls-1 mb-1">
|
||||
Performance
|
||||
</h6>
|
||||
<h2 className="mb-0">Total orders</h2>
|
||||
</div>
|
||||
</Row>
|
||||
</CardHeader>
|
||||
<CardBody>
|
||||
{/* Chart */}
|
||||
<div className="chart">
|
||||
<Bar
|
||||
data={chartExample2.data}
|
||||
options={chartExample2.options}
|
||||
/>
|
||||
</div>
|
||||
</CardBody>
|
||||
</Card>
|
||||
</Col>
|
||||
</Row>
|
||||
<Row className="mt-5">
|
||||
<Col className="mb-5 mb-xl-0" xl="8">
|
||||
<Card className="shadow">
|
||||
<CardHeader className="border-0">
|
||||
<Row className="align-items-center">
|
||||
<div className="col">
|
||||
<h3 className="mb-0">Page visits</h3>
|
||||
</div>
|
||||
<div className="col text-right">
|
||||
<Button
|
||||
color="primary"
|
||||
href="#pablo"
|
||||
onClick={(e) => e.preventDefault()}
|
||||
size="sm"
|
||||
>
|
||||
See all
|
||||
</Button>
|
||||
</div>
|
||||
</Row>
|
||||
</CardHeader>
|
||||
<Table className="align-items-center table-flush" responsive>
|
||||
<thead className="thead-light">
|
||||
<tr>
|
||||
<th scope="col">Page name</th>
|
||||
<th scope="col">Visitors</th>
|
||||
<th scope="col">Unique users</th>
|
||||
<th scope="col">Bounce rate</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">/argon/</th>
|
||||
<td>4,569</td>
|
||||
<td>340</td>
|
||||
<td>
|
||||
<i className="fas fa-arrow-up text-success mr-3" /> 46,53%
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">/argon/index.html</th>
|
||||
<td>3,985</td>
|
||||
<td>319</td>
|
||||
<td>
|
||||
<i className="fas fa-arrow-down text-warning mr-3" />{" "}
|
||||
46,53%
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">/argon/charts.html</th>
|
||||
<td>3,513</td>
|
||||
<td>294</td>
|
||||
<td>
|
||||
<i className="fas fa-arrow-down text-warning mr-3" />{" "}
|
||||
36,49%
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">/argon/tables.html</th>
|
||||
<td>2,050</td>
|
||||
<td>147</td>
|
||||
<td>
|
||||
<i className="fas fa-arrow-up text-success mr-3" /> 50,87%
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">/argon/profile.html</th>
|
||||
<td>1,795</td>
|
||||
<td>190</td>
|
||||
<td>
|
||||
<i className="fas fa-arrow-down text-danger mr-3" />{" "}
|
||||
46,53%
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</Table>
|
||||
</Card>
|
||||
</Col>
|
||||
<Col xl="4">
|
||||
<Card className="shadow">
|
||||
<CardHeader className="border-0">
|
||||
<Row className="align-items-center">
|
||||
<div className="col">
|
||||
<h3 className="mb-0">Social traffic</h3>
|
||||
</div>
|
||||
<div className="col text-right">
|
||||
<Button
|
||||
color="primary"
|
||||
href="#pablo"
|
||||
onClick={(e) => e.preventDefault()}
|
||||
size="sm"
|
||||
>
|
||||
See all
|
||||
</Button>
|
||||
</div>
|
||||
</Row>
|
||||
</CardHeader>
|
||||
<Table className="align-items-center table-flush" responsive>
|
||||
<thead className="thead-light">
|
||||
<tr>
|
||||
<th scope="col">Referral</th>
|
||||
<th scope="col">Visitors</th>
|
||||
<th scope="col" />
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">Facebook</th>
|
||||
<td>1,480</td>
|
||||
<td>
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="mr-2">60%</span>
|
||||
<div>
|
||||
<Progress
|
||||
max="100"
|
||||
value="60"
|
||||
barClassName="bg-gradient-danger"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Facebook</th>
|
||||
<td>5,480</td>
|
||||
<td>
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="mr-2">70%</span>
|
||||
<div>
|
||||
<Progress
|
||||
max="100"
|
||||
value="70"
|
||||
barClassName="bg-gradient-success"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Google</th>
|
||||
<td>4,807</td>
|
||||
<td>
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="mr-2">80%</span>
|
||||
<div>
|
||||
<Progress max="100" value="80" />
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Instagram</th>
|
||||
<td>3,678</td>
|
||||
<td>
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="mr-2">75%</span>
|
||||
<div>
|
||||
<Progress
|
||||
max="100"
|
||||
value="75"
|
||||
barClassName="bg-gradient-info"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">twitter</th>
|
||||
<td>2,645</td>
|
||||
<td>
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="mr-2">30%</span>
|
||||
<div>
|
||||
<Progress
|
||||
max="100"
|
||||
value="30"
|
||||
barClassName="bg-gradient-warning"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</Table>
|
||||
</Card>
|
||||
</Col>
|
||||
</Row>
|
||||
</Container>
|
||||
</div>
|
||||
// </div>
|
||||
// </CardBody>
|
||||
// </Card>
|
||||
// </Col>
|
||||
// <Col xl="4">
|
||||
// <Card className="shadow">
|
||||
// <CardHeader className="bg-transparent">
|
||||
// <Row className="align-items-center">
|
||||
// <div className="col">
|
||||
// <h6 className="text-uppercase text-muted ls-1 mb-1">
|
||||
// Performance
|
||||
// </h6>
|
||||
// <h2 className="mb-0">Total orders</h2>
|
||||
// </div>
|
||||
// </Row>
|
||||
// </CardHeader>
|
||||
// <CardBody>
|
||||
// {/* Chart */}
|
||||
// <div className="chart">
|
||||
// <Bar
|
||||
// data={chartExample2.data}
|
||||
// options={chartExample2.options}
|
||||
// />
|
||||
// </div>
|
||||
// </CardBody>
|
||||
// </Card>
|
||||
// </Col>
|
||||
// </Row>
|
||||
// <Row className="mt-5">
|
||||
// <Col className="mb-5 mb-xl-0" xl="8">
|
||||
// <Card className="shadow">
|
||||
// <CardHeader className="border-0">
|
||||
// <Row className="align-items-center">
|
||||
// <div className="col">
|
||||
// <h3 className="mb-0">Page visits</h3>
|
||||
// </div>
|
||||
// <div className="col text-right">
|
||||
// <Button
|
||||
// color="primary"
|
||||
// href="#pablo"
|
||||
// onClick={(e) => e.preventDefault()}
|
||||
// size="sm"
|
||||
// >
|
||||
// See all
|
||||
// </Button>
|
||||
// </div>
|
||||
// </Row>
|
||||
// </CardHeader>
|
||||
// <Table className="align-items-center table-flush" responsive>
|
||||
// <thead className="thead-light">
|
||||
// <tr>
|
||||
// <th scope="col">Page name</th>
|
||||
// <th scope="col">Visitors</th>
|
||||
// <th scope="col">Unique users</th>
|
||||
// <th scope="col">Bounce rate</th>
|
||||
// </tr>
|
||||
// </thead>
|
||||
// <tbody>
|
||||
// <tr>
|
||||
// <th scope="row">/argon/</th>
|
||||
// <td>4,569</td>
|
||||
// <td>340</td>
|
||||
// <td>
|
||||
// <i className="fas fa-arrow-up text-success mr-3" /> 46,53%
|
||||
// </td>
|
||||
// </tr>
|
||||
// <tr>
|
||||
// <th scope="row">/argon/index.html</th>
|
||||
// <td>3,985</td>
|
||||
// <td>319</td>
|
||||
// <td>
|
||||
// <i className="fas fa-arrow-down text-warning mr-3" />{" "}
|
||||
// 46,53%
|
||||
// </td>
|
||||
// </tr>
|
||||
// <tr>
|
||||
// <th scope="row">/argon/charts.html</th>
|
||||
// <td>3,513</td>
|
||||
// <td>294</td>
|
||||
// <td>
|
||||
// <i className="fas fa-arrow-down text-warning mr-3" />{" "}
|
||||
// 36,49%
|
||||
// </td>
|
||||
// </tr>
|
||||
// <tr>
|
||||
// <th scope="row">/argon/tables.html</th>
|
||||
// <td>2,050</td>
|
||||
// <td>147</td>
|
||||
// <td>
|
||||
// <i className="fas fa-arrow-up text-success mr-3" /> 50,87%
|
||||
// </td>
|
||||
// </tr>
|
||||
// <tr>
|
||||
// <th scope="row">/argon/profile.html</th>
|
||||
// <td>1,795</td>
|
||||
// <td>190</td>
|
||||
// <td>
|
||||
// <i className="fas fa-arrow-down text-danger mr-3" />{" "}
|
||||
// 46,53%
|
||||
// </td>
|
||||
// </tr>
|
||||
// </tbody>
|
||||
// </Table>
|
||||
// </Card>
|
||||
// </Col>
|
||||
// <Col xl="4">
|
||||
// <Card className="shadow">
|
||||
// <CardHeader className="border-0">
|
||||
// <Row className="align-items-center">
|
||||
// <div className="col">
|
||||
// <h3 className="mb-0">Social traffic</h3>
|
||||
// </div>
|
||||
// <div className="col text-right">
|
||||
// <Button
|
||||
// color="primary"
|
||||
// href="#pablo"
|
||||
// onClick={(e) => e.preventDefault()}
|
||||
// size="sm"
|
||||
// >
|
||||
// See all
|
||||
// </Button>
|
||||
// </div>
|
||||
// </Row>
|
||||
// </CardHeader>
|
||||
// <Table className="align-items-center table-flush" responsive>
|
||||
// <thead className="thead-light">
|
||||
// <tr>
|
||||
// <th scope="col">Referral</th>
|
||||
// <th scope="col">Visitors</th>
|
||||
// <th scope="col" />
|
||||
// </tr>
|
||||
// </thead>
|
||||
// <tbody>
|
||||
// <tr>
|
||||
// <th scope="row">Facebook</th>
|
||||
// <td>1,480</td>
|
||||
// <td>
|
||||
// <div className="d-flex align-items-center">
|
||||
// <span className="mr-2">60%</span>
|
||||
// <div>
|
||||
// <Progress
|
||||
// max="100"
|
||||
// value="60"
|
||||
// barClassName="bg-gradient-danger"
|
||||
// />
|
||||
// </div>
|
||||
// </div>
|
||||
// </td>
|
||||
// </tr>
|
||||
// <tr>
|
||||
// <th scope="row">Facebook</th>
|
||||
// <td>5,480</td>
|
||||
// <td>
|
||||
// <div className="d-flex align-items-center">
|
||||
// <span className="mr-2">70%</span>
|
||||
// <div>
|
||||
// <Progress
|
||||
// max="100"
|
||||
// value="70"
|
||||
// barClassName="bg-gradient-success"
|
||||
// />
|
||||
// </div>
|
||||
// </div>
|
||||
// </td>
|
||||
// </tr>
|
||||
// <tr>
|
||||
// <th scope="row">Google</th>
|
||||
// <td>4,807</td>
|
||||
// <td>
|
||||
// <div className="d-flex align-items-center">
|
||||
// <span className="mr-2">80%</span>
|
||||
// <div>
|
||||
// <Progress max="100" value="80" />
|
||||
// </div>
|
||||
// </div>
|
||||
// </td>
|
||||
// </tr>
|
||||
// <tr>
|
||||
// <th scope="row">Instagram</th>
|
||||
// <td>3,678</td>
|
||||
// <td>
|
||||
// <div className="d-flex align-items-center">
|
||||
// <span className="mr-2">75%</span>
|
||||
// <div>
|
||||
// <Progress
|
||||
// max="100"
|
||||
// value="75"
|
||||
// barClassName="bg-gradient-info"
|
||||
// />
|
||||
// </div>
|
||||
// </div>
|
||||
// </td>
|
||||
// </tr>
|
||||
// <tr>
|
||||
// <th scope="row">twitter</th>
|
||||
// <td>2,645</td>
|
||||
// <td>
|
||||
// <div className="d-flex align-items-center">
|
||||
// <span className="mr-2">30%</span>
|
||||
// <div>
|
||||
// <Progress
|
||||
// max="100"
|
||||
// value="30"
|
||||
// barClassName="bg-gradient-warning"
|
||||
// />
|
||||
// </div>
|
||||
// </div>
|
||||
// </td>
|
||||
// </tr>
|
||||
// </tbody>
|
||||
// </Table>
|
||||
// </Card>
|
||||
// </Col>
|
||||
// </Row>
|
||||
// </Container>
|
||||
// </div>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
// Import necessary components
|
||||
import React, { useState } from "react";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { setToken } from "../../utils/tokenService";
|
||||
import { setCurrentUser} from "../../utils/tokenService";
|
||||
import { LoginEnvironment } from "../examples/LoginEnviornment";
|
||||
import "../../assets/css/login.css";
|
||||
|
||||
@ -84,12 +84,15 @@ const Login = () => {
|
||||
|
||||
if (response.ok) {
|
||||
// Handle successful login
|
||||
console.log("Login successful ",response);
|
||||
const responseData = await response.json();
|
||||
console.log("Login successful ",responseData);
|
||||
const authToken = responseData.item.token;
|
||||
console.log("Login successful, token received");
|
||||
|
||||
// Store authentication token
|
||||
setToken(authToken);
|
||||
setCurrentUser(JSON.stringify(responseData.item));
|
||||
// setToken(authToken);
|
||||
console.log("Token stored in local storage, redirecting to dashboard");
|
||||
|
||||
// Redirect to dashboard
|
||||
@ -103,7 +106,9 @@ const Login = () => {
|
||||
} catch (error) {
|
||||
// Handle connection errors
|
||||
console.error("Login API error:", error.message);
|
||||
setError(`An error occurred during login: ${error.message}`);
|
||||
// setError(`An error occurred during login: ${error.message}`);
|
||||
setError(`Something went wrong !!!!`);
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user