Browse Source

批量添加记录

main
dark 4 months ago
parent
commit
06a28774f5
  1. 114
      src/pages/websites/record/index.tsx

114
src/pages/websites/record/index.tsx

@ -10,7 +10,7 @@ import {
websiteDnsRecordssAtom, websiteDnsRecordssAtom,
websiteDnsRecordsSearchAtom, websiteDnsRecordsSearchAtom,
} from '@/store/websites/record' } from '@/store/websites/record'
import { useEffect, useMemo, useState } from 'react'
import { useEffect, useMemo, useRef, useState } from 'react'
import Action from '@/components/action/Action.tsx' import Action from '@/components/action/Action.tsx'
import { import {
BetaSchemaForm, BetaSchemaForm,
@ -19,7 +19,7 @@ import {
} from '@ant-design/pro-components' } from '@ant-design/pro-components'
import ListPageLayout from '@/layout/ListPageLayout.tsx' import ListPageLayout from '@/layout/ListPageLayout.tsx'
import { useStyle } from './style' import { useStyle } from './style'
import { FilterOutlined, QuestionCircleOutlined } from '@ant-design/icons'
import { FilterOutlined, MinusCircleOutlined, PlusOutlined, QuestionCircleOutlined } from '@ant-design/icons'
import { getValueCount, unSetColumnRules } from '@/utils' import { getValueCount, unSetColumnRules } from '@/utils'
import { Table as ProTable } from '@/components/table' import { Table as ProTable } from '@/components/table'
import Popconfirm from '@/components/popconfirm' import Popconfirm from '@/components/popconfirm'
@ -48,6 +48,7 @@ const WebsiteDnsRecords = () => {
const [ searchKey, setSearchKey ] = useState(search?.title) const [ searchKey, setSearchKey ] = useState(search?.title)
const currentDomain = domainList?.rows?.find?.(item => item.id === id) const currentDomain = domainList?.rows?.find?.(item => item.id === id)
const isBatch = useRef(false)
useEffect(() => { useEffect(() => {
if (id) { if (id) {
@ -57,6 +58,27 @@ const WebsiteDnsRecords = () => {
const columns = useMemo(() => { const columns = useMemo(() => {
const batchDomain = {
title: '域名',
dataIndex: 'domains',
hideInSearch: true,
hideInTable: true,
hideInSetting: true,
formItemProps:{
rules: [
{ required: true,}
]
},
renderFormItem: (_schema, config) => {
return <div>
<Input.TextArea
{...config}
rows={5}
placeholder={t(`${i18nPrefix}.columns.domains`, '一行一个域名,最多支持10000个;\n支持复制黏贴到输入框,但请核对数据是否正确。')}/>
</div>
}
}
return [ return [
{ {
title: 'ID', title: 'ID',
@ -73,7 +95,6 @@ const WebsiteDnsRecords = () => {
hideInTable: true, hideInTable: true,
hideInSetting: true, hideInSetting: true,
}, },
{ {
title: t(`${i18nPrefix}.columns.domain_id`, 'domain_id'), title: t(`${i18nPrefix}.columns.domain_id`, 'domain_id'),
dataIndex: 'domain_id', dataIndex: 'domain_id',
@ -82,6 +103,7 @@ const WebsiteDnsRecords = () => {
hideInTable: true, hideInTable: true,
hideInSetting: true, hideInSetting: true,
}, },
isBatch.current ? batchDomain : null,
{ {
title: t(`${i18nPrefix}.columns.type`, '记录类型'), title: t(`${i18nPrefix}.columns.type`, '记录类型'),
tooltip: '指解析记录的用途,例如:网站、邮箱', tooltip: '指解析记录的用途,例如:网站、邮箱',
@ -104,7 +126,7 @@ const WebsiteDnsRecords = () => {
return record.type return record.type
} }
}, },
{
!isBatch.current ? {
title: t(`${i18nPrefix}.columns.name`, '主机记录'), title: t(`${i18nPrefix}.columns.name`, '主机记录'),
dataIndex: 'name', dataIndex: 'name',
tooltip: '指域名前缀,例如:www', tooltip: '指域名前缀,例如:www',
@ -139,6 +161,61 @@ const WebsiteDnsRecords = () => {
}/> }/>
</div> </div>
} }
} : {
title: t(`${i18nPrefix}.columns.names`, '主机记录'),
dataIndex: 'names',
tooltip: '指域名前缀,例如:www',
formItemProps: {
rules: [
{ required: true, }
]
},
renderFormItem: (_schema, config) => {
return <Form.List name="names"
{..._schema.formItemProps}
{...config}
>
{
(fields, { add, remove }) => {
return <>
{fields.map((field) => {
return (
<>
<Form.Item>
<Form.Item
{...field} key={field.key}
validateTrigger={[ 'onChange', 'onBlur' ]}
noStyle
>
<Input style={{ width: '90%' }} placeholder={'指域名前缀,例如:www'}/>
</Form.Item>
{fields.length > 1 ? (
<MinusCircleOutlined
className="dynamic-delete-button"
onClick={() => remove(field.name)}
/>
) : null}
</Form.Item>
</>
)
})}
<Form.Item noStyle={true}>
<Button
type="dashed"
onClick={() => add()}
style={{ width: '90%' }}
icon={<PlusOutlined/>}
>
</Button>
</Form.Item>
</>
}
}
</Form.List>
}
}, },
{ {
title: t(`${i18nPrefix}.columns.content`, '记录值'), title: t(`${i18nPrefix}.columns.content`, '记录值'),
@ -171,8 +248,8 @@ const WebsiteDnsRecords = () => {
colProps: { colProps: {
span: 8 span: 8
}, },
render(_dom, record){
return <Switch size={'small'} value={record.poxy} />
render(_dom, record) {
return <Switch size={'small'} value={record.poxy}/>
} }
}, },
{ {
@ -183,8 +260,8 @@ const WebsiteDnsRecords = () => {
colProps: { colProps: {
span: 8 span: 8
}, },
render(_dom, record){
return <Switch size={'small'} value={record.status} />
render(_dom, record) {
return <Switch size={'small'} value={record.status}/>
} }
}, },
@ -228,8 +305,8 @@ const WebsiteDnsRecords = () => {
</Popconfirm> </Popconfirm>
] ]
} }
] as ProColumns[]
}, [ isDeleting, currentWebsiteDnsRecords, search, currentDomain ])
].filter(Boolean) as ProColumns[]
}, [ isDeleting, currentWebsiteDnsRecords, search, currentDomain, isBatch.current ])
useEffect(() => { useEffect(() => {
@ -252,6 +329,7 @@ const WebsiteDnsRecords = () => {
<Space> <Space>
<Button key={'add'} <Button key={'add'}
onClick={() => { onClick={() => {
isBatch.current = false
form.resetFields() form.resetFields()
form.setFieldsValue({ form.setFieldsValue({
id: 0, id: 0,
@ -260,6 +338,17 @@ const WebsiteDnsRecords = () => {
setOpen(true) setOpen(true)
}} }}
type={'primary'}>{t(`${i18nPrefix}.add`, '添加记录')}</Button> type={'primary'}>{t(`${i18nPrefix}.add`, '添加记录')}</Button>
<Button key={'add'}
onClick={() => {
isBatch.current = true
form.resetFields()
form.setFieldsValue({
id: 0,
ttl: 1,
})
setOpen(true)
}}
type={'primary'}>{t(`${i18nPrefix}.batchAdd`, '批量添加记录')}</Button>
</Space> </Space>
} }
toolbar={{ toolbar={{
@ -356,7 +445,10 @@ const WebsiteDnsRecords = () => {
}} }}
loading={isSubmitting} loading={isSubmitting}
onFinish={async (values) => { onFinish={async (values) => {
saveOrUpdate(values)
saveOrUpdate({
...values,
domain_id: id,
})
}} }}
columns={columns as ProFormColumnsType[]}/> columns={columns as ProFormColumnsType[]}/>
<BetaSchemaForm <BetaSchemaForm

Loading…
Cancel
Save