Skip to content

S
saas-bi
提交 1b3cb1c4 authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

chore: update

上级 449ef2db
隐藏空白字符变更
内嵌 并排
正在显示 包含 709 行增加 和 311 行删除
src/hooks/useQuery.ts
浏览文件 @ 1b3cb1c4
......@@ -121,7 +121,7 @@ export function useProcessProgressQuery(params: { function_name: string }) {
},
select: (res) => res.data,
enabled,
refetchInterval: enabled ? 1000 : false,
refetchInterval: enabled ? 500 : false,
staleTime: 0,
gcTime: 0,
placeholderData: (): any => {
......@@ -144,7 +144,7 @@ export function useProcessProgressQuery(params: { function_name: string }) {
}
// 组件卸载时清理
useEffect(() => {
if (query.data?.result === 'SUCCESS' || query.data?.result === 'FAIL' || query.data?.result === null) {
if (query.data?.result === 'SUCCESS' || query.data?.result === 'FAIL') {
stop()
}
return () => {
......
src/modules/data/preprocess/error/api.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import httpRequest from '@/utils/axios'
import type { ProcessDataParams } from './types'
// 缺省值处理
export function processData(data: ProcessDataParams) {
return httpRequest.post('/api/resource/bi/v1/processing/pre-processing/abnormal', data)
}
src/modules/data/preprocess/error/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
......@@ -5,6 +5,7 @@ import AppProgressSteps from '@/components/AppProgressSteps'
import { useSearchParams } from 'react-router'
import { useAI } from '@/hooks/useAI'
import prompt from '@/utils/prompt'
import { useProcessData } from '../query'
export default function ButtonModal() {
const [searchParams] = useSearchParams()
......@@ -27,7 +28,7 @@ export default function ButtonModal() {
})
}
const { fieldOptions } = useDataFieldQuery()
const { fieldOptions, getFieldName } = useDataFieldQuery()
const [open, setOpen] = useState(false)
useEffect(() => {
......@@ -38,25 +39,33 @@ export default function ButtonModal() {
const [current, setCurrent] = useState(0)
const [form] = Form.useForm()
const initialValues = {
checked: '',
rule: '1',
action: '取该字段平均值',
}
const checked = Form.useWatch('checked', form)
const field = Form.useWatch('field', form)
const ruleOptions = [
{ label: '取该字段平均值', value: '1' },
{ label: '删除逻辑错误值', value: '2' },
{ label: '不处理', value: '3' },
]
const ruleOptions = ['取该字段平均值', '删除逻辑错误值', '不处理']
const [step, setStep] = useState<number>(-1)
const { mutate, isPending, progress, message, remove } = useProcessData()
// 开始处理
const handleStart = () => {
form.validateFields().then((values) => {
mutate(values)
})
}
// 关闭并重置
const handleClose = () => {
setOpen(false)
setCurrent(0)
remove()
}
const steps = [
{
title: '请选择逻辑错误值字段',
content: (
<Form.Item name="checked" rules={[{ required: true, message: '请选择逻辑错误值字段' }]}>
<Form.Item name="field" rules={[{ required: true, message: '请选择逻辑错误值字段' }]}>
<Radio.Group>
<Row gutter={[10, 10]}>
{fieldOptions.map((item) => (
......@@ -73,8 +82,8 @@ export default function ButtonModal() {
title: '配置处理规则',
content: (
<>
<Form.Item label="逻辑错误值处理字段">{checked}</Form.Item>
<Form.Item label="处理规则" name="rule" rules={[{ required: true, message: '请选择处理规则' }]}>
<Form.Item label="逻辑错误值处理字段">{getFieldName(field)}</Form.Item>
<Form.Item label="处理规则" name="action" rules={[{ required: true, message: '请选择处理规则' }]}>
<Radio.Group options={ruleOptions} />
</Form.Item>
</>
......@@ -84,29 +93,25 @@ export default function ButtonModal() {
title: '处理执行',
content: (
<>
<p>逻辑错误值处理字段：{checked}</p>
<p>逻辑错误值处理字段：{getFieldName(field)}</p>
<Flex vertical align="center" style={{ marginTop: '20px' }}>
<Button type="primary" onClick={() => setStep(1)}>
<Button type="primary" loading={isPending} onClick={handleStart}>
开始处理
</Button>
<AppProgressSteps
current={step}
current={progress}
items={[
{
title: <>检查字段处理规则</>,
title: '检查字段处理规则',
description: message[1],
},
{
title: <>逻辑错误值处理</>,
title: '逻辑错误值处理',
description: message[2],
},
{
title: <>处理结果</>,
description: (
<>
累计处理XX个字段
<br />
累计处理XX条记录
</>
),
title: '处理结果',
description: message[3],
},
]}
/>
......@@ -133,12 +138,12 @@ export default function ButtonModal() {
)}
{current > 0 && <Button onClick={() => setCurrent(current - 1)}>上一步</Button>}
{current < steps.length - 1 && (
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!checked}>
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!field}>
下一步
</Button>
)}
{current === steps.length - 1 && (
<Button type="primary" onClick={() => setOpen(false)}>
<Button type="primary" disabled={isPending} onClick={handleClose}>
关闭
</Button>
)}
......@@ -146,7 +151,7 @@ export default function ButtonModal() {
}
destroyOnClose
width={800}
onCancel={() => setOpen(false)}>
onCancel={handleClose}>
<div style={{ minHeight: 300, padding: '20px 0' }}>
<Form form={form} labelCol={{ span: 5 }} preserve={false} initialValues={initialValues}>
{steps.map((item, index) => (
......
src/modules/data/preprocess/error/query.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { message } from 'antd'
import { processData } from './api'
import type { ProcessDataParams } from './types'
import { useProcessProgressQuery } from '@/hooks/useQuery'
// 处理数据
export function useProcessData() {
const queryClient = useQueryClient()
const { data, start, remove } = useProcessProgressQuery({ function_name: 'abnormal' })
const query = useMutation({
mutationFn: (data: ProcessDataParams) => {
start()
return processData(data)
},
onSuccess: () => {
message.success('处理完成')
queryClient.invalidateQueries({ queryKey: ['data'] })
},
})
return { ...query, progress: data.progress, message: data.message, remove }
}
src/modules/data/preprocess/error/types.ts 0 → 100644
浏览文件 @ 1b3cb1c4
export interface ProcessDataParams {
field: string
action: string
}
src/modules/data/preprocess/max/api.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import httpRequest from '@/utils/axios'
import type { ProcessDataParams } from './types'
// 缺省值处理
export function processData(data: ProcessDataParams) {
return httpRequest.post('/api/resource/bi/v1/processing/pre-processing/out-of-range', data)
}
src/modules/data/preprocess/max/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
......@@ -5,6 +5,7 @@ import AppProgressSteps from '@/components/AppProgressSteps'
import { useSearchParams } from 'react-router'
import { useAI } from '@/hooks/useAI'
import prompt from '@/utils/prompt'
import { useProcessData } from '../query'
export default function ButtonModal() {
const [searchParams] = useSearchParams()
......@@ -27,7 +28,7 @@ export default function ButtonModal() {
})
}
const { fieldOptions } = useDataFieldQuery()
const { fieldOptions, getFieldName } = useDataFieldQuery()
const [open, setOpen] = useState(false)
useEffect(() => {
......@@ -37,26 +38,35 @@ export default function ButtonModal() {
}, [searchParams])
const [current, setCurrent] = useState(0)
const [form] = Form.useForm()
const initialValues = {
checked: '',
rule: '1',
action: '取该字段平均值',
}
const checked = Form.useWatch('checked', form)
const field = Form.useWatch('field', form)
const ruleOptions = [
{ label: '取该字段平均值', value: '1' },
{ label: '删除过大值', value: '2' },
{ label: '不处理', value: '3' },
]
const ruleOptions = ['取该字段平均值', '删除过大值', '不处理']
const { mutate, isPending, progress, message, remove } = useProcessData()
// 开始处理
const handleStart = () => {
form.validateFields().then((values) => {
mutate(values)
})
}
const [step, setStep] = useState<number>(-1)
// 关闭并重置
const handleClose = () => {
setOpen(false)
setCurrent(0)
remove()
}
const steps = [
{
title: '请选择过大值字段',
content: (
<Form.Item name="checked" rules={[{ required: true, message: '请选择过大值字段' }]}>
<Form.Item name="field" rules={[{ required: true, message: '请选择过大值字段' }]}>
<Radio.Group>
<Row gutter={[10, 10]}>
{fieldOptions.map((item) => (
......@@ -73,8 +83,8 @@ export default function ButtonModal() {
title: '配置处理规则',
content: (
<>
<Form.Item label="过大值处理字段">{checked}</Form.Item>
<Form.Item label="处理规则" name="rule" rules={[{ required: true, message: '请选择处理规则' }]}>
<Form.Item label="过大值处理字段">{getFieldName(field)}</Form.Item>
<Form.Item label="处理规则" name="action" rules={[{ required: true, message: '请选择处理规则' }]}>
<Radio.Group options={ruleOptions} />
</Form.Item>
</>
......@@ -84,29 +94,25 @@ export default function ButtonModal() {
title: '处理执行',
content: (
<>
<p>过大值处理字段：{checked}</p>
<p>过大值处理字段：{getFieldName(field)}</p>
<Flex vertical align="center" style={{ marginTop: '20px' }}>
<Button type="primary" onClick={() => setStep(1)}>
<Button type="primary" loading={isPending} onClick={handleStart}>
开始处理
</Button>
<AppProgressSteps
current={step}
current={progress}
items={[
{
title: <>检查字段处理规则</>,
title: '检查字段处理规则',
description: message[1],
},
{
title: <>过大值处理</>,
title: '过大值处理',
description: message[2],
},
{
title: <>处理结果</>,
description: (
<>
累计处理XX个字段
<br />
累计处理XX条记录
</>
),
title: '处理结果',
description: message[3],
},
]}
/>
......@@ -133,12 +139,12 @@ export default function ButtonModal() {
)}
{current > 0 && <Button onClick={() => setCurrent(current - 1)}>上一步</Button>}
{current < steps.length - 1 && (
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!checked}>
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!field}>
下一步
</Button>
)}
{current === steps.length - 1 && (
<Button type="primary" onClick={() => setOpen(false)}>
<Button type="primary" disabled={isPending} onClick={handleClose}>
关闭
</Button>
)}
......@@ -146,7 +152,7 @@ export default function ButtonModal() {
}
destroyOnClose
width={800}
onCancel={() => setOpen(false)}>
onCancel={handleClose}>
<div style={{ minHeight: 300, padding: '20px 0' }}>
<Form form={form} labelCol={{ span: 5 }} preserve={false} initialValues={initialValues}>
{steps.map((item, index) => (
......
src/modules/data/preprocess/max/query.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { message } from 'antd'
import { processData } from './api'
import type { ProcessDataParams } from './types'
import { useProcessProgressQuery } from '@/hooks/useQuery'
// 处理数据
export function useProcessData() {
const queryClient = useQueryClient()
const { data, start, remove } = useProcessProgressQuery({ function_name: 'outOfRange' })
const query = useMutation({
mutationFn: (data: ProcessDataParams) => {
start()
return processData(data)
},
onSuccess: () => {
message.success('处理完成')
queryClient.invalidateQueries({ queryKey: ['data'] })
},
})
return { ...query, progress: data.progress, message: data.message, remove }
}
src/modules/data/preprocess/max/types.ts 0 → 100644
浏览文件 @ 1b3cb1c4
export interface ProcessDataParams {
field: string
action: string
}
src/modules/data/preprocess/min/api.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import httpRequest from '@/utils/axios'
import type { ProcessDataParams } from './types'
// 缺省值处理
export function processData(data: ProcessDataParams) {
return httpRequest.post('/api/resource/bi/v1/processing/pre-processing/under-range', data)
}
src/modules/data/preprocess/min/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
......@@ -5,6 +5,7 @@ import AppProgressSteps from '@/components/AppProgressSteps'
import { useSearchParams } from 'react-router'
import { useAI } from '@/hooks/useAI'
import prompt from '@/utils/prompt'
import { useProcessData } from '../query'
export default function ButtonModal() {
const [searchParams] = useSearchParams()
......@@ -27,7 +28,7 @@ export default function ButtonModal() {
})
}
const { fieldOptions } = useDataFieldQuery()
const { fieldOptions, getFieldName } = useDataFieldQuery()
const [open, setOpen] = useState(false)
useEffect(() => {
......@@ -38,25 +39,33 @@ export default function ButtonModal() {
const [current, setCurrent] = useState(0)
const [form] = Form.useForm()
const initialValues = {
checked: '',
rule: '1',
action: '取该字段平均值',
}
const checked = Form.useWatch('checked', form)
const field = Form.useWatch('field', form)
const ruleOptions = [
{ label: '取该字段平均值', value: '1' },
{ label: '删除过小值', value: '2' },
{ label: '不处理', value: '3' },
]
const ruleOptions = ['取该字段平均值', '删除过小值', '不处理']
const [step, setStep] = useState<number>(-1)
const { mutate, isPending, progress, message, remove } = useProcessData()
// 开始处理
const handleStart = () => {
form.validateFields().then((values) => {
mutate(values)
})
}
// 关闭并重置
const handleClose = () => {
setOpen(false)
setCurrent(0)
remove()
}
const steps = [
{
title: '请选择过小值字段',
content: (
<Form.Item name="checked" rules={[{ required: true, message: '请选择过小值字段' }]}>
<Form.Item name="field" rules={[{ required: true, message: '请选择过小值字段' }]}>
<Radio.Group>
<Row gutter={[10, 10]}>
{fieldOptions.map((item) => (
......@@ -73,8 +82,8 @@ export default function ButtonModal() {
title: '配置处理规则',
content: (
<>
<Form.Item label="过小值处理字段">{checked}</Form.Item>
<Form.Item label="处理规则" name="rule" rules={[{ required: true, message: '请选择处理规则' }]}>
<Form.Item label="过小值处理字段">{getFieldName(field)}</Form.Item>
<Form.Item label="处理规则" name="action" rules={[{ required: true, message: '请选择处理规则' }]}>
<Radio.Group options={ruleOptions} />
</Form.Item>
</>
......@@ -84,29 +93,25 @@ export default function ButtonModal() {
title: '处理执行',
content: (
<>
<p>过小值处理字段：{checked}</p>
<p>过小值处理字段：{getFieldName(field)}</p>
<Flex vertical align="center" style={{ marginTop: '20px' }}>
<Button type="primary" onClick={() => setStep(1)}>
<Button type="primary" loading={isPending} onClick={handleStart}>
开始处理
</Button>
<AppProgressSteps
current={step}
current={progress}
items={[
{
title: <>检查字段处理规则</>,
title: '检查字段处理规则',
description: message[1],
},
{
title: <>过小值处理</>,
title: '过小值处理',
description: message[2],
},
{
title: <>处理结果</>,
description: (
<>
累计处理XX个字段
<br />
累计处理XX条记录
</>
),
title: '处理结果',
description: message[3],
},
]}
/>
......@@ -133,12 +138,12 @@ export default function ButtonModal() {
)}
{current > 0 && <Button onClick={() => setCurrent(current - 1)}>上一步</Button>}
{current < steps.length - 1 && (
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!checked}>
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!field}>
下一步
</Button>
)}
{current === steps.length - 1 && (
<Button type="primary" onClick={() => setOpen(false)}>
<Button type="primary" disabled={isPending} onClick={handleClose}>
关闭
</Button>
)}
......@@ -146,7 +151,7 @@ export default function ButtonModal() {
}
destroyOnClose
width={800}
onCancel={() => setOpen(false)}>
onCancel={handleClose}>
<div style={{ minHeight: 300, padding: '20px 0' }}>
<Form form={form} labelCol={{ span: 5 }} preserve={false} initialValues={initialValues}>
{steps.map((item, index) => (
......
src/modules/data/preprocess/min/query.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { message } from 'antd'
import { processData } from './api'
import type { ProcessDataParams } from './types'
import { useProcessProgressQuery } from '@/hooks/useQuery'
// 处理数据
export function useProcessData() {
const queryClient = useQueryClient()
const { data, start, remove } = useProcessProgressQuery({ function_name: 'underRange' })
const query = useMutation({
mutationFn: (data: ProcessDataParams) => {
start()
return processData(data)
},
onSuccess: () => {
message.success('处理完成')
queryClient.invalidateQueries({ queryKey: ['data'] })
},
})
return { ...query, progress: data.progress, message: data.message, remove }
}
src/modules/data/preprocess/min/types.ts 0 → 100644
浏览文件 @ 1b3cb1c4
export interface ProcessDataParams {
field: string
action: string
}
src/modules/data/preprocess/null/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
......@@ -152,16 +152,9 @@ export default function ButtonModal() {
<AppProgressSteps
current={progress}
items={[
{
title: <>检查字段处理规则</>,
},
{
title: <>缺失值处理</>,
},
{
title: <>处理结果</>,
description: <>{message[3]}</>,
},
{ title: '检查字段处理规则', description: message[1] },
{ title: '缺失值处理', description: message[2] },
{ title: '处理结果', description: message[3] },
]}
/>
</Flex>
......
src/modules/data/preprocess/repeat/api.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import httpRequest from '@/utils/axios'
import type { ProcessDataParams } from './types'
// 缺省值处理
export function processData(data: ProcessDataParams) {
return httpRequest.post('/api/resource/bi/v1/processing/pre-processing/duplicate', data)
}
src/modules/data/preprocess/repeat/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
......@@ -4,6 +4,7 @@ import AppProgressSteps from '@/components/AppProgressSteps'
import { useSearchParams } from 'react-router'
import { useAI } from '@/hooks/useAI'
import prompt from '@/utils/prompt'
import { useProcessData } from '../query'
export default function ButtonModal() {
const [searchParams] = useSearchParams()
......@@ -39,18 +40,28 @@ export default function ButtonModal() {
const [current, setCurrent] = useState(0)
const [form] = Form.useForm()
const initialValues = {
rule: '1',
action: '保留1条，删除剩余重复数据',
}
const checkedList: string[] = Form.useWatch('checkedList', form) || []
const ruleOptions = [
{ label: '保留1条，删除剩余重复数据', value: '1' },
{ label: '全部删除', value: '2' },
{ label: '不处理', value: '3' },
]
const ruleOptions = ['保留1条，删除剩余重复数据', '全部删除', '不处理']
const { mutate, isPending, progress, message, remove } = useProcessData()
// 开始处理
const handleStart = () => {
form.validateFields().then((values) => {
const params = { ...values }
mutate(params)
})
}
const [step, setStep] = useState<number>(-1)
// 关闭并重置
const handleClose = () => {
setOpen(false)
setCurrent(0)
remove()
}
const steps = [
{
......@@ -81,7 +92,7 @@ export default function ButtonModal() {
</p>
))}
</Form.Item>
<Form.Item label="处理规则" name="rule">
<Form.Item label="处理规则" name="action">
<Radio.Group options={ruleOptions} />
</Form.Item>
</>
......@@ -92,28 +103,15 @@ export default function ButtonModal() {
content: (
<>
<Flex vertical align="center" style={{ marginTop: '20px' }}>
<Button type="primary" onClick={() => setStep(1)}>
<Button type="primary" loading={isPending} onClick={handleStart}>
开始处理
</Button>
<AppProgressSteps
current={step}
current={progress}
items={[
{
title: <>检查字段处理规则</>,
},
{
title: <>重复值处理</>,
},
{
title: <>处理结果</>,
description: (
<>
累计处理XX个字段
<br />
累计处理XX条记录
</>
),
},
{ title: '检查字段处理规则', description: message[1] },
{ title: '重复值处理', description: message[2] },
{ title: '处理结果', description: message[3] },
]}
/>
</Flex>
......@@ -144,7 +142,7 @@ export default function ButtonModal() {
</Button>
)}
{current === steps.length - 1 && (
<Button type="primary" onClick={() => setOpen(false)}>
<Button type="primary" disabled={isPending} onClick={handleClose}>
关闭
</Button>
)}
......@@ -152,7 +150,7 @@ export default function ButtonModal() {
}
destroyOnClose
width={800}
onCancel={() => setOpen(false)}>
onCancel={handleClose}>
<div style={{ minHeight: 300, padding: '20px 0' }}>
<Form form={form} labelCol={{ span: 5 }} preserve={false} initialValues={initialValues}>
{steps.map((item, index) => (
......
src/modules/data/preprocess/repeat/query.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { message } from 'antd'
import { processData } from './api'
import type { ProcessDataParams } from './types'
import { useProcessProgressQuery } from '@/hooks/useQuery'
// 处理数据
export function useProcessData() {
const queryClient = useQueryClient()
const { data, start, remove } = useProcessProgressQuery({ function_name: 'duplicate' })
const query = useMutation({
mutationFn: (data: ProcessDataParams) => {
start()
return processData(data)
},
onSuccess: () => {
message.success('处理完成')
queryClient.invalidateQueries({ queryKey: ['data'] })
},
})
return { ...query, progress: data.progress, message: data.message, remove }
}
src/modules/data/preprocess/repeat/types.ts 0 → 100644
浏览文件 @ 1b3cb1c4
export interface ProcessDataParams {
fields: string
action: string
rules: string
rule: string
specify: string
}
src/modules/data/preprocess/sort/api.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import httpRequest from '@/utils/axios'
import type { ProcessDataParams } from './types'
// 缺省值处理
export function processData(data: ProcessDataParams) {
return httpRequest.post('/api/resource/bi/v1/processing/pre-processing/sort', data)
}
src/modules/data/preprocess/sort/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
......@@ -8,6 +8,7 @@ import { Button, Flex, Modal, Form, Table, Radio } from 'antd'
import { useDataFieldQuery } from '@/hooks/useQuery'
import AppProgressSteps from '@/components/AppProgressSteps'
import type { TableColumnsType } from 'antd'
import { useProcessData } from '../query'
interface DataType {
key: number
......@@ -44,7 +45,21 @@ export default function ButtonModal() {
const [current, setCurrent] = useState(0)
const [form] = Form.useForm()
const [dataSource, setDataSource] = useState<DataType[]>([])
const [step, setStep] = useState<number>(-1)
const { mutate, isPending, progress, message, remove } = useProcessData()
// 开始处理
const handleStart = () => {
const fields = dataSource.map((item) => {
return { field: item.key, rule: item.new_value }
})
mutate({ fields: JSON.stringify(fields) })
}
// 关闭并重置
const handleClose = () => {
setOpen(false)
setCurrent(0)
remove()
}
useEffect(() => {
if (fields?.length) {
......@@ -52,7 +67,7 @@ export default function ButtonModal() {
fields.map((item: any, index) => ({
key: index + 1,
...item,
new_value: '',
new_value: 'default',
}))
)
}
......@@ -82,9 +97,9 @@ export default function ButtonModal() {
)
const options = [
{ label: '无序', value: '1' },
{ label: '升序', value: '2' },
{ label: '降序', value: '3' },
{ label: '无序', value: 'default' },
{ label: '升序', value: 'asc' },
{ label: '降序', value: 'desc' },
]
const columns: TableColumnsType<DataType> = [
......@@ -128,13 +143,17 @@ export default function ButtonModal() {
title: '处理执行',
content: (
<Flex vertical align="center" style={{ marginTop: '20px' }}>
<Button type="primary" onClick={() => setStep(1)}>
<Button type="primary" loading={isPending} onClick={handleStart}>
开始处理
</Button>
<AppProgressSteps
style={{ margin: '80px' }}
current={step}
items={[{ title: '第一步\n开始' }, { title: '第二步\n数据排序' }, { title: '第三步\n处理结果' }]}
current={progress}
items={[
{ title: '第一步\n开始', description: message[1] },
{ title: '第二步\n数据排序', description: message[2] },
{ title: '第三步\n处理结果', description: message[3] },
]}
/>
</Flex>
),
......@@ -158,7 +177,7 @@ export default function ButtonModal() {
</Button>
)}
{current === steps.length - 1 && (
<Button type="primary" onClick={() => setOpen(false)}>
<Button type="primary" disabled={isPending} onClick={handleClose}>
关闭
</Button>
)}
......@@ -166,7 +185,7 @@ export default function ButtonModal() {
}
destroyOnClose
width={800}
onCancel={() => setOpen(false)}>
onCancel={handleClose}>
<div style={{ minHeight: 300, padding: '20px 0' }}>
<Form form={form} labelCol={{ span: 5 }} preserve={false}>
{steps.map((item, index) => (
......
src/modules/data/preprocess/sort/query.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { message } from 'antd'
import { processData } from './api'
import type { ProcessDataParams } from './types'
import { useProcessProgressQuery } from '@/hooks/useQuery'
// 处理数据
export function useProcessData() {
const queryClient = useQueryClient()
const { data, start, remove } = useProcessProgressQuery({ function_name: 'sort' })
const query = useMutation({
mutationFn: (data: ProcessDataParams) => {
start()
return processData(data)
},
onSuccess: () => {
message.success('处理完成')
queryClient.invalidateQueries({ queryKey: ['data'] })
},
})
return { ...query, progress: data.progress, message: data.message, remove }
}
src/modules/data/preprocess/sort/types.ts 0 → 100644
浏览文件 @ 1b3cb1c4
export interface ProcessDataParams {
fields: string
}
src/modules/data/preprocess/space/api.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import httpRequest from '@/utils/axios'
import type { ProcessDataParams } from './types'
// 缺省值处理
export function processData(data: ProcessDataParams) {
return httpRequest.post('/api/resource/bi/v1/processing/pre-processing/trim', data)
}
src/modules/data/preprocess/space/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
......@@ -4,6 +4,7 @@ import { useDataFieldQuery } from '@/hooks/useQuery'
import AppProgressSteps from '@/components/AppProgressSteps'
import { useAI } from '@/hooks/useAI'
import prompt from '@/utils/prompt'
import { useProcessData } from '../query'
export default function ButtonModal() {
const { isLoading, post } = useAI({
......@@ -24,33 +25,46 @@ export default function ButtonModal() {
})
}
const { fieldOptions } = useDataFieldQuery()
const { fieldOptions, getFieldName } = useDataFieldQuery()
const [open, setOpen] = useState(false)
const [current, setCurrent] = useState(0)
const [form] = Form.useForm()
const initialValues = {
checked: '',
rule: '1',
field: '',
rule: '开头去空格',
}
const checked = Form.useWatch('checked', form)
const field = Form.useWatch('field', form)
const ruleOptions = [
{ label: '开头去空格', value: '1' },
{ label: '结尾去空格', value: '2' },
{ label: '中间去空格', value: '3' },
{ label: '全部去空格', value: '4' },
{ label: '开头去空格', value: '开头去空格' },
{ label: '结尾去空格', value: '结尾去空格' },
{ label: '中间去空格', value: '中间去空格' },
{ label: '全部去空格', value: '全部去空格' },
]
const [step, setStep] = useState<number>(-1)
const { mutate, isPending, progress, message, remove } = useProcessData()
// 开始处理
const handleStart = () => {
form.validateFields().then((values) => {
mutate(values)
})
}
// 关闭并重置
const handleClose = () => {
setOpen(false)
setCurrent(0)
remove()
}
const steps = [
{
title: '请选择数据去空格字段',
content: (
<Form.Item name="checked" rules={[{ required: true, message: '请选择数据去空格字段' }]}>
<Form.Item name="field" rules={[{ required: true, message: '请选择数据去空格字段' }]}>
<Radio.Group>
<Row gutter={[10, 10]}>
{fieldOptions.map((item) => (
......@@ -67,7 +81,7 @@ export default function ButtonModal() {
title: '配置处理规则',
content: (
<>
<Form.Item label="数据去空格处理字段">{checked}</Form.Item>
<Form.Item label="数据去空格处理字段">{getFieldName(field)}</Form.Item>
<Form.Item label="处理规则" name="rule" rules={[{ required: true, message: '请选择处理规则' }]}>
<Radio.Group options={ruleOptions} />
</Form.Item>
......@@ -78,29 +92,25 @@ export default function ButtonModal() {
title: '处理执行',
content: (
<>
<p>数据去空格处理字段：{checked}</p>
<p>数据去空格处理字段：{getFieldName(field)}</p>
<Flex vertical align="center" style={{ marginTop: '20px' }}>
<Button type="primary" onClick={() => setStep(1)}>
<Button type="primary" loading={isPending} onClick={handleStart}>
开始处理
</Button>
<AppProgressSteps
current={step}
current={progress}
items={[
{
title: <>检查字段处理规则</>,
title: '检查字段处理规则',
description: message[1],
},
{
title: <>数据去空格处理</>,
title: '数据去空格处理',
description: message[2],
},
{
title: <>处理结果</>,
description: (
<>
累计处理XX个字段
<br />
累计处理XX条记录
</>
),
title: '处理结果',
description: message[3],
},
]}
/>
......@@ -127,12 +137,12 @@ export default function ButtonModal() {
)}
{current > 0 && <Button onClick={() => setCurrent(current - 1)}>上一步</Button>}
{current < steps.length - 1 && (
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!checked}>
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!field}>
下一步
</Button>
)}
{current === steps.length - 1 && (
<Button type="primary" onClick={() => setOpen(false)}>
<Button type="primary" disabled={isPending} onClick={handleClose}>
关闭
</Button>
)}
......@@ -140,7 +150,7 @@ export default function ButtonModal() {
}
destroyOnClose
width={800}
onCancel={() => setOpen(false)}>
onCancel={handleClose}>
<div style={{ minHeight: 300, padding: '20px 0' }}>
<Form form={form} labelCol={{ span: 5 }} preserve={false} initialValues={initialValues}>
{steps.map((item, index) => (
......
src/modules/data/preprocess/space/query.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { message } from 'antd'
import { processData } from './api'
import type { ProcessDataParams } from './types'
import { useProcessProgressQuery } from '@/hooks/useQuery'
// 处理数据
export function useProcessData() {
const queryClient = useQueryClient()
const { data, start, remove } = useProcessProgressQuery({ function_name: 'trim' })
const query = useMutation({
mutationFn: (data: ProcessDataParams) => {
start()
return processData(data)
},
onSuccess: () => {
message.success('处理完成')
queryClient.invalidateQueries({ queryKey: ['data'] })
},
})
return { ...query, progress: data.progress, message: data.message, remove }
}
src/modules/data/preprocess/space/types.ts 0 → 100644
浏览文件 @ 1b3cb1c4
export interface ProcessDataParams {
field: string
rule: string
}
src/modules/data/preprocess/splice/api.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import httpRequest from '@/utils/axios'
import type { ProcessDataParams } from './types'
// 缺省值处理
export function processData(data: ProcessDataParams) {
return httpRequest.post('/api/resource/bi/v1/processing/pre-processing/merge', data)
}
src/modules/data/preprocess/splice/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
import { useState } from 'react'
import { Button, Flex, Modal, Radio, Input, Form, Select, message } from 'antd'
import { useDataQuery, useDataFieldQuery } from '@/hooks/useQuery'
import { Button, Flex, Modal, Radio, Input, Form, Select } from 'antd'
import { useDataFieldQuery } from '@/hooks/useQuery'
import AppProgressSteps from '@/components/AppProgressSteps'
import { useProcessData } from '../query'
export default function ButtonModal() {
const { data = { list: [] } } = useDataQuery() // Default value to prevent data being undefined
const { data: fields = [] } = useDataFieldQuery()
const { fieldOptions } = useDataFieldQuery()
const [open, setOpen] = useState(false)
const [current, setCurrent] = useState(0)
const [form] = Form.useForm()
const [step, setStep] = useState(-1)
const [concatenatedFields, setConcatenatedFields] = useState<{ field: string; order: number }[]>([])
const [fields, setFields] = useState<{ field: string; order: number }[]>([])
// Process the concatenation
const { mutate, isPending, progress, message, remove } = useProcessData()
// 开始处理
const handleStart = () => {
setStep(0)
// Simulate processing steps with timeouts
setTimeout(() => {
setStep(1)
setTimeout(() => {
setStep(3)
message.success('数据拼接处理完成！')
}, 1000)
}, 1000)
form.validateFields().then((values) => {
mutate({ ...values, fields: JSON.stringify(fields) })
})
}
// 关闭并重置
const handleClose = () => {
setOpen(false)
setCurrent(0)
remove()
}
// 下一步
const handleNext = async () => {
await form.validateFields()
setCurrent(current + 1)
}
// Add concatenation field
const addConcatenationField = () => {
const addField = () => {
const newField = form.getFieldValue('fieldToAdd')
if (!newField) {
message.warning('请选择要添加的字段')
......@@ -35,21 +42,21 @@ export default function ButtonModal() {
}
const updatedFields = [
...concatenatedFields,
...fields,
{
field: newField,
order: concatenatedFields.length,
order: fields.length,
},
]
setConcatenatedFields(updatedFields)
setFields(updatedFields)
form.setFieldsValue({ fieldToAdd: undefined })
}
// Move field up in order
const moveFieldUp = (index: number) => {
if (index <= 0) return
const newFields = [...concatenatedFields]
const newFields = [...fields]
const temp = newFields[index]
newFields[index] = newFields[index - 1]
newFields[index - 1] = temp
......@@ -59,13 +66,13 @@ export default function ButtonModal() {
field.order = idx
})
setConcatenatedFields(newFields)
setFields(newFields)
}
// Move field down in order
const moveFieldDown = (index: number) => {
if (index >= concatenatedFields.length - 1) return
const newFields = [...concatenatedFields]
if (index >= fields.length - 1) return
const newFields = [...fields]
const temp = newFields[index]
newFields[index] = newFields[index + 1]
newFields[index + 1] = temp
......@@ -75,19 +82,19 @@ export default function ButtonModal() {
field.order = idx
})
setConcatenatedFields(newFields)
setFields(newFields)
}
// Remove field from list
const removeField = (index: number) => {
const newFields = concatenatedFields.filter((_, idx) => idx !== index)
const newFields = fields.filter((_, idx) => idx !== index)
// Update order property
newFields.forEach((field, idx) => {
field.order = idx
})
setConcatenatedFields(newFields)
setFields(newFields)
}
// Steps definition
......@@ -108,38 +115,32 @@ export default function ButtonModal() {
<Form.Item
label="拼接新字段类型"
name="fieldType"
rules={[{ required: true, message: '请选择拼接新字段类型' }]}>
<Radio.Group options={[{ label: '文本', value: 'text' }]} />
rules={[{ required: true, message: '请选择拼接新字段类型' }]}
initialValue="string">
<Radio.Group options={[{ label: '文本', value: 'string' }]} />
</Form.Item>
<Form.Item
label="请选择数据拼接字段"
name="selectedFields"
name="fields"
rules={[
{
required: true,
message: '请添加至少一个拼接字段',
validator: () =>
concatenatedFields.length > 0 ? Promise.resolve() : Promise.reject('请添加至少一个拼接字段'),
validator: () => (fields.length > 0 ? Promise.resolve() : Promise.reject('请添加至少一个拼接字段')),
},
]}>
<div>
<Flex gap={10}>
<Form.Item name="fieldToAdd" noStyle>
<Select
placeholder="选择要添加的字段"
options={fields.map((item) => ({
label: `${item.name} (${item.english_name})`,
value: item.english_name,
}))}
/>
<Select placeholder="选择要添加的字段" options={fieldOptions} />
</Form.Item>
<Button type="primary" onClick={addConcatenationField}>
<Button type="primary" onClick={addField}>
添加拼接字段
</Button>
</Flex>
{concatenatedFields.map((item, index) => {
const fieldInfo = fields.find((f) => f.english_name === item.field)
{fields.map((item, index) => {
const fieldInfo = fieldOptions.find((f) => f.value === item.field)
return (
<Flex key={index} gap={10} style={{ marginTop: '10px' }}>
<div style={{ flex: 1, border: '1px solid #d9d9d9', padding: '4px 11px', borderRadius: '6px' }}>
......@@ -148,10 +149,7 @@ export default function ButtonModal() {
<Button type="text" disabled={index === 0} onClick={() => moveFieldUp(index)}>
上移
</Button>
<Button
type="text"
disabled={index === concatenatedFields.length - 1}
onClick={() => moveFieldDown(index)}>
<Button type="text" disabled={index === fields.length - 1} onClick={() => moveFieldDown(index)}>
下移
</Button>
<Button type="text" danger onClick={() => removeField(index)}>
......@@ -170,27 +168,23 @@ export default function ButtonModal() {
content: (
<>
<Flex vertical align="center" style={{ marginTop: '20px' }}>
<Button type="primary" onClick={handleStart} disabled={step >= 0}>
<Button type="primary" loading={isPending} onClick={handleStart}>
开始处理
</Button>
<AppProgressSteps
current={step}
current={progress}
items={[
{
title: <>新增字段</>,
title: '新增字段',
description: message[1],
},
{
title: <>数据拼接</>,
title: '数据拼接',
description: message[2],
},
{
title: <>处理结果</>,
description: (
<>
累计处理{concatenatedFields.length}个字段
<br />
累计处理{data.list?.length || 0}条记录
</>
),
title: '处理结果',
description: message[3],
},
]}
/>
......@@ -200,28 +194,6 @@ export default function ButtonModal() {
},
]
// Handle next button logic
const handleNext = async () => {
try {
if (current === 0) {
// Validate the first step form
await form.validateFields(['name', 'english_name', 'fieldType', 'selectedFields'])
}
setCurrent(current + 1)
} catch (error) {
// Form validation error handling
console.error('表单验证失败', error)
}
}
// Reset everything when modal closes
const handleCancel = () => {
setOpen(false)
setCurrent(0)
setStep(-1)
setConcatenatedFields([])
}
return (
<>
<Button type="primary" onClick={() => setOpen(true)}>
......@@ -239,7 +211,7 @@ export default function ButtonModal() {
</Button>
)}
{current === steps.length - 1 && (
<Button type="primary" onClick={handleCancel}>
<Button type="primary" disabled={isPending} onClick={handleClose}>
关闭
</Button>
)}
......@@ -247,7 +219,7 @@ export default function ButtonModal() {
}
destroyOnClose
width={800}
onCancel={handleCancel}>
onCancel={handleClose}>
<div style={{ minHeight: 300, padding: '20px 0' }}>
<Form form={form} labelCol={{ span: 5 }} preserve={false}>
{steps.map((item, index) => (
......
src/modules/data/preprocess/splice/query.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { message } from 'antd'
import { processData } from './api'
import type { ProcessDataParams } from './types'
import { useProcessProgressQuery } from '@/hooks/useQuery'
// 处理数据
export function useProcessData() {
const queryClient = useQueryClient()
const { data, start, remove } = useProcessProgressQuery({ function_name: 'merge' })
const query = useMutation({
mutationFn: (data: ProcessDataParams) => {
start()
return processData(data)
},
onSuccess: () => {
message.success('处理完成')
queryClient.invalidateQueries({ queryKey: ['data'] })
},
})
return { ...query, progress: data.progress, message: data.message, remove }
}
src/modules/data/preprocess/splice/types.ts 0 → 100644
浏览文件 @ 1b3cb1c4
export interface ProcessDataParams {
name: string
english_name: string
fields: string
}
src/modules/data/preprocess/split/api.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import httpRequest from '@/utils/axios'
import type { ProcessDataParams } from './types'
// 缺省值处理
export function processData(data: ProcessDataParams) {
return httpRequest.post('/api/resource/bi/v1/processing/pre-processing/split', data)
}
src/modules/data/preprocess/split/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
......@@ -2,36 +2,50 @@ import { useState } from 'react'
import { Button, Flex, Modal, Radio, Form, Row, Col } from 'antd'
import { useDataFieldQuery } from '@/hooks/useQuery'
import AppProgressSteps from '@/components/AppProgressSteps'
import { useProcessData } from '../query'
export default function ButtonModal() {
const { fieldOptions } = useDataFieldQuery()
const { fieldOptions, getFieldName } = useDataFieldQuery()
const [open, setOpen] = useState(false)
const [current, setCurrent] = useState(0)
const [form] = Form.useForm()
const initialValues = {
checked: '',
rule: '1',
field: '',
char: ';',
}
const checked = Form.useWatch('checked', form)
const field = Form.useWatch('field', form)
const ruleOptions = [
{ label: '分号“;”', value: '1' },
{ label: '逗号“,”', value: '2' },
{ label: '空格“ ”', value: '3' },
{ label: '分号“;”', value: ';' },
{ label: '逗号“,”', value: ',' },
{ label: '空格“ ”', value: ' ' },
// { label: '特定字符', value: '4' },
// { label: '前几个字符', value: '5' },
]
const [step, setStep] = useState<number>(-1)
const { mutate, isPending, progress, message, remove } = useProcessData()
// 开始处理
const handleStart = () => {
form.validateFields().then((values) => {
mutate(values)
})
}
// 关闭并重置
const handleClose = () => {
setOpen(false)
setCurrent(0)
remove()
}
const steps = [
{
title: '请选择数据拆分字段',
content: (
<Form.Item name="checked" rules={[{ required: true, message: '请选择数据拆分字段' }]}>
<Form.Item name="field" rules={[{ required: true, message: '请选择数据拆分字段' }]}>
<Radio.Group>
<Row gutter={[10, 10]}>
{fieldOptions.map((item) => (
......@@ -48,8 +62,8 @@ export default function ButtonModal() {
title: '配置处理规则',
content: (
<>
<Form.Item label="数据拆分字段">{checked}</Form.Item>
<Form.Item label="处理规则" name="rule" rules={[{ required: true, message: '请选择处理规则' }]}>
<Form.Item label="数据拆分字段">{getFieldName(field)}</Form.Item>
<Form.Item label="处理规则" name="char" rules={[{ required: true, message: '请选择处理规则' }]}>
<Radio.Group options={ruleOptions} />
</Form.Item>
</>
......@@ -59,34 +73,33 @@ export default function ButtonModal() {
title: '处理执行',
content: (
<>
<p>数据拆分处理字段：{checked}</p>
<p>数据拆分处理字段：{getFieldName(field)}</p>
<Flex vertical align="center" style={{ marginTop: '20px' }}>
<Button type="primary" onClick={() => setStep(3)}>
<Button type="primary" loading={isPending} onClick={handleStart}>
开始处理
</Button>
<AppProgressSteps
current={step}
current={progress}
items={[
{
title: <>计算拆分字段</>,
title: '计算拆分字段',
description: message[1],
},
{
title: <>数据库表增加拆分字段</>,
title: '数据库表增加拆分字段',
description: message[2],
},
{
title: <>更新拆分字段</>,
title: '更新拆分字段',
description: message[3],
},
{
title: <>更新原始字段</>,
title: '更新原始字段',
description: message[4],
},
{
title: (
<>
第五步
<br />
处理结果
</>
),
title: '处理结果',
description: message[5],
},
]}
/>
......@@ -108,12 +121,12 @@ export default function ButtonModal() {
<Flex justify="center" gap={20}>
{current > 0 && <Button onClick={() => setCurrent(current - 1)}>上一步</Button>}
{current < steps.length - 1 && (
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!checked}>
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!field}>
下一步
</Button>
)}
{current === steps.length - 1 && (
<Button type="primary" onClick={() => setOpen(false)}>
<Button type="primary" disabled={isPending} onClick={handleClose}>
关闭
</Button>
)}
......@@ -121,7 +134,7 @@ export default function ButtonModal() {
}
destroyOnClose
width={800}
onCancel={() => setOpen(false)}>
onCancel={handleClose}>
<div style={{ minHeight: 300, padding: '20px 0' }}>
<Form form={form} labelCol={{ span: 5 }} preserve={false} initialValues={initialValues}>
{steps.map((item, index) => (
......
src/modules/data/preprocess/split/query.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { message } from 'antd'
import { processData } from './api'
import type { ProcessDataParams } from './types'
import { useProcessProgressQuery } from '@/hooks/useQuery'
// 处理数据
export function useProcessData() {
const queryClient = useQueryClient()
const { data, start, remove } = useProcessProgressQuery({ function_name: 'split' })
const query = useMutation({
mutationFn: (data: ProcessDataParams) => {
start()
return processData(data)
},
onSuccess: () => {
message.success('处理完成')
queryClient.invalidateQueries({ queryKey: ['data'] })
},
})
return { ...query, progress: data.progress, message: data.message, remove }
}
src/modules/data/preprocess/split/types.ts 0 → 100644
浏览文件 @ 1b3cb1c4
export interface ProcessDataParams {
field: string
char: string
rule: string
}
src/modules/data/preprocess/symbol/api.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import httpRequest from '@/utils/axios'
import type { ProcessDataParams } from './types'
// 缺省值处理
export function processData(data: ProcessDataParams) {
return httpRequest.post('/api/resource/bi/v1/processing/pre-processing/punctuation', data)
}
src/modules/data/preprocess/symbol/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
......@@ -2,28 +2,42 @@ import { useState } from 'react'
import { Button, Flex, Modal, Radio, Form, Row, Col, Input } from 'antd'
import { useDataFieldQuery } from '@/hooks/useQuery'
import AppProgressSteps from '@/components/AppProgressSteps'
import { useProcessData } from '../query'
export default function ButtonModal() {
const { fieldOptions } = useDataFieldQuery()
const { fieldOptions, getFieldName } = useDataFieldQuery()
const [open, setOpen] = useState(false)
const [current, setCurrent] = useState(0)
const [form] = Form.useForm()
const initialValues = {
checked: '',
rule: '',
field: '',
char: '',
}
const checked = Form.useWatch('checked', form)
const field = Form.useWatch('field', form)
const [step, setStep] = useState<number>(-1)
const { mutate, isPending, progress, message, remove } = useProcessData()
// 开始处理
const handleStart = () => {
form.validateFields().then((values) => {
mutate(values)
})
}
// 关闭并重置
const handleClose = () => {
setOpen(false)
setCurrent(0)
remove()
}
const steps = [
{
title: '请选择去标点字段',
content: (
<Form.Item name="checked" rules={[{ required: true, message: '请选择去标点字段' }]}>
<Form.Item name="field" rules={[{ required: true, message: '请选择去标点字段' }]}>
<Radio.Group>
<Row gutter={[10, 10]}>
{fieldOptions.map((item) => (
......@@ -40,8 +54,8 @@ export default function ButtonModal() {
title: '配置处理规则',
content: (
<>
<Form.Item label="数据去标点字段">{checked}</Form.Item>
<Form.Item label="处理规则" name="rule" rules={[{ required: true, message: '请输入处理规则' }]}>
<Form.Item label="数据去标点字段">{getFieldName(field)}</Form.Item>
<Form.Item label="处理规则" name="char" rules={[{ required: true, message: '请输入处理规则' }]}>
<Input />
</Form.Item>
</>
......@@ -51,22 +65,25 @@ export default function ButtonModal() {
title: '处理执行',
content: (
<>
<p>数据去标点处理字段：{checked}</p>
<p>数据去标点处理字段：{getFieldName(field)}</p>
<Flex vertical align="center" style={{ marginTop: '20px' }}>
<Button type="primary" onClick={() => setStep(1)}>
<Button type="primary" loading={isPending} onClick={handleStart}>
开始处理
</Button>
<AppProgressSteps
current={step}
current={progress}
items={[
{
title: <>开始</>,
title: '开始',
description: message[1],
},
{
title: <>数据去标点处理</>,
title: '数据去标点处理',
description: message[2],
},
{
title: <>处理结果</>,
title: '处理结果',
description: message[3],
},
]}
/>
......@@ -88,12 +105,12 @@ export default function ButtonModal() {
<Flex justify="center" gap={20}>
{current > 0 && <Button onClick={() => setCurrent(current - 1)}>上一步</Button>}
{current < steps.length - 1 && (
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!checked}>
<Button type="primary" onClick={() => setCurrent(current + 1)} disabled={!field}>
下一步
</Button>
)}
{current === steps.length - 1 && (
<Button type="primary" onClick={() => setOpen(false)}>
<Button type="primary" disabled={isPending} onClick={handleClose}>
关闭
</Button>
)}
......@@ -101,7 +118,7 @@ export default function ButtonModal() {
}
destroyOnClose
width={800}
onCancel={() => setOpen(false)}>
onCancel={handleClose}>
<div style={{ minHeight: 300, padding: '20px 0' }}>
<Form form={form} labelCol={{ span: 5 }} preserve={false} initialValues={initialValues}>
{steps.map((item, index) => (
......
src/modules/data/preprocess/symbol/query.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { message } from 'antd'
import { processData } from './api'
import type { ProcessDataParams } from './types'
import { useProcessProgressQuery } from '@/hooks/useQuery'
// 处理数据
export function useProcessData() {
const queryClient = useQueryClient()
const { data, start, remove } = useProcessProgressQuery({ function_name: 'punctuation' })
const query = useMutation({
mutationFn: (data: ProcessDataParams) => {
start()
return processData(data)
},
onSuccess: () => {
message.success('处理完成')
queryClient.invalidateQueries({ queryKey: ['data'] })
},
})
return { ...query, progress: data.progress, message: data.message, remove }
}
src/modules/data/preprocess/symbol/types.ts 0 → 100644
浏览文件 @ 1b3cb1c4
export interface ProcessDataParams {
field: string
rule: string
}
src/modules/data/preprocess/type/api.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import httpRequest from '@/utils/axios'
import type { ProcessDataParams } from './types'
// 缺省值处理
export function processData(data: ProcessDataParams) {
return httpRequest.post('/api/resource/bi/v1/processing/pre-processing/type', data)
}
src/modules/data/preprocess/type/components/ButtonModal.tsx
浏览文件 @ 1b3cb1c4
......@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react'
import { Button, Flex, Modal, Form, Table, Select } from 'antd'
import { useDataFieldQuery } from '@/hooks/useQuery'
import AppProgressSteps from '@/components/AppProgressSteps'
import { useProcessData } from '../query'
export default function ButtonModal() {
const { data: fields = [] } = useDataFieldQuery()
......@@ -11,7 +12,20 @@ export default function ButtonModal() {
const [current, setCurrent] = useState(0)
const [form] = Form.useForm()
const [dataSource, setDataSource] = useState<{ key: number; raw_value: string; new_value: string }[]>([])
const [step, setStep] = useState<number>(-1)
const { mutate, isPending, progress, message, remove } = useProcessData()
// 开始处理
const handleStart = () => {
form.validateFields().then((values) => {
mutate(values)
})
}
// 关闭并重置
const handleClose = () => {
setOpen(false)
setCurrent(0)
remove()
}
useEffect(() => {
if (fields?.length) {
......@@ -34,12 +48,7 @@ export default function ButtonModal() {
)
}
const options = [
{
label: '文本',
value: 'text',
},
]
const options = [{ label: '文本', value: 'string' }]
const steps = [
{
title: '请选择转换字段',
......@@ -76,21 +85,15 @@ export default function ButtonModal() {
content: (
<>
<Flex vertical align="center" style={{ marginTop: '20px' }}>
<Button type="primary" onClick={() => setStep(1)}>
<Button type="primary" loading={isPending} onClick={handleStart}>
开始处理
</Button>
<AppProgressSteps
current={step}
current={progress}
items={[
{
title: <>开始</>,
},
{
title: <>数据类型转换</>,
},
{
title: <>处理结果</>,
},
{ title: '开始', description: message[1] },
{ title: '数据类型转换', description: message[2] },
{ title: '处理结果', description: message[3] },
]}
/>
</Flex>
......@@ -116,7 +119,7 @@ export default function ButtonModal() {
</Button>
)}
{current === steps.length - 1 && (
<Button type="primary" onClick={() => setOpen(false)}>
<Button type="primary" disabled={isPending} onClick={handleClose}>
关闭
</Button>
)}
......@@ -124,7 +127,7 @@ export default function ButtonModal() {
}
destroyOnClose
width={800}
onCancel={() => setOpen(false)}>
onCancel={handleClose}>
<div style={{ minHeight: 300, padding: '20px 0' }}>
<Form form={form} labelCol={{ span: 5 }} preserve={false}>
{steps.map((item, index) => (
......
src/modules/data/preprocess/type/query.ts 0 → 100644
浏览文件 @ 1b3cb1c4
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { message } from 'antd'
import { processData } from './api'
import type { ProcessDataParams } from './types'
import { useProcessProgressQuery } from '@/hooks/useQuery'
// 处理数据
export function useProcessData() {
const queryClient = useQueryClient()
const { data, start, remove } = useProcessProgressQuery({ function_name: 'type' })
const query = useMutation({
mutationFn: (data: ProcessDataParams) => {
start()
return processData(data)
},
onSuccess: () => {
message.success('处理完成')
queryClient.invalidateQueries({ queryKey: ['data'] })
},
})
return { ...query, progress: data.progress, message: data.message, remove }
}
src/modules/data/preprocess/type/types.ts 0 → 100644
浏览文件 @ 1b3cb1c4
export interface ProcessDataParams {
fields: string
action: string
rules: string
rule: string
specify: string
}
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论