Commit 30d1d111 authored by Andy-bubu's avatar Andy-bubu

fix: align material modal form controls

parent 8832cdff
...@@ -37,6 +37,8 @@ import { ...@@ -37,6 +37,8 @@ import {
Input, Input,
InputGroup, InputGroup,
Modal, Modal,
Radio,
RadioGroup,
Spinner, Spinner,
Surface, Surface,
Tabs, Tabs,
...@@ -1683,10 +1685,11 @@ export default function ResourceBookingPage() { ...@@ -1683,10 +1685,11 @@ export default function ResourceBookingPage() {
{isDetailEditing ? ( {isDetailEditing ? (
<> <>
<FormSection title="基础信息"> <FormSection title="基础信息">
<div className="grid gap-4 sm:grid-cols-2"> <div className="grid min-w-0 gap-4 sm:grid-cols-2">
<div> <div>
<FieldLabel required>材料标题</FieldLabel> <FieldLabel required>材料标题</FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={detailForm.materialTitle} value={detailForm.materialTitle}
disabled={saving} disabled={saving}
...@@ -1701,6 +1704,7 @@ export default function ResourceBookingPage() { ...@@ -1701,6 +1704,7 @@ export default function ResourceBookingPage() {
<div> <div>
<FieldLabel>所属周期/年份</FieldLabel> <FieldLabel>所属周期/年份</FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={detailForm.archiveYear} value={detailForm.archiveYear}
disabled={saving} disabled={saving}
...@@ -1767,6 +1771,7 @@ export default function ResourceBookingPage() { ...@@ -1767,6 +1771,7 @@ export default function ResourceBookingPage() {
<div> <div>
<FieldLabel>标签分组</FieldLabel> <FieldLabel>标签分组</FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={detailForm.tag} value={detailForm.tag}
disabled={saving} disabled={saving}
...@@ -1782,10 +1787,11 @@ export default function ResourceBookingPage() { ...@@ -1782,10 +1787,11 @@ export default function ResourceBookingPage() {
</div> </div>
</FormSection> </FormSection>
<FormSection title="提供信息"> <FormSection title="提供信息">
<div className="grid gap-4 sm:grid-cols-2"> <div className="grid min-w-0 gap-4 sm:grid-cols-2">
<div> <div>
<FieldLabel>提供部门</FieldLabel> <FieldLabel>提供部门</FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={detailForm.provideDepartment} value={detailForm.provideDepartment}
disabled={saving} disabled={saving}
...@@ -1978,7 +1984,7 @@ export default function ResourceBookingPage() { ...@@ -1978,7 +1984,7 @@ export default function ResourceBookingPage() {
title="批量覆盖字段" title="批量覆盖字段"
description="先勾选要更新的字段,再填写统一值,避免误把空值覆盖到所有材料。" description="先勾选要更新的字段,再填写统一值,避免误把空值覆盖到所有材料。"
> >
<div className="grid gap-4 sm:grid-cols-2"> <div className="grid min-w-0 gap-4 sm:grid-cols-2">
<HeroCheckbox <HeroCheckbox
className="min-h-20" className="min-h-20"
isSelected={batchEditFields.archiveYear} isSelected={batchEditFields.archiveYear}
...@@ -2012,6 +2018,7 @@ export default function ResourceBookingPage() { ...@@ -2012,6 +2018,7 @@ export default function ResourceBookingPage() {
<div> <div>
<FieldLabel>所属周期/年份</FieldLabel> <FieldLabel>所属周期/年份</FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={batchEditForm.archiveYear} value={batchEditForm.archiveYear}
onChange={(event) => onChange={(event) =>
...@@ -2202,6 +2209,7 @@ export default function ResourceBookingPage() { ...@@ -2202,6 +2209,7 @@ export default function ResourceBookingPage() {
<div> <div>
<FieldLabel>提供部门</FieldLabel> <FieldLabel>提供部门</FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={batchEditForm.provideDepartment} value={batchEditForm.provideDepartment}
onChange={(event) => onChange={(event) =>
...@@ -2438,6 +2446,7 @@ export default function ResourceBookingPage() { ...@@ -2438,6 +2446,7 @@ export default function ResourceBookingPage() {
<div> <div>
<FieldLabel required>统一标签</FieldLabel> <FieldLabel required>统一标签</FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={batchTagForm.tag} value={batchTagForm.tag}
onChange={(event) => onChange={(event) =>
...@@ -2553,67 +2562,52 @@ export default function ResourceBookingPage() { ...@@ -2553,67 +2562,52 @@ export default function ResourceBookingPage() {
title="压缩包处理方式" title="压缩包处理方式"
description="同一个 ZIP 可以选择直接归档,或拆成多条材料记录。拆分时,下方属性会作为每个文件的通用属性。" description="同一个 ZIP 可以选择直接归档,或拆成多条材料记录。拆分时,下方属性会作为每个文件的通用属性。"
> >
<div className="grid gap-4 sm:grid-cols-2"> <RadioGroup
<Button aria-label="压缩包处理方式"
type="button" className="grid min-w-0 grid-cols-1 gap-4 sm:grid-cols-2"
variant={ orientation="horizontal"
uploadForm.uploadMode === ARCHIVE_UPLOAD_MODE.ARCHIVE value={uploadForm.uploadMode}
? "secondary" variant="secondary"
: "tertiary" onChange={(nextMode) =>
}
onPress={() =>
setUploadForm((prev) => ({ setUploadForm((prev) => ({
...prev, ...prev,
uploadMode: ARCHIVE_UPLOAD_MODE.ARCHIVE, uploadMode: nextMode,
materialTitle: materialTitle:
prev.materialTitle || nextMode === ARCHIVE_UPLOAD_MODE.ARCHIVE
inferTitleFromFile(selectedFile), ? prev.materialTitle || inferTitleFromFile(selectedFile)
: prev.materialTitle,
})) }))
} }
className="w-full min-w-0 justify-start text-left"
variant={
uploadForm.uploadMode === ARCHIVE_UPLOAD_MODE.ARCHIVE
? "secondary"
: "tertiary"
}
> >
<div className="text-sm font-semibold text-foreground"> <Radio
整包上传 className="min-w-0"
</div> value={ARCHIVE_UPLOAD_MODE.ARCHIVE}
<div className="mt-1 text-sm leading-6 text-muted">
将 ZIP 当成 1
个材料文件归档,材料标题必填,适合保留完整压缩包。
</div>
</Button>
<Button
type="button"
variant={
uploadForm.uploadMode === ARCHIVE_UPLOAD_MODE.EXTRACT
? "secondary"
: "tertiary"
}
onPress={() =>
setUploadForm((prev) => ({
...prev,
uploadMode: ARCHIVE_UPLOAD_MODE.EXTRACT,
}))
}
className="w-full min-w-0 justify-start text-left"
variant={
uploadForm.uploadMode === ARCHIVE_UPLOAD_MODE.EXTRACT
? "secondary"
: "tertiary"
}
> >
<div className="text-sm font-semibold text-foreground"> <Radio.Content>
解压后逐文件上传 <Radio.Control>
</div> <Radio.Indicator />
<div className="mt-1 text-sm leading-6 text-muted"> </Radio.Control>
ZIP <span data-slot="label">整包上传</span>
内有几个文件,就创建几条材料记录;材料标题会自动取每个文件名。 </Radio.Content>
</div> <Description>
</Button> 将 ZIP 当成 1 个材料文件归档,适合保留完整压缩包。
</div> </Description>
</Radio>
<Radio
className="min-w-0"
value={ARCHIVE_UPLOAD_MODE.EXTRACT}
>
<Radio.Content>
<Radio.Control>
<Radio.Indicator />
</Radio.Control>
<span data-slot="label">解压后逐文件上传</span>
</Radio.Content>
<Description>
ZIP 内有几个文件,就创建几条材料记录;标题自动取文件名。
</Description>
</Radio>
</RadioGroup>
</FormSection> </FormSection>
) : null} ) : null}
...@@ -2626,7 +2620,7 @@ export default function ResourceBookingPage() { ...@@ -2626,7 +2620,7 @@ export default function ResourceBookingPage() {
: "这部分字段直接影响材料主档展示与搜索。" : "这部分字段直接影响材料主档展示与搜索。"
} }
> >
<div className="grid gap-4 sm:grid-cols-2"> <div className="grid min-w-0 gap-4 sm:grid-cols-2">
<div> <div>
<FieldLabel <FieldLabel
required={ required={
...@@ -2637,6 +2631,7 @@ export default function ResourceBookingPage() { ...@@ -2637,6 +2631,7 @@ export default function ResourceBookingPage() {
材料标题 材料标题
</FieldLabel> </FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={uploadForm.materialTitle} value={uploadForm.materialTitle}
onChange={(event) => onChange={(event) =>
...@@ -2664,6 +2659,7 @@ export default function ResourceBookingPage() { ...@@ -2664,6 +2659,7 @@ export default function ResourceBookingPage() {
<div> <div>
<FieldLabel>所属周期/年份</FieldLabel> <FieldLabel>所属周期/年份</FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={uploadForm.archiveYear} value={uploadForm.archiveYear}
onChange={(event) => onChange={(event) =>
...@@ -2723,9 +2719,10 @@ export default function ResourceBookingPage() { ...@@ -2723,9 +2719,10 @@ export default function ResourceBookingPage() {
} }
/> />
</div> </div>
<div className="sm:col-span-2"> <div>
<FieldLabel>标签分组</FieldLabel> <FieldLabel>标签分组</FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={uploadForm.tag} value={uploadForm.tag}
onChange={(event) => onChange={(event) =>
...@@ -2744,10 +2741,11 @@ export default function ResourceBookingPage() { ...@@ -2744,10 +2741,11 @@ export default function ResourceBookingPage() {
title="提供信息" title="提供信息"
description="与对象文档保持一致,用于记录材料由谁、何时提供。" description="与对象文档保持一致,用于记录材料由谁、何时提供。"
> >
<div className="grid gap-4 sm:grid-cols-2"> <div className="grid min-w-0 gap-4 sm:grid-cols-2">
<div> <div>
<FieldLabel>提供部门</FieldLabel> <FieldLabel>提供部门</FieldLabel>
<Input <Input
fullWidth
variant="secondary" variant="secondary"
value={uploadForm.provideDepartment} value={uploadForm.provideDepartment}
onChange={(event) => onChange={(event) =>
...@@ -2851,6 +2849,7 @@ export default function ResourceBookingPage() { ...@@ -2851,6 +2849,7 @@ export default function ResourceBookingPage() {
<div> <div>
<FieldLabel>录入说明</FieldLabel> <FieldLabel>录入说明</FieldLabel>
<TextArea <TextArea
fullWidth
variant="secondary" variant="secondary"
value={[ value={[
uploadForm.sourceApp uploadForm.sourceApp
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment