46 lines
1.3 KiB
TypeScript
46 lines
1.3 KiB
TypeScript
'use client'
|
|
|
|
import Select from '@/components/ui/Select'
|
|
import {
|
|
MATERIAL_ACCESS_SCOPES,
|
|
MATERIAL_ACCESS_SCOPE_LABELS,
|
|
type MaterialAccessScope,
|
|
} from '@/lib/material-access-scope'
|
|
import { fieldControlClass, fieldHintClass, fieldLabelClass } from './upload-field-styles'
|
|
|
|
export default function MaterialAccessScopeField({
|
|
id,
|
|
value,
|
|
onChange,
|
|
disabled = false,
|
|
}: {
|
|
id: string
|
|
value: MaterialAccessScope
|
|
onChange: (value: MaterialAccessScope) => void
|
|
disabled?: boolean
|
|
}) {
|
|
return (
|
|
<div className="min-w-0 space-y-1">
|
|
<label htmlFor={id} className={fieldLabelClass}>使用范围 *</label>
|
|
<Select
|
|
id={id}
|
|
value={value}
|
|
onChange={(event) => onChange(event.target.value as MaterialAccessScope)}
|
|
disabled={disabled}
|
|
required
|
|
aria-describedby={`${id}-hint`}
|
|
className={`${fieldControlClass} min-h-11`}
|
|
>
|
|
{MATERIAL_ACCESS_SCOPES.map((scope) => (
|
|
<option key={scope} value={scope}>{MATERIAL_ACCESS_SCOPE_LABELS[scope]}</option>
|
|
))}
|
|
</Select>
|
|
<p id={`${id}-hint`} className={fieldHintClass}>
|
|
{value === 'operations_g'
|
|
? '仅运营中心 G 及其下属部门成员可见，中心内共享。'
|
|
: '按现有素材权限使用。'}
|
|
</p>
|
|
</div>
|
|
)
|
|
}
|