完成评查点分组的增删改
This commit is contained in:
@@ -5,6 +5,14 @@ import { useEffect, useState } from "react";
|
||||
import { Button } from "~/components/ui/Button";
|
||||
import { Card } from "~/components/ui/Card";
|
||||
import ruleGroupsNewStyles from "~/styles/pages/rule-groups_new.css?url";
|
||||
import {
|
||||
getRuleGroups,
|
||||
getRuleGroup,
|
||||
createRuleGroup,
|
||||
updateRuleGroup,
|
||||
type RuleGroup as ApiRuleGroup,
|
||||
type RuleGroupCreateUpdateDto
|
||||
} from "~/api/evaluation_points/rule-groups";
|
||||
|
||||
// 类型定义
|
||||
interface RuleGroup {
|
||||
@@ -65,6 +73,19 @@ export const meta: MetaFunction = ({ location }) => {
|
||||
];
|
||||
};
|
||||
|
||||
// 将API分组转换为前端分组模型
|
||||
function mapApiToFrontend(apiGroup: ApiRuleGroup): RuleGroup {
|
||||
return {
|
||||
id: apiGroup.id,
|
||||
name: apiGroup.name,
|
||||
code: apiGroup.code || '',
|
||||
description: apiGroup.description,
|
||||
status: apiGroup.is_enabled ? 'active' : 'inactive',
|
||||
parentId: apiGroup.pid === '0' ? null : apiGroup.pid,
|
||||
sortOrder: 0 // API中不存在sortOrder字段，使用默认值
|
||||
};
|
||||
}
|
||||
|
||||
// 数据加载器
|
||||
export async function loader({ request }: LoaderFunctionArgs) {
|
||||
console.log("rule-groups.new loader被调用，URL:", request.url);
|
||||
@@ -74,85 +95,48 @@ export async function loader({ request }: LoaderFunctionArgs) {
|
||||
console.log("获取到的ID参数:", id);
|
||||
|
||||
// 获取一级分组列表 (用于选择父级分组)
|
||||
const parentGroups: ParentGroup[] = [
|
||||
{ id: "1", name: "合同基本要素检查" },
|
||||
{ id: "4", name: "销售合同专项检查" },
|
||||
{ id: "5", name: "行政处罚规范性检查" }
|
||||
];
|
||||
|
||||
// 简化这里，初始时不获取数据，避免可能的错误
|
||||
let group: RuleGroup | undefined = undefined;
|
||||
|
||||
// 如果有ID才尝试获取数据
|
||||
if (id) {
|
||||
// 简化的模拟数据
|
||||
const demoData: Record<string, RuleGroup> = {
|
||||
"1": {
|
||||
id: "1",
|
||||
name: "合同基本要素检查",
|
||||
code: "contract-base",
|
||||
description: "检查合同基本要素是否完整规范",
|
||||
status: "active",
|
||||
parentId: null,
|
||||
sortOrder: 0
|
||||
},
|
||||
"2": {
|
||||
id: "2",
|
||||
name: "必备要素检查",
|
||||
code: "essential-elements",
|
||||
description: "检查合同中的必要信息项是否齐全",
|
||||
status: "active",
|
||||
parentId: "1",
|
||||
sortOrder: 1
|
||||
},
|
||||
"3": {
|
||||
id: "3",
|
||||
name: "合同主体检查",
|
||||
code: "contract-parties",
|
||||
description: "检查合同主体信息是否规范",
|
||||
status: "active",
|
||||
parentId: "1",
|
||||
sortOrder: 2
|
||||
},
|
||||
"4": {
|
||||
id: "4",
|
||||
name: "销售合同专项检查",
|
||||
code: "contract-sales",
|
||||
description: "针对销售合同的专项合规检查",
|
||||
status: "active",
|
||||
parentId: null,
|
||||
sortOrder: 3
|
||||
},
|
||||
"5": {
|
||||
id: "5",
|
||||
name: "行政处罚规范性检查",
|
||||
code: "punishment",
|
||||
description: "对行政处罚文书的合规性检查",
|
||||
status: "inactive",
|
||||
parentId: null,
|
||||
sortOrder: 4
|
||||
}
|
||||
};
|
||||
|
||||
group = demoData[id];
|
||||
console.log("找到的group数据:", group);
|
||||
const parentGroupsResponse = await getRuleGroups();
|
||||
if (parentGroupsResponse.error) {
|
||||
console.error("获取父分组列表失败:", parentGroupsResponse.error);
|
||||
throw new Error(parentGroupsResponse.error);
|
||||
}
|
||||
|
||||
// 返回简化的数据结构
|
||||
return json<LoaderData>({
|
||||
const parentGroups: ParentGroup[] = parentGroupsResponse.data ? parentGroupsResponse.data.map(group => ({
|
||||
id: group.id,
|
||||
name: group.name
|
||||
})) : [];
|
||||
|
||||
// 初始化分组数据
|
||||
let group: RuleGroup | undefined = undefined;
|
||||
|
||||
// 如果有ID，获取分组详情
|
||||
if (id) {
|
||||
const groupResponse = await getRuleGroup(id);
|
||||
if (groupResponse.error) {
|
||||
console.error("获取分组详情失败:", groupResponse.error);
|
||||
throw new Error(groupResponse.error);
|
||||
}
|
||||
|
||||
if (groupResponse.data) {
|
||||
group = mapApiToFrontend(groupResponse.data);
|
||||
}
|
||||
}
|
||||
|
||||
// 返回加载的数据
|
||||
return Response.json({
|
||||
group,
|
||||
parentGroups,
|
||||
isEdit: !!group,
|
||||
error: undefined // 显式返回error字段，无错误时为undefined
|
||||
error: undefined
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("loader函数出错:", error);
|
||||
// 返回一个基本的响应，避免500错误
|
||||
return json<LoaderData>({
|
||||
return Response.json({
|
||||
group: undefined,
|
||||
parentGroups: [],
|
||||
isEdit: false,
|
||||
error: "加载数据时出错"
|
||||
error: error instanceof Error ? error.message : "加载数据时出错"
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -169,7 +153,6 @@ export async function action({ request }: ActionFunctionArgs) {
|
||||
const status = formData.get("status") as string || "active";
|
||||
const groupType = formData.get("groupType") as string;
|
||||
const parentId = groupType === "secondary" ? formData.get("parentId") as string : null;
|
||||
const sortOrder = parseInt(formData.get("sortOrder") as string || "0", 10);
|
||||
|
||||
// 表单验证
|
||||
const errors: ActionData["errors"] = {};
|
||||
@@ -180,8 +163,8 @@ export async function action({ request }: ActionFunctionArgs) {
|
||||
|
||||
if (!code || code.trim() === "") {
|
||||
errors.code = "分组编码不能为空";
|
||||
} else if (!/^[a-zA-Z0-9-]+$/.test(code)) {
|
||||
errors.code = "分组编码只能包含字母、数字和连字符";
|
||||
} else if (!/^[a-zA-Z0-9-_]+$/.test(code)) {
|
||||
errors.code = "分组编码只能包含字母、数字、连字符和下划线";
|
||||
}
|
||||
|
||||
if (groupType === "secondary" && (!parentId || parentId.trim() === "")) {
|
||||
@@ -189,38 +172,41 @@ export async function action({ request }: ActionFunctionArgs) {
|
||||
}
|
||||
|
||||
if (Object.keys(errors).length > 0) {
|
||||
return json<ActionData>({
|
||||
return Response.json({
|
||||
errors,
|
||||
values: Object.fromEntries(formData) as Record<string, string>
|
||||
});
|
||||
}
|
||||
|
||||
// 构建保存数据
|
||||
const saveData = {
|
||||
id,
|
||||
const saveData: RuleGroupCreateUpdateDto = {
|
||||
name: name.trim(),
|
||||
code: code.trim(),
|
||||
description: description?.trim() || "",
|
||||
status,
|
||||
parentId,
|
||||
sortOrder
|
||||
is_enabled: status === "active",
|
||||
pid: parentId === null ? "0" : parentId
|
||||
};
|
||||
|
||||
try {
|
||||
// 实际应用中应调用API
|
||||
console.log("保存分组数据:", saveData);
|
||||
// 根据是否有ID决定是创建还是更新
|
||||
let response;
|
||||
if (id) {
|
||||
response = await updateRuleGroup(id, saveData);
|
||||
} else {
|
||||
response = await createRuleGroup(saveData);
|
||||
}
|
||||
|
||||
// const response = await fetch(`${process.env.API_BASE_URL}/api/rule-groups${id ? `/${id}` : ''}`, {
|
||||
// method: id ? "PUT" : "POST",
|
||||
// headers: {
|
||||
// "Content-Type": "application/json",
|
||||
// },
|
||||
// body: JSON.stringify(saveData),
|
||||
// });
|
||||
//
|
||||
// if (!response.ok) {
|
||||
// throw new Error(`保存失败: ${response.status}`);
|
||||
// }
|
||||
// 处理API响应
|
||||
if (response.error) {
|
||||
console.error("保存分组失败:", response.error);
|
||||
return json<ActionData>({
|
||||
success: false,
|
||||
errors: {
|
||||
general: response.error
|
||||
},
|
||||
values: Object.fromEntries(formData) as Record<string, string>
|
||||
});
|
||||
}
|
||||
|
||||
// 保存成功，重定向到列表页
|
||||
return redirect("/rule-groups");
|
||||
@@ -229,7 +215,7 @@ export async function action({ request }: ActionFunctionArgs) {
|
||||
return json<ActionData>({
|
||||
success: false,
|
||||
errors: {
|
||||
general: "保存分组失败，请稍后重试"
|
||||
general: error instanceof Error ? error.message : "保存分组失败，请稍后重试"
|
||||
},
|
||||
values: Object.fromEntries(formData) as Record<string, string>
|
||||
});
|
||||
@@ -384,11 +370,13 @@ export default function RuleGroupNew() {
|
||||
defaultValue={group?.parentId || ""}
|
||||
>
|
||||
<option value="">请选择上级分组</option>
|
||||
{parentGroups.map((parent) => (
|
||||
<option key={parent.id} value={parent.id}>
|
||||
{parent.name}
|
||||
</option>
|
||||
))}
|
||||
{parentGroups
|
||||
.filter((parent: ParentGroup) => !group?.id || parent.id !== group.id) // 过滤掉当前编辑的分组
|
||||
.map((parent: ParentGroup) => (
|
||||
<option key={parent.id} value={parent.id}>
|
||||
{parent.name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
{actionData?.errors?.parentId && (
|
||||
<div className="form-error">{actionData.errors.parentId}</div>
|
||||
@@ -415,7 +403,7 @@ export default function RuleGroupNew() {
|
||||
{actionData?.errors?.code && (
|
||||
<div className="form-error">{actionData.errors.code}</div>
|
||||
)}
|
||||
<div className="form-tip">编码只能包含字母、数字和连字符，且必须唯一</div>
|
||||
<div className="form-tip">编码只能包含字母、数字、连字符和下划线，且必须唯一</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-col">
|
||||
@@ -477,7 +465,7 @@ export default function RuleGroupNew() {
|
||||
</div>
|
||||
|
||||
{/* 排序 */}
|
||||
<div className="form-group" style={{ maxWidth: "400px" }}>
|
||||
<div className="form-group hidden" style={{ maxWidth: "400px" }}>
|
||||
<label htmlFor="sortOrder" className="form-label">排序</label>
|
||||
<input
|
||||
type="number"
|
||||
|
||||
Reference in New Issue
Block a user