gitadmin/admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add product

Browse Source
This commit is contained in:
pawan-dot 2022-05-29 23:52:57 +05:30
parent 2d1d8a380d
commit 6606e405d3
17 changed files with 950 additions and 176 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -49,6 +49,7 @@
"prop-types": "^15.7.2", "prop-types": "^15.7.2",
"react": "^17.0.2", "react": "^17.0.2",
"react-app-polyfill": "^2.0.0", "react-app-polyfill": "^2.0.0",
"react-date-picker": "^8.4.0",
"react-dom": "^17.0.2", "react-dom": "^17.0.2",
"react-redux": "^7.2.6", "react-redux": "^7.2.6",
"react-router-dom": "^5.3.0", "react-router-dom": "^5.3.0",

2
public/index.html
View File

@ -23,7 +23,7 @@
<link rel="manifest" href="%PUBLIC_URL%/manifest.json"> <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico"> <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script> <!-- <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script> -->
<!-- <!--
Notice the use of %PUBLIC_URL% in the tags above. Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build. It will be replaced with the URL of the `public` folder during the build.

6
src/_nav.js
View File

@ -321,6 +321,12 @@ const _nav = [
], ],
}, },
{
component: CNavItem,
name: 'User Logs',
icon: <CIcon icon={cilUser} customClassName="nav-icon" />,
to: '/loginUser',
},
// { // {
// component: CNavGroup, // component: CNavGroup,

68
src/components/User/DailyLoggedUserData.js Normal file
View File

@ -0,0 +1,68 @@
import React, { useState, useEffect } from 'react'
import axios from 'axios'
import { Link } from 'react-router-dom';
const DailyLoggedUser = (item) => {
const [user, setUser] = useState(false);
const token = localStorage.getItem("authToken")
const id = item.item;
// console.log(id)
useEffect(() => {
const getData = async () => {
// console.log(id);
await axios.get(
`/api/user/getUser/${id}`,
{
headers: {
Authorization: `Bearer ${token}`,
},
},
).then(function (response) {
console.log(response.data.user)
setUser(response.data.user)
// console.log(user)
}).catch((error) => {
console.log(error.response)
})
}
getData()
}, [item])
//change time formate
function formatAMPM(date) {
var hours = new Date(date).getHours();
var minutes = new Date(date).getMinutes();
var ampm = hours >= 12 ? 'PM' : 'AM';
hours = hours % 12;
hours = hours ? hours : 12; // the hour '0' should be '12'
minutes = minutes < 10 ? '0' + minutes : minutes;
var strTime = hours + ':' + minutes + ' ' + ampm;
return strTime;
}
return (
<>
<tr>
<th scope="row">{user?._id}</th>
<td>{user?.name}</td>
<td>{new Date(`${user?.cafeLoginTime}`).toDateString()}<span> , {`${formatAMPM(user?.cafeLoginTime)}`}</span></td>
{/* new Date('2022-05-24T04:33:21.021Z').toUTCString() */}
{/* <td>@mdo</td> */}
</tr>
</>
)
}
export default DailyLoggedUser

94
src/components/User/LoginUser.js Normal file
View File

@ -0,0 +1,94 @@
import React, { useState, useEffect } from 'react'
import axios from 'axios'
import { Link } from 'react-router-dom'
import DailyLoggedUser from './DailyLoggedUserData'
const LoginUser = () => {
const id = localStorage.getItem('ownerId')
const token = localStorage.getItem("authToken")
const [users, setUsers] = useState([])
const [count, setCount] = useState()
// console.log(id)
useEffect(async () => {
await axios.get(
`/api/user/DailyLoginUserInCafe/${id}`,
{
headers: {
Authorization: `Bearer ${token}`,
},
},
).then(function (response) {
// console.log(response.data)
setUsers(response.data.Daily)
// let countNo = [];
// countNo.push(response.data.Daily)
// const a = (1 + countNo.length)
// setCount(a)
// let counter = 0;
// for (let i = 0; i <= count.length; i++) {
// counter++;
// }
}).catch((error) => {
console.log(error.message)
})
// console.log(count);
}, []);
return (
<>
<div className='mb-4'>
<Link to="/monthlylogin"><button type="button" className="btn btn-warning float-end mb-3 ml-4"> Last Month Visit Users</button></Link>
<Link to="/specificDateLoginUser"><button type="button" className="btn btn-info float-end mb-3 "> Specific Date Visit</button></Link>
</div>
<div>
<div>
<div><span className='mb-3 fs-4 fw-bolder'>Daily Cafe Visit User <button className="btn btn-dark mb-2 mr-3 ">{`Total Users ${users.length}`}</button></span>
<div>
<table className="table">
<thead className="thead-dark ">
<tr>
<th scope="col"> User ID</th>
<th scope="col">User Name</th>
<th scope="col">Login Time </th>
{/* <th scope="col">Handle</th> */}
</tr>
</thead>
<tbody>
{users && users.map((item, index) =>
<DailyLoggedUser item={item} key={index} />
)}
</tbody>
</table >
</div >
</div >
<div>
</div>
</div >
</div>
</>
)
}
export default LoginUser

