MERMS/MermsPanelReactJS
1
0
Fork 0
Code Issues Pull Requests 1 Releases Activity

fixed product details page

Browse Source
This commit was merged in pull request #36.
This commit is contained in:
victorAnumudu
2025-07-04 19:43:28 +01:00
parent 8c57e94bb6
commit 2f73e84a84
4 changed files with 79 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/img/product/banner.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.5 KiB

src/component/calendar/Calendar.jsx
+31 -9
View File
@@ -1,5 +1,5 @@
import React, { useCallback, useEffect, useState } from "react";
import { useQuery } from '@tanstack/react-query'
import { useMutation, useQuery } from '@tanstack/react-query'
import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
import EventCalendar from "./EventCalendar";
@@ -16,12 +16,34 @@ export default function Calendar(){
// setDraggedEvent(event)
// }
const {data, isFetching, isError, error} = useQuery({
queryKey: queryKeys.calendar_events,
queryFn: () => getCalendarEvents()
// const {data, isFetching, isError, error} = useQuery({
// queryKey: queryKeys.calendar_events,
// queryFn: () => getCalendarEvents()
// })
const calendarEvents = useMutation({
mutationFn: (reqData) => {
return getCalendarEvents(reqData)
},
onError: (error) => {
console.log(error)
},
onSuccess: (res) => {
if(res?.data?.resultCode != '0'){
throw({message: 'Something went wrong'})
}
}
})
const receievedEvents = data?.data?.bar_data
useEffect(()=>{
let reqData = {
token: localStorage.getItem('token'), // USER TOKEN
uid: localStorage.getItem('uid') // USER UID
}
calendarEvents.mutate(reqData)
},[])
const receievedEvents = calendarEvents?.data?.data
const category = receievedEvents?.category //EVENT CATEGORIES FROM API
const eventList = receievedEvents?.list //EVENT LIST FROM API
@@ -62,15 +84,15 @@ export default function Calendar(){
</div>
<div className="card-body">
<div className="row">
{isFetching ?
{calendarEvents?.isPending ?
<>
<div className="col-12">
<p className='text-mute'>Loading...</p>
</div>
</>
: isError ?
: calendarEvents?.error ?
<div className="col-12">
<p className='text-danger'>{error.message}</p>
<p className='text-danger'>{calendarEvents?.error?.message}</p>
</div>
:
<>
@@ -83,7 +105,7 @@ export default function Calendar(){
Drag and drop your event or click in the calendar.
</p> */}
{category.map((item, index) => {
{category?.map((item, index) => {
let color = item?.cid == '1' ? 'fc-event-success' : item?.cid == '2' ? 'fc-event-danger' : item?.cid == '3' ? 'fc-event-warning' : 'fc-event-primary'
let circleColor = item?.cid == '1' ? 'text-success' : item?.cid == '2' ? 'text-danger' : item?.cid == '3' ? 'text-warning' : 'text-primary'
return (
src/component/product/ProductFactory.jsx
+31 -24
View File
@@ -1,11 +1,10 @@
import React, {useState} from "react";
import { useQuery } from '@tanstack/react-query'
import {useEffect} from "react";
import { useMutation, useQuery } from '@tanstack/react-query'
import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
// import getImage from "../../utils/getImage";
import ProductStart from "./ProductStart";
import { useLocation } from 'react-router-dom';
import {MyProductData, productData} from "../../services/services";
import queryKeys from "../../services/queryKeys";
import {MyProductData} from "../../services/services";
import ProductActive from "./ProductActive";
import ProductProvision from "./ProductProvision";
import {productConst} from "../../constants/products";
@@ -13,34 +12,42 @@ import {productConst} from "../../constants/products";
export default function ProductFactory(){
const location = useLocation();
const pathname = location.pathname;
const [productStatus, setProductStatus] = useState(0);
//productConst.PRODUCT_ACTIVE
// Split the pathname by '/' and get the last element
const lastPart = pathname.split('/').pop();
// console.log(lastPart)
const productID = pathname.split('/').pop();
const {data, isFetching, isError, error} = useQuery({
queryKey: queryKeys.product,
queryFn: () => MyProductData(lastPart)
const getProductData = useMutation({
mutationFn: (reqData) => {
return MyProductData(reqData)
},
onError: (error) => {
console.log(error)
},
onSuccess: (res) => {
if(res?.data?.resultCode != '0'){
throw({message: 'Something went wrong'})
}
}
})
const myproduct_data = data?.data?.myproduct_data
//setProductStatus(myproduct_data?.status)
const product_name = myproduct_data?.product_name;
const product_status = myproduct_data?.status;
useEffect(()=>{
let reqData = {
product_id : productID,
token: localStorage.getItem('token'), // USER TOKEN
uid: localStorage.getItem('uid') // USER UID
}
getProductData.mutate(reqData)
},[])
const myproduct_data = getProductData?.data?.data?.myproduct?.myproudct // PRODUCT DETAILS
const product_name = myproduct_data?.product_name;
const product_status = myproduct_data?.status;
return(
<>
<BreadcrumbComBS title={product_name} paths={['Dashboard', 'Product']} />
<div className="row">
{isFetching ?
{getProductData?.isPending ?
<>
<div className="row">
<div className="col-12">
@@ -48,10 +55,10 @@ export default function ProductFactory(){
</div>
</div>
</>
: isError ?
: getProductData?.error ?
<div className="row">
<div className="col-12">
<p className='text-danger'>{error.message}</p>
<p className='text-danger'>{getProductData?.error?.message}</p>
</div>
</div>
:
src/services/services.js
+17 -21
View File
@@ -75,6 +75,22 @@ export const topBar = (reqData) => {
return postAuxEnd(`/panel/account/bar`, postData, false)
}
// FUNCTION TO GET PRODUCT BY ID
export const MyProductData = (reqData) => {
let postData = {
...reqData,
}
return postAuxEnd(`/panel/myproduct/dash`, postData, false)
}
// FUNCTION TO GET CALENDAR EVENTS
export const getCalendarEvents = (reqData) => {
let postData = {
...reqData,
}
return postAuxEnd(`/panel/account/calendar`, postData, false)
}
// FUNCTION TO GET DASHBOARD RECENT ACTIONS SECTION
export const recentActions = (reqData) => {
let postData = {
@@ -98,6 +114,7 @@ export const productsData = (reqData) => {
// FUNCTION TO GET DASHBOARD PRODUCT URL DATA SECTION
export const productsURL = (reqData) => {
let postData = {
@@ -152,16 +169,6 @@ export const recoverPWD = (reqData) => {
return postAuxEnd('/panel/auth/reset', postData, false)
}
// FUNCTION TO GET CALENDAR EVENTS
export const getCalendarEvents = (reqData) => {
let postData = {
...reqData,
token: localStorage.getItem('token'), // USER TOKEN
uid: localStorage.getItem('uid') // USER UID
}
return postAuxEnd(`/panel/account/calendar`, postData, false)
}
// FUNCTION TO GET MY PRODUCT PROVISION DATA
export const productProvision = (reqData) => {
let postData = {
@@ -182,15 +189,4 @@ export const contactData = (reqData) => {
}
return postAuxEnd(`/panel/contacts`, postData, false)
// return getAuxEnd(`/panel/contacts`)
}
export const MyProductData = (productID) => {
const reqData = { product_id : productID}
let postData = {
...reqData,
token: localStorage.getItem('token'), // USER TOKEN
uid: localStorage.getItem('uid') // USER UID
}
return postAuxEnd(`/panel/myproduct/dash`, postData, false)
// return getAuxEnd(`/panel/myproduct/dash`,reqData)
}