first commit
This commit is contained in:
DESKTOP-GBA0BK8\Admin
@@ -0,0 +1,45 @@
|
||||
import React from 'react';
|
||||
import Grid from "@mui/material/Grid";
|
||||
import ShoppingCart from '@/components/eCommerce/Cart/ShoppingCart';
|
||||
import OrderSummary from '@/components/eCommerce/Cart/OrderSummary';
|
||||
import HaveAPromoCode from '@/components/eCommerce/Cart/HaveAPromoCode';
|
||||
import Link from 'next/link';
|
||||
import styles from '@/styles/PageTitle.module.css'
|
||||
|
||||
const Cart = () => {
|
||||
return (
|
||||
<>
|
||||
{/* Page title */}
|
||||
<div className={styles.pageTitle}>
|
||||
<h1>Cart</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Dashboard</Link>
|
||||
</li>
|
||||
<li>Cart</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<Grid
|
||||
container
|
||||
rowSpacing={1}
|
||||
columnSpacing={{ xs: 1, sm: 1, md: 1, lg: 1, xl: 2 }}
|
||||
>
|
||||
<Grid item xs={12} md={12} lg={12} xl={8}>
|
||||
{/* ShoppingCart */}
|
||||
<ShoppingCart />
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={12} lg={12} xl={4}>
|
||||
{/* OrderSummary */}
|
||||
<OrderSummary />
|
||||
|
||||
{/* HaveAPromoCode */}
|
||||
<HaveAPromoCode />
|
||||
</Grid>
|
||||
</Grid>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Cart;
|
||||
@@ -0,0 +1,41 @@
|
||||
import React from 'react';
|
||||
import Grid from "@mui/material/Grid";
|
||||
import ShoppingCart from '@/components/eCommerce/Checkout/ShoppingCart';
|
||||
import BillingInformation from '@/components/eCommerce/Checkout/BillingInformation';
|
||||
import Link from 'next/link';
|
||||
import styles from '@/styles/PageTitle.module.css'
|
||||
|
||||
const Checkout = () => {
|
||||
return (
|
||||
<>
|
||||
{/* Page title */}
|
||||
<div className={styles.pageTitle}>
|
||||
<h1>Checkout</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Dashboard</Link>
|
||||
</li>
|
||||
<li>Checkout</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<Grid
|
||||
container
|
||||
rowSpacing={1}
|
||||
columnSpacing={{ xs: 1, sm: 1, md: 1, lg: 1, xl: 2 }}
|
||||
>
|
||||
<Grid item xs={12} md={5} lg={5} xl={4}>
|
||||
{/* ShoppingCart */}
|
||||
<ShoppingCart />
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={7} lg={7} xl={8}>
|
||||
{/* BillingInformation */}
|
||||
<BillingInformation />
|
||||
</Grid>
|
||||
</Grid>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Checkout;
|
||||
@@ -0,0 +1,384 @@
|
||||
import * as React from "react";
|
||||
import { Box } from "@mui/material";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import { Typography } from "@mui/material";
|
||||
import Button from "@mui/material/Button";
|
||||
import TextField from "@mui/material/TextField";
|
||||
import AddIcon from "@mui/icons-material/Add";
|
||||
import InputLabel from '@mui/material/InputLabel';
|
||||
import MenuItem from '@mui/material/MenuItem';
|
||||
import FormControl from '@mui/material/FormControl';
|
||||
import Select from '@mui/material/Select';
|
||||
import Link from 'next/link';
|
||||
import styles from '@/styles/PageTitle.module.css'
|
||||
|
||||
import dynamic from 'next/dynamic'
|
||||
const RichTextEditor = dynamic(() => import('@mantine/rte'), {
|
||||
ssr: false,
|
||||
})
|
||||
|
||||
const CreateProduct = () => {
|
||||
const handleSubmit = (event) => {
|
||||
event.preventDefault();
|
||||
const data = new FormData(event.currentTarget);
|
||||
console.log({
|
||||
email: data.get("email"),
|
||||
password: data.get("password"),
|
||||
});
|
||||
};
|
||||
|
||||
// Select dropdown
|
||||
const [categorySelect, setCategorySelect] = React.useState('');
|
||||
const handleChange = (event) => {
|
||||
setCategorySelect(event.target.value);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* Page title */}
|
||||
<div className={styles.pageTitle}>
|
||||
<h1>Create Product</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Dashboard</Link>
|
||||
</li>
|
||||
<li>Create Product</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<Box component="form" noValidate onSubmit={handleSubmit}>
|
||||
<Box
|
||||
sx={{
|
||||
background: "#fff",
|
||||
padding: "30px 20px",
|
||||
borderRadius: "8px",
|
||||
mb: "15px"
|
||||
}}
|
||||
className="bg-black"
|
||||
>
|
||||
<Typography as="h4" fontWeight="500" fontSize="18px" mb="10px">
|
||||
Create Product
|
||||
</Typography>
|
||||
|
||||
<Grid container alignItems="center" spacing={2}>
|
||||
<Grid item xs={12} md={12} lg={6}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Product Name
|
||||
</Typography>
|
||||
<TextField
|
||||
autoComplete="product-name"
|
||||
name="productName"
|
||||
required
|
||||
fullWidth
|
||||
id="productName"
|
||||
label="Product Name"
|
||||
autoFocus
|
||||
InputProps={{
|
||||
style: { borderRadius: 8 },
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={12} lg={6}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Short Description
|
||||
</Typography>
|
||||
<TextField
|
||||
autoComplete="short-description"
|
||||
name="Short Description"
|
||||
required
|
||||
fullWidth
|
||||
id="Short Description"
|
||||
label="Short Description"
|
||||
autoFocus
|
||||
InputProps={{
|
||||
style: { borderRadius: 8 },
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Category
|
||||
</Typography>
|
||||
|
||||
<FormControl fullWidth>
|
||||
<InputLabel id="demo-simple-select-label">Select</InputLabel>
|
||||
<Select
|
||||
labelId="demo-simple-select-label"
|
||||
id="demo-simple-select"
|
||||
value={categorySelect}
|
||||
label="Category"
|
||||
onChange={handleChange}
|
||||
>
|
||||
<MenuItem value={10}>Laptop</MenuItem>
|
||||
<MenuItem value={20}>Camera</MenuItem>
|
||||
<MenuItem value={30}>Smart Watch</MenuItem>
|
||||
<MenuItem value={30}>iPhone</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={12} lg={6}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Price
|
||||
</Typography>
|
||||
<TextField
|
||||
autoComplete="price"
|
||||
name="price"
|
||||
required
|
||||
fullWidth
|
||||
id="price"
|
||||
label="$0"
|
||||
type="number"
|
||||
autoFocus
|
||||
InputProps={{
|
||||
style: { borderRadius: 8 },
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={12} lg={6}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Discount Price
|
||||
</Typography>
|
||||
<TextField
|
||||
autoComplete="discount-price"
|
||||
name="DiscountPrice"
|
||||
required
|
||||
fullWidth
|
||||
id="DiscountPrice"
|
||||
label="$0"
|
||||
type="number"
|
||||
autoFocus
|
||||
InputProps={{
|
||||
style: { borderRadius: 8 },
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Stock
|
||||
</Typography>
|
||||
<TextField
|
||||
autoComplete="stock"
|
||||
name="stock"
|
||||
required
|
||||
fullWidth
|
||||
id="stock"
|
||||
label="5"
|
||||
autoFocus
|
||||
InputProps={{
|
||||
style: { borderRadius: 8 },
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Product Description
|
||||
</Typography>
|
||||
|
||||
<RichTextEditor
|
||||
id="rte"
|
||||
controls={[
|
||||
['bold', 'italic', 'underline', 'link', 'image'],
|
||||
['unorderedList', 'h1', 'h2', 'h3'],
|
||||
['sup', 'sub'],
|
||||
['alignLeft', 'alignCenter', 'alignRight'],
|
||||
]}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Meta Title
|
||||
</Typography>
|
||||
<TextField
|
||||
autoComplete="meta-title"
|
||||
name="metaTitle"
|
||||
required
|
||||
fullWidth
|
||||
id="metaTitle"
|
||||
label="Meta Title"
|
||||
autoFocus
|
||||
InputProps={{
|
||||
style: { borderRadius: 8 },
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Meta Keywords
|
||||
</Typography>
|
||||
<TextField
|
||||
autoComplete="meta-keywords"
|
||||
name="metaKeywords"
|
||||
required
|
||||
fullWidth
|
||||
id="metaKeywords"
|
||||
label="Meta Keywords"
|
||||
autoFocus
|
||||
InputProps={{
|
||||
style: { borderRadius: 8 },
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Meta Description
|
||||
</Typography>
|
||||
|
||||
<RichTextEditor
|
||||
id="rte"
|
||||
controls={[
|
||||
['bold', 'italic', 'underline', 'link', 'image'],
|
||||
['unorderedList', 'h1', 'h2', 'h3'],
|
||||
['sup', 'sub'],
|
||||
['alignLeft', 'alignCenter', 'alignRight'],
|
||||
]}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12}>
|
||||
<Typography
|
||||
as="h5"
|
||||
sx={{
|
||||
fontWeight: "500",
|
||||
fontSize: "14px",
|
||||
mb: "12px",
|
||||
}}
|
||||
>
|
||||
Product Image
|
||||
</Typography>
|
||||
<TextField
|
||||
autoComplete="product-image"
|
||||
name="productImage"
|
||||
required
|
||||
fullWidth
|
||||
id="productImage"
|
||||
type="file"
|
||||
autoFocus
|
||||
InputProps={{
|
||||
style: { borderRadius: 8 },
|
||||
}}
|
||||
/>
|
||||
|
||||
<Box
|
||||
sx={{
|
||||
mt: '15px'
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src="/images/product1.png"
|
||||
alt="product"
|
||||
wisth="55px"
|
||||
className='mr-10px'
|
||||
/>
|
||||
</Box>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} textAlign="end">
|
||||
<Button
|
||||
type="submit"
|
||||
variant="contained"
|
||||
sx={{
|
||||
textTransform: "capitalize",
|
||||
borderRadius: "8px",
|
||||
fontWeight: "500",
|
||||
fontSize: "13px",
|
||||
padding: "12px 20px",
|
||||
color: "#fff !important"
|
||||
}}
|
||||
>
|
||||
<AddIcon
|
||||
sx={{
|
||||
position: "relative",
|
||||
top: "-2px",
|
||||
}}
|
||||
className='mr-5px'
|
||||
/>{" "}
|
||||
Create Product
|
||||
</Button>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Box>
|
||||
</Box>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default CreateProduct;
|
||||
@@ -0,0 +1,25 @@
|
||||
import React from 'react';
|
||||
import Link from 'next/link';
|
||||
import styles from '@/styles/PageTitle.module.css'
|
||||
import CustomersLists from '@/components/eCommerce/Customers/CustomersLists';
|
||||
|
||||
const Customers = () => {
|
||||
return (
|
||||
<>
|
||||
{/* Page title */}
|
||||
<div className={styles.pageTitle}>
|
||||
<h1>Customers</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Dashboard</Link>
|
||||
</li>
|
||||
<li>Customers</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<CustomersLists />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Customers;
|
||||
@@ -0,0 +1,344 @@
|
||||
import React from "react";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import Card from "@mui/material/Card";
|
||||
import { Box, Typography } from "@mui/material";
|
||||
import TrackOrder from "@/components/eCommerce/OrderDetails/TrackOrder";
|
||||
import OrderTable from "@/components/eCommerce/OrderDetails/TrackOrder/OrderTable";
|
||||
import Link from 'next/link';
|
||||
import styles from '@/styles/PageTitle.module.css'
|
||||
|
||||
const OrderDetails = () => {
|
||||
return (
|
||||
<>
|
||||
{/* Page title */}
|
||||
<div className={styles.pageTitle}>
|
||||
<h1>Order Details</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Dashboard</Link>
|
||||
</li>
|
||||
<li>Order Details</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<Grid
|
||||
container
|
||||
rowSpacing={1}
|
||||
columnSpacing={{ xs: 1, sm: 1, md: 1, lg: 1, xl: 2 }}
|
||||
>
|
||||
<Grid item xs={12} md={12} lg={12} xl={4}>
|
||||
{/* TrackOrder */}
|
||||
<TrackOrder />
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={12} lg={12} xl={8}>
|
||||
{/* OrderTable */}
|
||||
<OrderTable />
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
<Grid
|
||||
container
|
||||
rowSpacing={1}
|
||||
columnSpacing={{ xs: 1, sm: 1, md: 1, lg: 1, xl: 2 }}
|
||||
>
|
||||
<Grid item xs={12} md={12} lg={12} xl={4}>
|
||||
<Card
|
||||
sx={{
|
||||
boxShadow: "none",
|
||||
borderRadius: "10px",
|
||||
p: "25px 20px",
|
||||
mb: "15px",
|
||||
}}
|
||||
>
|
||||
<Typography
|
||||
as="h3"
|
||||
sx={{
|
||||
fontSize: 16,
|
||||
fontWeight: 500,
|
||||
mb: "15px",
|
||||
}}
|
||||
>
|
||||
Shipping Information
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
as="h3"
|
||||
sx={{
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
mb: "15px",
|
||||
}}
|
||||
>
|
||||
Thomas Adison
|
||||
</Typography>
|
||||
|
||||
<Box>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: 13,
|
||||
mt: "10px",
|
||||
display: "flex",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
width: "60px",
|
||||
fontWeight: "500",
|
||||
}}
|
||||
className='mr-10px'
|
||||
>
|
||||
Address:
|
||||
</span>
|
||||
3559 Roosevelt Wilson Lane San Bernardino, CA 92405
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: 13,
|
||||
mt: "10px",
|
||||
display: "flex",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
width: "60px",
|
||||
fontWeight: "500",
|
||||
}}
|
||||
className='mr-10px'
|
||||
>
|
||||
Phone:
|
||||
</span>
|
||||
(123) 456-7890
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: 13,
|
||||
mt: "10px",
|
||||
display: "flex",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
width: "60px",
|
||||
fontWeight: "500",
|
||||
}}
|
||||
className='mr-10px'
|
||||
>
|
||||
Email:
|
||||
</span>
|
||||
contact@gmail.com
|
||||
</Typography>
|
||||
</Box>
|
||||
</Card>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={12} lg={12} xl={4}>
|
||||
<Card
|
||||
sx={{
|
||||
boxShadow: "none",
|
||||
borderRadius: "10px",
|
||||
p: "25px 20px",
|
||||
mb: "15px",
|
||||
}}
|
||||
>
|
||||
<Typography
|
||||
as="h3"
|
||||
sx={{
|
||||
fontSize: 16,
|
||||
fontWeight: 500,
|
||||
mb: "15px",
|
||||
}}
|
||||
>
|
||||
Billing Information
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
as="h3"
|
||||
sx={{
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
mb: "15px",
|
||||
}}
|
||||
>
|
||||
Thomas Adison
|
||||
</Typography>
|
||||
|
||||
<Box>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: 13,
|
||||
mt: "10px",
|
||||
display: "flex",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
width: "100px",
|
||||
fontWeight: "500",
|
||||
}}
|
||||
className='mr-10px'
|
||||
>
|
||||
Payment Type:
|
||||
</span>
|
||||
Credit Card
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: 13,
|
||||
mt: "10px",
|
||||
display: "flex",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
width: "100px",
|
||||
fontWeight: "500",
|
||||
}}
|
||||
className='mr-10px'
|
||||
>
|
||||
Provider:
|
||||
</span>
|
||||
Visa ending in 2851
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: 13,
|
||||
mt: "10px",
|
||||
display: "flex",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
width: "100px",
|
||||
fontWeight: "500",
|
||||
}}
|
||||
className='mr-10px'
|
||||
>
|
||||
Valid Date:
|
||||
</span>
|
||||
April 22 2019
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: 13,
|
||||
mt: "10px",
|
||||
display: "flex",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
width: "100px",
|
||||
fontWeight: "500",
|
||||
}}
|
||||
className='mr-10px'
|
||||
>
|
||||
CVV:
|
||||
</span>
|
||||
xxx
|
||||
</Typography>
|
||||
</Box>
|
||||
</Card>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={12} lg={12} xl={4}>
|
||||
<Card
|
||||
sx={{
|
||||
boxShadow: "none",
|
||||
borderRadius: "10px",
|
||||
p: "25px 20px",
|
||||
mb: "15px",
|
||||
}}
|
||||
>
|
||||
<Typography
|
||||
as="h3"
|
||||
sx={{
|
||||
fontSize: 16,
|
||||
fontWeight: 500,
|
||||
mb: "15px",
|
||||
}}
|
||||
>
|
||||
Delivery Info
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
as="h3"
|
||||
sx={{
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
mb: "15px",
|
||||
}}
|
||||
>
|
||||
UPS Delivery
|
||||
</Typography>
|
||||
|
||||
<Box>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: 13,
|
||||
mt: "10px",
|
||||
display: "flex",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
width: "100px",
|
||||
fontWeight: "500",
|
||||
}}
|
||||
className='mr-10px'
|
||||
>
|
||||
Order ID :
|
||||
</span>
|
||||
xxxx235
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: 13,
|
||||
mt: "10px",
|
||||
display: "flex",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
width: "100px",
|
||||
fontWeight: "500",
|
||||
}}
|
||||
className='mr-10px'
|
||||
>
|
||||
Payment Mode :
|
||||
</span>
|
||||
COD
|
||||
</Typography>
|
||||
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: 13,
|
||||
mt: "10px",
|
||||
display: "flex",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
width: "100px",
|
||||
fontWeight: "500",
|
||||
}}
|
||||
className='mr-10px'
|
||||
>
|
||||
Email:
|
||||
</span>
|
||||
info@contact.com
|
||||
</Typography>
|
||||
</Box>
|
||||
</Card>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default OrderDetails;
|
||||
@@ -0,0 +1,30 @@
|
||||
import React from 'react';
|
||||
import OrdersLists from '@/components/eCommerce/OrdersList/OrdersLists';
|
||||
import Features from '@/components/eCommerce/OrdersList/Features';
|
||||
import Link from 'next/link';
|
||||
import styles from '@/styles/PageTitle.module.css'
|
||||
|
||||
const OrdersList = () => {
|
||||
return (
|
||||
<>
|
||||
{/* Page title */}
|
||||
<div className={styles.pageTitle}>
|
||||
<h1>Orders List</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Dashboard</Link>
|
||||
</li>
|
||||
<li>Orders List</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Features */}
|
||||
<Features />
|
||||
|
||||
{/* OrdersLists */}
|
||||
<OrdersLists />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default OrdersList;
|
||||
@@ -0,0 +1,23 @@
|
||||
import React from 'react';
|
||||
import ProductDetailsContent from "@/components/eCommerce/ProductDetails/ProductDetailsContent";
|
||||
import Link from 'next/link';
|
||||
import styles from '@/styles/PageTitle.module.css'
|
||||
|
||||
export default function ProductDetails() {
|
||||
return (
|
||||
<>
|
||||
{/* Page title */}
|
||||
<div className={styles.pageTitle}>
|
||||
<h1>Product Details</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Dashboard</Link>
|
||||
</li>
|
||||
<li>Product Details</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<ProductDetailsContent />
|
||||
</>
|
||||
);
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,207 @@
|
||||
import React from "react";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import { Box, Typography } from "@mui/material";
|
||||
import Card from "@mui/material/Card";
|
||||
import Button from "@mui/material/Button";
|
||||
import IconButton from "@mui/material/IconButton";
|
||||
import DeleteIcon from "@mui/icons-material/Delete";
|
||||
import Tooltip from "@mui/material/Tooltip";
|
||||
import BorderColorIcon from "@mui/icons-material/BorderColor";
|
||||
import Link from "next/link";
|
||||
import styles from '@/styles/PageTitle.module.css'
|
||||
|
||||
const sellerLists = [
|
||||
{
|
||||
id: 1,
|
||||
brandLogo: "/images/seller1.png",
|
||||
brandName: "Nesta Technologies",
|
||||
sellersName: "Katia Stapleton",
|
||||
itemStock: "12,0558",
|
||||
walletBalance: "$48,450.00",
|
||||
viewUrl: "#",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
brandLogo: "/images/seller2.png",
|
||||
brandName: "Force Medicines",
|
||||
sellersName: "Wade Dave",
|
||||
itemStock: "10,500",
|
||||
walletBalance: "$50,500.00",
|
||||
viewUrl: "#",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
brandLogo: "/images/seller3.png",
|
||||
brandName: "Metelgo Sys",
|
||||
sellersName: "Gilbert Dan",
|
||||
itemStock: "8,450",
|
||||
walletBalance: "$60,450.00",
|
||||
viewUrl: "#",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
brandLogo: "/images/seller4.png",
|
||||
brandName: "Digito Galatoxy",
|
||||
sellersName: "Roberto Ramon",
|
||||
itemStock: "15,0587",
|
||||
walletBalance: "$78,450.00",
|
||||
viewUrl: "#",
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
brandLogo: "/images/seller5.png",
|
||||
brandName: "Micro Technology",
|
||||
sellersName: "Nathaniel Liam",
|
||||
itemStock: "18,0558",
|
||||
walletBalance: "$65,450.00",
|
||||
viewUrl: "#",
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
brandLogo: "/images/seller6.png",
|
||||
brandName: "iTest Factory",
|
||||
sellersName: "Ethan Milton",
|
||||
itemStock: "19,0558",
|
||||
walletBalance: "$76,450.00",
|
||||
viewUrl: "#",
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
brandLogo: "/images/seller7.png",
|
||||
brandName: "Syntech Service",
|
||||
sellersName: "Joshua Harvey",
|
||||
itemStock: "20,0558",
|
||||
walletBalance: "$56,450.00",
|
||||
viewUrl: "#",
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
brandLogo: "/images/seller8.png",
|
||||
brandName: "Zotic Mentex",
|
||||
sellersName: "Antonio Connor",
|
||||
itemStock: "22,0558",
|
||||
walletBalance: "$90,450.00",
|
||||
viewUrl: "#",
|
||||
},
|
||||
];
|
||||
|
||||
const Sellers = () => {
|
||||
return (
|
||||
<>
|
||||
{/* Page title */}
|
||||
<div className={styles.pageTitle}>
|
||||
<h1>Sellers</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Dashboard</Link>
|
||||
</li>
|
||||
<li>Sellers</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<Grid
|
||||
container
|
||||
rowSpacing={1}
|
||||
columnSpacing={{ xs: 1, sm: 1, md: 1, lg: 1, xl: 2 }}
|
||||
>
|
||||
{sellerLists.map((seller) => (
|
||||
<Grid item xs={12} sm={6} md={6} lg={6} xl={3} key={seller.id}>
|
||||
<Card
|
||||
sx={{
|
||||
boxShadow: "none",
|
||||
borderRadius: "10px",
|
||||
p: "25px",
|
||||
mb: "15px",
|
||||
textAlign: "center",
|
||||
position: "relative",
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src={seller.brandLogo}
|
||||
alt="Seller"
|
||||
width="110px"
|
||||
height="110px"
|
||||
className="borRadius100"
|
||||
/>
|
||||
|
||||
<Typography
|
||||
as="h4"
|
||||
fontWeight="500"
|
||||
fontSize="17px"
|
||||
mt="10px"
|
||||
mb="5px"
|
||||
>
|
||||
{seller.brandName}
|
||||
</Typography>
|
||||
|
||||
<Typography fontSize="13px">{seller.sellersName}</Typography>
|
||||
|
||||
<Link href={seller.viewUrl} className="text-decoration-none">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
sx={{
|
||||
textTransform: "capitalize",
|
||||
borderRadius: "8px",
|
||||
fontWeight: "500",
|
||||
mt: "20px",
|
||||
color: "#fff !important",
|
||||
}}
|
||||
>
|
||||
View Details
|
||||
</Button>
|
||||
</Link>
|
||||
|
||||
<Box
|
||||
sx={{
|
||||
display: "flex",
|
||||
justifyContent: "space-between",
|
||||
mt: "20px",
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<Typography fontSize="13px">Item Stock</Typography>
|
||||
|
||||
<Typography as="h4" fontWeight="500" fontSize="17px" mt="5px">
|
||||
{seller.itemStock}
|
||||
</Typography>
|
||||
</Box>
|
||||
|
||||
<Box>
|
||||
<Typography fontSize="13px">Wallet Balance</Typography>
|
||||
|
||||
<Typography as="h4" fontWeight="500" fontSize="17px" mt="5px">
|
||||
{seller.walletBalance}
|
||||
</Typography>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
{/* Edit & Delete Button */}
|
||||
<Box
|
||||
sx={{
|
||||
position: "absolute",
|
||||
top: "10px",
|
||||
right: "10px",
|
||||
}}
|
||||
>
|
||||
<Tooltip title="Edit" placement="top">
|
||||
<IconButton aria-label="edit" size="small">
|
||||
<BorderColorIcon fontSize="inherit" />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip title="Delete" placement="top">
|
||||
<IconButton aria-label="delete" size="small">
|
||||
<DeleteIcon fontSize="inherit" />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
</Box>
|
||||
</Card>
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default Sellers;
|
||||
Reference in New Issue
Block a user