68
src/components/User/MonthUserData.js Normal file
View File

@ -0,0 +1,68 @@
import React, { useState, useEffect } from 'react'
import axios from 'axios'
const MonthUserDara = (item) => {
const [loginUser, setLoginUser] = useState(false);
const token = localStorage.getItem("authToken")
const id = item.item;
// console.log(id)
useEffect(() => {
const getData = async () => {
// console.log(id);
await axios.get(
`/api/user/getUser/${id}`,
{
headers: {
Authorization: `Bearer ${token}`,
},
},
).then(function (response) {
console.log(response.data.user)
setLoginUser(response.data.user)
// console.log(user)
}).catch((error) => {
console.log(error.response)
})
}
getData()
}, [item])
//change time formate
function formatAMPM(date) {
var hours = new Date(date).getHours();
var minutes = new Date(date).getMinutes();
var ampm = hours >= 12 ? 'PM' : 'AM';
hours = hours % 12;
hours = hours ? hours : 12; // the hour '0' should be '12'
minutes = minutes < 10 ? '0' + minutes : minutes;
var strTime = hours + ':' + minutes + ' ' + ampm;
return strTime;
}
return (
<>
{loginUser &&
<tr>
<th scope="row">{loginUser?._id}</th>
<td>{loginUser?.name}</td>
{ }
<td>{new Date(`${loginUser?.cafeLoginTime}`).toDateString()}<span> , {`${formatAMPM(loginUser?.cafeLoginTime)}`}</span></td>
{/* new Date('2022-05-24T04:33:21.021Z').toUTCString() */}
{/* <td>@mdo</td> */}
</tr>
}
</>
)
}
export default MonthUserDara

74
src/components/User/MothlyLoginUser.js Normal file
View File

@ -0,0 +1,74 @@
import React, { useState, useEffect } from 'react'
import axios from 'axios'
import MonthUserData from './MonthUserData';
const MothlyLoginUser = () => {
// const [users, setUsers] = useState(false);
const id = localStorage.getItem('ownerId')
const [monthlyUsers, setMonthlyUsers] = useState(false);
const token = localStorage.getItem("authToken")
const [mcount, setMcount] = useState()
// console.log(id)
useEffect(async () => {
await axios.get(
`/api/user/DailyLoginUserInCafe/${id}`,
{
headers: {
Authorization: `Bearer ${token}`,
},
},
).then(function (response) {
// console.log(response.data.MonthlyUser)
setMonthlyUsers(response.data.MonthlyUser)
}).catch((error) => {
console.log(error.message)
})
}, [])
//change time formate
// console.log(monthlyUsers.length)
// const a = console.log(a)
return (
<>
<div>
<div>
<div>
<span className='mb-3 fs-4 fw-bolder'>Mothaly Cafe Visit User </span>
<button className="btn btn-dark mb-2 float-end">{`Total Users ${monthlyUsers.length}`}</button>
<div>
<table className="table">
<thead className="thead-dark ">
<tr>
<th scope="col"> User ID</th>
<th scope="col">User Name</th>
<th scope="col">Login Time </th>
{/* <th scope="col">Handle</th> */}
</tr>
</thead>
<tbody>
{monthlyUsers && monthlyUsers.map((item, index) =>
<MonthUserData item={item} key={index} />
)}
</tbody>
</table>
</div>
</div>
<div>
</div>
</div>
</div>
</>
)
}
export default MothlyLoginUser

