provision data
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 78 KiB |
@@ -66,7 +66,7 @@ export default function ProductActive({productData}){
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
<div className="card-body" style={{minHeight: '680px'}}>
|
||||
<iframe ref={iframe} style={{borderWidth: '0px'}} src={externalUrl} width="100%" height="600" title={externalUrl}></iframe>
|
||||
</div>
|
||||
<div className="p-4 ml-auto">
|
||||
@@ -87,7 +87,7 @@ export default function ProductActive({productData}){
|
||||
<h4 className="card-title"> Site Settings </h4>
|
||||
</div>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
<div className="card-body" style={{minHeight: '680px'}}>
|
||||
<Settings productData={productData} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -28,7 +28,7 @@ export default function ProductProvision(props) {
|
||||
const provisionData = provision?.data
|
||||
|
||||
useEffect(() => {
|
||||
const provision_room = "PROVISION_"+productSubUID;
|
||||
const provision_room = "PROVISION_" + productSubUID;
|
||||
console.log("JOINING ROOM ON START *** ", provision_room);
|
||||
joinRoom(provision_room); // provision subscription room
|
||||
}, [])
|
||||
|
||||
@@ -1,6 +1,174 @@
|
||||
const ColorStyleConfigure =()=>{
|
||||
import React, {memo} from 'react'
|
||||
import getImage from "../../../utils/getImage";
|
||||
import {useMutation, useQuery, useQueryClient} from '@tanstack/react-query';
|
||||
import queryKeys from '../../../services/queryKeys';
|
||||
import {
|
||||
getProductcolorStyleCss,
|
||||
activateTemplate,
|
||||
getProductColorStyles,
|
||||
activateColorStyle
|
||||
} from '../../../services/services';
|
||||
import {Link} from "react-router-dom";
|
||||
import siteLinks from "../../../links/siteLinks";
|
||||
|
||||
return <>COLOR CONFIG</>
|
||||
}
|
||||
const ColorStyleConfigure = memo(({name = 'Full Name', data, productData}) => {
|
||||
|
||||
export default ColorStyleConfigure
|
||||
const queryClient = useQueryClient()
|
||||
|
||||
const {data: colorStyleCss, isFetching, isError, error} = useQuery({
|
||||
queryKey: queryKeys.productcolorStyleCss,
|
||||
queryFn: () => {
|
||||
let reqData = {
|
||||
token: localStorage.getItem('token'), // USER TOKEN
|
||||
uid: localStorage.getItem('uid'), // USER UID
|
||||
product_id: productData?.product_id
|
||||
}
|
||||
return getProductColorStyles(reqData)
|
||||
},
|
||||
staleTime: 0
|
||||
})
|
||||
|
||||
const templateResponse = colorStyleCss?.data
|
||||
const currentTemUID = templateResponse?.current_template_uid
|
||||
const templates = templateResponse?.templates
|
||||
const custom_template_name = templateResponse?.custom_template_name
|
||||
|
||||
// console.log('data Template', templateResponse)
|
||||
console.log("Page data == ", data)
|
||||
|
||||
const handleActivateTemplate = useMutation({
|
||||
mutationFn: (fields) => {
|
||||
return activateColorStyle(fields)
|
||||
},
|
||||
onSuccess: (res) => {
|
||||
if (res?.data?.resultCode != '0') {
|
||||
throw new Error(res.data.resultDescription)
|
||||
}
|
||||
queryClient.refetchQueries({ // refetches productProvision API call
|
||||
queryKey: [...queryKeys.settingsData],
|
||||
})
|
||||
},
|
||||
onSettled: () => {
|
||||
setTimeout(() => {
|
||||
handleActivateTemplate.reset()
|
||||
}, 3000)
|
||||
}
|
||||
})
|
||||
|
||||
const handleSubmit = (style_uid) => {
|
||||
const reqData = {
|
||||
token: localStorage.getItem('token'), // USER TOKEN
|
||||
uid: localStorage.getItem('uid'), // USER UID
|
||||
product_id: productData?.product_id,
|
||||
color_style_uid: style_uid
|
||||
}
|
||||
// console.log(reqData)
|
||||
handleActivateTemplate.mutate(reqData)
|
||||
}
|
||||
if (custom_template_name && custom_template_name != '') {
|
||||
// This implies we have a custom template , just return here
|
||||
return <>
|
||||
<div className='col-12'>
|
||||
<div
|
||||
className="rounded-2 d-flex flex-column justify-content-between align-items-center"
|
||||
style={{backgroundColor: '#F2FAF7'}}>
|
||||
<h4 className='p-4 text-black'
|
||||
style={{marginBottom: '20px'}}>Custom Product Template.</h4>
|
||||
<img className='' style={{width: '200px'}}
|
||||
src={getImage('custom-template.png')}
|
||||
alt='mail-alert'/>
|
||||
<h4 className='p-4 text-black'
|
||||
style={{marginTop: '20px'}}>This product is using a custom template named <span
|
||||
style={{color: 'darkred'}}>“{custom_template_name}”</span> .</h4>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</>
|
||||
}
|
||||
return (
|
||||
<div className="page-account-form">
|
||||
<div className="p-0">
|
||||
{isFetching ?
|
||||
<>
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<p className='text-mute'>Loading...</p>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
: isError ?
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<p className='text-danger'>{error?.message}</p>
|
||||
</div>
|
||||
</div>
|
||||
:
|
||||
<div className="row">
|
||||
<>
|
||||
{!templates?.length ?
|
||||
<p>No data Found</p>
|
||||
:
|
||||
templates.map(color_style => (
|
||||
<div key={template.template_uid} className="col-xl-6 col-sm-6">
|
||||
<div className="card card-statistics">
|
||||
<div className="card-body">
|
||||
<div className="text-center p-2" style={{backgroundColor: `#${color_style.color_code}`}}>
|
||||
{/*<div className="mb-2">*/}
|
||||
{/* <img src={getImage('file-icon/svg.png')}*/}
|
||||
{/* alt={template.title}/>*/}
|
||||
{/*</div>*/}
|
||||
<h4 className="mb-0">{color_style.title}</h4>
|
||||
{currentTemUID === color_style.color_style_uid ?
|
||||
<button className="btn btn-light"
|
||||
disabled={true}>Active</button>
|
||||
:
|
||||
<button onClick={() => handleSubmit(color_style.color_style_uid)}
|
||||
className="btn btn-primary">Select</button>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
{/* {Object.entries(data)?.map(([key, value]) => (
|
||||
<div key={key} className="col-xl-6 col-sm-6">
|
||||
<div className="card card-statistics">
|
||||
<div className="card-body">
|
||||
<div className="text-center p-2">
|
||||
<div className="mb-2">
|
||||
<img src={getImage(value.banner)} alt={value.title} />
|
||||
</div>
|
||||
<h4 className="mb-0">{value.title}</h4>
|
||||
<a href="javascript:void(0)" className="btn btn-light">Activate</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))} */}
|
||||
</>
|
||||
|
||||
<div className="col-12">
|
||||
<>
|
||||
{handleActivateTemplate.isPending ?
|
||||
<p className={'text-center '}>loading...</p>
|
||||
:
|
||||
handleActivateTemplate.isError ?
|
||||
<p className={'text-center text-danger'}>{handleActivateTemplate.error.message}</p>
|
||||
:
|
||||
handleActivateTemplate.isSuccess ?
|
||||
<p className={'text-center text-success'}>Templated activated
|
||||
successfully</p>
|
||||
:
|
||||
null
|
||||
}
|
||||
</>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
)
|
||||
export default ColorStyleConfigure
|
||||
@@ -112,9 +112,15 @@ const GeneralTab = memo(({
|
||||
<>
|
||||
{isCustom === true ?
|
||||
<>
|
||||
{(tabKey === 'template_tab') && <SiteTemplateSelector name={name} data={sortedData} isCustom={isCustom} productData={productData}/>}
|
||||
{(tabKey === 'url_config_tab') && <URLConfiguration name={name} data={sortedData} isCustom={isCustom} productData={productData}/>}
|
||||
{(tabKey === 'color_scheme_tab') && <ColorStyleConfigure name={name} data={sortedData} isCustom={isCustom} productData={productData}/>}
|
||||
{(tabKey === 'template_tab') &&
|
||||
<SiteTemplateSelector name={name} data={sortedData} isCustom={isCustom}
|
||||
productData={productData}/>}
|
||||
{(tabKey === 'url_config_tab') &&
|
||||
<URLConfiguration name={name} data={sortedData} isCustom={isCustom}
|
||||
productData={productData}/>}
|
||||
{(tabKey === 'color_scheme_tab') &&
|
||||
<ColorStyleConfigure name={name} data={sortedData} isCustom={isCustom}
|
||||
productData={productData}/>}
|
||||
</>
|
||||
:
|
||||
<div className="page-account-form">
|
||||
|
||||
@@ -214,6 +214,12 @@ export const getProductTemplateData = (reqData) => {
|
||||
return postAuxEnd(`/panel/account/products/templates`, postData, false)
|
||||
}
|
||||
|
||||
export const getProductColorStyles = (reqData) => {
|
||||
let postData = {
|
||||
...reqData,
|
||||
}
|
||||
return postAuxEnd(`/panel/account/products/color-styles`, postData, false)
|
||||
}
|
||||
// FUNCTION TO ACTIVATE TEMPLATE
|
||||
export const activateTemplate = (reqData) => {
|
||||
let postData = {
|
||||
@@ -222,6 +228,14 @@ export const activateTemplate = (reqData) => {
|
||||
return postAuxEnd(`/panel/account/template/activate`, postData, false)
|
||||
}
|
||||
|
||||
export const activateColorStyle = (reqData) => {
|
||||
let postData = {
|
||||
...reqData,
|
||||
}
|
||||
return postAuxEnd(`/panel/account/colorstyle/activate`, postData, false)
|
||||
}
|
||||
|
||||
|
||||
// FUNCTION TO GET PRODUCT SUBSCRIPTIONS
|
||||
export const completeProfile = (reqData) => {
|
||||
let postData = {
|
||||
|
||||
Reference in New Issue
Block a user