ограничение ввода отрицательных чисел и мелкие правки по стилю
This commit is contained in:
parent
37c15047d4
commit
77b3ac8369
@ -217,11 +217,11 @@ const Discounts: React.FC = () => {
|
|||||||
const toTime = React.useRef<HTMLInputElement | null>(null);
|
const toTime = React.useRef<HTMLInputElement | null>(null);
|
||||||
const toCapacity = React.useRef<HTMLInputElement | null>(null);
|
const toCapacity = React.useRef<HTMLInputElement | null>(null);
|
||||||
|
|
||||||
const cleraAddedMore = () => {
|
// const cleraAddedMore = () => {
|
||||||
if (fieldAddedMore.current) {
|
// if (fieldAddedMore.current) {
|
||||||
fieldAddedMore.current.value = "";
|
// fieldAddedMore.current.value = "";
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
|
|
||||||
const checkFields = () => {
|
const checkFields = () => {
|
||||||
if( fieldName.current != null
|
if( fieldName.current != null
|
||||||
@ -268,6 +268,12 @@ const Discounts: React.FC = () => {
|
|||||||
discountsArraySet( discountsArray );
|
discountsArraySet( discountsArray );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const PositiveInput = (event:any) => {
|
||||||
|
const numberInput = parseInt(event.target.value);
|
||||||
|
if(isNaN(numberInput) || numberInput < 0) {event.target.value = '0'}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<React.Fragment>
|
<React.Fragment>
|
||||||
<LocalizationProvider dateAdapter={AdapterDayjs}>
|
<LocalizationProvider dateAdapter={AdapterDayjs}>
|
||||||
@ -285,33 +291,22 @@ const Discounts: React.FC = () => {
|
|||||||
СКИДКИ
|
СКИДКИ
|
||||||
</Typography>
|
</Typography>
|
||||||
|
|
||||||
<Box sx={{
|
<Box
|
||||||
|
sx={{
|
||||||
display: "flex",
|
display: "flex",
|
||||||
flexDirection: "column",
|
flexDirection: "column",
|
||||||
justifyContent: "left",
|
justifyContent: "left",
|
||||||
alignItems: "left",
|
alignItems: "left",
|
||||||
marginTop: "15px",
|
marginTop: "15px",
|
||||||
}}>
|
}}
|
||||||
<Typography
|
>
|
||||||
variant="h4"
|
|
||||||
sx={{
|
|
||||||
width: "90%",
|
|
||||||
height: "40px",
|
|
||||||
fontWeight: "normal",
|
|
||||||
color: theme.palette.grayDisabled.main,
|
|
||||||
marginTop: "35px"
|
|
||||||
}}>
|
|
||||||
Название:
|
|
||||||
</Typography>
|
|
||||||
<TextField
|
<TextField
|
||||||
id = "standard-basic"
|
id = "standard-basic"
|
||||||
label = { "" }
|
label = { "Название" }
|
||||||
variant = "filled"
|
variant = "filled"
|
||||||
color = "secondary"
|
color = "secondary"
|
||||||
sx={{
|
sx={{
|
||||||
width: "200px",
|
|
||||||
height: "30px",
|
height: "30px",
|
||||||
marginTop: "-20px"
|
|
||||||
}}
|
}}
|
||||||
InputProps={{
|
InputProps={{
|
||||||
style: {
|
style: {
|
||||||
@ -332,7 +327,8 @@ const Discounts: React.FC = () => {
|
|||||||
height: "40px",
|
height: "40px",
|
||||||
fontWeight: "normal",
|
fontWeight: "normal",
|
||||||
color: theme.palette.grayDisabled.main,
|
color: theme.palette.grayDisabled.main,
|
||||||
marginTop: "75px"
|
marginTop: "75px",
|
||||||
|
paddingLeft: '10px',
|
||||||
}}>
|
}}>
|
||||||
Условия:
|
Условия:
|
||||||
</Typography>
|
</Typography>
|
||||||
@ -400,6 +396,7 @@ const Discounts: React.FC = () => {
|
|||||||
color: theme.palette.secondary.main
|
color: theme.palette.secondary.main
|
||||||
} }}
|
} }}
|
||||||
inputRef={ fieldAddedMore }
|
inputRef={ fieldAddedMore }
|
||||||
|
onChange={PositiveInput}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<TextField
|
<TextField
|
||||||
@ -421,7 +418,7 @@ const Discounts: React.FC = () => {
|
|||||||
color: theme.palette.secondary.main
|
color: theme.palette.secondary.main
|
||||||
} }}
|
} }}
|
||||||
inputRef={ basketMore }
|
inputRef={ basketMore }
|
||||||
onChange={ () => cleraAddedMore() }
|
onChange={ PositiveInput }
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<TextField
|
<TextField
|
||||||
@ -443,6 +440,7 @@ const Discounts: React.FC = () => {
|
|||||||
color: theme.palette.secondary.main
|
color: theme.palette.secondary.main
|
||||||
} }}
|
} }}
|
||||||
inputRef={ toTime }
|
inputRef={ toTime }
|
||||||
|
onChange={ PositiveInput }
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<TextField
|
<TextField
|
||||||
@ -464,6 +462,7 @@ const Discounts: React.FC = () => {
|
|||||||
color: theme.palette.secondary.main
|
color: theme.palette.secondary.main
|
||||||
} }}
|
} }}
|
||||||
inputRef={ toCapacity }
|
inputRef={ toCapacity }
|
||||||
|
onChange={PositiveInput}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<TableContainer component={Paper} sx={{
|
<TableContainer component={Paper} sx={{
|
||||||
|
@ -180,26 +180,24 @@ const Promocode: React.FC = () => {
|
|||||||
alignItems: "left",
|
alignItems: "left",
|
||||||
marginTop: "15px",
|
marginTop: "15px",
|
||||||
}}>
|
}}>
|
||||||
<Typography
|
{/*<Typography */}
|
||||||
variant="h4"
|
{/* variant="h4" */}
|
||||||
sx={{
|
{/* sx={{*/}
|
||||||
width: "90%",
|
{/* width: "90%",*/}
|
||||||
height: "40px",
|
{/* height: "40px",*/}
|
||||||
fontWeight: "normal",
|
{/* fontWeight: "normal",*/}
|
||||||
color: theme.palette.grayDisabled.main,
|
{/* color: theme.palette.grayDisabled.main,*/}
|
||||||
marginTop: "35px"
|
{/* marginTop: "35px"*/}
|
||||||
}}>
|
{/*}}>*/}
|
||||||
Название:
|
{/* Название:*/}
|
||||||
</Typography>
|
{/*</Typography>*/}
|
||||||
<TextField
|
<TextField
|
||||||
id = "standard-basic"
|
id = "standard-basic"
|
||||||
label = { "" }
|
label = { "Название" }
|
||||||
variant = "filled"
|
variant = "filled"
|
||||||
color = "secondary"
|
color = "secondary"
|
||||||
sx={{
|
sx={{
|
||||||
width: "200px",
|
|
||||||
height: "30px",
|
height: "30px",
|
||||||
marginTop: "-20px"
|
|
||||||
}}
|
}}
|
||||||
InputProps={{
|
InputProps={{
|
||||||
style: {
|
style: {
|
||||||
@ -302,10 +300,12 @@ const Promocode: React.FC = () => {
|
|||||||
Дата действия:
|
Дата действия:
|
||||||
</Typography>
|
</Typography>
|
||||||
|
|
||||||
<Box sx={{
|
<Box
|
||||||
|
sx={{
|
||||||
width: "90%",
|
width: "90%",
|
||||||
display: "flex"
|
display: "flex"
|
||||||
}}>
|
}}
|
||||||
|
>
|
||||||
<Typography sx={{
|
<Typography sx={{
|
||||||
width: "35px",
|
width: "35px",
|
||||||
display: "flex",
|
display: "flex",
|
||||||
|
@ -187,15 +187,22 @@ const DataGridElement: React.FC<MWProps> = ({ openModal }) => {
|
|||||||
setSelectedPromocode( codeNumber );
|
setSelectedPromocode( codeNumber );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const PositiveInput = (event:any) => {
|
||||||
|
const numberInput = parseInt(event.target.value);
|
||||||
|
if(isNaN(numberInput) || numberInput < 0) {event.target.value = '0'}
|
||||||
|
}
|
||||||
|
|
||||||
const fieldAdded = React.useRef<HTMLInputElement | null>(null);
|
const fieldAdded = React.useRef<HTMLInputElement | null>(null);
|
||||||
const [ fieldAddedValue, setFieldAddedValue ] = React.useState("");
|
const [ fieldAddedValue, setFieldAddedValue ] = React.useState("");
|
||||||
|
|
||||||
const changeAdded = () => {
|
const changeAdded = (event:any) => {
|
||||||
if( fieldAdded.current != null ) {
|
if( fieldAdded.current != null ) {
|
||||||
if( fieldAdded.current.value != null ) {
|
if( fieldAdded.current.value != null ) {
|
||||||
setFieldAddedValue( fieldAdded.current.value );
|
setFieldAddedValue( fieldAdded.current.value );
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
PositiveInput(event)
|
||||||
};
|
};
|
||||||
|
|
||||||
const separator = (amount: number) => {
|
const separator = (amount: number) => {
|
||||||
@ -296,6 +303,7 @@ console.log(amount)
|
|||||||
|
|
||||||
return discounts.map(e => `${(e*100).toFixed(2)}%`).join(' × ') + ` = ${(100 - discounts.reduce((a : number,cv : number) => a*(1-cv), 100)) .toFixed(2)}%`;
|
return discounts.map(e => `${(e*100).toFixed(2)}%`).join(' × ') + ` = ${(100 - discounts.reduce((a : number,cv : number) => a*(1-cv), 100)) .toFixed(2)}%`;
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box style={{ width: "100%" }}>
|
<Box style={{ width: "100%" }}>
|
||||||
<Box style={{ height: 400 }}>
|
<Box style={{ height: 400 }}>
|
||||||
@ -512,7 +520,7 @@ console.log(amount)
|
|||||||
color: theme.palette.secondary.main
|
color: theme.palette.secondary.main
|
||||||
} }}
|
} }}
|
||||||
inputRef={ fieldAdded }
|
inputRef={ fieldAdded }
|
||||||
onChange={ () => changeAdded() }
|
onChange={ changeAdded }
|
||||||
/>
|
/>
|
||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
|
@ -50,15 +50,8 @@ const Authorization: React.FC = () => {
|
|||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
variant = "contained"
|
variant = 'enter'
|
||||||
sx={{
|
>
|
||||||
backgroundColor: theme.palette.content.main,
|
|
||||||
width: "50%",
|
|
||||||
height: "62px",
|
|
||||||
"&:hover": {
|
|
||||||
backgroundColor: theme.palette.menu.main
|
|
||||||
}
|
|
||||||
}}>
|
|
||||||
ВОЙТИ
|
ВОЙТИ
|
||||||
</Button>
|
</Button>
|
||||||
</Box>
|
</Box>
|
||||||
|
28
src/theme.ts
28
src/theme.ts
@ -1,6 +1,12 @@
|
|||||||
import { createTheme, PaletteColorOptions } from "@mui/material";
|
import { createTheme, PaletteColorOptions } from "@mui/material";
|
||||||
//import { createTheme } from "./types";
|
//import { createTheme } from "./types";
|
||||||
|
|
||||||
|
declare module '@mui/material/Button' {
|
||||||
|
interface ButtonPropsVariantOverrides {
|
||||||
|
enter: true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const fontFamily: string = "GilroyRegular";
|
const fontFamily: string = "GilroyRegular";
|
||||||
const fontWeight: string = "600";
|
const fontWeight: string = "600";
|
||||||
|
|
||||||
@ -81,6 +87,28 @@ const theme = createTheme({
|
|||||||
fontSize: 16
|
fontSize: 16
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
components: {
|
||||||
|
MuiButton: {
|
||||||
|
variants: [
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
variant: 'enter' },
|
||||||
|
style: {
|
||||||
|
backgroundColor: "#26272c",
|
||||||
|
padding: '12px 48px',
|
||||||
|
"&:hover": {
|
||||||
|
backgroundColor: "#2f3339"
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user