#优化：收货历史单明细修改前端样式

zjj

2025-04-17 cb99baca31835dddfda18705b4a4da5407186f7c

#优化：收货历史单明细修改前端样式

 rsf-admin/src/page/histories/asnOrderLog/AsnOrderLogEdit.jsx

@@ -29,7 +29,7 @@
const FormToolbar = () => {
    return (
        <Toolbar sx={{ justifyContent: 'end' }}>
            <SaveButton />
           <></>
        </Toolbar>
    )
}
@@ -54,12 +54,23 @@
                // validate={(values) => { }}
                >
                    <Grid container width={{ xs: '100%', xl: '80%' }} rowSpacing={3} columnSpacing={3}>
                        <Grid item xs={24} md={12}>
                        <Grid item xs={24} md={12} sx={{
                            "& .MuiFormLabel-root.MuiInputLabel-root.Mui-disabled":{
                            bgcolor : 'white',
                            WebkitTextFillColor: "rgba(0, 0, 0)"                            
                            },

                            "& .MuiInputBase-input.MuiFilledInput-input.Mui-disabled":{
                            bgcolor : 'white',
                            WebkitTextFillColor: "rgba(0, 0, 0)"                            
                            } 
                        }}>
                            <Typography variant="h6" gutterBottom>
                                {translate('common.edit.title.main')}
                            </Typography>
                            <Stack direction='row' gap={2}>
                                <TextInput
                                disableUnderline 
                                    label="table.field.asnOrderLog.code"
                                    source="code"
                                    parse={v => v}
@@ -78,14 +89,14 @@
                                />
                                <TextInput
                                    label="table.field.asnOrderLog.type"
                                    source="type"
                                    source="type$"
                                    readOnly
                                    parse={v => v}
                                    validate={required()}
                                />
                                <TextInput
                                    label="table.field.asnOrderLog.wkType"
                                    source="wkType"
                                    source="wkType$"
                                    readOnly
                                    parse={v => v}
                                    validate={required()}

 rsf-admin/src/page/histories/asnOrderLog/AsnOrderLogShow.jsx

New file
@@ -0,0 +1,149 @@
import { BooleanField, DateField, NumberField, ReferenceField, Show, SimpleShowLayout, TextField ,DateInput,
    SelectInput,required,useTranslate,
    useRecordContext,} from 'react-admin';
    import { Stack, Grid, Box, Typography, Card } from '@mui/material';
    import { EDIT_MODE, REFERENCE_INPUT_PAGESIZE } from '@/config/setting';
    import EditBaseAside from "../../components/EditBaseAside";
    import CustomerTopToolBar from "../../components/EditTopToolBar";
    import AsnOrderItemLogList from "./AsnOrderItemLogList"


