/** 活动列表 GET /activityManage/main/list */
// @ts-ignore
/* eslint-disable */
import { request } from '@umijs/max';
/** 活动列表 POST /activityManage/main/list */
export async function listUsingPost(
body: API.huodongshujuliebiaorucan,
options?: { [key: string]: any },
) {
return request<API.ResponseOfPageOfhuodongshujuliebiaochucan>(
'/seele-api/activityManage/main/list',
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
data: body,
...(options || {}),
},
);
}
/** 删除 POST /activityManage/main/delete */
export async function deleteUsingPost(
body: API.huodongshujuxiangqingrucan,
options?: { [key: string]: any },
) {
return request<API.ResponseOfhuodongshujuxiangqingchucan>(
'/seele-api/activityManage/main/delete',
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
data: body,
...(options || {}),
},
);
}
/** 批量获取活动链接 POST /activityManage/main/batchActUrl */
export async function batchActUrlUsingPost(
body: API.huodongshujupilianghuodonglianjierucan,
options?: { [key: string]: any },
) {
return request<API.ResponseOfListOfhuodongshujuhuodonglianjiepiliangchucan>(
'/seele-api/activityManage/main/batchActUrl',
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
data: body,
...(options || {}),
},
);
}
/** 导出获取活动批量链接 GET /activityManage/main/batchExportActUrl */
export async function batchExportActUrlUsingGet(
// 叠加生成的Param类型 (非body参数swagger默认没有生成对象)
params: API.batchExportActUrlUsingGETParams,
options?: { [key: string]: any },
) {
return request<any>('/seele-api/activityManage/main/batchExportActUrl', {
method: 'GET',
responseType: 'blob',
params: {
...params,
},
...(options || {}),
});
}
/** 搜索工具 GET /activityManage/main/searchTool */
export async function searchToolUsingGet(
// 叠加生成的Param类型 (非body参数swagger默认没有生成对象)
params: API.searchToolUsingGET1Params,
options?: { [key: string]: any },
) {
return request<API.ResponseOfActivityMainSearchToolResultVO>(
'/seele-api/activityManage/main/searchTool',
{
method: 'GET',
params: {
...params,
},
...(options || {}),
},
);
}
/** 测试人员列表 GET /activityManage/main/testerList */
export async function testerListUsingGet(options?: { [key: string]: any }) {
return request<API.ResponseOfListOflong>(
'/seele-api/activityManage/main/testerList',
{
method: 'GET',
...(options || {}),
},
);
}
/** 复制同一活动标识符下所有活动配置 POST /activityManage/main/copyAct */
export async function copyActUsingPost(
body: API.huodongshujufuzhirucan,
options?: { [key: string]: any },
) {
return request<API.ResponseOfhuodongshujuxiangqingchucan>(
'/seele-api/activityManage/main/copyAct',
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
data: body,
...(options || {}),
},
);
}
/** 检查活动标识符或活动名称是否重复 POST /activityManage/main/checkActNameUnique */
export async function checkActNameUniqueUsingPost(
body: API.huodongmingchengzhongfujianchaqingqiu,
options?: { [key: string]: any },
) {
return request<API.ResponseOfVoid>(
'/seele-api/activityManage/main/checkActNameUnique',
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
data: body,
...(options || {}),
},
);
}
/** 天天
领现金检查活动标识符或活动名称是否重复 POST /activityManage/main/preCheck4addAct */
export async function checkActNamePreCheck4addActUsingPost(
body: API.huodongmingchengzhongfujianchaqingqiu,
options?: { [key: string]: any },
) {
return request<API.ResponseOfVoid>(
'/seele-api/activityManage/main/preCheck4addAct',
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
data: body,
...(options || {}),
},
);
}
/** 获取当前登录用户信息 获取当前登录用户信息 POST /admin/get_login_user */
export async function getLoginUserUsingPost(options?: { [key: string]: any }) {
return request<API.ResponseOfUserInfoResp>(
'/seele-api/admin/get_login_user',
{
method: 'POST',
...(options || {}),
},
);
}
/** 注销接口 注销接口 GET /ulp/logout */
export async function logoutUsingGet(
// 叠加生成的Param类型 (非body参数swagger默认没有生成对象)
params: API.logoutUsingGETParams,
options?: { [key: string]: any },
) {
return request<API.ResponseOfLayoutResp>('/seele-api/ulp/logout', {
method: 'GET',
params: {
...params,
},
...(options || {}),
});
}
/** 查询可用奖池 */
export async function queryAvailablePrizePoolsUsingGet(
params: API.queryAvailablePrizePoolsUsingGETParams,
options?: { [key: string]: any },
) {
return request<API.ResponseOfLayoutResp>(
'/seele-api/activityManage/main/queryAvailablePrizePools',
{
method: 'GET',
params: {
...params,
},
...(options || {}),
},
);
}
/** 获取活动操作详情 GET /activityManage/main/getActOptDetail */
export async function getActOptDetailUsingGet(
// 叠加生成的Param类型 (非body参数swagger默认没有生成对象)
params: API.getActOptDetailUsingGETParams,
options?: Record<string, any>,
) {
return request<API.ResponseOfhuodongshujucaozuoxiangqingchucan>(
'/seele-api/activityManage/main/getActOptDetail',
{
method: 'GET',
params: {
...params,
},
...(options || {}),
},
);
}
/** 获取活动操作记录列表 GET /activityManage/main/getActOptRecordList */
export async function getActOptRecordListUsingGet(
body: API.huodongshujuAbtfenzhicaozuoliebiaochaxunrucan,
options?: Record<string, any>,
) {
return request<API.ResponseOfPageOfhuodongshujucaozuojiluchucan>(
'/seele-api/activityManage/main/getActOptRecordList',
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
data: body,
...(options || {}),
},
);
}
/** 获取活动操作分支列表 POST /activityManage/main/getActOptAbtBranchList */
export async function getActOptAbtBranchListUsingPost(
body: API.huodongshujuAbtfenzhiliebiaochaxunrucan,
options?: { [key: string]: any },
) {
return request<API.ResponseOfListOfstring>(
'/seele-api/activityManage/main/getActOptAbtBranchList',
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
data: body,
...(options || {}),
},
);
}
你抄一下这个格式，改下我的调用import {
DeleteOutlined,
EditOutlined,
EyeOutlined,
PlusOutlined,
} from '@
ant-design/icons';
import type { ActionType, ProColumns } from '@
ant-design/pro-components';
import { ProTable } from '@
ant-design/pro-components';
import { request, useModel } from '@umijs/max';
import {
Button,
Form,
Input,
Modal,
Spin,
Tooltip,
Typography,
message,
} from '
antd';
import { useRef, useState } from 'react';
import {
ApmLogLevel,
ApmLogSendType,
apmLog,
markEnd,
markStart,
} from 'sheinq'; // 埋点相关
type DbRecord = {
id: number;
database_name: string;
created_user_name: string;
updated_at: string;
remark?: string;
};
type DbDetail = {
id: number;
name: string;
host: string;
port: number;
username: string;
password: string;
database_name: string;
remark?: string;
};
const DbconnectionPage = () => {
const actionRef = useRef<ActionType>();
const [isModalOpen, setIsModalOpen] = useState(false);
const [editRecord, setEditRecord] = useState<DbRecord | undefined>();
const [loading, setLoading] = useState(false);
const [paramModalOpen, setParamModalOpen] = useState(false);
const [currentRecord, setCurrentRecord] = useState<DbRecord | undefined>();
const [form] = Form.useForm();
const { initialState = {} } = useModel('@@initialState');
const { currentUser = {} } = initialState;
const { employeeId: rawEmpId, enName } = currentUser;
// 服务端只接受number，这里转换 employeeId 为 number
const employeeId =
rawEmpId && !isNaN(Number(rawEmpId)) ? Number.parseInt(rawEmpId, 10) : 123;
const { Title } = Typography;
// 接口路径常量
const BASE_URL = 'https://growth-qa-test.sheincorp.cn/api/v1/connections';
// === 统一请求参数构建 ===
const buildPayload = (values: any, isEdit: boolean) => {
const base = {
name: values.name,
host: values.host,
port: parseInt(values.port, 10),
username: values.username,
password: values.password,
databaseName: values.database_name,
charset: 'utf8mb4',
isEnabled: true,
remark: values.remark,
timeout: isEdit ? 0 : 100, // 更新操作无需timeout
};
return isEdit
? {
...base,
updated_user_id: employeeId,
updated_user_name: enName ?? 'kovin wu',
}
: {
...base,
created_user_id: employeeId,
created_user_name: enName ?? 'kovin wu',
};
};
// 查询数据库列表
const queryDbList = async (params: {
id?: number;
database_name?: string;
created_user_name?: string;
current?: number;
pageSize?: number;
}) => {
// 埋点：列表查询
apmLog(
ApmLogLevel.Info,
'查询数据库列表',
JSON.stringify(params),
ApmLogSendType.NoApmYesLog,
{ pageNum: params.current },
);
try {
const result = await request<{
code: number;
info: { total: number; records: any[] };
msg: string;
}>(`${BASE_URL}/list`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
data: {
id: params.id || 0,
database_name: params.database_name || '',
created_user_name: params.created_user_name || '',
currentPage: params.current || 1,
pageSize: params.pageSize || 10,
},
});
if (result.code === 0) {
// 转换数据结构
const list = result.info.records.map((item) => ({
id: item.id,
name: item.name,
database_name: item.database_name,
created_user_name: item.created_user_name,
updated_at: item.updated_at,
remark: item.remark, // ✅ 添加这一行
}));
return { data: list, total: result.info.total, success: true };
} else {
message.error(result.msg || '请求失败');
apmLog(
ApmLogLevel.Error,
'数据库列表请求失败',
JSON.stringify(result),
ApmLogSendType.NoApmYesLog,
);
return { data: [], total: 0, success: false };
}
} catch (error: any) {
message.error('请求异常');
apmLog(
ApmLogLevel.Error,
'数据库列表请求异常',
error.message,
ApmLogSendType.NoApmYesLog,
);
return { data: [], total: 0, success: false };
}
};
// 测试数据库连接
const testDbConnection = async (values: any, isEdit?: boolean) => {
apmLog(
ApmLogLevel.Info,
'测试数据库连接',
JSON.stringify(values),
ApmLogSendType.NoApmYesLog,
{ type: isEdit ? 'edit' : 'add' },
);
try {
const res = await request(`${BASE_URL}/test`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
data: {
name: values.database_name,
host: values.host,
port: parseInt(values.port, 10),
username: values.username,
password: values.password,
databaseName: values.database_name,
charset: 'utf8mb4',
timeout: 100,
isEnabled: true,
},
});
if (res.code === 0) {
message.success('连接成功');
return { success: true };
} else {
message.error(res.msg || '连接失败');
return { success: false };
}
} catch (error: any) {
message.error(error.message || '连接异常');
return { success: false };
} finally {
apmLog(
ApmLogLevel.Info,
'数据库连接测试完成',
JSON.stringify(values),
ApmLogSendType.NoApmYesLog,
);
}
};
// === 保存，把编辑和新增整合===
const handleSave = async () => {
markEnd('db-conn-modal');
try {
const values = await form.validateFields();
const isEdit = !!editRecord;
const payload = buildPayload(values, isEdit);
const url = isEdit
? `${BASE_URL}/update/${editRecord?.id}`
: `${BASE_URL}/new`;
// 埋点：保存前
apmLog(
ApmLogLevel.Info,
isEdit ? '编辑数据库提交' : '新增数据库提交',
JSON.stringify(payload),
ApmLogSendType.NoApmYesLog,
{ dbId: editRecord?.id },
);
const res = await request(url, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
data: payload,
});
if (+res.code === 0) {
message.success(isEdit ? '更新成功' : '保存成功');
setIsModalOpen(false);
setEditRecord(undefined);
form.resetFields();
actionRef.current?.reload();
// 埋点：保存成功
apmLog(
ApmLogLevel.Info,
isEdit ? '编辑数据库成功' : '新增数据库成功',
JSON.stringify(payload),
ApmLogSendType.NoApmYesLog,
{ dbId: editRecord?.id },
);
} else {
message.error(res.msg || '保存失败');
// 埋点：保存失败
apmLog(
ApmLogLevel.Warn,
'数据库保存失败',
JSON.stringify(res),
ApmLogSendType.NoApmYesLog,
);
}
} catch (err) {
message.error('保存失败，请检查表单');
// 埋点：保存异常
apmLog(
ApmLogLevel.Error,
'数据库保存异常',
'表单校验失败',
ApmLogSendType.NoApmYesLog,
);
}
};
// 查看数据库详情
const showParamModal = async (record: DbRecord) => {
markStart('db-detail-modal');
try {
setLoading(true);
apmLog(
ApmLogLevel.Info,
'点击查看数据库详情',
JSON.stringify(record),
ApmLogSendType.NoApmYesLog,
{ dbId: record.id },
);
const res = await request<{ code: number; info: DbDetail; msg: string }>(
`${BASE_URL}/${record.id}`,
{ method: 'GET' },
);
if (res.code === 0) {
form.setFieldsValue(res.info);
setCurrentRecord(record);
setParamModalOpen(true);
} else {
message.error(res.msg || '获取详情失败');
}
} catch (error: any) {
message.error(error.message || '请求详情失败');
} finally {
setLoading(false);
markEnd('db-detail-modal');
}
};
// === 抽象详情获取逻辑 ===
const fetchDbDetail = async (id: number, actionType: 'view' | 'edit') => {
try {
const res = await request<{ code: number; info: DbDetail; msg: string }>(
`${BASE_URL}/${id}`,
{ method: 'GET' },
);
if (res.code === 0) {
form.setFieldsValue(res.info);
return true;
}
throw new Error(res.msg);
} catch (error: any) {
message.error(`获取${actionType === 'edit' ? '编辑数据' : '详情'}失败`);
apmLog(
ApmLogLevel.Error,
`数据库${actionType === 'edit' ? '编辑' : '详情'}接口异常`,
error.message,
ApmLogSendType.NoApmYesLog,
{ dbId: id },
);
return false;
}
};
// 编辑数据库
const handleEdit = async (record: DbRecord) => {
markStart('db-conn-modal');
setLoading(true);
apmLog(
ApmLogLevel.Info,
'点击编辑数据库',
JSON.stringify(record),
ApmLogSendType.NoApmYesLog,
{ dbId: record.id },
);
if (await fetchDbDetail(record.id, 'edit')) {
setEditRecord(record);
setIsModalOpen(true);
}
setLoading(false);
};
// 删除数据库
const handleDelete = async (record: DbRecord) => {
Modal.confirm({
title: '确认删除?',
content: `确定要删除数据库连接 "${record.database_name}" 吗？`,
onOk: async () => {
markStart('db-conn-delete');
apmLog(
ApmLogLevel.Warn,
'点击删除数据库',
JSON.stringify(record),
ApmLogSendType.NoApmYesLog,
{ dbId: record.id },
);
try {
const res = await request(`${BASE_URL}/delete/${record.id}`, {
method: 'POST',
});
if (+res.code === 0) {
message.success('删除成功');
actionRef.current?.reload();
} else {
throw new Error(res.msg);
}
} catch (error: any) {
message.error(error.message || '删除失败');
} finally {
markEnd('db-conn-delete');
}
},
});
};
// 测试连接
const handleTestConnection = async () => {
try {
const values = await form.validateFields();
await testDbConnection(values, !!editRecord);
} catch {
message.error('请填写完整信息');
}
};
// 表格列配置
const columns: ProColumns<DbRecord>[] = [
{ title: 'ID', dataIndex: 'id', search: false },
{ title: '数据库名称', dataIndex: 'name' },
{ title: '概述', dataIndex: 'remark', ellipsis: true },
{ title: '创建人', dataIndex: 'created_user_name' },
{ title: '创建时间', dataIndex: 'updated_at', valueType: 'dateTime' },
{
title: '操作',
valueType: 'option',
render: (_, record) => [
<Tooltip title="查看" key="view">
<Button
icon={<EyeOutlined />}
onClick={() => showParamModal(record)}
/>
</Tooltip>,
<Tooltip title="编辑" key="edit">
<Button icon={<EditOutlined />} onClick={() => handleEdit(record)} />
</Tooltip>,
<Tooltip title="删除" key="delete">
<Button
icon={<DeleteOutlined />}
danger
onClick={() => handleDelete(record)}
/>
</Tooltip>,
],
},
];
return (
<>
<ProTable<DbRecord>
columns={columns}
actionRef={actionRef}
cardBordered
headerTitle="数据库管理"
request={queryDbList}
rowKey="id"
pagination={{ defaultPageSize: 10, showSizeChanger: true }}
toolBarRender={() => [
<Button
key="add"
icon={<PlusOutlined />}
type="primary"
onClick={() => {
markStart('db-conn-modal');
setIsModalOpen(true);
form.resetFields();
setEditRecord(undefined);
}}
>
新增数据库
</Button>,
]}
/>
{/* 新增/编辑弹窗 */}
<Modal
title={editRecord ? '编辑数据库连接' : '新增数据库连接'}
open={isModalOpen}
onCancel={() => {
setIsModalOpen(false);
markEnd('db-conn-modal');
}}
footer={[
<Button key="test" onClick={handleTestConnection}>
测试连接
</Button>,
<Button key="cancel" onClick={() => setIsModalOpen(false)}>
取消
</Button>,
<Button key="submit" type="primary" onClick={handleSave}>
保存
</Button>,
]}
>
<Spin spinning={loading}>
<Form form={form} layout="vertical">
<Form.Item
label="数据库名称"
name="name"
rules={[{ required: true }]}
>
<Input />
</Form.Item>
<Form.Item
label="DB名称"
name="database_name"
rules={[{ required: true, max: 32 }]}
>
<Input />
</Form.Item>
<Form.Item label="Host" name="host" rules={[{ required: true }]}>
<Input placeholder="127.0.0.1" />
</Form.Item>
<Form.Item label="Port" name="port" rules={[{ required: true }]}>
<Input placeholder="3306" />
</Form.Item>
<Form.Item
label="用户名"
name="username"
rules={[{ required: true }]}
>
<Input />
</Form.Item>
<Form.Item
label="密码"
name="password"
rules={[{ required: true }]}
>
<Input.Password />
</Form.Item>
<Form.Item label="概述" name="remark">
<Input.TextArea rows={3} />
</Form.Item>
</Form>
</Spin>
</Modal>
{/* 详情弹窗 */}
<Modal
title="数据库参数配置"
open={paramModalOpen}
// 修复点：添加 onCancel 处理
onCancel={() => {
setParamModalOpen(false);
markEnd('db-detail-modal');
}}
footer={[
<Button
key="close"
onClick={() => {
setParamModalOpen(false);
markEnd('db-detail-modal');
}}
>
关闭
</Button>,
]}
>
<Spin spinning={loading}>
<Form form={form} layout="vertical" disabled>
<Form.Item label="数据库名称" name="name">
<Input />
</Form.Item>
<Form.Item label="DB名称" name="database_name">
<Input />
</Form.Item>
<Form.Item label="Host" name="host">
<Input />
</Form.Item>
<Form.Item label="Port" name="port">
<Input />
</Form.Item>
<Form.Item label="用户名" name="username">
<Input />
</Form.Item>
<Form.Item label="密码" name="password">
<Input.Password />
</Form.Item>
<Form.Item label="概述" name="remark">
<Input.TextArea rows={3} />
</Form.Item>
</Form>
</Spin>
</Modal>
</>
);
};
export default DbconnectionPage;
扫一扫
4925
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
