|  |  |  | 
|---|
|  |  |  | import React, { useState, useRef, useEffect, useMemo, useCallback } from "react"; | 
|---|
|  |  |  | import { Card, useTheme, List, CardContent, Input, InputAdornment, IconButton, TextField } from "@mui/material"; | 
|---|
|  |  |  | import { useForm } from 'react-hook-form'; | 
|---|
|  |  |  | import React, { | 
|---|
|  |  |  | useState, | 
|---|
|  |  |  | useRef, | 
|---|
|  |  |  | useEffect, | 
|---|
|  |  |  | useMemo, | 
|---|
|  |  |  | useCallback, | 
|---|
|  |  |  | } from "react"; | 
|---|
|  |  |  | import { | 
|---|
|  |  |  | Card, | 
|---|
|  |  |  | useTheme, | 
|---|
|  |  |  | List, | 
|---|
|  |  |  | CardContent, | 
|---|
|  |  |  | Input, | 
|---|
|  |  |  | InputAdornment, | 
|---|
|  |  |  | IconButton, | 
|---|
|  |  |  | TextField, | 
|---|
|  |  |  | } from "@mui/material"; | 
|---|
|  |  |  | import { useForm } from "react-hook-form"; | 
|---|
|  |  |  | import Warehouse from "./warehouse"; | 
|---|
|  |  |  | import { Filter, SearchInput, useListContext,useTranslate } from 'react-admin'; | 
|---|
|  |  |  | import request from '@/utils/request'; | 
|---|
|  |  |  | import { | 
|---|
|  |  |  | Filter, | 
|---|
|  |  |  | SearchInput, | 
|---|
|  |  |  | useListContext, | 
|---|
|  |  |  | useTranslate, | 
|---|
|  |  |  | useNotify, | 
|---|
|  |  |  | } from "react-admin"; | 
|---|
|  |  |  | import request from "@/utils/request"; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const WhMatListAside = () => { | 
|---|
|  |  |  | const theme = useTheme(); | 
|---|
|  |  |  | const translate = useTranslate(); | 
|---|
|  |  |  | const [searchVal, setSearchVal] = useState(''); | 
|---|
|  |  |  | const { control, getValues } = useForm(); | 
|---|
|  |  |  | const [map, setMap] = useState([ | 
|---|
|  |  |  | { | 
|---|
|  |  |  | id: 1, | 
|---|
|  |  |  | name: '仓库1', | 
|---|
|  |  |  | code: 'WH1', | 
|---|
|  |  |  | icon: 'Warehouse', | 
|---|
|  |  |  | locCount: 350, | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | id: 2, | 
|---|
|  |  |  | name: '仓库2', | 
|---|
|  |  |  | code: 'WH1', | 
|---|
|  |  |  | icon: 'Warehouse', | 
|---|
|  |  |  | locCount: 237, | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | id: 3, | 
|---|
|  |  |  | name: '仓库3', | 
|---|
|  |  |  | code: 'WH1', | 
|---|
|  |  |  | icon: 'Warehouse', | 
|---|
|  |  |  | locCount: 590, | 
|---|
|  |  |  | } | 
|---|
|  |  |  | ]); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleInput = (value) => { | 
|---|
|  |  |  | console.log(value); | 
|---|
|  |  |  | setSearchVal(value); | 
|---|
|  |  |  | const theme = useTheme(); | 
|---|
|  |  |  | const translate = useTranslate(); | 
|---|
|  |  |  | const [searchVal, setSearchVal] = useState(""); | 
|---|
|  |  |  | const { control, getValues } = useForm(); | 
|---|
|  |  |  | const notify = useNotify(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const [map, setMap] = useState([ | 
|---|
|  |  |  | { | 
|---|
|  |  |  | id: 1, | 
|---|
|  |  |  | name: "仓库1", | 
|---|
|  |  |  | code: "WH1", | 
|---|
|  |  |  | icon: "Warehouse", | 
|---|
|  |  |  | locCount: 350, | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | id: 2, | 
|---|
|  |  |  | name: "仓库2", | 
|---|
|  |  |  | code: "WH1", | 
|---|
|  |  |  | icon: "Warehouse", | 
|---|
|  |  |  | locCount: 237, | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | id: 3, | 
|---|
|  |  |  | name: "仓库3", | 
|---|
|  |  |  | code: "WH1", | 
|---|
|  |  |  | icon: "Warehouse", | 
|---|
|  |  |  | locCount: 590, | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | ]); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleInput = (value) => { | 
|---|
|  |  |  | setSearchVal(value); | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const getMatnrList = async () => { | 
|---|
|  |  |  | const { | 
|---|
|  |  |  | data: { code, data, msg }, | 
|---|
|  |  |  | } = await request.post("/warehouse/list", {}).then(); | 
|---|
|  |  |  | if (code === 200) { | 
|---|
|  |  |  | console.log(data); | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | notify(msg); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | React.useEffect(() => { | 
|---|
|  |  |  | request.post('/matnrGroup/tree', {}) | 
|---|
|  |  |  | .then(res => { | 
|---|
|  |  |  | if (res?.data?.code === 200) { | 
|---|
|  |  |  | let data = res.data.data; | 
|---|
|  |  |  | console.log(data); | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | notify(res.data.msg); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .catch(error => { | 
|---|
|  |  |  | notify('Error fetching tree data'); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | }, [searchVal]) | 
|---|
|  |  |  | React.useEffect(() => { | 
|---|
|  |  |  | getMatnrList(); | 
|---|
|  |  |  | }, [searchVal]); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | return ( | 
|---|
|  |  |  | <Card | 
|---|
|  |  |  | sx={{ | 
|---|
|  |  |  | order: -1, | 
|---|
|  |  |  | mr: 2, | 
|---|
|  |  |  | mt: 4, | 
|---|
|  |  |  | width: 250 | 
|---|
|  |  |  | }} | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <CardContent> | 
|---|
|  |  |  | <div> | 
|---|
|  |  |  | <TextField | 
|---|
|  |  |  | label={translate('ra.action.search')} | 
|---|
|  |  |  | value={searchVal} | 
|---|
|  |  |  | onChange={(e) => handleInput(e.target.value)} | 
|---|
|  |  |  | return ( | 
|---|
|  |  |  | <Card | 
|---|
|  |  |  | sx={{ | 
|---|
|  |  |  | order: -1, | 
|---|
|  |  |  | mr: 2, | 
|---|
|  |  |  | mt: 4, | 
|---|
|  |  |  | width: 250, | 
|---|
|  |  |  | }} | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <CardContent> | 
|---|
|  |  |  | <div> | 
|---|
|  |  |  | <TextField | 
|---|
|  |  |  | label={translate("ra.action.search")} | 
|---|
|  |  |  | value={searchVal} | 
|---|
|  |  |  | onChange={(e) => handleInput(e.target.value)} | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <List> | 
|---|
|  |  |  | {map.map((record) => ( | 
|---|
|  |  |  | <Warehouse key={record.id} record={record} /> | 
|---|
|  |  |  | ))} | 
|---|
|  |  |  | </List> | 
|---|
|  |  |  | </CardContent> | 
|---|
|  |  |  | </Card> | 
|---|
|  |  |  | ); | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <List> | 
|---|
|  |  |  | {map.map(record => ( | 
|---|
|  |  |  | <Warehouse key={record.id} record={record} /> | 
|---|
|  |  |  | ))} | 
|---|
|  |  |  | </List> | 
|---|
|  |  |  | </CardContent> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </Card> | 
|---|
|  |  |  | ) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export default WhMatListAside; | 
|---|
|  |  |  | export default WhMatListAside; | 
|---|