persist middleware
This commit is contained in:
Nikolai
parent
9059f2013e
commit
e434d1c1c2
@ -108,15 +108,7 @@ const Discounts: React.FC = () => {
|
||||
};
|
||||
|
||||
|
||||
let { discountsArray, discountsArraySet } = useStore<StoreState>((state) => state);
|
||||
|
||||
const getDiscounts = localStorage.getItem("discounts");
|
||||
const store = useStore( (state) => state );
|
||||
|
||||
if( getDiscounts && !store.discountsArray.length ) {
|
||||
const rows:Array<DiscountProps> = JSON.parse(getDiscounts);
|
||||
if( rows.length ) { store.discountsArraySet( rows ); };
|
||||
}
|
||||
const { discountsArray, discountsArraySet } = useStore<StoreState>((state) => state);
|
||||
|
||||
const { discountsActiveArray, discountsActiveArraySet } = useStore<StoreState>((state) => state);
|
||||
let discountsActiveArrayUpdated:Array<number>;
|
||||
@ -132,19 +124,11 @@ const Discounts: React.FC = () => {
|
||||
|
||||
if( JSON.stringify(discountsActiveArray) != JSON.stringify(discountsActiveArrayUpdated) ) {
|
||||
discountsActiveArraySet( discountsActiveArrayUpdated );
|
||||
localStorage.setItem("activeDiscounts", JSON.stringify( discountsActiveArrayUpdated ));
|
||||
}
|
||||
}
|
||||
|
||||
findActiveDiscounts();
|
||||
|
||||
const getActiveDiscounts = localStorage.getItem("activeDiscounts");
|
||||
|
||||
if( getActiveDiscounts && !store.discountsArray.length ) {
|
||||
const rows:Array<number> = JSON.parse(getActiveDiscounts);
|
||||
if( rows.length ) { store.discountsActiveArraySet( rows ); };
|
||||
}
|
||||
|
||||
const discountsArrayConverted = discountsArray.map( (item) => {
|
||||
const dateFrom = item.from ? new Date( Number(item.from) ) : "";
|
||||
const dateDueTo = item.from ? new Date( Number(item.dueTo) ) : "";
|
||||
@ -172,7 +156,7 @@ const Discounts: React.FC = () => {
|
||||
}
|
||||
} );
|
||||
|
||||
const createDiscount = ( name:string, discount: number ) => {
|
||||
const createDiscount = ( name:string, discount: number, addedMore: number ) => {
|
||||
const newDiscount = {
|
||||
id: new Date().getTime(),
|
||||
name,
|
||||
@ -188,15 +172,21 @@ const Discounts: React.FC = () => {
|
||||
|
||||
const discountsArrayUpdated = [ ...discountsArray, newDiscount ];
|
||||
discountsArraySet( discountsArrayUpdated );
|
||||
localStorage.setItem("discounts", JSON.stringify( discountsArrayUpdated ));
|
||||
}
|
||||
|
||||
const fieldName = React.useRef<HTMLInputElement | null>(null);
|
||||
const fieldDiscount = React.useRef<HTMLInputElement | null>(null);
|
||||
const fieldAddedMore = React.useRef<HTMLInputElement | null>(null);
|
||||
|
||||
const checkFields = () => {
|
||||
if( fieldName.current != null && fieldDiscount.current != null ) {
|
||||
createDiscount( fieldName.current.value, Number(fieldDiscount.current.value) );
|
||||
if( fieldName.current != null
|
||||
&& fieldDiscount.current != null
|
||||
&& fieldAddedMore.current != null ) {
|
||||
|
||||
createDiscount( fieldName.current.value,
|
||||
Number(fieldDiscount.current.value),
|
||||
Number(fieldAddedMore.current.value) );
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -225,7 +215,6 @@ const Discounts: React.FC = () => {
|
||||
} );
|
||||
|
||||
discountsArraySet( discountsArray );
|
||||
localStorage.setItem("discounts", JSON.stringify( discountsArray ));
|
||||
}
|
||||
|
||||
return (
|
||||
@ -341,6 +330,27 @@ const Discounts: React.FC = () => {
|
||||
inputRef={ fieldDiscount }
|
||||
/>
|
||||
|
||||
<TextField
|
||||
id = "standard-basic"
|
||||
label = { "Внесено больше" }
|
||||
variant = "filled"
|
||||
color = "secondary"
|
||||
type = "number"
|
||||
sx={{
|
||||
marginTop: "15px"
|
||||
}}
|
||||
InputProps={{
|
||||
style: {
|
||||
backgroundColor: theme.palette.content.main,
|
||||
color: theme.palette.secondary.main,
|
||||
} }}
|
||||
InputLabelProps={{
|
||||
style: {
|
||||
color: theme.palette.secondary.main
|
||||
} }}
|
||||
inputRef={ fieldAddedMore }
|
||||
/>
|
||||
|
||||
<TableContainer component={Paper} sx={{
|
||||
width: "100%",
|
||||
marginTop: "35px",
|
||||
|
||||
@ -67,6 +67,12 @@ const columns: GridColDef[] = [
|
||||
width: 160,
|
||||
sortable: false,
|
||||
},
|
||||
{
|
||||
field: "conditions",
|
||||
headerName: "Условия",
|
||||
width: 110,
|
||||
sortable: false,
|
||||
},
|
||||
];
|
||||
|
||||
const rows = [
|
||||
@ -79,8 +85,6 @@ const rows = [
|
||||
] },
|
||||
];
|
||||
|
||||
//localStorage.setItem("tariffs", JSON.stringify(rows));
|
||||
|
||||
const rowz:Array<PromocodeProps> = [
|
||||
{ id: 1, name: "Промокод 1", endless: false, from: "", dueTo: "", privileges: [
|
||||
{
|
||||
@ -111,21 +115,6 @@ const DataGridElement: React.FC<MWProps> = ({ openModal }) => {
|
||||
const { discountsArray, discountsArraySet } = useStore<StoreState>((state) => state);
|
||||
const { discountsActiveArray, discountsActiveArraySet } = useStore<StoreState>((state) => state);
|
||||
|
||||
const getDiscounts = localStorage.getItem("discounts");
|
||||
const store = useStore( (state) => state );
|
||||
|
||||
if( getDiscounts && !store.discountsArray.length ) {
|
||||
const rows:Array<DiscountProps> = JSON.parse(getDiscounts);
|
||||
if( rows.length ) { store.discountsArraySet( rows ); };
|
||||
}
|
||||
|
||||
const getActiveDiscounts = localStorage.getItem("activeDiscounts");
|
||||
|
||||
if( getActiveDiscounts && !store.discountsArray.length ) {
|
||||
const rows:Array<number> = JSON.parse(getActiveDiscounts);
|
||||
if( rows.length ) { store.discountsActiveArraySet( rows ); };
|
||||
}
|
||||
|
||||
const [checkboxStates, setCheckboxStates] = React.useState(1);
|
||||
|
||||
const checkboxToggle = () => {
|
||||
@ -159,8 +148,6 @@ const DataGridElement: React.FC<MWProps> = ({ openModal }) => {
|
||||
}
|
||||
} );
|
||||
|
||||
localStorage.setItem("tariffs", JSON.stringify(tariffsArray));
|
||||
|
||||
const { tariffsSelectedRowsData, tariffsSelectedRowsDataSet } = useStore<StoreState>((state) => state);
|
||||
const onRowsSelectionHandler = ( ids:GridSelectionModel ) => {
|
||||
const result:Array<ArrayProps> = [];
|
||||
@ -383,7 +370,14 @@ const DataGridElement: React.FC<MWProps> = ({ openModal }) => {
|
||||
Корзина
|
||||
</Typography>
|
||||
|
||||
<FormControlLabel sx={{ marginTop: "15px", }} control={
|
||||
<Box sx={{
|
||||
display: "flex",
|
||||
marginTop: "15px",
|
||||
marginBottom: "15px",
|
||||
width: "350px",
|
||||
justifyContent: "space-between"
|
||||
}}>
|
||||
<FormControlLabel control={
|
||||
<Checkbox sx={{
|
||||
color: theme.palette.secondary.main,
|
||||
"&.Mui-checked": {
|
||||
@ -392,6 +386,29 @@ const DataGridElement: React.FC<MWProps> = ({ openModal }) => {
|
||||
}} onClick={ () => checkboxToggle() } />
|
||||
} label="НКО" />
|
||||
|
||||
<TextField
|
||||
id = "standard-basic"
|
||||
label = { "Внесено" }
|
||||
variant = "filled"
|
||||
size="small"
|
||||
color = "secondary"
|
||||
type="number"
|
||||
sx={{
|
||||
width: "200px"
|
||||
}}
|
||||
InputProps={{
|
||||
style: {
|
||||
backgroundColor: theme.palette.content.main,
|
||||
color: theme.palette.secondary.main,
|
||||
} }}
|
||||
InputLabelProps={{
|
||||
style: {
|
||||
color: theme.palette.secondary.main
|
||||
} }}
|
||||
//inputRef={ fieldPromocode }
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<List sx={{
|
||||
width: "50%",
|
||||
border: "1px solid",
|
||||
|
||||
27
src/store.ts
27
src/store.ts
@ -1,31 +1,40 @@
|
||||
import create from "zustand";
|
||||
import { persist } from "zustand/middleware"
|
||||
import { ArrayProps } from "./Components/LoggedIn/Content/Tariffs/types";
|
||||
import { PromocodeProps } from "./Components/LoggedIn/Content/Promocode/types";
|
||||
import { DiscountProps } from "./Components/LoggedIn/Content/Discounts/types";
|
||||
|
||||
|
||||
const useStore = create<StoreState>((set) => ({
|
||||
const useStore = create<StoreState>()(
|
||||
persist(
|
||||
(set, get) => ({
|
||||
tariffsArray: [],
|
||||
tariffsArraySet: (array) => set({ tariffsArray: array }),
|
||||
tariffsArraySet: (array:Array<ArrayProps>) => set({ tariffsArray: array }),
|
||||
|
||||
tariffsSelectedRowsData: [],
|
||||
tariffsSelectedRowsDataSet: (array) => set({ tariffsSelectedRowsData: array }),
|
||||
tariffsSelectedRowsDataSet: (array:Array<ArrayProps>) => set({ tariffsSelectedRowsData: array }),
|
||||
|
||||
cartRowsData: [],
|
||||
cartRowsDataSet: (array) => set({ cartRowsData: array }),
|
||||
cartRowsDataSet: (array:Array<ArrayProps>) => set({ cartRowsData: array }),
|
||||
|
||||
promocodeArray: [],
|
||||
promocodeArraySet: (array) => set({ promocodeArray: array }),
|
||||
promocodeArraySet: (array:Array<PromocodeProps>) => set({ promocodeArray: array }),
|
||||
|
||||
discountsArray: [],
|
||||
discountsArraySet: (array) => set({ discountsArray: array }),
|
||||
discountsArraySet: (array:Array<DiscountProps>) => set({ discountsArray: array }),
|
||||
|
||||
discountsActiveArray: [],
|
||||
discountsActiveArraySet: (array) => set({ discountsActiveArray: array }),
|
||||
discountsActiveArraySet: (array:Array<number>) => set({ discountsActiveArray: array }),
|
||||
|
||||
discountsSelectedRowsData: [],
|
||||
discountsSelectedRowsDataSet: (array) => set({ discountsSelectedRowsData: array }),
|
||||
}))
|
||||
discountsSelectedRowsDataSet: (array:Array<DiscountProps>) => set({ discountsSelectedRowsData: array }),
|
||||
}),
|
||||
{
|
||||
name: "arrays-storage",
|
||||
getStorage: () => localStorage,
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
export interface StoreState {
|
||||
tariffsArray: Array<ArrayProps>,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user