79
src/components/User/SpecificDate.js Normal file
View File

@ -0,0 +1,79 @@
import React, { useState } from 'react'
import axios from 'axios'
import DatePicker from 'react-date-picker';
import SpecificDateData from './SpecificDateData';
const SpecificDate = () => {
const id = localStorage.getItem('ownerId')
const token = localStorage.getItem("authToken")
const [specificUsers, setSpecificUsers] = useState([])
const [value, setOnChange] = useState(new Date());
const handleChange = (e) => {
axios.post(
`/api/user/getUsersInCafeSpecificDate/${id}`,
{ date: e },
{
headers: {
Authorization: `Bearer ${token}`,
},
},
).then(function (response) {
console.log(response.data)
setSpecificUsers(response.data.unique)
// console.log(users)
}).catch((error) => {
console.log(error.message)
})
}
console.log(value)
console.log(specificUsers.length)
return (
<> <div className='mb-4'>
<span className='fs-6 fw-bolder mb-0'>Specific Date Visit's : <DatePicker onChange={(e) => { setOnChange(e); handleChange(e) }} value={value} /></span>
<button className="btn btn-dark float-end mr-4">{`Total Users ${specificUsers.length}`}</button>
</div>
<div>
<div>
<div><span className='mb-3 fs-4 fw-bolder'>Specific Date Visit User In Cafe </span>
<div>
<table className="table">
<thead className="thead-dark ">
<tr>
<th scope="col"> User ID</th>
<th scope="col">User Name</th>
<th scope="col">Login Time </th>
{/* <th scope="col">Handle</th> */}
</tr>
</thead>
<tbody>
{specificUsers && specificUsers.map((item, index) =>
<SpecificDateData item={item} key={index} />
)}
</tbody>
</table >
</div >
</div >
<div>
</div>
</div >
</div>
</>
)
}
export default SpecificDate

67
src/components/User/SpecificDateData.js Normal file
View File

@ -0,0 +1,67 @@
import React, { useState, useEffect } from 'react'
import axios from 'axios'
const SpecificDateData = (item) => {
const [specificDate, setSpecificDate] = useState(false);
const token = localStorage.getItem("authToken")
const id = item.item;
// console.log(id)
useEffect(() => {
const getData = async () => {
// console.log(id);
await axios.get(
`/api/user/getUser/${id}`,
{
headers: {
Authorization: `Bearer ${token}`,
},
},
).then(function (response) {
console.log(response.data.user)
setSpecificDate(response.data.user)
// console.log(user)
}).catch((error) => {
console.log(error.response)
})
}
getData()
}, [item])
//change time formate
function formatAMPM(date) {
var hours = new Date(date).getHours();
var minutes = new Date(date).getMinutes();
var ampm = hours >= 12 ? 'PM' : 'AM';
hours = hours % 12;
hours = hours ? hours : 12; // the hour '0' should be '12'
minutes = minutes < 10 ? '0' + minutes : minutes;
var strTime = hours + ':' + minutes + ' ' + ampm;
return strTime;
}
return (
<>
{specificDate &&
<tr>
<th scope="row">{specificDate?._id}</th>
<td>{specificDate?.name}</td>
{ }
<td>{new Date(`${specificDate?.cafeLoginTime}`).toDateString()}<span> , {`${formatAMPM(specificDate?.cafeLoginTime)}`}</span></td>
{/* new Date('2022-05-24T04:33:21.021Z').toUTCString() */}
{/* <td>@mdo</td> */}
</tr>
}
</>
)
}
export default SpecificDateData

2
src/data.js
View File

@ -1,6 +1,6 @@
// export const API = "https://mantur-server.herokuapp.com"; // export const API = "https://mantur-server.herokuapp.com";
// export const API = "https://api.tellytell.com"; // export const API = "https://api.tellytell.com";
// export const API = "http://localhost:5000"; export const API = "http://localhost:5000";
// export const API = "https://popstoreeee.herokuapp.com"; // export const API = "https://popstoreeee.herokuapp.com";
import { useEffect } from 'react'; import { useEffect } from 'react';

9
src/index.js
View File

