second commit

package.json

@@ -3,12 +3,18 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@ant-design/icons": "^5.2.6",
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
+    "antd": "^5.10.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-redux": "^8.1.3",
+    "react-router-dom": "^6.17.0",
     "react-scripts": "5.0.1",
+    "redux": "^4.2.1",
+    "sass": "^1.69.4",
     "web-vitals": "^2.1.4"
   },
   "scripts": {

src/App.css

@@ -1,38 +1,11 @@
-.App {
-  text-align: center;
+* {
+  box-sizing: border-box;
 }
 
-.App-logo {
-  height: 40vmin;
-  pointer-events: none;
+#root {
+  height: 100vh !important;
 }
-
-@media (prefers-reduced-motion: no-preference) {
-  .App-logo {
-    animation: App-logo-spin infinite 20s linear;
-  }
-}
-
-.App-header {
-  background-color: #282c34;
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
-  color: white;
-}
-
-.App-link {
-  color: #61dafb;
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
+.container {
+  margin: 0 20px;
+  padding: 30px 20px;
 }

src/App.js

@@ -1,24 +1,11 @@
-import logo from './logo.svg';
+import AllRoutes from "./components/AllRoutes"
 import './App.css';
 
 function App() {
   return (
-    <div className="App">
-      <header className="App-header">
-        <img src={logo} className="App-logo" alt="logo" />
-        <p>
-          Edit <code>src/App.js</code> and save to reload.
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn React
-        </a>
-      </header>
-    </div>
+   <>
+      <AllRoutes />
+   </>
   );
 }
 

src/actions/admin.js

@@ -0,0 +1,6 @@
+export const adminStatus = (status) => {
+    return {
+        type: "ADMIN_STATUS",
+        status: status,
+    }
+}

src/actions/authen.js

@@ -0,0 +1,6 @@
+export const checkAuthen = (status) => {
+    return {
+        type: "CHECK_AUTHEN",
+        status: status,
+    }
+}

src/actions/search.js

@@ -0,0 +1,7 @@
+export const inputSearch = (city, tag) => {
+    return {
+        type: "INPUT_SEARCH",
+        city: city,
+        tag: tag
+    }
+}

src/components/AllRoutes/index.js

@@ -0,0 +1,14 @@
+import { useRoutes } from "react-router-dom"
+import { routes } from "../../routes"
+
+const AllRoutes = () => {
+    const elements = useRoutes(routes);
+
+    return (
+        <>
+            {elements}
+        </>
+    )
+}
+
+export default AllRoutes;

src/components/DashBoard/index.js

@@ -0,0 +1,9 @@
+const DashBoard = () => {
+    return (
+        <>
+            <h2>Tổng quan</h2>
+        </>
+    )
+}
+
+export default DashBoard;

src/components/MenuSider/index.js

@@ -0,0 +1,53 @@
+import { Menu } from "antd";
+import { 
+    UserOutlined,
+    DashboardOutlined,
+    UnorderedListOutlined,
+    AuditOutlined,
+} from '@ant-design/icons';
+import { Link } from "react-router-dom";
+
+const MenuSider = () => {
+    const items = [
+        {
+            key: "dashboard",
+            icon: <DashboardOutlined />,
+            label: <Link to="/admin">Tổng quan</Link>,
+
+        },
+        {
+            key: "info-company",
+            icon: <UserOutlined />,
+            label: <Link to="/info-company">Thông tin công ty</Link>,
+
+        },
+        {
+            key: "job-manage",
+            icon: <UnorderedListOutlined />,
+            label:  <Link to="/job-manage">Quản lý việc làm </Link>,
+
+        },
+        {
+            key: "cv-manage",
+            icon: <AuditOutlined />,
+            label: <Link to="/cv-manage">Quản lý CV</Link>,
+
+        },
+    ];
+
+    return (
+        <>
+            <>
+                <Menu
+                    theme="light"
+                    mode="inline"
+                    items={items}
+                    defaultOpenKeys={['dashboard']}
+                    defaultSelectedKeys={['dashboard']}
+                />
+            </>
+        </>
+    )
+}
+
+export default MenuSider;

src/components/PrivateRoutes/index.js

@@ -0,0 +1,17 @@
+import { Navigate, Outlet } from "react-router-dom";
+import { getCookie } from "../../helpers/cookies";
+
+const PrivateRoutes = () => {
+    const token = getCookie("token");
+    let isLogin = false;
+    if(token) {
+        isLogin = true;
+    }
+    return (
+        <>
+           {isLogin ? <Outlet /> : <Navigate to="/login" />}
+        </>
+    )
+}
+
+export default PrivateRoutes ;

src/helpers/cookies.js

@@ -0,0 +1,46 @@
+//Hàm lấy cookie
+export function getCookie(cname) {
+    var name = cname + "=";
+    var ca = document.cookie.split(";");
+    for (var i = 0; i < ca.length; i++) {
+    var c = ca[i];
+    while (c.charAt(0) === " ") {
+    c = c.substring(1);
+    }
+    if (c.indexOf(name) === 0) {
+    return c.substring(name.length, c.length);
+    }
+    }
+    return "";
+}    
+//Hết Hàm lấy cookie
+
+
+//Hàm tạo cookie
+export function setCookie(cname, cvalue, exdays) {
+    var d = new Date();
+    d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
+    var expires = "expires=" + d.toUTCString();
+    document.cookie = cname + "=" + cvalue + "; " + expires;
+}
+// Hết hàm tạo cookie
+
+
+//Hàm xóa cookie
+export function deleteCookie(cname) {
+    document.cookie = `${cname}=; expires=Thu, 01 Jan 1970 00:00:00 UTC`;
+}    
+//Hết Hàm xóa cookie
+
+//Xóa hết cookie
+export function deleteAllCookies() {
+    const cookies = document.cookie.split(";");
+
+    for(let i = 0; i < cookies.length; i++){
+        const cookie =  cookies[i];
+        const eqPos = cookies.indexOf("=");
+        const name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie;
+        document.cookie = name + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT";
+    }
+}
+//Hết phần  Xóa hết cookie

src/helpers/generate.js

@@ -0,0 +1,12 @@
+export function generateToken() {
+    const characters = 
+    'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+    const length = 20;
+    let token = '';
+
+    for(let i = 0; i < length; i++){
+        token += characters.charAt(Math.floor(Math.random() * characters.length));
+    }
+
+    return token;
+}

src/index.js

@@ -3,12 +3,20 @@ import ReactDOM from 'react-dom/client';
 import './index.css';
 import App from './App';
 import reportWebVitals from './reportWebVitals';
+import { BrowserRouter } from "react-router-dom";
+import { createStore } from 'redux';
+import { allReducer } from './reducer';
+import { Provider } from "react-redux";
+
+const store = createStore(allReducer);
 
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
+  <BrowserRouter>
+     <Provider store={store}>
+        <App />
+      </Provider>
+  </BrowserRouter>
 );
 
 // If you want to start measuring performance in your app, pass a function

src/layouts/LayoutAdmin/LayoutAdmin.scss

@@ -0,0 +1,54 @@
+.layout-admin {
+  &__header {
+    height: 70px;
+    border-bottom: 1px solid #ddd;
+    background: #fff;
+    position: fixed !important;
+    top: 0;
+    z-index: 999;
+    display: flex;
+    align-items: center;
+    width: 100%;
+  }
+
+  &__logo {
+    width: 200px;
+    border-right: 1px solid #ddd;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all 0.2s;
+    height: 100%;
+
+    &--fold {
+      width: 80px;
+    }
+  }
+
+  &__nav {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    flex: 1;
+    padding: 0 20px;
+  }
+
+  &__sider {
+    position: fixed!important;
+    top: 70px;
+    left: 0;
+    height: calc(100vh - 70px);
+    border-right: 1px solid #ddd;
+  }
+
+  &__content {
+    padding: 25px;
+    margin-top: 70px;
+    margin-left: 200px;
+    transition: all 0.2s;
+
+    &--full {
+      margin-left: 80px;
+    }
+  }
+}