const Aa = () =>{
    const translate = useTranslate();

    return(
        <>
        <Show
            redirect="list"
            mutationMode={EDIT_MODE}
            actions={<CustomerTopToolBar />}
            aside={<EditBaseAside />}
            >
            <SimpleShowLayout
            shouldUnregister
            warnWhenUnsavedChanges
            
            mode="onTouched"
            defaultValues={{}}
            >
    
                <Grid sx={{
                    "& .MuiInputBase-input": {
                        bgcolor: "white" 
                    }
                }} container width={{ xs: '100%', xl: '80%' }} rowSpacing={3} columnSpacing={3}>
                    
                    <Grid item xs={24} md={12}>
                    <Typography variant="h6" gutterBottom>
                        {translate('common.edit.title.main')}
                    </Typography>                        
                        <Stack display="flax" justifyContent="space-between" flexWrap="wrap" direction='row' gap={2} >
                            <Grid item  display="flex" gap={1} minWidth={150}>                            
                                <Box flexGrow={1}>
                                    <Typography variant="body2" >
                                        {translate('table.field.asnOrderLog.code')}
                                    </Typography>
                                    <TextField source="code" label="id"/>
                                </Box>
                            </Grid>
                            <Grid item  display="flex" gap={1} minWidth={150}>                            
                                <Box flexGrow={1}>
                                    <Typography variant="body2" sx={{fontSize: 20}}>
                                        {translate('table.field.asnOrderLog.poCode')}
                                    </Typography>
                                    <TextField source="poCode" label="poCode"/>
                                </Box>
                            </Grid>
                            <Grid item  display="flex" gap={1} minWidth={150}>                            
                                <Box flexGrow={1}>
                                    <Typography variant="body2" sx={{fontSize: 20}}>
                                        {translate('table.field.asnOrderLog.poId')}
                                    </Typography>
                                    <NumberField source="poId" label="poId"/>
                                </Box>
                            </Grid>
                            <Grid item  display="flex" gap={1} minWidth={150}>                            
                                <Box flexGrow={1}>
                                    <Typography variant="body2" sx={{fontSize: 20}}>
                                        {translate('table.field.asnOrderLog.type')}
                                    </Typography>
                                    <TextField source="type$" label="type"/>
                                </Box>
                            </Grid>
                            <Grid item  display="flex" gap={1} minWidth={150}>                            
                                <Box flexGrow={1}>
                                    <Typography variant="body2" sx={{fontSize: 20}}>
                                        {translate('table.field.asnOrderLog.wkType')}
                                    </Typography>
                                    <TextField source="wkType$" label="type"/>
                                </Box>
                            </Grid>                            
                        
                        </Stack>
                        <Stack display="flax" justifyContent="space-between"  flexWrap="wrap" direction='row' gap={2} sx={{mt:5 }}>
                        <Grid item  display="flex" gap={1} minWidth={150}>                            
                                <Box flexGrow={1}>
                                    <Typography variant="body2" sx={{fontSize: 20}}>
                                        {translate('table.field.asnOrderLog.anfme')}
                                    </Typography>
                                    <TextField source="anfme" label="id"/>
                                </Box>
                            </Grid>
                            <Grid item  display="flex" gap={1} minWidth={150}>                            
                                <Box flexGrow={1}>
                                    <Typography variant="body2" sx={{fontSize: 20}}>
                                        {translate('table.field.asnOrderLog.qty')}
                                    </Typography>
                                    <TextField source="qty" label="poCode"/>
                                </Box>
                            </Grid>
                            <Grid item  display="flex" gap={1} minWidth={150}>                            
                                <Box flexGrow={1}>
                                    <Typography variant="body2" sx={{fontSize: 20}}>
                                        {translate('table.field.asnOrderLog.logisNo')}
                                    </Typography>
                                    <NumberField source="logisNo" label="poId"/>
                                </Box>
                            </Grid>
                            <Grid item  display="flex" gap={1} minWidth={150}>                            
                                <Box flexGrow={1}>
                                    <Typography variant="body2" sx={{fontSize: 20}}>
                                        {translate('table.field.asnOrderLog.arrTime')}
                                    </Typography>
                                    <DateField source="arrTime" label="type" showTime/>
                                </Box>
                            </Grid>
                            <Grid item  display="flex" gap={1} minWidth={150}>                            
                                <Box flexGrow={1}>
                                    <Typography variant="body2" sx={{fontSize: 20}}>
                                        {translate('table.field.asnOrderLog.ntyStatus')}
                                    </Typography>
                                    <TextField source="ntyStatus$" label="type"/>
                                </Box>
                            </Grid> 
                        </Stack>
                    </Grid>
                </Grid>
    
            </SimpleShowLayout>
        </Show>
        <Grid item xs={24} md={16} sx={{ marginTop: '1em' }}>
                <Typography variant="h6" gutterBottom >
                    {translate('common.edit.title.common')}
                </Typography>
            </Grid>
            <AsnOrderItemLogList />
        </>
        
       ); 
}

const AsnorderlogShow = () => (
   
    <Aa />
        
    
   
);

export default AsnorderlogShow

 rsf-admin/src/page/histories/asnOrderLog/index.jsx

@@ -7,11 +7,12 @@

import AsnOrderLogList from "./AsnOrderLogList";
import AsnOrderLogEdit from "./AsnOrderLogEdit";
import  AsnorderlogShow  from "./AsnOrderLogShow";

export default {
    list: AsnOrderLogList,
    edit: AsnOrderLogEdit,
    show: ShowGuesser,
    show: AsnorderlogShow,
    recordRepresentation: (record) => {
        return `${record.id}`
    }