feat(frotnend): devices tooltip warn to upgrade to business plan

This commit is contained in:
leandrofars 2024-09-05 13:04:42 -03:00
parent 4d6493f8c5
commit 05dcca4d82
2 changed files with 31 additions and 24 deletions

View File

@ -78,42 +78,47 @@ const Page = () => {
label="Wi-Fi" label="Wi-Fi"
onClick={()=>{router.push(`/devices/cwmp/${deviceID}/wifi`)}} onClick={()=>{router.push(`/devices/cwmp/${deviceID}/wifi`)}}
value={"wifi"}/> value={"wifi"}/>
<Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><SignalIcon/></SvgIcon>} icon={<SvgIcon><SignalIcon/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Site Survey" label="Site Survey"
onClick={()=>{router.push(`/devices/cwmp/${deviceID}/site-survey`)}} onClick={()=>{router.push(`/devices/cwmp/${deviceID}/site-survey`)}}
value={"site-survey"} value={"site-survey"}
disabled={true}/> style={{opacity:"0.5", cursor:"default"}}/></Tooltip>
<Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><DevicePhoneMobile/></SvgIcon>} icon={<SvgIcon><DevicePhoneMobile/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Connected Devices" label="Connected Devices"
disabled={true} style={{opacity:"0.5", cursor:"default"}}
onClick={()=>{router.push(`/devices/cwmp/${deviceID}/connected-devices`)}} onClick={()=>{router.push(`/devices/cwmp/${deviceID}/connected-devices`)}}
value={"connected-devices"} value={"connected-devices"}
/> /></Tooltip>
<Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><WrenchScrewDriverIcon/></SvgIcon>} icon={<SvgIcon><WrenchScrewDriverIcon/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Diagnostic" label="Diagnostic"
onClick={()=>{router.push(`/devices/cwmp/${deviceID}/diagnostic`)}} onClick={()=>{router.push(`/devices/cwmp/${deviceID}/diagnostic`)}}
value={"diagnostic"} value={"diagnostic"}
disabled={true}/> style={{opacity:"0.5", cursor:"default"}}/></Tooltip>
<Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><ServerStackIcon/></SvgIcon>} icon={<SvgIcon><ServerStackIcon/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Ports" label="Ports"
onClick={()=>{router.push(`/devices/usp/${deviceID}/ports`)}} onClick={()=>{router.push(`/devices/usp/${deviceID}/ports`)}}
disabled={true} style={{opacity:"0.5", cursor:"default"}}
value={"ports"} /> value={"ports"} /></Tooltip>
<Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><CommandLineIcon/></SvgIcon>} icon={<SvgIcon><CommandLineIcon/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Actions" label="Actions"
onClick={()=>{router.push(`/devices/usp/${deviceID}/actions`)}} onClick={()=>{router.push(`/devices/usp/${deviceID}/actions`)}}
disabled={true} style={{opacity:"0.5", cursor:"default"}}
value={"actions"} /> value={"actions"} /></Tooltip>
<Tab <Tab
value={"msg"} value={"msg"}
onClick={()=>{router.push(`/devices/cwmp/${deviceID}/msg`)}} onClick={()=>{router.push(`/devices/cwmp/${deviceID}/msg`)}}

View File

@ -75,51 +75,53 @@ const Page = () => {
}} }}
mb={3}> mb={3}>
<Tabs value={router.query.id[1]} aria-label="icon label tabs example"> <Tabs value={router.query.id[1]} aria-label="icon label tabs example">
<Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><WifiIcon/></SvgIcon>} icon={<SvgIcon><WifiIcon/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Wi-Fi" label="Wi-Fi"
onClick={()=>{router.push(`/devices/usp/${deviceID}/wifi`)}} style={{cursor:"default", opacity: 0.5}}
disabled={true}
value={"wifi"}/> value={"wifi"}/>
</Tooltip>
<Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><SignalIcon/></SvgIcon>} icon={<SvgIcon><SignalIcon/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Site Survey" label="Site Survey"
style={{opacity:"0.5"}} style={{cursor:"default", opacity: 0.5}}
onClick={()=>{router.push(`/devices/usp/${deviceID}/site-survey`)}}
disabled={true}
value={"site-survey"} value={"site-survey"}
/> />
</Tooltip>
<Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><DevicePhoneMobile/></SvgIcon>} icon={<SvgIcon><DevicePhoneMobile/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Connected Devices" label="Connected Devices"
onClick={()=>{router.push(`/devices/usp/${deviceID}/connected-devices`)}} style={{cursor:"default", opacity: 0.5}}
disabled={true}
value={"connected-devices"} value={"connected-devices"}
/> />
</Tooltip>
<Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><WrenchScrewDriverIcon/></SvgIcon>} icon={<SvgIcon><WrenchScrewDriverIcon/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Diagnostic" label="Diagnostic"
onClick={()=>{router.push(`/devices/usp/${deviceID}/diagnostic`)}} style={{cursor:"default", opacity: 0.5}}
disabled={true} value={"diagnostic"} /></Tooltip>
value={"diagnostic"} /> <Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><ServerStackIcon/></SvgIcon>} icon={<SvgIcon><ServerStackIcon/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Ports" label="Ports"
onClick={()=>{router.push(`/devices/usp/${deviceID}/ports`)}} style={{cursor:"default", opacity: 0.5}}
disabled={true} value={"ports"} /></Tooltip>
value={"ports"} /> <Tooltip title="Upgrade to Business Plan" placement="bottom">
<Tab <Tab
icon={<SvgIcon><CommandLineIcon/></SvgIcon>} icon={<SvgIcon><CommandLineIcon/></SvgIcon>}
iconPosition={"end"} iconPosition={"end"}
label="Actions" label="Actions"
onClick={()=>{router.push(`/devices/usp/${deviceID}/actions`)}} style={{cursor:"default", opacity: 0.5}}
disabled={true} value={"actions"} /></Tooltip>
value={"actions"} />
<Tab <Tab
value={"discovery"} value={"discovery"}
onClick={()=>{router.push(`/devices/usp/${deviceID}/discovery`)}} onClick={()=>{router.push(`/devices/usp/${deviceID}/discovery`)}}