add category banner image

This commit is contained in:
pawan-dot 2022-10-27 12:02:33 +05:30
parent 541270c2c0
commit 6f6a884c54
4 changed files with 59 additions and 10 deletions

View File

@ -12,7 +12,7 @@ import axios from 'axios'
const setupAxios = () => {
axios.defaults.baseURL = 'https://cms-api-dashboard.herokuapp.com/';
// axios.defaults.baseURL = 'http://localhost:5000'
//axios.defaults.baseURL = 'http://localhost:5000'
axios.defaults.headers = {
'Cache-Control': 'no-cache,no-store',
'Pragma': 'no-cache',

View File

@ -26,12 +26,13 @@ const AddProduct = () => {
const token = isAutheticated();
let history = useHistory();
const [image, setImage] = useState("");
const [ctegoryBannerImage, setCtegoryBannerImage] = useState("");
const [name, setName] = useState("");
const [loading, setLoading] = useState(false);
const handleSubmit = async () => {
if (!(name && image)) {
if (!(name && image && ctegoryBannerImage)) {
return swal('Error!', 'All fields are required', 'error')
}
@ -41,6 +42,7 @@ const AddProduct = () => {
myForm.set("image", image);
myForm.set("category_banner", ctegoryBannerImage);
setLoading({ loading: true });
// console.log(image)
try {
@ -103,8 +105,9 @@ const AddProduct = () => {
value={name}
placeholder="Name" />
</CInputGroup>
<div>category image *</div>
<CInputGroup className="mb-3">
<CInputGroup className="mb-3 mt-2">
{/* <CIcon icon={cilLockLocked} /> */}
@ -116,6 +119,21 @@ const AddProduct = () => {
onChange={handleImage}
/>
</CInputGroup>
<div>category Banner image *</div>
<CInputGroup className="mb-3 mt-2">
<CFormInput
type="file"
placeholder="image"
accept="image/*"
required
onChange={(e) => setCtegoryBannerImage(e.target.files[0])}
/>
</CInputGroup>
</div>

View File

@ -33,7 +33,7 @@ function Products() {
},
}
);
// console.log(res.data.category[0].image.url)
// console.log(res.data.category)
setCategory(res.data.category)
// console.log(category[0].addedOn)
changeState({
@ -62,12 +62,16 @@ function Products() {
Authorization: `Bearer ${token}`,
},
});
console.log(res)
// console.log(res)
if (res.data.success == true) {
swal("success!", "Category Deleted Successfully!", "success");
window.location.reload();
// if (res.status === 200) window.location.reload();
}
else {
swal("error!", "failled!", "error");
}
};
@ -119,7 +123,8 @@ function Products() {
<thead className="thead-light">
<tr>
<th>Name</th>
<th>Image</th>
<th>Category Image</th>
<th>Category Banner</th>
<th>Added On</th>
<th>Actions</th>
</tr>
@ -129,7 +134,12 @@ function Products() {
<tr key={index}>
<td>{item?.name}</td>
<td>
<img src={`${item?.image.url}`} width="50" alt="" /></td>
<img src={`${item?.image.url}`} width="50" alt="" />
</td>
<td>
{item.category_banner && <img src={`${item?.category_banner.url}`} width="50" alt="" />}
</td>
<td>
{/* {item?.addedOn} */}
{new Date(`${item?.addedOn}`).toDateString()}<span> , {`${formatAMPM(item?.addedOn)}`}</span>

View File

@ -29,6 +29,8 @@ const AddProduct = () => {
// console.log(id)
const [image, setImage] = useState("");
const [name, setName] = useState("");
const [ctegoryBannerImage, setCtegoryBannerImage] = useState("");
const [loading, setLoading] = useState(false);
useEffect(async () => {
const res = await axios.get(`/api/category/getOne/${id}`, {
@ -43,8 +45,8 @@ const AddProduct = () => {
const handleSubmit = async () => {
if (!(name && image)) {
return swal('Error!', 'All fields are required', 'error')
if (!(name)) {
return swal('Error!', 'Name fields are required', 'error')
}
const myForm = new FormData();
@ -53,6 +55,8 @@ const AddProduct = () => {
myForm.set("image", image);
myForm.set("category_banner", ctegoryBannerImage);
setLoading({ loading: true });
// console.log(image)
try {
@ -112,7 +116,9 @@ const AddProduct = () => {
placeholder="Name" />
</CInputGroup>
<CInputGroup className="mb-3">
<div>category image *</div>
<CInputGroup className="mb-3 mt-2">
{/* <CIcon icon={cilLockLocked} /> */}
@ -124,6 +130,21 @@ const AddProduct = () => {
onChange={handleImage}
/>
</CInputGroup>
<div>category Banner image *</div>
<CInputGroup className="mb-3 mt-2">
<CFormInput
type="file"
placeholder="image"
accept="image/*"
required
onChange={(e) => setCtegoryBannerImage(e.target.files[0])}
/>
</CInputGroup>
</div>