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