@ -1,9 +1,4 @@
// import 'bootstrap/dist/css/bootstrap.min.css';
// import "bootstrap/dist/js/bootstrap.js";
// import "bootstrap";
// import "bootstrap/dist/css/bootstrap.css";
// import "bootstrap/dist/js/bootstrap.js";
import 'react-app-polyfill/stable' import 'react-app-polyfill/stable'
import 'core-js' import 'core-js'
import React from 'react' import React from 'react'
@ -15,8 +10,8 @@ import store from './store'
import axios from 'axios' import axios from 'axios'
const setupAxios = () => { const setupAxios = () => {
axios.defaults.baseURL = 'https://dating-api-server.herokuapp.com'; // axios.defaults.baseURL = 'https://dating-api-server.herokuapp.com';
//axios.defaults.baseURL = 'http://localhost:5000' axios.defaults.baseURL = 'http://localhost:5000'
axios.defaults.headers = { axios.defaults.headers = {
'Cache-Control': 'no-cache,no-store', 'Cache-Control': 'no-cache,no-store',
'Pragma': 'no-cache', 'Pragma': 'no-cache',

14
src/routes.js
View File

@ -1,6 +1,13 @@
import React from 'react' import React from 'react'
import Products from './views/Commerce/Products' import Products from './views/Commerce/Products'
import EditProducts from './views/Commerce/Editproducts' import EditProducts from './views/Commerce/Editproducts'
import LoginUser from './components/User/LoginUser'
//user logged property
import MothlyLoginUser from './components/User/MothlyLoginUser'
import SpecificDate from './components/User/SpecificDate'
import AddProduct from './views/Commerce/AddProduct'
// import EditProducts from './views/Commerce/Editproducts'
const AirwaysBill = React.lazy(() => import('./views/AirwaysBill/AirwaysBill')) const AirwaysBill = React.lazy(() => import('./views/AirwaysBill/AirwaysBill'))
const EditBill = React.lazy(() => import('./views/AirwaysBill/EditBill')) const EditBill = React.lazy(() => import('./views/AirwaysBill/EditBill'))
@ -68,14 +75,21 @@ const Toasts = React.lazy(() => import('./views/notifications/toasts/Toasts'))
const Widgets = React.lazy(() => import('./views/widgets/Widgets')) const Widgets = React.lazy(() => import('./views/widgets/Widgets'))
const routes = [ const routes = [
{ path: '/', exact: true, name: 'Home' }, { path: '/', exact: true, name: 'Home' },
{ path: '/register', name: 'Change Password', component: Register }, { path: '/register', name: 'Change Password', component: Register },
{ path: '/edit', name: 'Change Password', component: EditProfile }, { path: '/edit', name: 'Change Password', component: EditProfile },
{ path: '/profile', name: 'Change Password', component: Profile }, { path: '/profile', name: 'Change Password', component: Profile },
//product route //product route
{ path: '/addproduct', name: 'Product Edit', component: AddProduct },
{ path: '/comproducts/edit/:id', name: 'Product Edit', component: EditProducts }, { path: '/comproducts/edit/:id', name: 'Product Edit', component: EditProducts },
{ path: '/comproducts', name: 'Courier Products', component: Products }, { path: '/comproducts', name: 'Courier Products', component: Products },
//user
{ path: '/specificDateLoginUser', name: ' Monthly Logged in User', component: SpecificDate },
{ path: '/monthlylogin', name: ' Monthly Logged in User', component: MothlyLoginUser },
{ path: '/loginUser', name: 'Logged in User', component: LoginUser },
, ,
//// ////
{ path: '/courier', name: 'Courier', component: Courier }, { path: '/courier', name: 'Courier', component: Courier },

300
src/views/Commerce/AddProduct.js Normal file
View File

@ -0,0 +1,300 @@
import axios from "axios";
import React, { useCallback, useEffect, useState } from "react";
import { API } from "../../data";
import { isAutheticated } from "../../auth";
import ClipLoader from "react-spinners/ClipLoader";
//import Footer from "../../Footer";
import { Link } from "react-router-dom";
import { useHistory } from "react-router-dom";
import swal from 'sweetalert';
const AddProduct = () => {
const { token } = isAutheticated();
let history = useHistory();
const [state, setstate] = useState({
title: "",
description: "",
status: "",
tax: "",
price: "",
taxes: [],
loading: false,
});
const { title, description, status, tax, price, taxes, loading } = state;
const changeState = (newState) =>
setstate((prevState) => ({ ...prevState, ...newState }));
const fetchTax = useCallback(async () => {
let res = await axios.get(`${API}/api/tax/view_tax`, {
headers: {
Authorization: `Bearer ${token}`,
},
});
if (res.status === 200) changeState({ taxes: res.data });
}, [token]);
useEffect(() => {
fetchTax();
}, [fetchTax]);
const handleSubmit = async () => {
if (!(title || description || tax || price)) {
alert("Please fill required field ");
return;
}
changeState({ loading: true });
let res = await axios.post(
`${API}/api/product`,
{
title,
description,
status,
tax: taxes.find((taxObj) => taxObj.name === tax)?._id,
price,
},
{
headers: {
Authorization: `Bearer ${token}`,
},
}
);
if (res.status === 200) {
swal("success!", "Product Added Successfully!", "success");
history.goBack();
}
changeState({ loading: false });
};
//
const onCancel = () => {
// window.location = "/comproducts";
history.goBack()
};
const handleChange = (e) => {
const { name, value } = e.target;
changeState({ [name]: value });
};
return (
<>
<div className="main-content">
<div className="page-content">
<div className="container-fluid">
{/* <!-- start page title --> */}
<div className="row">
<div className="col-12">
<div className="page-title-box d-flex align-items-center justify-content-between">
<h4 className="mb-0">Add New Product</h4>
<div className="page-title-right">
<ol className="breadcrumb m-0">
<li className="breadcrumb-item">
<Link to="/dashboard">Dating App</Link>
</li>
<li className="breadcrumb-item active">Commerce</li>
<li className="breadcrumb-item active">Add New Product</li>
</ol>
</div>
</div>
</div>
</div>
{/* <!-- end page title --> */}
{/* <!-- Save options Begins--> */}
<div className="row">
<div className="col-12">
<div className="form-group text-right">
<button
onClick={handleSubmit}
type="button"
className="btn btn-success btn-login waves-effect waves-light mr-3"
>
<ClipLoader loading={loading} size={18} />
{!loading && "Save"}
</button>
<button
onClick={onCancel}
type="button"
className="btn btn-warning btn-cancel waves-effect waves-light mr-3"
>
Cancel
</button>
</div>
</div>
</div>
{/* <!-- Save options Ends--> */}
{/* <!-- Row 1 Begins --> */}
<div className="row">
{/* <!--Left Column Begins--> */}
<div className="col-lg-8">
<div className="card">
<div className="card-body">
<div className="row">
<div className="col-md-12">
<form>
<div className="row">
<div className="col-lg-12">
<div className="form-group">
<label
for="basicpill-phoneno-input"
className="label-100"
>
Title*
</label>
<input
type="text"
name="title"
value={title}
className="form-control input-field"
onChange={handleChange}
placeholder="Title"
/>
</div>
</div>
</div>
<div className="row">
<div className="col-lg-12">
<div className="form-group mb-30 width-100 row">
<label className="col-md-4 control-label">
Description
</label>
<div className="col-md-13">
<textarea
value={description}
onChange={handleChange}
name="description"
className="form-control input-field"
rows="5"
placeholder="Add description"
></textarea>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{/* <!-- Left Column Ends --> */}
{/* <!--Right Column Begins --> */}
<div className="col-lg-4">
<div className="card">
<div className="card-body">
<div className="row">
<div className="col-md-12">
<form>
<div className="row">
<div className="col-lg-12">
<div className="form-group">
<label
for="basicpill-phoneno-input"
className="label-100"
>
Select Tax*
</label>
<select
name="tax"
value={tax}
onChange={({ target: { value } }) =>
changeState({ tax: value })
}
className="form-control input-field"
>
<option value="">--select--</option>
{taxes?.map(({ name, tax }) => (
<option value={name}>
{name}&nbsp;{tax}%
bvb
</option>
))}
</select>
</div>
</div>
</div>
<div className="row">
<div className="col-lg-12">
<div className="form-group">
<label
for="basicpill-phoneno-input"
className="label-100"
>
Status*
</label>
<select
name="status"
value={status}
onChange={handleChange}
className="form-control input-field"
>
<option value="">--select--</option>
<option value={true}>Active</option>
<option value={false}>Inactive</option>
</select>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{/* <!--Right Column Ends --> */}
</div>
<div className="row">
{/* <!--Left Column Begins--> */}
<div className="col-lg-8">
<div className="card">
<div className="card-body">
<div className="row">
<div className="col-md-12">
<form>
<div className="row">
<div className="col-lg-4">
<div className="form-group">
<label
for="basicpill-phoneno-input"
className="label-100"
>
Price*
</label>
<input
type="text"
name="price"
onChange={handleChange}
className="form-control input-field"
/>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{/* <!-- Left Column Ends --> */}
</div>
</div>
{/* <!-- container-fluid --> */}
</div>
{/* <!-- End Page-content --> */}
{/* <Footer /> */}
</div>
</>
)
}
export default AddProduct

4
src/views/Commerce/Editproducts.js
View File

@ -141,7 +141,7 @@ function EditProducts() {
<button <button
onClick={handleSubmit} onClick={handleSubmit}
type="button" type="button"
className="btn btn-warning mt-3 mb-0 my-1 btn btn-success btn-login waves-effect waves-light mr-1" className="btn btn-success mt-3 mb-0 my-1 btn btn-success btn-login waves-effect waves-light mr-1"
> >
<ClipLoader loading={loading} size={18} /> <ClipLoader loading={loading} size={18} />
{!loading && "Save"} {!loading && "Save"}
@ -149,7 +149,7 @@ function EditProducts() {
<button <button
onClick={onCancel} onClick={onCancel}
type="button" type="button"
className=" mt-3 ml-2 btn btn-success btn-cancel waves-effect waves-light mr-3" className=" mt-3 ml-2 btn btn-warning btn-cancel waves-effect waves-light mr-3"
> >
Cancel Cancel
</button> </button>

322
src/views/Commerce/Products.js
View File

@ -5,104 +5,106 @@ import { Link } from "react-router-dom";
import { isAutheticated } from "../../auth"; import { isAutheticated } from "../../auth";
function Products() { function Products() {
const [state, setState] = useState({ const [state, setState] = useState({
products: [], products: [],
page: 1, page: 1,
limit: 10, limit: 10,
totalProducts: 0, totalProducts: 0,
pages: 1, pages: 1,
});
window.scrollTo({ behavior: "smooth", top: "0px" });
const { products, page, limit, totalProducts, pages } = state;
const changeState = (newState) =>
setState((prevState) => ({ ...prevState, ...newState }));
const { token } = isAutheticated();
const getProducts = useCallback(async () => {
let res = await axios.get(
`/api/product?page=${page}&limit=${limit}`,
{
headers: {
Authorization: `Bearer ${token}`,
},
}
);
// console.log(res)
changeState({
...res.data,
pages: Math.ceil(res.data.totalProducts / limit),
});
}, [limit, page, token]);
useEffect(() => {
getProducts();
}, [getProducts]);
const getTotalPages = useMemo(() => {
const length = pages > 1 ? pages : totalProducts ? 1 : 0;
return Array.from({ length }, (_, i) => i + 1);
}, [pages, totalProducts]);
// console.log(getTotalPages);
const handleDelete = async (id) => {
let status = window.confirm("Do you want to delete");
if (!status) return;
let res = await axios.delete(`/api/product/${id}`, {
headers: {
Authorization: `Bearer ${token}`,
},
}); });
window.scrollTo({ behavior: "smooth", top: "0px" }); if (res.status === 200) window.location.reload();
};
const { products, page, limit, totalProducts, pages } = state; const toggleStatus = async (id) => {
let status = window.confirm("Do you want to delete");
if (!status) {
return;
}
let res = await axios.get(`/api/product/setStatus/${id}`, {
headers: {
Authorization: `Bearer ${token}`,
},
});
if (res.status === 200) window.location.reload();
};
const changeState = (newState) => return (
setState((prevState) => ({ ...prevState, ...newState })); <div className=" main-content">
<div className=" my-3 page-content">
<div className="container-fluid">
{/* <!-- start page title --> */}
<div className="row">
<div className="col-12">
<div className="page-title-box d-flex align-items-center justify-content-between">
<h4 className="mb-3">Commerce - Products</h4>
<Link to="/addproduct"><button type="button" className="btn btn-info float-end mb-3 ml-4"> + Add Product</button></Link>
<div className="page-title-right">
<ol className="breadcrumb m-0">
<li className="breadcrumb-item">
<Link to="/dashboard">Dating App</Link>
</li>
<li className="breadcrumb-item">Commerce - Products</li>
</ol>
</div>
</div>
</div>
</div>
{/* <!-- end page title --> */}
const { token } = isAutheticated(); <div className="row">
<div className="col-lg-12">
const getProducts = useCallback(async () => { <div className="card">
let res = await axios.get( <div className="card-body">
`/api/product?page=${page}&limit=${limit}`, <div className="row ml-0 mr-0 mb-10">
{ {/* <div className="col-sm-12 col-md-6">
headers: {
Authorization: `Bearer ${token}`,
},
}
);
changeState({
...res.data,
pages: Math.ceil(res.data.totalProducts / limit),
});
}, [limit, page, token]);
useEffect(() => {
getProducts();
}, [getProducts]);
const getTotalPages = useMemo(() => {
const length = pages > 1 ? pages : totalProducts ? 1 : 0;
return Array.from({ length }, (_, i) => i + 1);
}, [pages, totalProducts]);
// console.log(getTotalPages);
const handleDelete = async (id) => {
let status = window.confirm("Do you want to delete");
if (!status) return;
let res = await axios.delete(`/api/product/${id}`, {
headers: {
Authorization: `Bearer ${token}`,
},
});
if (res.status === 200) window.location.reload();
};
const toggleStatus = async (id) => {
let status = window.confirm("Do you want to delete");
if (!status) {
return;
}
let res = await axios.get(`/api/product/setStatus/${id}`, {
headers: {
Authorization: `Bearer ${token}`,
},
});
if (res.status === 200) window.location.reload();
};
return (
<div className=" main-content">
<div className=" my-3 page-content">
<div className="container-fluid">
{/* <!-- start page title --> */}
<div className="row">
<div className="col-12">
<div className="page-title-box d-flex align-items-center justify-content-between">
<h4 className="mb-3">Commerce - Products</h4>
<div className="page-title-right">
<ol className="breadcrumb m-0">
<li className="breadcrumb-item">
<Link to="/dashboard">Dating App</Link>
</li>
<li className="breadcrumb-item">Commerce - Products</li>
</ol>
</div>
</div>
</div>
</div>
{/* <!-- end page title --> */}
<div className="row">
<div className="col-lg-12">
<div className="card">
<div className="card-body">
<div className="row ml-0 mr-0 mb-10">
{/* <div className="col-sm-12 col-md-6">
<div className="dataTables_length"> <div className="dataTables_length">
<label className="w-100"> <label className="w-100">
Show{" "} Show{" "}
@ -121,7 +123,7 @@ function Products() {
</label> </label>
</div> </div>
</div> */} </div> */}
{/* <div className="col-sm-12 col-md-6"> {/* <div className="col-sm-12 col-md-6">
<div className="dropdown d-block"> <div className="dropdown d-block">
<a href="/comproducts/add"> <a href="/comproducts/add">
<button <button
@ -134,68 +136,68 @@ function Products() {
</a> </a>
</div> </div>
</div> */} </div> */}
</div> </div>
<div className="table-responsive table-shoot"> <div className="table-responsive table-shoot">
<table className="table table-centered table-nowrap mb-0"> <table className="table table-centered table-nowrap mb-0">
<thead className="thead-light"> <thead className="thead-light">
<tr> <tr>
<th>Name</th> <th>Name</th>
<th>Price</th> <th>Price</th>
<th>Status</th> <th>Status</th>
<th>Actions</th> <th>Actions</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{products.map( {products.map(
({ title, _id, price, status }) => ({ title, _id, price, status }) =>
title && ( title && (
<tr key={_id}> <tr key={_id}>
<td>{title}</td> <td>{title}</td>
<td>{price}</td> <td>{price}</td>
<td> <td>
<span <span
className={`badge badge-pill badge-soft-${status ? "success" : "danger" className={`badge rounded-pill bg-${status ? "success" : "danger"
} font-size-13`} } font-size-10`}
> >
{status ? "Live" : "Suspended"} {status ? "Live" : "Suspended"}
</span> </span>
</td> </td>
<td> <td>
<button <button
type="button" type="button"
className={`btn btn-${status ? "danger" : "success" className={`btn btn-${status ? "danger" : "success"
} btn-sm waves-effect waves-light btn-table`} } btn-sm waves-effect waves-light btn-table ml-2`}
onClick={() => toggleStatus(_id)} onClick={() => toggleStatus(_id)}
> >
{status ? "Suspend" : "Activate"} {status ? "Suspend" : "Activate"}
</button> </button>
<Link to={`/comproducts/edit/${_id}`}> <Link to={`/comproducts/edit/${_id}`}>
<button <button
type="button" type="button"
className=" mx-2 btn btn-primary btn-sm waves-effect waves-light btn-table ml-2" className=" mx-2 btn btn-primary btn-sm waves-effect waves-light btn-table ml-2"
> >
Edit Edit
</button> </button>
</Link> </Link>
<button <button
type="button" type="button"
onClick={() => handleDelete(_id)} onClick={() => handleDelete(_id)}
className=" btn btn-danger btn-sm waves-effect waves-light btn-table ml-2" className=" btn btn-danger btn-sm waves-effect waves-light btn-table ml-2"
id="sa-params" id="sa-params"
> >
Delete Delete
</button> </button>
</td> </td>
</tr> </tr>
) )
)} )}
</tbody> </tbody>
</table> </table>
</div> </div>
{/* <div className="row mt-20"> {/* <div className="row mt-20">
<div className="col-sm-12 col-md-6 mb-20"> <div className="col-sm-12 col-md-6 mb-20">
<div <div
className="dataTables_info" className="dataTables_info"
@ -274,16 +276,16 @@ function Products() {
</div> </div>
</div> */} </div> */}
{/* <!-- end table-responsive --> */} {/* <!-- end table-responsive --> */}
</div>
</div>
</div>
</div>
</div> </div>
{/* <!-- container-fluid --> */} </div>
</div> </div>
</div>
</div> </div>
); {/* <!-- container-fluid --> */}
</div>
</div>
);
} }
export default Products; export default Products;

13
src/views/Profile/Profile.js
View File

@ -20,7 +20,7 @@ const Profile = () => {
const [user, setUser] = useState({}); const [user, setUser] = useState({});
const { token } = isAutheticated(); const { token } = isAutheticated();
const history = useHistory() const history = useHistory()
console.log(token); // console.log(token);
useEffect(async () => { useEffect(async () => {
let res = await axios.get('/owner', { let res = await axios.get('/owner', {
headers: { headers: {
@ -28,13 +28,15 @@ const Profile = () => {
} }
}) })
if (res) { if (res) {
// console.log(res.data.user._id)
localStorage.setItem('ownerId', res.data.user._id)
setUser(res.data.user) setUser(res.data.user)
} }
console.log(res); // console.log(res);
}, []) }, [])
console.log(user); // console.log(user);
return ( return (
<div> <div>
<CRow> <CRow>
@ -42,10 +44,11 @@ const Profile = () => {
<h1>Profile</h1> <h1>Profile</h1>
</CCol> </CCol>
<CCol> <CCol>
<CButton color='dark' onClick={() => history.push('/edit')}>Edit Profile</CButton> <CButton color='dark'
className="float-right" onClick={() => history.push('/edit')}>Edit Profile</CButton>
</CCol> </CCol>
</CRow> </CRow>
<CTable color="dark" striped> <CTable color="white" striped>
<CTableHead> <CTableHead>
<CTableRow> <CTableRow>
<CTableHeaderCell scope="col">Cafe Name</CTableHeaderCell> <CTableHeaderCell scope="col">Cafe Name</CTableHeaderCell>

3
src/views/pages/login/Login.js
View File

@ -33,10 +33,13 @@ const Login = () => {
const Login = async () => { const Login = async () => {
const res = await axios.post("/owner/signin", auth); const res = await axios.post("/owner/signin", auth);
if (res.data.status == "ok") { if (res.data.status == "ok") {
localStorage.setItem("authToken", res.data.token)
console.log(res.data)
localStorage.setItem("auth", JSON.stringify({ localStorage.setItem("auth", JSON.stringify({
user: res.data.user, user: res.data.user,
token: res.data.token, token: res.data.token,
})); }));
history.push('/dashboard') history.push('/dashboard')