Skip to content

A
Agiliza
Commit e63508b1 authored by Rafael's avatar Rafael
Browse files
Options

Adiciona alterações de migração.

parent c5e9603f
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 3343 additions and 2697 deletions
cli/web/cliente/.yarnrc
View file @ e63508b1
--registry "https://nexus.dev.evologica.com.br/repository/npm/"
--registry "https://nexus.dev.evologica.com.br/repository/npm"
"@curio:registry" "https://nexus.dev.evologica.com.br/repository/npm"
"@dynamo:registry" "https://nexus.dev.evologica.com.br/repository/npm"
\ No newline at end of file
cli/web/cliente/babel.config.json
View file @ e63508b1
......@@ -21,8 +21,8 @@
[
"babel-plugin-import",
{
"libraryName": "@material-ui/core",
"libraryDirectory": "esm",
"libraryName": "@mui/material",
"libraryDirectory": "",
"camel2DashComponentName": false
},
"core"
......@@ -30,20 +30,20 @@
[
"babel-plugin-import",
{
"libraryName": "@material-ui/lab",
"libraryDirectory": "esm",
"libraryName": "@mui/icons-material",
"libraryDirectory": "",
"camel2DashComponentName": false
},
"lab"
"icons"
],
[
"babel-plugin-import",
{
"libraryName": "@material-ui/icons",
"libraryDirectory": "esm",
"libraryName": "@mui/lab",
"libraryDirectory": "",
"camel2DashComponentName": false
},
"icons"
"lab"
],
"@babel/plugin-proposal-optional-chaining",
"@babel/plugin-proposal-nullish-coalescing-operator",
......
cli/web/cliente/package.json
View file @ e63508b1
......@@ -80,17 +80,19 @@
},
"dependencies": {
"@curio/client": "1.3.3",
"@curio/components": "^0.1.6",
"@curio/components": "^1.0.3",
"@curio/ui": "^0.1.0",
"@date-io/date-fns": "^1.0.0",
"@dynamo/components": "0.70.1",
"@dynamo/curio": "0.70.1",
"@dynamo/material-ui": "0.70.1",
"@material-ui/core": "4.11.4",
"@material-ui/icons": "^4.11.2",
"@material-ui/lab": "4.0.0-alpha.58",
"@material-ui/pickers": "^3.3.10",
"@emotion/react": "^11.4.1",
"@emotion/styled": "^11.3.0",
"@microcredito/client": "^0.7.26",
"@mui/icons-material": "^5.0.0",
"@mui/lab": "^5.0.0-alpha.46",
"@mui/material": "^5.0.0",
"@mui/system": "^5.0.0",
"@reduxjs/toolkit": "^1.2.5",
"@types/react-swipeable-views": "^0.13.1",
"@types/react-swipeable-views-utils": "^0.13.3",
......@@ -103,8 +105,8 @@
"deepmerge": "^4.2.2",
"normalizr": "^3.6.1",
"p-min-delay": "^4.0.0",
"react": "^16.0.0",
"react-dom": "^16.0.0",
"react": "^17.0.0",
"react-dom": "^17.0.0",
"react-loading-skeleton": "^2.0.1",
"react-redux": "^7.2.0",
"react-router": "5.2.0",
......
cli/web/cliente/src/api/domain/simulation/context.d.ts
View file @ e63508b1
......@@ -21,3 +21,12 @@ export interface CreditInstallment extends Entity {
export interface CreditGracePeriod extends Entity {
description: string
}
interface OutputGetVisitContext {
gracePeriods: CreditGracePeriod
}
export interface GetVisitContext {
Input: void
Output: OutputGetVisitContext
}
cli/web/cliente/src/components/atoms/ButtonWithProgress/ButtonWithProgress.tsx
View file @ e63508b1
import React from 'react'
import { Button, LinearProgress } from '@material-ui/core'
import { ButtonProps } from '@material-ui/core/Button'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Button, LinearProgress } from '@mui/material'
import { ButtonProps } from '@mui/material/Button'
import { styles } from './styles'
type ExtendedTypes = WithStyles<typeof styles> &
Pick<ButtonProps, 'disabled' | 'onClick' | 'type' | 'children' | 'className' | 'color' | 'size' | 'variant'>
type ExtendedTypes = Pick<ButtonProps, 'disabled' | 'onClick' | 'type' | 'children' | 'sx' | 'color' | 'size' | 'variant'>
interface Props extends ExtendedTypes {
fetching?: boolean
}
const ButtonWithProgress = (props: Props) => {
const { className, classes, fetching, disabled, onClick, type, children, color = 'primary', size, variant = 'contained' } = props
const { sx, fetching, disabled, onClick, type, children, color = 'primary', size, variant = 'contained' } = props
return (
<Button className={className} disabled={disabled || fetching} onClick={onClick} variant={variant} color={color} type={type} size={size}>
{fetching && <LinearProgress className={classes.progress} />}
<Button sx={sx} disabled={disabled || fetching} onClick={onClick} variant={variant} color={color} type={type} size={size}>
{fetching && <LinearProgress sx={styles.progress} />}
{children}
</Button>
)
}
export default withStyles(styles)(ButtonWithProgress)
export default ButtonWithProgress
cli/web/cliente/src/components/atoms/ButtonWithProgress/styles.ts
View file @ e63508b1
import { Theme, createStyles } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
export const styles = (theme: Theme) => {
return createStyles({
progress: {
bottom: 0,
margin: 0,
width: '100%',
position: 'absolute'
}
})
}
export const styles = createSxStyles({
progress: {
bottom: 0,
margin: 0,
width: '100%',
position: 'absolute',
},
})
cli/web/cliente/src/components/atoms/ItemWithIcon/ItemWithIcon.tsx
View file @ e63508b1
import React from 'react'
import ListItem from '@material-ui/core/ListItem'
import ListItemIcon from '@material-ui/core/ListItemIcon'
import ListItemText from '@material-ui/core/ListItemText'
import ListItem, { ListItemProps } from '@mui/material/ListItem'
import ListItemIcon from '@mui/material/ListItemIcon'
import ListItemText from '@mui/material/ListItemText'
interface Props {
label: string
className?: string
sx?: ListItemProps['sx']
children: React.ReactElement
onClick?: () => void
}
const ItemWithIcon = (props: Props) => {
const { className, label, children, onClick } = props
const { sx, label, children, onClick } = props
return (
<ListItem button className={className} onClick={onClick}>
<ListItem button sx={sx} onClick={onClick}>
<ListItemIcon>{children}</ListItemIcon>
<ListItemText primary={label} />
</ListItem>
......
cli/web/cliente/src/components/atoms/TextFieldWithIcon/TextFieldWithIcon.tsx
View file @ e63508b1
import React, { useState } from 'react'
import InputAdornment from '@material-ui/core/InputAdornment'
import TextField, { TextFieldProps } from '@material-ui/core/TextField'
import Visibility from '@material-ui/icons/Visibility'
import VisibilityOff from '@material-ui/icons/VisibilityOff'
import withStyles, { WithStyles } from '@material-ui/styles/withStyles'
import Visibility from '@mui/icons-material/Visibility'
import VisibilityOff from '@mui/icons-material/VisibilityOff'
import InputAdornment from '@mui/material/InputAdornment'
import TextField, { TextFieldProps } from '@mui/material/TextField'
import styles from './styles'
type BaseProps = WithStyles<typeof styles> &
Pick<TextFieldProps, 'value' | 'onChange' | 'required' | 'label' | 'type' | 'className' | 'InputProps' | 'autoFocus' | 'inputProps'>
type BaseProps = Pick<TextFieldProps, 'value' | 'onChange' | 'required' | 'label' | 'type' | 'sx' | 'InputProps' | 'autoFocus' | 'inputProps'>
interface Props extends BaseProps {}
const TextFieldWithIcon = (props: Props) => {
const [isPasswordVisible, setIsPasswordVisible] = useState(false)
const { onChange, required, value, label, type, className, InputProps, classes, autoFocus } = props
const { onChange, required, value, label, type, sx, InputProps, autoFocus } = props
return (
<TextField
autoFocus={autoFocus}
......@@ -23,14 +21,14 @@ const TextFieldWithIcon = (props: Props) => {
value={value}
onChange={onChange}
label={label}
className={className}
sx={sx}
variant="outlined"
type={type === 'password' ? (isPasswordVisible ? undefined : type) : type}
InputProps={
InputProps || {
startAdornment:
type === 'password' ? (
<InputAdornment position="start" onClick={() => setIsPasswordVisible(!isPasswordVisible)} className={classes.inputAdorment}>
<InputAdornment position="start" onClick={() => setIsPasswordVisible(!isPasswordVisible)} sx={styles.inputAdorment}>
{isPasswordVisible ? <Visibility /> : <VisibilityOff />}
</InputAdornment>
) : null,
......@@ -40,4 +38,4 @@ const TextFieldWithIcon = (props: Props) => {
)
}
export default withStyles(styles)(TextFieldWithIcon)
export default TextFieldWithIcon
cli/web/cliente/src/components/atoms/TextFieldWithIcon/styles.ts
View file @ e63508b1
import { createStyles, Theme } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
export default (theme: Theme) =>
createStyles({
inputAdorment: {
cursor: 'pointer'
}
})
export default createSxStyles({
inputAdorment: {
cursor: 'pointer',
},
})
cli/web/cliente/src/components/molecules/AppBar/Toolbar.tsx
View file @ e63508b1
import React from 'react'
import MuiToolbar from '@material-ui/core/Toolbar'
import { Box } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import MuiToolbar, { ToolbarProps as MuiToolbarProps } from '@mui/material/Toolbar'
import { useStyles } from './styles'
......@@ -8,14 +10,15 @@ export interface ToolbarProps {
title?: React.ReactNode
actions?: React.ReactNode
nav?: React.ReactNode
sx?: MuiToolbarProps['sx']
}
export function Toolbar({ nav, title, actions }: ToolbarProps) {
const classes = useStyles()
export function Toolbar({ nav, title, actions, sx }: ToolbarProps) {
const styles = useStyles(useTheme())
return (
<MuiToolbar>
<div className={classes.nav}>{nav}</div>
{title ? <div className={classes.grow}>{title}</div> : <div className={classes.grow} />}
<Box sx={styles.nav}>{nav}</Box>
{title ? <Box sx={styles.grow}>{title}</Box> : <Box sx={styles.grow} />}
{actions}
</MuiToolbar>
)
......
cli/web/cliente/src/components/molecules/AppBar/index.tsx
View file @ e63508b1
import cn from 'classnames'
import deepmerge from 'deepmerge'
import React, { useState } from 'react'
import { Collapse, CollapseProps, Fade } from '@material-ui/core'
import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@material-ui/core/AppBar'
import { createStyles, makeStyles, Theme } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
import { Box, Collapse, CollapseProps, Fade } from '@mui/material'
import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar'
import { Theme, useTheme } from '@mui/material/styles'
import { Toolbar, ToolbarProps } from './Toolbar'
const useStyles = makeStyles((theme: Theme) =>
createStyles({
const useStyles = (theme: Theme) =>
createSxStyles({
appBar: {
// position: 'fixed',
...theme.mixins.toolbar,
......@@ -21,21 +22,19 @@ const useStyles = makeStyles((theme: Theme) =>
width: '100%',
},
})
)
type BaseType = Omit<ToolbarProps, 'classes' | 'nav'>
export interface AppBarProps extends BaseType {
className?: string
position?: MuiAppBarProps['position']
children?: React.ReactNode
onNavClick?(event: React.MouseEvent<HTMLButtonElement, MouseEvent>): void
style?: MuiAppBarProps['style']
}
const AppBar = ({ className, position = 'static', actions, title, children, onNavClick, style }: AppBarProps) => {
const classes = useStyles()
const AppBar = ({ sx, position = 'static', actions, title, children, onNavClick, style }: AppBarProps) => {
const [fadeIn, setFadeIn] = useState(false)
const styles = useStyles(useTheme())
const onCollapse: CollapseProps['onEntered'] = (el, isAppearing) => {
setFadeIn(isAppearing)
......@@ -48,13 +47,13 @@ const AppBar = ({ className, position = 'static', actions, title, children, onNa
// ) : null
return (
<>
<MuiAppBar className={cn(classes.appBar, className)} position={position} style={style}>
<MuiAppBar sx={deepmerge(styles.appBar, sx || {})} position={position} style={style}>
<Toolbar title={title} actions={actions} /*nav={nav}*/ />
{children && (
<Collapse appear enter in onEntered={onCollapse} timeout={400}>
<div>
<Fade in={fadeIn} enter timeout={600}>
<div className={classes.content}>{children}</div>
<Box sx={styles.content}>{children}</Box>
</Fade>
</div>
</Collapse>
......
cli/web/cliente/src/components/molecules/AppBar/styles.ts
View file @ e63508b1
import { createStyles, makeStyles, Theme } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
export const useStyles = makeStyles((theme: Theme) =>
createStyles({
export const useStyles = (theme: Theme) =>
createSxStyles({
grow: {
flexGrow: 1,
},
......@@ -9,4 +10,3 @@ export const useStyles = makeStyles((theme: Theme) =>
marginRight: theme.spacing(2),
},
})
)
cli/web/cliente/src/components/molecules/CircularProgress/CircularProgress.tsx
View file @ e63508b1
import cn from 'classnames'
import deepmerge from 'deepmerge'
import React from 'react'
import CircularProgressMUI from '@material-ui/core/CircularProgress'
import Container from '@material-ui/core/Container'
import Box from '@mui/material/Box'
import CircularProgressMUI from '@mui/material/CircularProgress'
import { useStyles } from './styles'
import { styles } from './styles'
interface Props {
className?: string
......@@ -12,13 +12,10 @@ interface Props {
}
const CircularProgress = (props: Props) => {
const classes = useStyles()
return (
<Container
className={cn(classes.container, { [classes.allContainer]: props.root })}
>
<Box sx={deepmerge(styles.container, props.root ? styles.allContainer : {})}>
<CircularProgressMUI className={props.className} color="secondary" />
</Container>
</Box>
)
}
......
cli/web/cliente/src/components/molecules/CircularProgress/styles.ts
View file @ e63508b1
import { createStyles, makeStyles, Theme } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
export const useStyles = makeStyles((theme: Theme) =>
createStyles({
container: {
display: 'flex',
flex: 1,
justifyContent: 'center',
alignItems: 'center'
},
allContainer: {
height: '100vh'
}
})
)
export const styles = createSxStyles({
container: {
display: 'flex',
flex: 1,
justifyContent: 'center',
alignItems: 'center',
},
allContainer: {
height: '100vh',
},
})
cli/web/cliente/src/components/molecules/ContextButton/ContextButton.tsx
View file @ e63508b1
import React from 'react'
import IconButton from '@material-ui/core/IconButton'
import ListItemText from '@material-ui/core/ListItemText'
import Menu from '@material-ui/core/Menu'
import MenuItem from '@material-ui/core/MenuItem'
import { MoreVert as ContextIconVertical } from '@material-ui/icons'
import { MoreVert as ContextIconVertical } from '@mui/icons-material'
import IconButton from '@mui/material/IconButton'
import ListItemText from '@mui/material/ListItemText'
import Menu from '@mui/material/Menu'
import MenuItem from '@mui/material/MenuItem'
export interface ContextItem {
icon?: React.ReactElement
......@@ -38,23 +39,10 @@ export default function ContextButton({ menuId, disabled, menuItems, className,
return (
<>
<IconButton
disabled={disabled}
className={className}
aria-controls={menuId}
aria-haspopup="true"
onClick={handleClick}
>
<IconButton disabled={disabled} className={className} aria-controls={menuId} aria-haspopup="true" onClick={handleClick}>
<ContextIconVertical />
</IconButton>
<Menu
id={menuId}
anchorEl={anchorEl}
keepMounted
open={Boolean(anchorEl)}
onClose={handleClose}
className={menuClassName}
>
<Menu id={menuId} anchorEl={anchorEl} keepMounted open={Boolean(anchorEl)} onClose={handleClose} className={menuClassName}>
{menuItems.map((item, index) => (
<MenuItem key={index} onClick={(e) => handleItemClick(e, item)}>
{/* <ListItemIcon>{item.icon}</ListItemIcon> */}
......
cli/web/cliente/src/components/molecules/DialogLayout/DialogLayout.tsx
View file @ e63508b1
import React from 'react'
// import AppBar from '@material-ui/core/AppBar'
// import AppBar from '@mui/material/AppBar'
import AppBar from '@agiliza/components/molecules/AppBar'
import { IconButton } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import DialogActions from '@material-ui/core/DialogActions'
// import Toolbar from '@material-ui/core/Toolbar'
// import IconButton from '@material-ui/core/IconButton'
import DialogContent from '@material-ui/core/DialogContent'
import DialogTitle from '@material-ui/core/DialogTitle'
import Slide from '@material-ui/core/Slide'
import { TransitionProps } from '@material-ui/core/transitions/transition'
import CloseIcon from '@material-ui/icons/Close'
import CloseIcon from '@mui/icons-material/Close'
import { IconButton } from '@mui/material'
import Dialog from '@mui/material/Dialog'
import DialogActions from '@mui/material/DialogActions'
// import Toolbar from '@mui/material/Toolbar'
// import IconButton from '@mui/material/IconButton'
import DialogContent from '@mui/material/DialogContent'
import DialogTitle from '@mui/material/DialogTitle'
import Slide from '@mui/material/Slide'
import { TransitionProps } from '@mui/material/transitions/transition'
import type { DialogProps } from '@material-ui/core/Dialog'
import type { DialogProps } from '@mui/material/Dialog'
const Transition = React.forwardRef(function Transition(
props: TransitionProps & { children?: React.ReactElement<any, any> },
ref: React.Ref<unknown>
......
cli/web/cliente/src/components/molecules/DialogLayout/styles.ts
View file @ e63508b1
import { Theme, createStyles } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material'
export const styles = (theme: Theme) =>
createStyles({
createSxStyles({
appBar: { position: 'relative' },
title: {
marginLeft: theme.spacing(2),
flex: 1
}
flex: 1,
},
})
cli/web/cliente/src/components/molecules/Drawer/Drawer.tsx
View file @ e63508b1
import cn from 'classnames'
import deepmerge from 'deepmerge'
import React from 'react'
import { RouteComponentProps } from 'react-router'
import logo from '@agiliza/public/images/logo.svg'
import { actions as loginActions } from '@agiliza/redux/ui/login'
import Divider from '@material-ui/core/Divider'
import MUIDrawer from '@material-ui/core/Drawer'
import { ListItemProps } from '@mui/material'
import Divider from '@mui/material/Divider'
import MUIDrawer from '@mui/material/Drawer'
import { useTheme } from '@mui/material/styles'
import { useStyles } from './styles'
type ExtendedTypes = RouteComponentProps
interface DrawerItemsProps extends ExtendedTypes {
listItemClassName?: string
sx: ListItemProps['sx']
toggleDrawer: () => void
logout: Props['logout']
}
......@@ -28,30 +30,29 @@ export interface Props extends BaseProps {
const Drawer = (props: Props) => {
const { drawerOpen, toggleDrawer, Items, logout, ...routeProps } = props
const classes = useStyles()
const styles = useStyles(useTheme())
return (
<MUIDrawer
variant="temporary"
open={drawerOpen}
className={cn(classes.drawer, {
[classes.drawerOpen]: drawerOpen,
[classes.drawerClose]: !drawerOpen,
})}
classes={{
paper: cn(classes.drawer, {
[classes.drawerOpen]: drawerOpen,
[classes.drawerClose]: !drawerOpen,
}),
sx={deepmerge(styles.drawer, drawerOpen ? styles.drawerOpen : styles.drawerClose)}
// classes={{
// paper: cn(classes.drawer, {
// [classes.drawerOpen]: drawerOpen,
// [classes.drawerClose]: !drawerOpen,
// }),
// }}
PaperProps={{
sx: deepmerge(styles.drawer, drawerOpen ? styles.drawerOpen : styles.drawerClose),
}}
onBackdropClick={() => toggleDrawer()}
>
<div className={classes.header}>
<img src={logo} className={classes.headerLogo} alt="Camedics Logo" />
<div style={styles.header}>
<img src={logo} style={styles.headerLogo} alt="Camedics Logo" />
</div>
<Divider />
{Items ? <Items logout={logout} listItemClassName={classes.listItem} toggleDrawer={toggleDrawer} {...routeProps} /> : null}
{Items ? <Items logout={logout} sx={styles.listItem} toggleDrawer={toggleDrawer} {...routeProps} /> : null}
{/* <DrawerItems listItemClassName={classes.listItem} toggleDrawer={toggleDrawer} {...routerProps} /> */}
{/* <div className={classes.grow} /> */}
{/* <Divider /> */}
......
cli/web/cliente/src/components/molecules/Drawer/styles.ts
View file @ e63508b1
import { drawerWidth, toolbarHeight } from '@agiliza/constants/styles'
import { createStyles, makeStyles, Theme } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material'
export const useStyles = makeStyles((theme: Theme) => {
export const useStyles = (theme: Theme) => {
const drawerClosedWidth = theme.spacing(0)
const hover = '&:hover'
return createStyles({
return createSxStyles({
grow: {
flexGrow: 1,
},
......@@ -87,4 +88,4 @@ export const useStyles = makeStyles((theme: Theme) => {
},
headerLogo: { width: 100, height: 'auto' },
})
})
}
cli/web/cliente/src/components/molecules/ErrorDialog/ErrorDialog.tsx
View file @ e63508b1
......@@ -4,15 +4,12 @@ import { bindActionCreators, Dispatch } from 'redux'
import { StoreState } from '@agiliza/redux'
import { actions as errorActions, selectors, State as ErrorState } from '@agiliza/redux/ui/error'
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
import DialogActions from '@material-ui/core/DialogActions'
import DialogContent from '@material-ui/core/DialogContent'
import DialogContentText from '@material-ui/core/DialogContentText'
import DialogTitle from '@material-ui/core/DialogTitle'
import { withStyles } from '@material-ui/styles'
import { styles } from './styles'
import Button from '@mui/material/Button'
import Dialog from '@mui/material/Dialog'
import DialogActions from '@mui/material/DialogActions'
import DialogContent from '@mui/material/DialogContent'
import DialogContentText from '@mui/material/DialogContentText'
import DialogTitle from '@mui/material/DialogTitle'
interface Props {
error: ErrorState['error']
......@@ -60,4 +57,4 @@ const mapDispatchToProps = (dispatch: Dispatch) =>
dispatch
)
export default connect(mapStateToProps, mapDispatchToProps)(withStyles(styles)(ErrorDialog))
export default connect(mapStateToProps, mapDispatchToProps)(ErrorDialog)
cli/web/cliente/src/components/molecules/ErrorDialog/styles.ts
View file @ e63508b1
import { Theme, createStyles } from '@material-ui/core/styles'
export const styles = (theme: Theme) => createStyles({})
cli/web/cliente/src/components/molecules/PopoverVersion/PopoverVersion.tsx
View file @ e63508b1
import React, { useState } from 'react'
import Popover from '@material-ui/core/Popover'
import Typography from '@material-ui/core/Typography'
import InfoIcon from '@material-ui/icons/InfoRounded'
import { WithStyles, withStyles } from '@material-ui/styles'
import InfoIcon from '@mui/icons-material/InfoRounded'
import Popover from '@mui/material/Popover'
import { useTheme } from '@mui/material/styles'
import Typography from '@mui/material/Typography'
import { styles } from './styles'
import { useStyles } from './styles'
interface Props extends WithStyles<typeof styles> {}
interface Props {}
interface PopItem {
key: string
......@@ -16,10 +16,11 @@ interface PopItem {
}
const PopoverVersion = (props: Props) => {
const { classes } = props
const [popItems] = useState<PopItem[]>([])
const [anchor, setAnchor] = useState<HTMLDivElement | null>(null)
const styles = useStyles(useTheme())
// useEffect(() => {
// let items: PopItem[] = [{ key: 'Versão', value: VERSION }]
// if (service) {
......@@ -35,16 +36,16 @@ const PopoverVersion = (props: Props) => {
const createPopItems = (items: PopItem[]) =>
items.map((item, i) => (
<Typography className={classes.msg} color="textPrimary" key={i}>
<Typography sx={styles.msg} color="textPrimary" key={i} component="span">
{`${item.key}: `}
{<span style={{ textDecoration: item.underline ? 'underline' : undefined }}>{item.value || ''}</span>}
</Typography>
))
return (
<div className={classes.root}>
<div style={styles.root}>
<div onClick={(evt) => setAnchor(evt.currentTarget)}>
<InfoIcon className={classes.infoBtn} color="primary" />
<InfoIcon sx={styles.infoBtn} color="primary" />
</div>
<Popover
id="version-popover"
......@@ -60,9 +61,9 @@ const PopoverVersion = (props: Props) => {
horizontal: 'right',
}}
>
<div className={classes.popoverContent}>{createPopItems(popItems)}</div>
<div style={styles.popoverContent}>{createPopItems(popItems)}</div>
</Popover>
</div>
)
}
export default withStyles(styles)(PopoverVersion)
export default PopoverVersion
cli/web/cliente/src/components/molecules/PopoverVersion/styles.ts
View file @ e63508b1
import { createStyles, Theme } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material'
export const styles = (theme: Theme) =>
createStyles({
export const useStyles = (theme: Theme) =>
createSxStyles({
root: { position: 'fixed', bottom: theme.spacing(5), right: theme.spacing(5) },
popoverContent: { padding: theme.spacing(1.5) },
msg: {
......
cli/web/cliente/src/components/organisms/DashboardCard/DashboardCard.tsx
View file @ e63508b1
import cn from 'classnames'
import deepmerge from 'deepmerge'
import React from 'react'
import { makeStyles, Theme } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme, useTheme } from '@mui/material/styles'
const useStyles = makeStyles((theme: Theme) => ({
card: {
// backgroundColor: '#fafafa',
height: 100,
width: 175,
padding: theme.spacing(1),
border: '1px solid #dfdfdf',
borderRadius: '10px',
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
// color: theme.palette.grey[500],
transform: 'scale(1)',
transition: theme.transitions.create(['color', 'border', 'transform'], {
duration: theme.transitions.duration.short,
}),
'&:hover': {
transform: 'scale(1.03)',
color: theme.palette.primary.main,
borderColor: theme.palette.primary.main,
cursor: 'pointer',
border: `1px solid ${theme.palette.primary.main}`,
const useStyles = (theme: Theme) =>
createSxStyles({
card: {
// backgroundColor: '#fafafa',
height: '100px',
width: '175px',
padding: theme.spacing(1),
border: '1px solid #dfdfdf',
borderRadius: '10px',
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
// color: theme.palette.grey[500],
transform: 'scale(1)',
transition: theme.transitions.create(['color', 'border', 'transform'], {
duration: theme.transitions.duration.short,
}),
'&:hover': {
transform: 'scale(1.03)',
color: theme.palette.primary.main,
borderColor: theme.palette.primary.main,
cursor: 'pointer',
border: `1px solid ${theme.palette.primary.main}`,
},
},
},
cardIcon: {
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
},
cardDescription: {
textAlign: 'center',
},
}))
cardIcon: {
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
},
cardDescription: {
textAlign: 'center',
},
})
export interface DashboardCardProps {
label: string
icon: React.ReactNode
className?: string
style?: React.CSSProperties
onClick?(): void
}
function DashboardCard(props: DashboardCardProps) {
const classes = useStyles()
const styles = useStyles(useTheme())
return (
<div onClick={props.onClick} className={cn(classes.card, props.className)}>
<div className={classes.cardIcon}>{props.icon}</div>
<div className={classes.cardDescription}>{props.label}</div>
<div onClick={props.onClick} style={deepmerge(styles.card, props.style || {})}>
<div style={styles.cardIcon}>{props.icon}</div>
<div style={styles.cardDescription}>{props.label}</div>
</div>
)
}
......
cli/web/cliente/src/components/organisms/ImageUpload/ImageUpload.tsx
View file @ e63508b1
import cn from 'classnames'
import deepmerge from 'deepmerge'
import React from 'react'
import { Button } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { PhotoCamera as PhotoCameraIcon } from '@material-ui/icons'
import { PhotoCamera as PhotoCameraIcon } from '@mui/icons-material'
import { Button, ButtonProps } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
image?: string
onChangeImage: React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>['onChange']
label: string
imageStyle?: React.HTMLAttributes<HTMLDivElement>['style']
className?: string
buttonClassName?: string
style?: React.CSSProperties
sx?: ButtonProps['sx']
}
const ImageUpload = (props: Props) => {
const { classes, className, buttonClassName, image, onChangeImage, label, imageStyle } = props
const { style, sx = {}, image, onChangeImage, label, imageStyle = {} } = props
const styles = useStyles(useTheme())
return (
<div className={cn(className, classes.container)}>
<Button variant="text" component="label" className={cn(classes.photoBtn, buttonClassName)} classes={{ label: classes.photoLabelBtn }}>
<div style={deepmerge(style || {}, styles.container)}>
{/* <Button variant="text" sx={deepmerge(styles.photoBtn, sx || {})} > */}
<Button variant="text" component="label" sx={deepmerge(styles.photoBtn, sx || {})}>
{image ? (
<div className={classes.card} style={imageStyle}>
<img src={'data:image/png;base64,' + image} className={classes.media} />
<div style={deepmerge(styles.card, imageStyle)}>
<img src={'data:image/png;base64,' + image} style={styles.media} />
</div>
) : (
<PhotoCameraIcon />
......@@ -44,4 +46,4 @@ const ImageUpload = (props: Props) => {
)
}
export default withStyles(styles)(ImageUpload)
export default ImageUpload
cli/web/cliente/src/components/organisms/ImageUpload/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
export default (theme: Theme) =>
createSxStyles({
container: { width: '100%', textAlign: 'center', marginTop: theme.spacing(1), marginBottom: theme.spacing(1) },
photoBtn: { width: '100%' },
photoLabelBtn: { display: 'flex', flexDirection: 'column', height: '280px', alignItems: 'center', flexGrow: 1 },
photoBtn: { width: '100%', '&.MuiButton-text': { display: 'flex', flexDirection: 'column', height: '280px', alignItems: 'center', flexGrow: 1 } },
card: { width: '100%', maxWidth: '100%', height: '100%', textAlign: 'center' },
media: {
height: '230px',
......@@ -15,4 +14,3 @@ export default (theme: Theme) => {
// paddingTop: '56.25%', // 16:9
},
})
}
cli/web/cliente/src/components/organisms/PhoneField/PhoneField.tsx
View file @ e63508b1
import React from 'react'
import { maskPhone } from '@agiliza/utils/masks'
import { TextField, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { TextField, TextFieldProps } from '@mui/material'
import styles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
value?: string
onChange: TextFieldProps['onChange']
label?: string
......@@ -19,4 +14,4 @@ const PhoneField = (props: Props) => {
return <TextField variant="outlined" label={label || 'Telefone'} value={maskPhone(value)} onChange={onChange} inputProps={{ maxLength: 15 }} />
}
export default withStyles(styles)(PhoneField)
export default PhoneField
cli/web/cliente/src/components/organisms/PhoneField/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({})
}
export default createSxStyles({})
cli/web/cliente/src/components/particles/Icons/BellIcon.tsx
View file @ e63508b1
import React from 'react'
import { SvgIcon } from '@material-ui/core'
import { SvgIcon } from '@mui/material'
interface Props {}
......
cli/web/cliente/src/components/particles/Icons/SecurityProfileIcon.tsx
View file @ e63508b1
import React from 'react'
import SvgIcon, { SvgIconProps } from '@material-ui/core/SvgIcon'
import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'
interface Props extends SvgIconProps {}
......
cli/web/cliente/src/components/particles/Icons/ShareSquareIcon.tsx
View file @ e63508b1
import React from 'react'
import SvgIcon, { SvgIconProps } from '@material-ui/core/SvgIcon'
import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'
interface Props extends SvgIconProps {}
......
cli/web/cliente/src/components/particles/Icons/TermIcon.tsx
View file @ e63508b1
import React from 'react'
import SvgIcon, { SvgIconProps } from '@material-ui/core/SvgIcon'
import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'
interface Props extends SvgIconProps {}
......
cli/web/cliente/src/components/particles/Icons/UploadIcon.tsx
View file @ e63508b1
import React from 'react'
import SvgIcon, { SvgIconProps } from '@material-ui/core/SvgIcon'
import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'
interface Props extends SvgIconProps {}
......@@ -9,7 +10,7 @@ export default (props: Props) => {
{...props}
style={{
width: 21,
height: 21
height: 21,
}}
viewBox="0 0 21 21"
>
......
cli/web/cliente/src/components/particles/Icons/VialIcon.tsx
View file @ e63508b1
import React from 'react'
import SvgIcon, { SvgIconProps } from '@material-ui/core/SvgIcon'
import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'
interface Props extends SvgIconProps {}
......@@ -9,7 +10,7 @@ export default (props: Props) => {
{...props}
style={{
width: 21,
height: 21
height: 21,
}}
viewBox="0 0 21 21"
>
......
cli/web/cliente/src/components/templates/AccountInputsPhoto/AccountInputsPhoto.tsx
View file @ e63508b1
......@@ -3,14 +3,11 @@ import React from 'react'
import { BanestesAccount } from '@agiliza/api/domain'
import ImageUpload from '@agiliza/components/organisms/ImageUpload'
import { extractNumbers, getBase64FromFile } from '@agiliza/utils/method'
import { TextField, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { TextField, TextFieldProps } from '@mui/material'
import styles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
values: BanestesAccount
onChanges: {
account: (type: keyof BanestesAccount) => TextFieldProps['onChange']
......@@ -20,7 +17,7 @@ interface Props extends ExtendedProps {
}
const AccountInputsPhoto = (props: Props) => {
const { classes, values, onChanges } = props
const { values, onChanges } = props
const { agencyNumber, cardPicture, number } = values
const handleChangeField = (type: keyof BanestesAccount): TextFieldProps['onChange'] => onChanges.account(type)
......@@ -34,8 +31,8 @@ const AccountInputsPhoto = (props: Props) => {
}
return (
<div className={classes.accountInputsPhotoContainer}>
<div className={classes.accountInputsContainer}>
<div style={styles.accountInputsPhotoContainer}>
<div style={styles.accountInputsContainer}>
<TextField
label="Número da agência"
value={extractNumbers(agencyNumber) || ''}
......@@ -49,4 +46,4 @@ const AccountInputsPhoto = (props: Props) => {
)
}
export default withStyles(styles)(AccountInputsPhoto)
export default AccountInputsPhoto
cli/web/cliente/src/components/templates/AccountInputsPhoto/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
accountInputsPhotoContainer: { width: '100%', height: '100%' },
accountInputsContainer: { height: '100%' },
photoBtn: { minWidth: '50%' },
photoLabelBtn: { display: 'flex', flexDirection: 'column', height: '280px', alignItems: 'center', flexGrow: 1 },
card: { width: 'auto', height: 'auto' },
media: {
height: '250px',
width: 'auto',
// paddingTop: '56.25%', // 16:9
},
})
}
export default createSxStyles({
accountInputsPhotoContainer: { width: '100%', height: '100%' },
accountInputsContainer: { height: '100%' },
photoBtn: { minWidth: '50%' },
photoLabelBtn: { display: 'flex', flexDirection: 'column', height: '280px', alignItems: 'center', flexGrow: 1 },
card: { width: 'auto', height: 'auto' },
media: {
height: '250px',
width: 'auto',
// paddingTop: '56.25%', // 16:9
},
})
cli/web/cliente/src/components/templates/Address/Address.tsx
View file @ e63508b1
......@@ -3,15 +3,13 @@ import React, { useMemo } from 'react'
import { City, State } from '@agiliza/api/domain'
import { maskCEP } from '@agiliza/utils/masks'
import { SelectField, SelectFieldProps } from '@curio/components'
import { TextField, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { TextField, TextFieldProps } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { AddressState } from './state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
states: State[]
cities: City[]
state: AddressState
......@@ -19,7 +17,8 @@ interface Props extends ExtendedProps {
}
const Address = (props: Props) => {
const { classes, state: _state, onChange, states, cities } = props
const styles = useStyles(useTheme())
const { state: _state, onChange, states, cities } = props
const { cep, street, number, complement, state, city, district } = _state
......@@ -54,7 +53,8 @@ const Address = (props: Props) => {
onChange={handleChangeSelect('state')}
items={states.map((st) => ({ label: st.name, value: st.id }))}
shrink={false}
className={classes.selectField}
// sx={classes.selectField}
sx={styles.selectField}
/>
<SelectField
id="state-select"
......@@ -65,11 +65,11 @@ const Address = (props: Props) => {
onChange={handleChangeSelect('city')}
items={availableCities.map((st) => ({ label: st.name, value: st.id }))}
shrink={false}
className={classes.selectField}
sx={styles.selectField}
/>
<TextField variant="outlined" label="Bairro" value={district} onChange={handleChange('district')} />
</>
)
}
export default withStyles(styles)(Address)
export default Address
cli/web/cliente/src/components/templates/Address/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material'
// eslint-disable-next-line
export default (theme: Theme) =>
createStyles({
createSxStyles({
form: { display: 'flex', flexDirection: 'column' },
selectField: { marginBottom: theme.spacing(2) },
})
cli/web/cliente/src/components/templates/FirstAccess/FirstAccess.tsx
View file @ e63508b1
......@@ -5,16 +5,14 @@ import PhoneField from '@agiliza/components/organisms/PhoneField'
import { useErrorValidator } from '@agiliza/utils/hooks/errorValidation'
import { ActionType } from '@agiliza/utils/hooks/state'
import CPFCNPJField from '@agiliza/views/ProposalData/components/atoms/CPFCNPJField'
import { TextField, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { TextField, TextFieldProps } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import AddressForm, { AddressState } from '../Address'
import { initState, State as FirstAccessState } from './state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
states: State[]
cities: City[]
state: FirstAccessState
......@@ -22,12 +20,14 @@ interface Props extends ExtendedProps {
}
const FirstAccess = (props: Props) => {
const { classes, states, cities, state, actions } = props
const { states, cities, state, actions } = props
const { cpf, name, email, phone, ...addressState } = state
const { actions: errorActions } = useErrorValidator(initState)
const styles = useStyles(useTheme())
const handleChange =
(key: keyof FirstAccessState): TextFieldProps['onChange'] =>
(evt) => {
......@@ -39,7 +39,7 @@ const FirstAccess = (props: Props) => {
}
return (
<form className={classes.form}>
<form style={styles.form}>
<CPFCNPJField value={cpf} onChange={handleChange('cpf')} onlyCPF disabled />
<TextField variant="outlined" label="Nome" value={name} onChange={handleChange('name')} />
<TextField variant="outlined" label="Email" value={email} onChange={handleChange('email')} />
......@@ -49,4 +49,4 @@ const FirstAccess = (props: Props) => {
)
}
export default withStyles(styles)(FirstAccess)
export default FirstAccess
cli/web/cliente/src/components/templates/FirstAccess/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
// eslint-disable-next-line
export default (theme: Theme) =>
createStyles({
createSxStyles({
form: {
display: 'flex',
flexDirection: 'column',
......
cli/web/cliente/src/components/templates/Login/Login.tsx
View file @ e63508b1
import React from 'react'
import TextFieldWithIcon from '@agiliza/components/atoms/TextFieldWithIcon'
import { InputAdornment, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { AccountCircle } from '@material-ui/icons'
import { AccountCircle } from '@mui/icons-material'
import { InputAdornment, TextFieldProps } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
username: string
password: string
onChange(type: 'username' | 'password'): TextFieldProps['onChange']
}
const Login = (props: Props) => {
const { classes, username, password, onChange } = props
const styles = useStyles(useTheme())
const { username, password, onChange } = props
return (
<form className={classes.form}>
<form style={styles.form}>
<TextFieldWithIcon
autoFocus
required
value={username}
onChange={onChange('username')}
label="CPF"
className={classes.usernameTxtField}
sx={styles.usernameTxtField}
inputProps={{ maxLength: 14 }}
InputProps={{
startAdornment: (
......@@ -41,4 +40,4 @@ const Login = (props: Props) => {
)
}
export default withStyles(styles)(Login)
export default Login
cli/web/cliente/src/components/templates/Login/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material'
// eslint-disable-next-line
export default (theme: Theme) =>
createStyles({
createSxStyles({
title: {
fontSize: '150%',
fontWeight: 'bold',
......@@ -30,5 +30,5 @@ export default (theme: Theme) =>
width: '100%',
margin: theme.spacing(2),
},
usernameTxtField: { marginBottom: 10 },
usernameTxtField: { marginBottom: theme.spacing(2) },
})
cli/web/cliente/src/components/templates/NotFound/NotFound.tsx
View file @ e63508b1
import React from 'react'
import { RouteComponentProps } from 'react-router-dom'
import { Typography } from '@material-ui/core'
import { createStyles, Theme } from '@material-ui/core/styles'
import { withStyles, WithStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Typography } from '@mui/material'
import { Theme, useTheme } from '@mui/material/styles'
const styles = (theme: Theme) =>
createStyles({
const useStyles = (theme: Theme) =>
createSxStyles({
container: {
paddingLeft: theme.spacing(2),
},
......@@ -15,19 +15,20 @@ const styles = (theme: Theme) =>
},
})
type Props = WithStyles<typeof styles> & RouteComponentProps
type Props = RouteComponentProps
interface NotFoundProps extends Props {}
function NotFound({ classes }: NotFoundProps) {
function NotFound(props: NotFoundProps) {
const styles = useStyles(useTheme())
return (
<div className={classes.container}>
<div style={styles.container}>
<Typography variant="h3">404: Página não encontrada</Typography>
<div className={classes.messageBox}>
<div style={styles.messageBox}>
<Typography variant="h5">A página pela qual você procurou não existe.</Typography>
</div>
</div>
)
}
export default /*#__PURE__*/ withStyles(styles)(NotFound)
export default /*#__PURE__*/ NotFound
cli/web/cliente/src/components/templates/RGTemplate/RGTemplate.tsx
View file @ e63508b1
......@@ -4,20 +4,19 @@ import { RG } from '@agiliza/api/domain'
import ImageUpload from '@agiliza/components/organisms/ImageUpload'
import { maskRG } from '@agiliza/utils/masks'
import { getBase64FromFile } from '@agiliza/utils/method'
import { TextField, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { TextField, TextFieldProps } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
rg?: RG
onChange: (rg: Partial<RG>) => void
}
const RGTemplate = (props: Props) => {
const { classes, rg, onChange } = props
const { rg, onChange } = props
const styles = useStyles(useTheme())
const handleChangePhoto =
(key: keyof Pick<RG, 'front' | 'back'>): React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>['onChange'] =>
......@@ -36,10 +35,10 @@ const RGTemplate = (props: Props) => {
}
return (
<div className={classes.container}>
<div className={classes.imagesContainer}>
<ImageUpload label="Frente" image={rg?.front} onChangeImage={handleChangePhoto('front')} className={classes.imageUpload} />
<ImageUpload label="Verso" image={rg?.back} onChangeImage={handleChangePhoto('back')} className={classes.imageUpload} />
<div style={styles.container}>
<div style={styles.imagesContainer}>
<ImageUpload label="Frente" image={rg?.front} onChangeImage={handleChangePhoto('front')} sx={styles.imageUpload} />
<ImageUpload label="Verso" image={rg?.back} onChangeImage={handleChangePhoto('back')} sx={styles.imageUpload} />
</div>
<TextField
variant="outlined"
......@@ -53,4 +52,4 @@ const RGTemplate = (props: Props) => {
)
}
export default withStyles(styles)(RGTemplate)
export default RGTemplate
cli/web/cliente/src/components/templates/RGTemplate/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
container: { display: 'flex', flexDirection: 'column', alignItems: 'center' },
imagesContainer: { display: 'flex', width: '100%', padding: theme.spacing(1) },
imageUpload: { width: '50%', textAlign: 'center' },
......
cli/web/cliente/src/constants/styles.ts
View file @ e63508b1
import { CSSProperties } from '@material-ui/styles/withStyles'
import { CSSProperties } from '@mui/system'
export const drawerWidth = 300
export const toolbarHeight = 124
export const drawerWidth = '300px'
export const toolbarHeight = '124px'
export const flexColumn: CSSProperties = {
display: 'flex',
......
cli/web/cliente/src/index.tsx
View file @ e63508b1
......@@ -8,9 +8,9 @@ import { render } from 'react-dom'
import { Provider } from 'react-redux'
import { browser, SUPPORTED_BROWSERS } from '@agiliza/constants/browser'
import DateFnsUtils from '@date-io/date-fns'
import { MuiThemeProvider } from '@material-ui/core/styles'
import { MuiPickersUtilsProvider } from '@material-ui/pickers'
import { LocalizationProvider } from '@mui/lab'
import AdapterDateFns from '@mui/lab/AdapterDateFns'
import { ThemeProvider } from '@mui/material/styles'
import { SESSION_KEY } from './api/useCases/shared'
import ErrorDialog from './components/molecules/ErrorDialog'
......@@ -28,12 +28,12 @@ interface Props {}
const Adm = (props: Props) => {
return (
<Provider store={store}>
<MuiThemeProvider theme={theme}>
<MuiPickersUtilsProvider utils={DateFnsUtils} locale={ptBR}>
<ThemeProvider theme={theme}>
<LocalizationProvider dateAdapter={AdapterDateFns} locale={ptBR}>
<Views />
<ErrorDialog />
</MuiPickersUtilsProvider>
</MuiThemeProvider>
</LocalizationProvider>
</ThemeProvider>
</Provider>
)
}
......
cli/web/cliente/src/theme/index.ts
View file @ e63508b1
import red from '@material-ui/core/colors/red'
import { createMuiTheme } from '@material-ui/core/styles'
import red from '@mui/material/colors/red'
import { createTheme } from '@mui/material/styles'
import { SxProps } from '@mui/system'
export const defaultToobarHeight = 64
export const theme = createMuiTheme({
export const theme = createTheme({
palette: {
primary: {
light: '#034da6',
main: '#0d3366'
main: '#0d3366',
},
secondary: {
main: '#23a897',
contrastText: '#fafafa'
contrastText: '#fafafa',
},
text: { primary: '#2e2e2e' },
error: {
main: red[500]
}
main: red[500],
},
},
mixins: {
toolbar: {
minHeight: defaultToobarHeight
}
minHeight: defaultToobarHeight,
},
},
typography: {
fontSize: 13,
fontFamily: "'Rubik', 'Roboto', 'Open Sans', sans-serif"
fontFamily: "'Rubik', 'Roboto', 'Open Sans', sans-serif",
},
overrides: {
components: {
MuiInputBase: {
input: {
'&:-webkit-autofill': {
WebkitBoxShadow: '0 0 0 1000px white inset'
}
}
styleOverrides: {
input: {
'&:-webkit-autofill': {
WebkitBoxShadow: '0 0 0 1000px white inset',
},
},
},
},
MuiTableCell: {
root: {
fontFamily: 'Heebo'
}
styleOverrides: {
root: {
fontFamily: 'Heebo',
},
},
},
MuiListItemText: {
primary: {
fontFamily: 'Heebo'
}
styleOverrides: {
primary: {
fontFamily: 'Heebo',
},
},
},
MuiDialogContentText: {
root: {
fontFamily: 'Heebo'
}
styleOverrides: {
root: {
fontFamily: 'Heebo',
},
},
},
MuiListItemIcon: {
root: {
minWidth: 40
}
}
}
styleOverrides: {
root: {
minWidth: 40,
},
},
},
},
})
export const createSxStyles = <T extends { [k: string]: SxProps<typeof theme> }>(obj: T) => obj
cli/web/cliente/src/views/BrowserIncompatible/BrowserIncompatible.tsx
View file @ e63508b1
......@@ -2,13 +2,12 @@ import cn from 'classnames'
import React from 'react'
import { browser, SUPPORTED_BROWSERS } from '@agiliza/constants/browser'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Link } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {}
interface Props {}
const chrome = SUPPORTED_BROWSERS['chrome'].replace(/(>=)/g, '') + '+'
const firefox = SUPPORTED_BROWSERS['firefox'].replace(/(>=)/g, '') + '+'
......@@ -16,33 +15,33 @@ const edge = SUPPORTED_BROWSERS['windows']['edge'].replace(/(>=)/g, '') + '+'
const safari = SUPPORTED_BROWSERS['macos']['safari'].replace(/(>=)/g, '') + '+'
const BrowserIncompatible = (props: Props) => {
const { classes } = props
const styles = useStyles(useTheme())
return (
<div className={classes.page}>
<i className={cn('fas fa-exclamation-circle', classes.titleIcon)} />
<h1 className={classes.title}>Navegador não suportado</h1>
<p className={classes.subTitle}>{`Você está usando o ${browser.getBrowserName()} na versão ${browser.getBrowserVersion()}`}</p>
<p className={classes.subTitle}>É recomendado utilizar o {process.env.APP_TITLE} em um dos seguintes navegadores:</p>
<div className={classes.browserList}>
<a target="#" className={classes.anchorBrowser} href="https://www.google.com/chrome/">
<i className={cn('fab fa-chrome', classes.icon)} />
<div style={styles.page}>
<i className="fas fa-exclamation-circle" style={styles.titleIcon} />
<h1 style={styles.title}>Navegador não suportado</h1>
<p style={styles.subTitle}>{`Você está usando o ${browser.getBrowserName()} na versão ${browser.getBrowserVersion()}`}</p>
<p style={styles.subTitle}>É recomendado utilizar o {process.env.APP_TITLE} em um dos seguintes navegadores:</p>
<div style={styles.browserList}>
<Link target="#" sx={styles.anchorBrowser} href="https://www.google.com/chrome/">
<i className={cn('fab fa-chrome', styles.icon)} />
Chrome {chrome}
</a>
<a target="#" className={classes.anchorBrowser} href="https://www.mozilla.org/en-US/firefox/new/">
<i className={cn('fab fa-firefox-browser', classes.icon)} />
</Link>
<Link target="#" sx={styles.anchorBrowser} href="https://www.mozilla.org/en-US/firefox/new/">
<i className={cn('fab fa-firefox-browser', styles.icon)} />
Firefox {firefox}
</a>
<a target="#" className={classes.anchorBrowser} href="https://www.microsoft.com/en-us/edge">
<i className={cn('fab fa-edge', classes.icon)}></i>
</Link>
<Link target="#" sx={styles.anchorBrowser} href="https://www.microsoft.com/en-us/edge">
<i className={cn('fab fa-edge', styles.icon)}></i>
Edge {edge}
</a>
<a target="#" className={classes.anchorBrowser} href="https://support.apple.com/downloads/safari">
<i className={cn('fab fa-safari', classes.icon)}></i>
</Link>
<Link target="#" sx={styles.anchorBrowser} href="https://support.apple.com/downloads/safari">
<i className={cn('fab fa-safari', styles.icon)}></i>
Safari {safari}
</a>
</Link>
</div>
</div>
)
}
export default withStyles(styles)(BrowserIncompatible)
export default BrowserIncompatible
cli/web/cliente/src/views/BrowserIncompatible/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core'
import { createStyles } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material'
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
page: {
display: 'flex',
flexDirection: 'column',
......@@ -16,7 +16,7 @@ export default (theme: Theme) => {
title: {
textAlign: 'center',
marginBottom: '1rem',
fontSize: 'xx-large',
fontSize: 'xxx-large',
fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif',
},
subTitle: {
......
cli/web/cliente/src/views/Login/Login.tsx
View file @ e63508b1
......@@ -9,9 +9,11 @@ import { StoreState } from '@agiliza/redux'
import { isAuthenticated } from '@agiliza/redux/session/selectors'
import { actions } from '@agiliza/redux/ui/login'
import { isFetching } from '@agiliza/redux/ui/login/selectors'
import InputAdornment from '@material-ui/core/InputAdornment'
import Typography from '@material-ui/core/Typography'
import AccountCircle from '@material-ui/icons/AccountCircle'
import AccountCircle from '@mui/icons-material/AccountCircle'
import Box from '@mui/material/Box'
import InputAdornment from '@mui/material/InputAdornment'
import { useTheme } from '@mui/material/styles'
import Typography from '@mui/material/Typography'
import { useStyles } from './styles'
......@@ -28,7 +30,7 @@ interface Props extends BaseProps {
const Login = (props: Props) => {
const { loginRequest, authenticated, fetching, redirectTo } = props
const classes = useStyles()
const styles = useStyles(useTheme())
const [username, setUsername] = useState('')
const [password, setPassword] = useState('')
......@@ -42,20 +44,20 @@ const Login = (props: Props) => {
}
return (
<div className={classes.container}>
<div style={styles.container}>
{/* <div className={classes.logo} /> */}
<div className={classes.formContainer}>
<Typography align="center" className={classes.title} color="primary">
<Box sx={styles.formContainer}>
<Typography align="center" sx={styles.title} color="primary">
{process.env.APP_TITLE}
</Typography>
<form className={classes.form} onKeyDown={(evt) => evt.keyCode === 13 && handleLogin()}>
<form style={styles.form} onKeyDown={(evt) => evt.keyCode === 13 && handleLogin()}>
<TextFieldWithIcon
autoFocus
required
value={username}
onChange={(evt) => setUsername(evt.target.value)}
label="Usuário"
className={classes.usernameTxtField}
sx={styles.usernameTxtField}
InputProps={{
startAdornment: (
<InputAdornment position="start">
......@@ -69,7 +71,7 @@ const Login = (props: Props) => {
<ButtonWithProgress disabled={!username} color="secondary" fetching={fetching} onClick={handleLogin}>
Entrar
</ButtonWithProgress>
</div>
</Box>
{/* <PopoverVersion service={service} /> */}
</div>
)
......
cli/web/cliente/src/views/Login/styles.ts
View file @ e63508b1
import { flexColumn } from '@agiliza/constants/styles'
import { makeStyles, Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
// eslint-disable-next-line
export const useStyles = makeStyles((theme: Theme) =>
createStyles({
export const useStyles = (theme: Theme) =>
createSxStyles({
title: {
fontSize: '150%',
fontWeight: 'bold',
......@@ -41,6 +41,5 @@ export const useStyles = makeStyles((theme: Theme) =>
display: 'flex',
flexDirection: 'column',
},
usernameTxtField: { marginBottom: 10 },
usernameTxtField: { marginBottom: theme.spacing(2) },
})
)
cli/web/cliente/src/views/Main/DrawerItems/DrawerItems.tsx
View file @ e63508b1
import cn from 'classnames'
import React from 'react'
import ItemWithIcon from '@agiliza/components/atoms/ItemWithIcon'
import List from '@material-ui/core/List'
import { AttachMoney as AttachMoneyIcon, ExitToApp } from '@material-ui/icons'
import withStyles from '@material-ui/styles/withStyles'
import { AttachMoney as AttachMoneyIcon, ExitToApp } from '@mui/icons-material'
import { ListItemProps } from '@mui/material'
import List from '@mui/material/List'
import { useTheme } from '@mui/material/styles'
import { styles } from './styles'
import { useStyles } from './styles'
import type { WithStyles } from '@material-ui/styles/withStyles'
import type { RouteComponentProps } from 'react-router-dom'
import type { Props as DrawerProps } from '@agiliza/components/molecules/Drawer'
interface ListItem {
......@@ -32,10 +31,10 @@ export const mapPathToTitle = (path: string) => {
return drawerListItems.find((dL) => dL.path === path)?.label || ''
}
type ExtendedTypes = RouteComponentProps & WithStyles<typeof styles>
type ExtendedTypes = RouteComponentProps
interface Props extends ExtendedTypes {
listItemClassName?: string
sx: ListItemProps['sx']
toggleDrawer: () => void
logout: DrawerProps['logout']
}
......@@ -46,30 +45,26 @@ const isCurrentPath = (history: RouteComponentProps['history'], path: string) =>
}
const DrawerItems = (props: Props) => {
const { listItemClassName, history, classes, toggleDrawer, logout } = props
const styles = useStyles(useTheme())
const { sx, history, toggleDrawer, logout } = props
const handleClick = (path: string) => () => {
history.push(path)
toggleDrawer()
}
const listItemComponent = (label: string, path: string, Icon: React.ComponentType) => (
<ItemWithIcon
key={path}
label={label}
className={cn(listItemClassName, { [classes.selected]: isCurrentPath(history, path) })}
onClick={handleClick(path)}
>
<ItemWithIcon key={path} label={label} sx={{ ...sx, ...(isCurrentPath(history, path) ? styles.selected : {}) }} onClick={handleClick(path)}>
<Icon />
</ItemWithIcon>
)
return (
<List className={classes.list}>
<List sx={styles.list}>
{drawerListItems.map((item) => listItemComponent(item.label, item.path, item.Icon))}
<ItemWithIcon label="Sair" className={listItemClassName} onClick={() => logout()}>
<ItemWithIcon label="Sair" sx={sx} onClick={() => logout()}>
<ExitToApp />
</ItemWithIcon>
</List>
)
}
export default withStyles(styles)(DrawerItems)
export default DrawerItems
cli/web/cliente/src/views/Main/DrawerItems/styles.ts
View file @ e63508b1
import { drawerWidth } from '@agiliza/constants/styles'
import { createStyles, Theme } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material'
export const styles = (theme: Theme) => {
return createStyles({
export const useStyles = (theme: Theme) =>
createSxStyles({
selected: {
backgroundColor: theme.palette.primary.light,
color: theme.palette.primary.contrastText,
......@@ -37,4 +38,3 @@ export const styles = (theme: Theme) => {
},
grow: { flex: 1 },
})
}
cli/web/cliente/src/views/Main/Main.tsx
View file @ e63508b1
......@@ -6,20 +6,20 @@ import CircularProgress from '@agiliza/components/molecules/CircularProgress'
import { actions as drawerActions } from '@agiliza/redux/ui/drawer'
import { actions as loginActions } from '@agiliza/redux/ui/login'
import { ProposalDataRouteState } from '@agiliza/views/ProposalData/pages/ProposalData'
import { Button, ListItem, ListItemIcon, ListItemText, Menu, Typography } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { AccountCircleOutlined as PersonIcon, MeetingRoom as LogoutIcon } from '@material-ui/icons'
import { AccountCircleOutlined as PersonIcon, MeetingRoom as LogoutIcon } from '@mui/icons-material'
import { Button, Link, ListItem, ListItemIcon, ListItemText, Menu, Typography } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import connect, { ConnectedProps } from './connect'
import { PATHS } from './DrawerItems'
import styles from './styles'
import useStyles from './styles'
const SimulationCreditLines = lazy(() => import('@agiliza/views/SimulationCreditLines/pages/router'))
const ProposalData = lazy(() => import('@agiliza/views/ProposalData/pages/ProposalData'))
const Projects = lazy(() => import('@agiliza/views/Projects/pages/router'))
// const SecurityProfile = lazy(() => import('@curio/ui/dist/views/SecurityProfile'))
type BaseProps = RouteComponentProps & ConnectedProps & WithStyles<typeof styles>
type BaseProps = RouteComponentProps & ConnectedProps
interface Props extends BaseProps {
toggleDrawer: typeof drawerActions.toggleDrawer
......@@ -27,7 +27,8 @@ interface Props extends BaseProps {
}
const Main = (props: Props) => {
const { classes, toggleDrawer, fetchMenu, customer } = props
const { toggleDrawer, fetchMenu, customer } = props
const styles = useStyles(useTheme())
const history = useHistory()
......@@ -55,20 +56,24 @@ const Main = (props: Props) => {
}
return (
<div className={classes.pageContainer}>
<div style={styles.pageContainer}>
<AppBar
onNavClick={toggleDrawer}
title={
<div style={{ display: 'flex' }}>
<a onClick={() => history.push('/')} className={classes.titleAnchor}>
<Typography className={classes.appTitle}>Agiliza</Typography>
</a>
<>
<Link onClick={() => history.push('/')} sx={styles.titleAnchor}>
<Typography sx={styles.appTitle}>Agiliza</Typography>
</Link>
<div style={{ flex: 1 }} />
</>
}
actions={
<>
<Button color="inherit" variant="text" onClick={() => history.push(PATHS.proposals)}>
Retomar proposta
</Button>
{customer && <Button onClick={handleProfileClick} key="1" color="inherit" endIcon={<PersonIcon />} />}
</div>
</>
}
/>
{/* <Drawer drawerOpen={drawerOpen} toggleDrawer={toggleDrawer} logout={logout} Items={DrawerItems} {...routeProps} /> */}
......@@ -100,4 +105,4 @@ const Main = (props: Props) => {
)
}
export default connect(withStyles(styles)(Main))
export default connect(Main)
cli/web/cliente/src/views/Main/styles.ts
View file @ e63508b1
import { createStyles, Theme } from '@material-ui/core/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../shared-styles'
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
pageContainer: {
height: '100vh',
......@@ -14,7 +15,7 @@ export default (theme: Theme) => {
paddingBottom: 0,
justifyContent: 'flex-start',
},
appTitle: { flexGrow: 1, fontSize: '100%', textTransform: 'uppercase' },
titleAnchor: { cursor: 'pointer' },
appTitle: { flexGrow: 1, fontSize: '100%', textTransform: 'uppercase', color: 'white' },
titleAnchor: { cursor: 'pointer', display: { xs: 'none', sm: 'block' } },
})
}
cli/web/cliente/src/views/Projects/pages/ListProjects/ListProjects.tsx
View file @ e63508b1
......@@ -3,27 +3,30 @@ import { RouteComponentProps } from 'react-router'
import { Project } from '@agiliza/api/domain/project'
import { PATHS } from '@agiliza/views/Main/DrawerItems'
import { Apps as AppsIcon } from '@mui/icons-material'
import {
Avatar,
Box,
CircularProgress,
List,
ListItem,
ListItemAvatar,
ListItemText,
ListSubheader
} from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Apps as AppsIcon } from '@material-ui/icons'
} from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { connected, ConnectedProps } from './connect'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles> & ConnectedProps & RouteComponentProps
type ExtendedProps = ConnectedProps & RouteComponentProps
interface Props extends ExtendedProps {}
const ListProjects = (props: Props) => {
const { classes, fetching, proposals, history } = props
const { fetching, proposals, history } = props
const styles = useStyles(useTheme())
useEffect(() => {
props.getProjects()
......@@ -37,9 +40,9 @@ const ListProjects = (props: Props) => {
if (fetching) return <CircularProgress />
return (
<div className={classes.pageContent}>
<Box sx={styles.pageContent}>
<List
className={classes.list}
sx={styles.list}
subheader={
<ListSubheader component="div" id="nested-list-subheader">
Projetos
......@@ -57,8 +60,8 @@ const ListProjects = (props: Props) => {
</ListItem>
))}
</List>
</div>
</Box>
)
}
export default connected(withStyles(styles)(ListProjects))
export default connected(ListProjects)
cli/web/cliente/src/views/Projects/pages/ListProjects/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material'
import sharedStyles from '../shared-styles'
// eslint-disable-next-line
export default (theme: Theme) =>
createStyles({
const styles = (theme: Theme) =>
createSxStyles({
...sharedStyles(theme),
list: { width: '100%' },
})
export default styles
cli/web/cliente/src/views/Projects/pages/router.tsx
View file @ e63508b1
......@@ -3,10 +3,10 @@ import { Route, RouteComponentProps, Switch } from 'react-router'
import AuthRoute from '@agiliza/components/atoms/AuthRoute'
import { PATHS } from '@agiliza/views/Main/DrawerItems'
import { CircularProgress } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Box, CircularProgress } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import styles from './shared-styles'
import useStyles from './shared-styles'
export const PROJECTS_PATHS = {
login: PATHS.proposals + '/login',
......@@ -15,23 +15,22 @@ export const PROJECTS_PATHS = {
const ListProjects = lazy(() => import('./ListProjects'))
const Login = lazy(() => import('@agiliza/views/Login'))
type ExtendedProps = WithStyles<typeof styles> & RouteComponentProps
type ExtendedProps = RouteComponentProps
interface Props extends ExtendedProps {}
const ProposalDataRouter = (props: Props) => {
const { classes } = props
const styles = useStyles(useTheme())
return (
<div className={classes.pageContent}>
<Suspense fallback={<CircularProgress className={classes.circularProgress} />}>
<Box sx={styles.pageContent}>
<Suspense fallback={<CircularProgress sx={styles.circularProgress} />}>
<Switch>
<Route path={PROJECTS_PATHS.login} render={(renderProps) => <Login {...renderProps} redirectTo={PATHS.proposals} />} />
<AuthRoute path={PATHS.proposals} redirectTo={PROJECTS_PATHS.login} component={ListProjects} />
</Switch>
</Suspense>
</div>
</Box>
)
}
export default withStyles(styles)(ProposalDataRouter)
export default ProposalDataRouter
cli/web/cliente/src/views/Projects/pages/shared-styles.ts
View file @ e63508b1
import { createSxStyles } from '@agiliza/theme'
import sharedStyles from '@agiliza/views/shared-styles'
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { Theme } from '@mui/material'
// eslint-disable-next-line
export default (theme: Theme) =>
createStyles({
const styles = (theme: Theme) =>
createSxStyles({
...sharedStyles(theme),
title: { marginBottom: theme.spacing(2) },
})
export default styles
cli/web/cliente/src/views/ProposalData/components/atoms/CPFCNPJField/CPFCNPJField.tsx
View file @ e63508b1
import React from 'react'
import { maskCNPJ, maskCPFCNPJ } from '@agiliza/utils/masks'
import { TextField, TextFieldProps } from '@material-ui/core'
import { TextField, TextFieldProps } from '@mui/material'
type ExtendedProps = Record<string, unknown> & Pick<TextFieldProps, 'value' | 'onChange' | 'disabled'>
......
cli/web/cliente/src/views/ProposalData/components/templates/Address/Address.tsx
View file @ e63508b1
......@@ -3,15 +3,11 @@ import React from 'react'
import { IPAddress } from '@agiliza/api/domain'
import { maskCEP } from '@agiliza/utils/masks'
import { extractNumbers } from '@agiliza/utils/method'
import { TextField, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { TextField, TextFieldProps } from '@mui/material'
import { AddressState } from './state'
import styles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
state: AddressState
onChange: (address: Partial<IPAddress>) => void
}
......@@ -35,4 +31,4 @@ const Address = (props: Props) => {
)
}
export default withStyles(styles)(Address)
export default Address
cli/web/cliente/src/views/ProposalData/components/templates/Address/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
form: {
'& .MuiTextField-root': {
marginBottom: theme.spacing(2),
......
cli/web/cliente/src/views/ProposalData/components/templates/PriceAmountInput/PriceAmountInput.tsx
View file @ e63508b1
......@@ -2,7 +2,7 @@ import React from 'react'
import { extractNumbers } from '@agiliza/utils/extractors'
import { formatCurrency } from '@agiliza/utils/formatters'
import { TextField, TextFieldProps } from '@material-ui/core'
import { TextField, TextFieldProps } from '@mui/material'
const getTotalPrice = <T extends { price: string; amount: string }>(pva: T) => {
const { amount, price } = pva
......
cli/web/cliente/src/views/ProposalData/pages/BusinessData/Address/Address.tsx
View file @ e63508b1
import React from 'react'
import { ActionType } from '@agiliza/utils/hooks/state'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { useTheme } from '@mui/material/styles'
import { connected, ConnectedProps } from './connect'
import Form from './Form'
import { BDAddressState } from './state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles> & ConnectedProps
type ExtendedProps = ConnectedProps
interface Props extends ExtendedProps {
state: BDAddressState
......@@ -16,15 +16,16 @@ interface Props extends ExtendedProps {
}
const Address = (props: Props) => {
const { classes, context, state, actions } = props
const { context, state, actions } = props
const styles = useStyles(useTheme())
return (
<div className={classes.contentContainer}>
<div className={classes.content}>
<div style={styles.contentContainer}>
<div style={styles.content}>
<Form state={state} actions={actions} context={context} />
</div>
</div>
)
}
export default connected(withStyles(styles)(Address))
export default connected(Address)
cli/web/cliente/src/views/ProposalData/pages/BusinessData/Address/Form/Form.tsx
View file @ e63508b1
......@@ -5,22 +5,21 @@ import ImageUpload from '@agiliza/components/organisms/ImageUpload'
import AddressTemplate from '@agiliza/components/templates/Address'
import { ActionType } from '@agiliza/utils/hooks/state'
import { getBase64FromFile } from '@agiliza/utils/method'
import { TextField, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Box, TextField, TextFieldProps } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { BDAddressState } from '../state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
state: BDAddressState
actions: ActionType<BDAddressState>
context: AuthenticationContext
}
const Form = (props: Props) => {
const { classes, state: _state, actions, context } = props
const { state: _state, actions, context } = props
const styles = useStyles(useTheme())
const { cep, number, street, city, complement, district, state, referencePoint, proof } = _state
......@@ -39,7 +38,7 @@ const Form = (props: Props) => {
}
return (
<form className={classes.form}>
<Box sx={styles.form} component="form">
<ImageUpload label="Comprovante de residência" image={proof} onChangeImage={handleChangeProof} />
<AddressTemplate
states={context.states}
......@@ -48,8 +47,8 @@ const Form = (props: Props) => {
onChange={(addrs) => actions.update(addrs)}
/>
<TextField variant="outlined" label="Ponto de referência" value={referencePoint} onChange={handleChangeText('referencePoint')} />
</form>
</Box>
)
}
export default withStyles(styles)(Form)
export default Form
cli/web/cliente/src/views/ProposalData/pages/BusinessData/Address/Form/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
form: {
'& .MuiTextField-root': {
......
cli/web/cliente/src/views/ProposalData/pages/BusinessData/Address/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
})
}
cli/web/cliente/src/views/ProposalData/pages/BusinessData/BusinessData.tsx
View file @ e63508b1
import React from 'react'
import { RouteComponentProps } from 'react-router'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import styles from './styles'
type ExtendedProps = WithStyles<typeof styles> & RouteComponentProps
type ExtendedProps = RouteComponentProps
interface Props extends ExtendedProps {}
const BusinessData = (props: Props) => {
const { classes } = props
return <div className={classes.contentContainer}></div>
return <div></div>
}
export default withStyles(styles)(BusinessData)
export default BusinessData
cli/web/cliente/src/views/ProposalData/pages/BusinessData/Identification/Form/Form.tsx
View file @ e63508b1
......@@ -6,22 +6,21 @@ import { ActionType } from '@agiliza/utils/hooks/state'
import { getBase64FromFile } from '@agiliza/utils/method'
import CPFCNPJField from '@agiliza/views/ProposalData/components/atoms/CPFCNPJField'
import { DatePicker, SelectField, SelectFieldProps } from '@curio/components'
import { TextField, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Box, TextField, TextFieldProps } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { BDIdentificationState } from '../state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
state: BDIdentificationState
actions: ActionType<BDIdentificationState>
context: ProposalDataContext
}
const Form = (props: Props) => {
const { classes, state, actions, context } = props
const { state, actions, context } = props
const styles = useStyles(useTheme())
const {
cnpj,
......@@ -44,8 +43,8 @@ const Form = (props: Props) => {
actions.update({ [key]: evt.target.value })
}
const handleChangeDate = (type: keyof Pick<BDIdentificationState, 'openingDate'>) => (date: Date | null) => {
actions.update({ [type]: date })
const handleChangeDate = (type: keyof Pick<BDIdentificationState, 'openingDate'>) => (date: unknown) => {
actions.update({ [type]: date as Date })
}
const handleChangeSelect =
......@@ -68,7 +67,7 @@ const Form = (props: Props) => {
}
return (
<form className={classes.form}>
<Box sx={styles.form}>
<DocumentTemplate document={document} context={context} onChangeImage={handleChangeProof} onChangeDocumentType={handleChangeDocumentType} />
<CPFCNPJField value={cnpj} onChange={handleChangeText('cnpj')} onlyCPNJ />
<DatePicker
......@@ -76,8 +75,8 @@ const Form = (props: Props) => {
label="Data da abertura"
value={openingDate}
onChange={handleChangeDate('openingDate')}
format="dd/MM/yyyy"
className={classes.datePicker}
// format="dd/MM/yyyy"
sx={styles.datePicker}
/>
<TextField variant="outlined" label="Inscrição estadual" value={stateRegistration} onChange={handleChangeText('stateRegistration')} />
<TextField variant="outlined" label="Inscrição municipal" value={cityRegistration} onChange={handleChangeText('cityRegistration')} />
......@@ -117,8 +116,8 @@ const Form = (props: Props) => {
/>
<TextField variant="outlined" type="tel" label="Código CNAE" value={codeCNAE} onChange={handleChangeText('codeCNAE')} />
<TextField variant="outlined" label="Atividade principal" value={mainActivity} onChange={handleChangeText('mainActivity')} />
</form>
</Box>
)
}
export default withStyles(styles)(Form)
export default Form
cli/web/cliente/src/views/ProposalData/pages/BusinessData/Identification/Form/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
form: {
'& .MuiTextField-root': {
......
cli/web/cliente/src/views/ProposalData/pages/BusinessData/Identification/Identification.tsx
View file @ e63508b1
import React from 'react'
import { ActionType } from '@agiliza/utils/hooks/state'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { useTheme } from '@mui/material/styles'
import { connected, ConnectedProps } from './connect'
import Form from './Form'
import { BDIdentificationState } from './state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles> & ConnectedProps
type ExtendedProps = ConnectedProps
interface Props extends ExtendedProps {
state: BDIdentificationState
......@@ -16,15 +16,16 @@ interface Props extends ExtendedProps {
}
const Identification = (props: Props) => {
const { classes, context, state, actions } = props
const { context, state, actions } = props
const styles = useStyles(useTheme())
return (
<div className={classes.contentContainer}>
<div className={classes.content}>
<div style={styles.contentContainer}>
<div style={styles.content}>
<Form state={state} actions={actions} context={context} />
</div>
</div>
)
}
export default connected(withStyles(styles)(Identification))
export default connected(Identification)
cli/web/cliente/src/views/ProposalData/pages/BusinessData/Identification/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
})
}
cli/web/cliente/src/views/ProposalData/pages/BusinessData/ProductsServices/Dialog/Dialog.tsx
View file @ e63508b1
......@@ -10,14 +10,14 @@ import {
DialogContent,
DialogProps,
DialogTitle
} from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
} from '@mui/material'
import { useTheme } from '@mui/material/styles'
import Form from '../Form'
import { initialState } from '../state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = Pick<DialogProps, 'open'> & WithStyles<typeof styles>
type ExtendedProps = Pick<DialogProps, 'open'>
interface Props extends ExtendedProps {
onClose: () => void
......@@ -27,7 +27,8 @@ interface Props extends ExtendedProps {
}
const Dialog = (props: Props) => {
const { classes, fetching, open, onClose, onSave, productService } = props
const { fetching, open, onClose, onSave, productService } = props
const styles = useStyles(useTheme())
const formState = useFormState('VehicleForm', initialState)
......@@ -43,7 +44,7 @@ const Dialog = (props: Props) => {
}
return (
<MUIDialog onClose={onClose} aria-labelledby="simple-dialog-title" open={open} PaperProps={{ className: classes.dialog }}>
<MUIDialog onClose={onClose} aria-labelledby="simple-dialog-title" open={open} PaperProps={{ sx: styles.dialog }}>
<DialogTitle>{productService ? 'Editar' : 'Adicionar'} pessoa envolvida</DialogTitle>
<DialogContent>
<Form {...formState} />
......@@ -58,4 +59,4 @@ const Dialog = (props: Props) => {
)
}
export default withStyles(styles)(Dialog)
export default Dialog
cli/web/cliente/src/views/ProposalData/pages/BusinessData/ProductsServices/Dialog/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
dialog: { width: '80%', height: '55%' },
})
......
cli/web/cliente/src/views/ProposalData/pages/BusinessData/ProductsServices/Form/Form.tsx
View file @ e63508b1
......@@ -5,21 +5,20 @@ import { ActionType } from '@agiliza/utils/hooks/state'
import PriceAmountInput, {
Values
} from '@agiliza/views/ProposalData/components/templates/PriceAmountInput'
import { TextField, TextFieldProps, Typography } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Box, TextField, TextFieldProps, Typography } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { BDProductServiceState } from '../state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
state: BDProductServiceState
actions: ActionType<BDProductServiceState>
}
const Form = (props: Props) => {
const { classes, state, actions } = props
const { state, actions } = props
const styles = useStyles(useTheme())
const { description, unit, stock, monthlySales, variableCosts } = state
......@@ -34,17 +33,17 @@ const Form = (props: Props) => {
}
return (
<form className={classes.form}>
<Box component="form" sx={styles.form}>
<TextField variant="outlined" label="Descrição do produto / serviço" value={description} onChange={handleChangeText('description')} />
<TextField variant="outlined" label="Unidade" value={extractNumbers(unit)} onChange={handleChangeText('unit')} type="tel" />
<Typography className={classes.label}>Informações de estoque</Typography>
<Typography sx={styles.label}>Informações de estoque</Typography>
<PriceAmountInput values={stock} onChange={handleChangePriceAmount('stock')} />
<Typography className={classes.label}>Vendas mensais</Typography>
<Typography sx={styles.label}>Vendas mensais</Typography>
<PriceAmountInput values={monthlySales} onChange={handleChangePriceAmount('monthlySales')} />
<Typography className={classes.label}>Custos variáveis</Typography>
<Typography sx={styles.label}>Custos variáveis</Typography>
<PriceAmountInput values={variableCosts} onChange={handleChangePriceAmount('variableCosts')} />
</form>
</Box>
)
}
export default withStyles(styles)(Form)
export default Form
cli/web/cliente/src/views/ProposalData/pages/BusinessData/ProductsServices/Form/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
form: {
'& .MuiTextField-root': {
......
cli/web/cliente/src/views/ProposalData/pages/BusinessData/ProductsServices/ProductsServices.tsx
View file @ e63508b1
......@@ -2,16 +2,16 @@ import React, { useState } from 'react'
import { BDProductService } from '@agiliza/api/domain'
import { ActionType } from '@agiliza/utils/hooks/state'
import { Avatar, List, ListItem, ListItemAvatar, ListItemText } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Add as AddIcon, Apps as AppsIcon } from '@material-ui/icons'
import { Add as AddIcon, Apps as AppsIcon } from '@mui/icons-material'
import { Avatar, List, ListItem, ListItemAvatar, ListItemText } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { connected, ConnectedProps } from './connect'
import Dialog from './Dialog'
import { BDProductServiceState } from './state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles> & ConnectedProps
type ExtendedProps = ConnectedProps
interface Props extends ExtendedProps {
projectId: string
......@@ -20,7 +20,8 @@ interface Props extends ExtendedProps {
}
const ProductsServices = (props: Props) => {
const { classes, fetching, projectId, productsServices } = props
const { fetching, projectId, productsServices } = props
const styles = useStyles(useTheme())
const [selectedProductService, setSelectedProductService] = useState<BDProductService | undefined>()
......@@ -51,9 +52,9 @@ const ProductsServices = (props: Props) => {
return (
<>
<div className={classes.contentContainer}>
<div className={classes.content}>
<List className={classes.list}>
<div style={styles.contentContainer}>
<div style={styles.content}>
<List sx={styles.list}>
{productsServices.map((vehicle, i) => (
<ListItem key={i} button onClick={handleClickListItem(vehicle)}>
<ListItemAvatar>
......@@ -67,7 +68,7 @@ const ProductsServices = (props: Props) => {
</List>
</div>
</div>
<Avatar className={classes.avatarBtnContainer} onClick={handleClickAdd}>
<Avatar sx={styles.avatarBtnContainer} onClick={handleClickAdd}>
<AddIcon />
</Avatar>
<Dialog fetching={fetching} open={open} onClose={handleClickClose} productService={selectedProductService} onSave={handleSave} />
......@@ -75,4 +76,4 @@ const ProductsServices = (props: Props) => {
)
}
export default connected(withStyles(styles)(ProductsServices))
export default connected(ProductsServices)
cli/web/cliente/src/views/ProposalData/pages/BusinessData/ProductsServices/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
list: { width: '100%' },
avatarBtnContainer: {
......
cli/web/cliente/src/views/ProposalData/pages/BusinessData/StockSalesCosts/Form/Form.tsx
View file @ e63508b1
......@@ -7,15 +7,13 @@ import { ActionType } from '@agiliza/utils/hooks/state'
import { maskMonthYear } from '@agiliza/utils/masks'
import { getBase64FromFile } from '@agiliza/utils/method'
import { SelectField, SelectFieldProps } from '@curio/components'
import { TextField, TextFieldProps, Typography } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Box, TextField, TextFieldProps, Typography } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { BDStockSalesCostsState } from '../state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
state: BDStockSalesCostsState
actions: ActionType<BDStockSalesCostsState>
context: ProposalDataContext
......@@ -23,7 +21,8 @@ interface Props extends ExtendedProps {
}
const Form = (props: Props) => {
const { classes, state, actions, context, productsServices } = props
const { state, actions, context, productsServices } = props
const styles = useStyles(useTheme())
const { monthYearReference, salesCommission, document, monthRating } = state
......@@ -63,7 +62,7 @@ const Form = (props: Props) => {
}
return (
<form className={classes.form}>
<Box component="form" sx={styles.form}>
<DocumentTemplate context={context} document={document} onChangeImage={handleChangeImage} onChangeDocumentType={handleChangeDocumentType} />
{/* <Typography className={classes.label}>
Preencha as informações abaixo, e na tela seguinte informe os produtos/serviços e os respectivos dados referente a estoque, vendas mensais e
......@@ -87,7 +86,7 @@ const Form = (props: Props) => {
variant="outlined"
shrink={false}
/>
<Typography className={classes.label}>
<Typography sx={styles.label}>
Após o preenchimento das informações citadas acima, os totais abaixo serão preenchidos automaticamente.
</Typography>
<TextField variant="outlined" disabled label="Total geral estoque" value={formatCurrency(getTotals('stock').toFixed(2)) || ''} />
......@@ -99,8 +98,8 @@ const Form = (props: Props) => {
value={formatCurrency(getTotalCommission(salesCommission).toFixed(2)) || ''}
/>
<TextField variant="outlined" disabled label="Total geral custos var." value={formatCurrency(getTotals('variableCosts').toFixed(2)) || ''} />
</form>
</Box>
)
}
export default withStyles(styles)(Form)
export default Form
cli/web/cliente/src/views/ProposalData/pages/BusinessData/StockSalesCosts/Form/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
form: {
'& .MuiTextField-root': {
......
cli/web/cliente/src/views/ProposalData/pages/BusinessData/StockSalesCosts/StockSalesCosts.tsx
View file @ e63508b1
import React from 'react'
import { ActionType } from '@agiliza/utils/hooks/state'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { useTheme } from '@mui/material/styles'
import { connected, ConnectedProps } from './connect'
import Form from './Form'
import { BDStockSalesCostsState } from './state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles> & ConnectedProps
type ExtendedProps = ConnectedProps
interface Props extends ExtendedProps {
state: BDStockSalesCostsState
......@@ -16,15 +16,15 @@ interface Props extends ExtendedProps {
}
const StockSalesCosts = (props: Props) => {
const { classes, context, productsServices, state, actions } = props
const { context, productsServices, state, actions } = props
const styles = useStyles(useTheme())
return (
<div className={classes.contentContainer}>
<div className={classes.content}>
<div style={styles.contentContainer}>
<div style={styles.content}>
<Form state={state} actions={actions} context={context} productsServices={productsServices} />
</div>
</div>
)
}
export default connected(withStyles(styles)(StockSalesCosts))
export default connected(StockSalesCosts)
cli/web/cliente/src/views/ProposalData/pages/BusinessData/StockSalesCosts/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
})
}
cli/web/cliente/src/views/ProposalData/pages/BusinessData/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../shared-styles'
// eslint-disable-next-line
export default (theme: Theme) =>
createStyles({
createSxStyles({
...sharedStyles(theme),
cardsContainer: { display: 'flex' },
gridItem: { display: 'flex', justifyContent: 'center' },
......
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Address/Address.tsx
View file @ e63508b1
import React from 'react'
import { ActionType } from '@agiliza/utils/hooks/state'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { useTheme } from '@mui/material/styles'
import { connected, ConnectedProps } from './connect'
import Form from './Form'
import { CDAddressState } from './state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles> & ConnectedProps
type ExtendedProps = ConnectedProps
interface Props extends ExtendedProps {
state: CDAddressState
......@@ -16,15 +16,16 @@ interface Props extends ExtendedProps {
}
const Address = (props: Props) => {
const { classes, context, state, actions } = props
const { context, state, actions } = props
const styles = useStyles(useTheme())
return (
<div className={classes.contentContainer}>
<div className={classes.content}>
<div style={styles.contentContainer}>
<div style={styles.content}>
<Form states={context.states} cities={context.cities} state={state} actions={actions} />
</div>
</div>
)
}
export default connected(withStyles(styles)(Address))
export default connected(Address)
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Address/Form/Form.tsx
View file @ e63508b1
......@@ -5,14 +5,13 @@ import ImageUpload from '@agiliza/components/organisms/ImageUpload'
import Address, { AddressState } from '@agiliza/components/templates/Address'
import { ActionType } from '@agiliza/utils/hooks/state'
import { getBase64FromFile } from '@agiliza/utils/method'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Box } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { CDAddressState } from '../state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
states: State[]
cities: City[]
state: CDAddressState
......@@ -20,7 +19,8 @@ interface Props extends ExtendedProps {
}
const Form = (props: Props) => {
const { classes, state, actions, states, cities } = props
const { state, actions, states, cities } = props
const styles = useStyles(useTheme())
const { proof } = state
......@@ -37,11 +37,11 @@ const Form = (props: Props) => {
}
return (
<form className={classes.form}>
<Box component="form" sx={styles.form}>
<ImageUpload label="Comprovante de residência" image={proof} onChangeImage={handleChangeProof} />
<Address state={state} onChange={handleChangeAddress} states={states} cities={cities} />
</form>
</Box>
)
}
export default withStyles(styles)(Form)
export default Form
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Address/Form/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
switchCardPhotoContainer: { flexDirection: 'row', alignItems: 'center', justifyContent: 'space-evenly' },
datePicker: { marginBottom: '0px !important' },
......
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Address/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
})
}
cli/web/cliente/src/views/ProposalData/pages/CustomerData/CustomerData.tsx
View file @ e63508b1
import React from 'react'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import styles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
activeStep: number
}
const CustomerData = (props: Props) => {
const { classes } = props
return <div className={classes.stepContentContainer}>{}</div>
return <div />
}
export default withStyles(styles)(CustomerData)
export default CustomerData
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Home/Form/Form.tsx
View file @ e63508b1
......@@ -7,21 +7,20 @@ import { ActionType } from '@agiliza/utils/hooks/state'
import { extractNumbers, getBase64FromFile } from '@agiliza/utils/method'
import { SelectField, SelectFieldProps, Switch } from '@curio/components'
import {
Box,
Checkbox,
CheckboxProps,
FormControlLabel,
FormGroup,
TextField,
TextFieldProps
} from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
} from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { CDHomeState } from '../state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
addressContext: AuthenticationContext
state: CDHomeState
actions: ActionType<CDHomeState>
......@@ -29,7 +28,9 @@ interface Props extends ExtendedProps {
}
const Form = (props: Props) => {
const { classes, addressContext, context, state, actions } = props
const { addressContext, context, state, actions } = props
const styles = useStyles(useTheme())
const { states, cities } = addressContext
const { resideTime, cityResideTime, address, hasProperty, deed, type, deedRecord, reside, hasOnus } = state
......@@ -60,7 +61,7 @@ const Form = (props: Props) => {
}
return (
<form className={classes.form}>
<Box component="form" sx={styles.form}>
<Switch label="Possui imóveis?" value={hasProperty} onChange={(vl) => actions.update({ hasProperty: vl })} required />
{hasProperty ? (
<>
......@@ -83,7 +84,7 @@ const Form = (props: Props) => {
variant="outlined"
shrink={false}
/>
<FormGroup row className={classes.formGroup}>
<FormGroup row sx={styles.formGroup}>
<FormControlLabel
control={<Checkbox name="reside" checked={reside} onChange={handleChangeCheckbox('reside')} />}
label="Reside no imóvel?"
......@@ -110,8 +111,8 @@ const Form = (props: Props) => {
<AddressTemplate states={states} cities={cities} state={address} onChange={(addrs) => actions.update({ address: addrs as IPAddress })} />
</>
) : null}
</form>
</Box>
)
}
export default withStyles(styles)(Form)
export default Form
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Home/Form/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
switchCardPhotoContainer: { flexDirection: 'row', alignItems: 'center', justifyContent: 'space-evenly' },
formGroup: {
......
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Home/Home.tsx
View file @ e63508b1
import React from 'react'
import { ActionType } from '@agiliza/utils/hooks/state'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { useTheme } from '@mui/material/styles'
import { connected, ConnectedProps } from './connect'
import Form from './Form'
import { CDHomeState } from './state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles> & ConnectedProps
type ExtendedProps = ConnectedProps
interface Props extends ExtendedProps {
state: CDHomeState
......@@ -16,15 +16,16 @@ interface Props extends ExtendedProps {
}
const Home = (props: Props) => {
const { classes, context, addressContext, state, actions } = props
const { context, addressContext, state, actions } = props
const styles = useStyles(useTheme())
return (
<div className={classes.contentContainer}>
<div className={classes.content}>
<div style={styles.contentContainer}>
<div style={styles.content}>
<Form state={state} actions={actions} addressContext={addressContext} context={context} />
</div>
</div>
)
}
export default connected(withStyles(styles)(Home))
export default connected(Home)
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Home/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
})
}
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Identification/Form/Form.tsx
View file @ e63508b1
......@@ -5,22 +5,21 @@ import AccountInputsPhoto from '@agiliza/components/templates/AccountInputsPhoto
import { ActionType } from '@agiliza/utils/hooks/state'
import CPFCNPJField from '@agiliza/views/ProposalData/components/atoms/CPFCNPJField'
import { SelectField, SelectFieldProps } from '@curio/components'
import { FormControlLabel, Switch, TextField, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Box, FormControlLabel, Switch, TextField, TextFieldProps } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { CDIdentificationState } from '../state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
state: CDIdentificationState
actions: ActionType<CDIdentificationState>
context: ProposalDataContext
}
const Form = (props: Props) => {
const { classes, state, actions, context } = props
const { state, actions, context } = props
const styles = useStyles(useTheme())
const { cpfcnpj, dataType, name, gender, hasAccount, account } = state
......@@ -54,7 +53,7 @@ const Form = (props: Props) => {
const handleChangeValidState = (vldStt: boolean) => {}
return (
<form className={classes.form}>
<Box component="form" sx={styles.form}>
<SelectField
id="framework-select-field"
label="Enquadramento"
......@@ -75,7 +74,7 @@ const Form = (props: Props) => {
variant="outlined"
shrink={false}
/>
<div className={classes.switchCardPhotoContainer}>
<div style={styles.switchCardPhotoContainer}>
<FormControlLabel
label="Possui conta na entidade?"
control={
......@@ -96,8 +95,8 @@ const Form = (props: Props) => {
/>
) : null}
</div>
</form>
</Box>
)
}
export default withStyles(styles)(Form)
export default Form
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Identification/Form/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
switchCardPhotoContainer: { flexDirection: 'row', alignItems: 'center', justifyContent: 'space-evenly' },
})
......
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Identification/Identification.tsx
View file @ e63508b1
import React from 'react'
import { ActionType } from '@agiliza/utils/hooks/state'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { useTheme } from '@mui/material/styles'
import { connected, ConnectedProps } from './connect'
import Form from './Form'
import { CDIdentificationState } from './state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles> & ConnectedProps
type ExtendedProps = ConnectedProps
interface Props extends ExtendedProps {
state: CDIdentificationState
......@@ -16,16 +16,16 @@ interface Props extends ExtendedProps {
}
const Identification = (props: Props) => {
const { classes, context, state, actions } = props
const { context, state, actions } = props
const styles = useStyles(useTheme())
return (
<div className={classes.contentContainer}>
<div className={classes.content}>
<div style={styles.contentContainer}>
<div style={styles.content}>
<Form context={context} state={state} actions={actions} />
</div>
</div>
)
}
export default connected(withStyles(styles)(Identification))
export default connected(Identification)
cli/web/cliente/src/views/ProposalData/pages/CustomerData/Identification/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
})
}
cli/web/cliente/src/views/ProposalData/pages/CustomerData/PersonalData/Form/Form.tsx
View file @ e63508b1
......@@ -6,22 +6,21 @@ import RGTemplate from '@agiliza/components/templates/RGTemplate'
import { ActionType } from '@agiliza/utils/hooks/state'
import { maskLandline } from '@agiliza/utils/masks'
import { DatePicker, SelectField, SelectFieldProps, Switch } from '@curio/components'
import { TextField, TextFieldProps } from '@material-ui/core'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { Box, TextField, TextFieldProps } from '@mui/material'
import { useTheme } from '@mui/material/styles'
import { CDPersonalDataState } from '../state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles>
interface Props extends ExtendedProps {
interface Props {
state: CDPersonalDataState
actions: ActionType<CDPersonalDataState>
context: ProposalDataContext
}
const Form = (props: Props) => {
const { classes, state, actions, context } = props
const { state, actions, context } = props
const styles = useStyles(useTheme())
const {
birthday,
......@@ -39,8 +38,8 @@ const Form = (props: Props) => {
landline,
} = state
const handleChangeDate = (type: keyof Pick<CDPersonalDataState, 'birthday'>) => (date: Date | null) => {
actions.update({ [type]: date })
const handleChangeDate = (type: keyof Pick<CDPersonalDataState, 'birthday'>) => (date: unknown) => {
actions.update({ [type]: date as Date })
}
const handleChangeText =
......@@ -60,15 +59,8 @@ const Form = (props: Props) => {
}
return (
<form className={classes.form}>
<DatePicker
id="birthday"
label="Data de nascimento"
value={birthday}
onChange={handleChangeDate('birthday')}
format="dd/MM/yyyy"
className={classes.datePicker}
/>
<Box component="form" sx={styles.form}>
<DatePicker id="birthday" label="Data de nascimento" value={birthday} onChange={handleChangeDate('birthday')} sx={styles.datePicker} />
<RGTemplate rg={rg} onChange={handleChangeRG} />
<Switch label="Usuário CRAS?" required value={userCRAS} onChange={(value) => actions.update({ userCRAS: value })} />
<TextField variant="outlined" label="Nome da mãe" value={mothersName} onChange={handleChangeText('mothersName')} />
......@@ -103,8 +95,8 @@ const Form = (props: Props) => {
onChange={handleChangeText('landline')}
inputProps={{ maxLength: 14 }}
/>
</form>
</Box>
)
}
export default withStyles(styles)(Form)
export default Form
cli/web/cliente/src/views/ProposalData/pages/CustomerData/PersonalData/Form/styles.ts
View file @ e63508b1
import { Theme } from '@material-ui/core/styles'
import { createStyles } from '@material-ui/styles'
import { createSxStyles } from '@agiliza/theme'
import { Theme } from '@mui/material/styles'
import sharedStyles from '../styles'
// eslint-disable-next-line
export default (theme: Theme) => {
return createStyles({
return createSxStyles({
...sharedStyles(theme),
switchCardPhotoContainer: { flexDirection: 'row', alignItems: 'center', justifyContent: 'space-evenly' },
......
cli/web/cliente/src/views/ProposalData/pages/CustomerData/PersonalData/PersonalData.tsx
View file @ e63508b1
import React from 'react'
import { ActionType } from '@agiliza/utils/hooks/state'
import { withStyles, WithStyles } from '@material-ui/core/styles'
import { useTheme } from '@mui/material/styles'
import { connected, ConnectedProps } from './connect'
import Form from './Form'
import { CDPersonalDataState } from './state'
import styles from './styles'
import useStyles from './styles'
type ExtendedProps = WithStyles<typeof styles> & ConnectedProps
type ExtendedProps = ConnectedProps
interface Props extends ExtendedProps {
state: CDPersonalDataState
......@@ -16,15 +16,16 @@ interface Props extends ExtendedProps {
}
const PersonalData = (props: Props) => {
const { classes, context, state, actions } = props
const { context, state, actions } = props
const styles = useStyles(useTheme())
return (
<div className={classes.contentContainer}>
<div className={classes.content}>
<div style={styles.contentContainer}>
<div style={styles.content}>
<Form context={context} state={state} actions={actions} />
</div>
</div>
)
}
export default connected(withStyles(styles)(PersonalData))
export default connected(PersonalData)
cli/web/cliente/src/views/shared-styles.ts
View file @ e63508b1
This diff is collapsed.
cli/web/cliente/webpack.config.js
View file @ e63508b1
This diff is collapsed.
cli/web/cliente/yarn.lock
View file @ e63508b1
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment