前端项目实战叁佰捌拾肆react-admin和material ui-设置符合1920✖1020样式
<Show resource='t_prod_style'> <Box sx={{ width: '200px' }} > <Card elevation={0}> <CardContent> <Divider textAlign="left">款式基本信息</Divider> <Grid container spacing={1} > <Grid item xs={12} sm={6} md={3} > <Labeled source='编码'> <TextField source='code' /> </Labeled> </Grid> <Grid item xs={12} sm={6} md={3} > <Labeled source='名称'> <TextField source='style_name' /> </Labeled> </Grid> <Grid item xs={12} sm={6} md={3} > <Labeled source='品类编号'> <TextField source='category_id' /> </Labeled> </Grid> </Grid> </CardContent> </Card> <Box sx={{ width: 'calc(100vw - 450px)', typography: 'body1' }}> <Divider> <Chip label='品类款式资源' /> </Divider> <TabContext value={value}> <Box sx={{ borderBottom: 1, borderColor: 'divider' }} > <TabList onChange={handleChange} aria-label="lab API tabs example"> <Tab label="物料管理" value="1" /> <Tab label="工序管理" value="2" /> <Tab label="测试管理" value="3" /> </TabList> </Box> <TabPanel value="1"><MaterielTab line_id={id} /></TabPanel> <TabPanel value="2"><StepTab line_id={id} /></TabPanel> <TabPanel value="3"><EditableDatagrid /></TabPanel> </TabContext> </Box> </Box> </Show>
运行结果
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 零经验选手,Compose 一天开发一款小游戏!
· 一起来玩mcp_server_sqlite,让AI帮你做增删改查!!