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

added office refreesh

Browse Source
This commit is contained in:
CHIEFSOFT\ameye
2025-10-11 06:18:05 -04:00
parent a5fc0890b4
commit b898f7c3e3
2 changed files with 116 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/subscription_view/SubscriptionViewCom.jsx
+108 -65
View File
@@ -1,10 +1,10 @@
import {useLocation, useNavigate, Link} from 'react-router-dom' import {useLocation, useNavigate, Link} from 'react-router-dom'
import { useQuery, useMutation } from '@tanstack/react-query' import {useQuery, useMutation} from '@tanstack/react-query'
import { FaCaretDown } from "react-icons/fa"; import {FaCaretDown} from "react-icons/fa";
import BreadcrumbCom from '../breadcrumb/BreadcrumbCom' import BreadcrumbCom from '../breadcrumb/BreadcrumbCom'
import {useEffect, useState} from 'react'; import {useEffect, useState} from 'react';
import RouteLinks from '../../RouteLinks'; import RouteLinks from '../../RouteLinks';
import { getSubscriptionsView, updateTemplate, updateCustomTemplate } from '../../services/siteServices' import {getSubscriptionsView, updateTemplate, updateCustomTemplate, rebuildTemplate} from '../../services/siteServices'
import queryKeys from '../../services/queryKeys' import queryKeys from '../../services/queryKeys'
import getDateTimeFromDateString from '../../helpers/getDateTimeFromDateString'; import getDateTimeFromDateString from '../../helpers/getDateTimeFromDateString';
@@ -18,12 +18,12 @@ export default function SubscriptionViewCom() {
const [values, setValues] = useState({custom_id: '', template_uid: ''}) const [values, setValues] = useState({custom_id: '', template_uid: ''})
const handleValueChange = ({target:{name, value}}) => { const handleValueChange = ({target: {name, value}}) => {
if(name == 'custom_template'){ if (name == 'custom_template') {
setValues(prev => ({...prev, custom_id: value})) setValues(prev => ({...prev, custom_id: value}))
}else if (name == 'template') { } else if (name == 'template') {
setValues(prev => ({...prev, template_uid: value})) setValues(prev => ({...prev, template_uid: value}))
}else{ } else {
setValues(prev => ({...prev})) setValues(prev => ({...prev}))
} }
} }
@@ -34,7 +34,7 @@ export default function SubscriptionViewCom() {
} }
}, []) }, [])
const {data, isFetching, isError, error} = useQuery({ const {data, isFetching, isError, error} = useQuery({
queryKey: queryKeys.subscriptions_view, queryKey: queryKeys.subscriptions_view,
queryFn: () => { queryFn: () => {
// const filterData = filter?.type ? {[filter?.type]: filter.id} : {} // const filterData = filter?.type ? {[filter?.type]: filter.id} : {}
@@ -63,6 +63,16 @@ export default function SubscriptionViewCom() {
// } // }
// },[data]) // },[data])
const templateRebuild = useMutation({
mutationFn: (fields) => {
return rebuildTemplate(fields)
},
onSettled: () => {
setTimeout(() => {
templateRebuild.reset()
}, 3000)
}
})
const templateUpdate = useMutation({ const templateUpdate = useMutation({
mutationFn: (fields) => { mutationFn: (fields) => {
@@ -73,7 +83,7 @@ export default function SubscriptionViewCom() {
// onSuccess: (res) => { // onSuccess: (res) => {
// }, // },
onSettled: () => { onSettled: () => {
setTimeout(()=>{ setTimeout(() => {
templateUpdate.reset() templateUpdate.reset()
}, 3000) }, 3000)
} }
@@ -88,7 +98,7 @@ export default function SubscriptionViewCom() {
// onSuccess: (res) => { // onSuccess: (res) => {
// }, // },
onSettled: () => { onSettled: () => {
setTimeout(()=>{ setTimeout(() => {
customTemplateUpdate.reset() customTemplateUpdate.reset()
}, 3000) }, 3000)
} }
@@ -102,6 +112,13 @@ export default function SubscriptionViewCom() {
templateUpdate.mutate(reqData) templateUpdate.mutate(reqData)
} }
const handleRebuildTemplate = () => {
const reqData = {
subscription_uid: state?.subscriptionUID,
}
templateRebuild.mutate(reqData)
}
const handleUpdateCustomTemplate = () => { const handleUpdateCustomTemplate = () => {
const reqData = { const reqData = {
subscrtiption_uid: state?.subscriptionUID, subscrtiption_uid: state?.subscriptionUID,
@@ -113,88 +130,114 @@ export default function SubscriptionViewCom() {
return ( return (
<div className='w-full flex flex-col gap-8'> <div className='w-full flex flex-col gap-8'>
<BreadcrumbCom title={`Subscription View [${state?.subscriptionUID}]`} paths={['Dashboard', 'Subscription View']}/> <BreadcrumbCom title={`Subscription View [${state?.subscriptionUID}]`}
paths={['Dashboard', 'Subscription View']}/>
{isFetching ? {isFetching ?
<>
<p className='text-slate-800'>Loading...</p>
</>
: isError ?
<p className='text-red-500'>{error.message}</p>
:
<> <>
<div className='w-full box bg-white dark:bg-black-box text-black-body dark:text-white-body overflow-x-auto'> <p className='text-slate-800'>Loading...</p>
<table className="py-2 w-full text-sm bg-[aliceblue] dark:bg-transparent rounded-[10px]"> </>
<tbody> : isError ?
<p className='text-red-500'>{error.message}</p>
:
<>
<div
className='w-full box bg-white dark:bg-black-box text-black-body dark:text-white-body overflow-x-auto'>
<table className="py-2 w-full text-sm bg-[aliceblue] dark:bg-transparent rounded-[10px]">
<tbody>
<tr className="py-2 border-t border-dashed border-slate-300"> <tr className="py-2 border-t border-dashed border-slate-300">
<td className="px-2 py-2"> <td className="px-2 py-2">
<div className="text-left"> <div className="text-left">
<div className="text-base font-semibold">{getDateTimeFromDateString(selectedSubscription?.added)}</div> <div
className="text-base font-semibold">{getDateTimeFromDateString(selectedSubscription?.added)}</div>
</div> </div>
</td> </td>
<td className="px-2"> <td className="px-2">
<div className="text-left"> <div className="text-left">
<div className="text-base font-semibold">{selectedSubscription?.product_id}</div> <div
className="text-base font-semibold">{selectedSubscription?.product_id}</div>
</div> </div>
</td> </td>
<td className="px-2"> <td className="px-2">
<div className="text-left"> <div className="text-left">
<div className="text-base font-semibold">{selectedSubscription?.internal_url} <div
<br /><span>Template :</span> {selectedSubscription?.product_template} className="text-base font-semibold">{selectedSubscription?.internal_url}
<br /><span>Custom :</span> {selectedSubscription?.custom_template} <br/><span>Template :</span> {selectedSubscription?.product_template}
<br/><span>Custom :</span> {selectedSubscription?.custom_template}
</div> </div>
</div> </div>
</td> </td>
<td className="px-2"> <td className="px-2">
<div className="text-right"> <div className="text-right">
<div className="text-base font-semibold">{selectedSubscription?.status}</div> <div
className="text-base font-semibold">{selectedSubscription?.status}</div>
</div>
</td>
<td className="px-2">
<div className="text-right">
<button name='template' onClick={handleRebuildTemplate}
className={`rounded-md p-2 bg-primary text-white text-center`}>
Rebuild
</button>
</div> </div>
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div>
<div className='box bg-white dark:bg-black-box text-black-body dark:text-white-body'>
<div className='w-full'>
<label className='font-medium'>Assign Template</label>
<div className='flex flex-col xs:flex-row md:items-center gap-2'>
<div className='w-full h-10 relative overflow-hidden rounded-md'>
<select name='template' value={currentTemplate || values.template_uid} onChange={handleValueChange} className='w-full h-full p-2 appearance-none dark:bg-transparent border-0 dark:border-1 border-white ring-0 outline-none'>
<option value=''>None</option>
{availableTemplates && availableTemplates.map(item => (
<option key={item?.template_uid} value={item?.template_uid}>{`${item?.product_id}-${item?.provision_name}`}</option>
))}
</select>
<FaCaretDown className='text-base absolute top-1/2 -translate-y-1/2 right-2' />
</div>
<button name='template' onClick={handleUpdateTemplate} disabled={(templateUpdate.isPending || !values.template_uid)} className={`rounded-md p-2 bg-primary text-white text-center ${(templateUpdate.isPending || !values.template_uid) && 'opacity-50'}`}>Update</button>
</div>
<p className={`p-2 mt-4 ${templateUpdate.isSuccess ? 'text-emerald-500' : 'text-red-500'}`}>{templateUpdate.isSuccess ? 'Template updated' : templateUpdate.isSuccess ? 'Unable to complete request, try again' : ''}</p>
</div> </div>
</div>
<div className='box bg-white dark:bg-black-box text-black-body dark:text-white-body'> <div className='box bg-white dark:bg-black-box text-black-body dark:text-white-body'>
<div className='w-full'> <div className='w-full'>
<label className='font-medium'>Assign Custom Template</label> <label className='font-medium'>Assign Template</label>
<div className='flex flex-col xs:flex-row md:items-center gap-2'> <div className='flex flex-col xs:flex-row md:items-center gap-2'>
<div className='w-full h-10 relative overflow-hidden rounded-md'> <div className='w-full h-10 relative overflow-hidden rounded-md'>
<select name='custom_template' value={currentCustomTem || values.custom_id} onChange={handleValueChange} className='w-full h-full p-2 appearance-none dark:bg-transparent border-0 dark:border-1 border-white ring-0 outline-none'> <select name='template' value={currentTemplate || values.template_uid}
<option value=''>None</option> onChange={handleValueChange}
{customTemplates && customTemplates.map(item => ( className='w-full h-full p-2 appearance-none dark:bg-transparent border-0 dark:border-1 border-white ring-0 outline-none'>
<option key={item?.custom_id} value={item?.custom_id}>{`${item?.custom_id}-${item?.provision_name}`}</option> <option value=''>None</option>
))} {availableTemplates && availableTemplates.map(item => (
</select> <option key={item?.template_uid}
<FaCaretDown className='text-base absolute top-1/2 -translate-y-1/2 right-2' /> value={item?.template_uid}>{`${item?.product_id}-${item?.provision_name}`}</option>
))}
</select>
<FaCaretDown className='text-base absolute top-1/2 -translate-y-1/2 right-2'/>
</div>
<button name='template' onClick={handleUpdateTemplate}
disabled={(templateUpdate.isPending || !values.template_uid)}
className={`rounded-md p-2 bg-primary text-white text-center ${(templateUpdate.isPending || !values.template_uid) && 'opacity-50'}`}>Update
</button>
</div> </div>
<button name='custom_template' onClick={handleUpdateCustomTemplate} disabled={(customTemplateUpdate.isPending || !values.custom_id)} className={`rounded-md p-2 bg-primary text-white text-center ${(customTemplateUpdate.isPending || !values.custom_id) && 'opacity-50'}`}>Update</button> <p className={`p-2 mt-4 ${templateUpdate.isSuccess ? 'text-emerald-500' : 'text-red-500'}`}>{templateUpdate.isSuccess ? 'Template updated' : templateUpdate.isSuccess ? 'Unable to complete request, try again' : ''}</p>
</div> </div>
<p className={`p-2 mt-4 ${customTemplateUpdate.isSuccess ? 'text-emerald-500' : 'text-red-500'}`}>{customTemplateUpdate.isSuccess ? 'Custom Template updated' : customTemplateUpdate.isSuccess ? 'Unable to complete request, try again' : ''}</p>
</div> </div>
</div>
</> <div className='box bg-white dark:bg-black-box text-black-body dark:text-white-body'>
<div className='w-full'>
<label className='font-medium'>Assign Custom Template</label>
<div className='flex flex-col xs:flex-row md:items-center gap-2'>
<div className='w-full h-10 relative overflow-hidden rounded-md'>
<select name='custom_template' value={currentCustomTem || values.custom_id}
onChange={handleValueChange}
className='w-full h-full p-2 appearance-none dark:bg-transparent border-0 dark:border-1 border-white ring-0 outline-none'>
<option value=''>None</option>
{customTemplates && customTemplates.map(item => (
<option key={item?.custom_id}
value={item?.custom_id}>{`${item?.custom_id}-${item?.provision_name}`}</option>
))}
</select>
<FaCaretDown className='text-base absolute top-1/2 -translate-y-1/2 right-2'/>
</div>
<button name='custom_template' onClick={handleUpdateCustomTemplate}
disabled={(customTemplateUpdate.isPending || !values.custom_id)}
className={`rounded-md p-2 bg-primary text-white text-center ${(customTemplateUpdate.isPending || !values.custom_id) && 'opacity-50'}`}>Update
</button>
</div>
<p className={`p-2 mt-4 ${customTemplateUpdate.isSuccess ? 'text-emerald-500' : 'text-red-500'}`}>{customTemplateUpdate.isSuccess ? 'Custom Template updated' : customTemplateUpdate.isSuccess ? 'Unable to complete request, try again' : ''}</p>
</div>
</div>
</>
} }
</div> </div>
) )
src/services/siteServices.js
+8
View File
@@ -124,6 +124,14 @@ export const getProductsTemplate = (reqData) => {
return getAuxEnd(`/products-templates`, postData) return getAuxEnd(`/products-templates`, postData)
} }
// FUNCTION TO INITIATE TEMPLATE REBUILD
export const rebuildTemplate = (reqData) => {
let postData = {
...reqData
}
return postAuxEnd('/rebuild-template', postData, false)
}
// FUNCTION TO UPDATE TEMPLATE // FUNCTION TO UPDATE TEMPLATE
export const updateTemplate = (reqData) => { export const updateTemplate = (reqData) => {
let postData = { let postData = {