training_data/apps/web/src/app/admin/assessmentstandard/assessment-standard-provide...

141 lines
4.7 KiB
TypeScript
Executable File

import React, {
createContext,
ReactNode,
useContext,
useMemo,
useState,
} from "react";
// import { useDebounce } from "use-debounce";
import { Form, FormInstance } from 'antd';
import { api } from "@nice/client";
interface AssessmentStandardContextType {
form: FormInstance;
sportProjectList: {
id: string;
name: string;
unit: string;
deletedAt?: string | null;
}[];
sportProjectLoading: boolean;
ageRanges: { start: number; end: number; label: string; }[];
records: { score: number, standards: number[] }[];
isAgeModalVisible: boolean;
isScoreModalVisible: boolean;
showAgeModal: () => void;
handleAgeOk: (values: any) => void;
handleAgeCancel: () => void;
showScoreModal: () => void;
handleScoreOk: (values: any) => void;
handleScoreCancel: () => void;
setRecords: (records: { score: number, standards: number[] }[]) => void;
setIsAgeModalVisible: (isAgeModalVisible: boolean) => void;
setIsScoreModalVisible: (isScoreModalVisible: boolean) => void;
ageForm: FormInstance;
scoreForm: FormInstance;
setAgeRanges: (ageRanges: { start: number; end: number; label: string; }[]) => void;
isStandardCreate: boolean;
setIsStandardCreate: (isStandardCreate: boolean) => void;
}
const AssessmentStandardContext = createContext<AssessmentStandardContextType | null>(null);
interface AssessmentStandardProviderProps {
children: ReactNode;
}
export function AssessmentStandardProvider({ children }: AssessmentStandardProviderProps) {
const [form] = Form.useForm();
const [ageForm] = Form.useForm();
const [scoreForm] = Form.useForm();
const { data: sportProjectList, isLoading: sportProjectLoading } = api.sportProject.findMany.useQuery()
const [ageRanges, setAgeRanges] = useState<{ start: number; end: number; label: string; }[]>([]);
const [records, setRecords] = useState<{ score: number, standards: number[] }[]>([]);
const [isAgeModalVisible, setIsAgeModalVisible] = useState(false);
const [isScoreModalVisible, setIsScoreModalVisible] = useState(false);
const [isStandardCreate, setIsStandardCreate] = useState(true);
// 显示年龄范围模态框
const showAgeModal = () => {
setIsAgeModalVisible(true);
};
// 处理年龄范围模态框确定
const handleAgeOk = (values: any) => {
console.log('values', values)
const { start, end } = values;
const newRange = {
start,
end,
label: end ? `${start}-${end}` : `${start}岁以上`,
};
setAgeRanges([...ageRanges, newRange]);
setIsAgeModalVisible(false);
};
// 处理年龄范围模态框取消
const handleAgeCancel = () => {
setIsAgeModalVisible(false);
};
// 显示分数标准模态框
const showScoreModal = () => {
setIsScoreModalVisible(true);
};
// 处理分数标准模态框确定
const handleScoreOk = async (values: any) => {
const { score, standards } = values;
console.log(values)
const standardsArray = Object.keys(values)
.filter(key => key.startsWith('standards_'))
.map(key => values[key]);
setRecords([...records, { score, standards: standardsArray }]);
setIsScoreModalVisible(false);
};
// 处理分数标准模态框取消
const handleScoreCancel = () => {
setIsScoreModalVisible(false);
};
return (
<AssessmentStandardContext.Provider
value={{
form,
sportProjectList: sportProjectList?.map((item) => ({
id: item.id,
name: item.name,
unit: item.unit,
deletedAt: item.deletedAt
})),
sportProjectLoading,
ageRanges,
records,
isAgeModalVisible,
isScoreModalVisible,
setIsAgeModalVisible,
setIsScoreModalVisible,
showAgeModal,
handleAgeOk,
handleAgeCancel,
showScoreModal,
handleScoreOk,
handleScoreCancel,
setRecords,
ageForm,
scoreForm,
setAgeRanges,
isStandardCreate,
setIsStandardCreate
}}>
{children}
</AssessmentStandardContext.Provider>
);
}
export const useAssessmentStandardContext = () => {
const context = useContext(AssessmentStandardContext);
if (!context) {
throw new Error("useAssessmentStandardContext must be used within AssessmentStandardProvider");
}
return context;
};