import React, { useState, useRef, useEffect, useMemo } from "react"; 
 | 
import { 
 | 
    Edit, 
 | 
    SimpleForm, 
 | 
    FormDataConsumer, 
 | 
    useTranslate, 
 | 
    TextInput, 
 | 
    NumberInput, 
 | 
    BooleanInput, 
 | 
    DateInput, 
 | 
    SelectInput, 
 | 
    ReferenceInput, 
 | 
    SelectArrayInput, 
 | 
    ReferenceArrayInput, 
 | 
    AutocompleteInput, 
 | 
    SaveButton, 
 | 
    Toolbar, 
 | 
    Labeled, 
 | 
    NumberField, 
 | 
    required, 
 | 
    useRecordContext, 
 | 
    useGetRecordId, 
 | 
    useGetOne, 
 | 
    DeleteButton, 
 | 
    useNotify, 
 | 
    useEditContext, 
 | 
} from 'react-admin'; 
 | 
import { EDIT_MODE, REFERENCE_INPUT_PAGESIZE } from '@/config/setting'; 
 | 
import StatusSelectInput from "../../components/StatusSelectInput"; 
 | 
import CustomerTopToolBar from "../../components/EditTopToolBar"; 
 | 
import DictionarySelect from "../../components/DictionarySelect"; 
 | 
import { Stack, Grid, Box, Typography } from '@mui/material'; 
 | 
import EditBaseAside from "../../components/EditBaseAside"; 
 | 
import { useWatch, useFormContext } from "react-hook-form"; 
 | 
import MemoInput from "../../components/MemoInput"; 
 | 
import * as Common from '@/utils/common'; 
 | 
import LocItemList from "./LocItemList"; 
 | 
import request from '@/utils/request'; 
 | 
  
 | 
const FormToolbar = () => { 
 | 
    const { getValues } = useFormContext(); 
 | 
  
 | 
    return ( 
 | 
        <Toolbar sx={{ justifyContent: 'flex-end' }}> 
 | 
            {/* <DeleteButton mutationMode="optimistic" /> */} 
 | 
            <SaveButton /> 
 | 
        </Toolbar> 
 | 
    ) 
 | 
} 
 | 
  
 | 
const LocEdit = () => { 
 | 
    const translate = useTranslate(); 
 | 
    const dicts = JSON.parse(localStorage.getItem('sys_dicts'))?.filter(dict => (dict.dictTypeCode == 'sys_loc_type')) || []; 
 | 
    const [warehouseId, setWrehouseId] = useState(); 
 | 
    const id = useGetRecordId(); 
 | 
    const { data, isLoading } = useGetOne('loc', { id }); 
 | 
    if (!isLoading) { 
 | 
        data.typeIds = data?.type.split(','); 
 | 
    } else { 
 | 
        return 
 | 
    } 
 | 
  
 | 
    const warehouseChange = (val) => { 
 | 
        setWrehouseId(val) 
 | 
    } 
 | 
  
 | 
  
 | 
    return ( 
 | 
        <> 
 | 
            <Edit 
 | 
                redirect="list" 
 | 
                mutationMode={EDIT_MODE} 
 | 
                actions={<CustomerTopToolBar />} 
 | 
                aside={<EditBaseAside />} 
 | 
                title={"menu.loc"} 
 | 
            > 
 | 
                <SimpleForm 
 | 
                    record={data} 
 | 
                    shouldUnregister 
 | 
                    warnWhenUnsavedChanges 
 | 
                    toolbar={<FormToolbar />} 
 | 
                    mode="onTouched" 
 | 
                // validate={(values) => { }} 
 | 
                > 
 | 
                    <Grid container width={{ xs: '100%', xl: '90%' }} rowSpacing={3} columnSpacing={3}> 
 | 
                        <Grid item xs={12} md={12}> 
 | 
                            <Typography variant="h6" gutterBottom> 
 | 
                                {translate('common.edit.title.main')} 
 | 
                            </Typography> 
 | 
                            <Grid container rowSpacing={2} columnSpacing={2}> 
 | 
                                <Grid item display="flex" gap={2}> 
 | 
                                    <ReferenceInput 
 | 
                                        source="warehouseId" 
 | 
                                        reference="warehouse" 
 | 
                                    > 
 | 
                                        <AutocompleteInput 
 | 
                                            label="table.field.loc.warehouseId" 
 | 
                                            optionText="name" 
 | 
                                            validate={[required()]} 
 | 
                                            onChange={warehouseChange} 
 | 
                                            filterToQuery={(val) => ({ name: val })} 
 | 
                                        /> 
 | 
                                    </ReferenceInput> 
 | 
                                    <ReferenceInput 
 | 
                                        source="areaId" 
 | 
                                        reference="warehouseAreas" 
 | 
                                        filter={{ warehouseId }} 
 | 
                                    > 
 | 
                                        <AutocompleteInput 
 | 
                                            label="table.field.loc.areaId" 
 | 
                                            optionText="name" 
 | 
                                            validate={[required()]} 
 | 
                                            filterToQuery={(val) => ({ name: val })} 
 | 
                                        /> 
 | 
                                    </ReferenceInput> 
 | 
                                    <TextInput 
 | 
                                        label="table.field.loc.code" 
 | 
                                        source="code" 
 | 
                                        parse={v => v} 
 | 
                                        validate={required()} 
 | 
                                    /> 
 | 
                                    <NumberInput 
 | 
                                        label="table.field.loc.length" 
 | 
                                        source="length" 
 | 
                                    /> 
 | 
  
 | 
                                    <NumberInput 
 | 
                                        label="table.field.loc.width" 
 | 
                                        source="width" 
 | 
                                    /> 
 | 
  
 | 
                                    <NumberInput 
 | 
                                        label="table.field.loc.height" 
 | 
                                        source="height" 
 | 
                                    /> 
 | 
                                </Grid> 
 | 
                                <Grid item display="flex" gap={1}> 
 | 
                                    <ReferenceArrayInput source="typeIds" reference="locType" > 
 | 
                                        <SelectArrayInput label="table.field.loc.type" /> 
 | 
                                    </ReferenceArrayInput> 
 | 
                                    <TextInput 
 | 
                                        label="table.field.loc.unit" 
 | 
                                        source="unit" 
 | 
                                        parse={v => v} 
 | 
                                    /> 
 | 
                                    <DictionarySelect 
 | 
                                        label={translate("table.field.loc.useStatus")} 
 | 
                                        name="useStatus" 
 | 
                                        validate={[required()]} 
 | 
                                        size="small" 
 | 
                                        dictTypeCode="sys_loc_use_stas" 
 | 
                                    /> 
 | 
                                    <NumberInput 
 | 
                                        label="table.field.loc.row" 
 | 
                                        source="row" 
 | 
                                        validate={required()} 
 | 
                                    /> 
 | 
  
 | 
                                    <NumberInput 
 | 
                                        label="table.field.loc.col" 
 | 
                                        source="col" 
 | 
                                        validate={required()} 
 | 
                                    /> 
 | 
  
 | 
                                    <NumberInput 
 | 
                                        label="table.field.loc.lev" 
 | 
                                        source="lev" 
 | 
                                        validate={required()} 
 | 
                                    /> 
 | 
                                </Grid> 
 | 
                            </Grid> 
 | 
                        </Grid> 
 | 
                    </Grid> 
 | 
                </SimpleForm> 
 | 
            </Edit > 
 | 
            <LocItemList /> 
 | 
        </> 
 | 
    ) 
 | 
} 
 | 
  
 | 
export default LocEdit; 
 |