drag
This commit is contained in:
parent
b18e139445
commit
e020fb69c1
51
src/Components/Drage/DragAndDropList.tsx
Normal file
51
src/Components/Drage/DragAndDropList.tsx
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
import React, { useState } from 'react';
|
||||
|
||||
const DragAndDropList: React.FC = () => {
|
||||
const [items, setItems] = useState<string[]>(['Item 1', 'Item 2', 'Item 3', 'Item 4']);
|
||||
const [draggedItemIndex, setDraggedItemIndex] = useState<number | null>(null);
|
||||
|
||||
const handleDragStart = (index: number) => {
|
||||
setDraggedItemIndex(index);
|
||||
};
|
||||
|
||||
const handleDragOver = (index: number) => {
|
||||
if (index !== draggedItemIndex && draggedItemIndex !== null) {
|
||||
const newItems = [...items];
|
||||
const draggedItem = newItems[draggedItemIndex];
|
||||
newItems.splice(draggedItemIndex, 1);
|
||||
newItems.splice(index, 0, draggedItem);
|
||||
setItems(newItems);
|
||||
setDraggedItemIndex(index);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDrop = () => {
|
||||
setDraggedItemIndex(null);
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
{items.map((item, index) => (
|
||||
<div
|
||||
key={index}
|
||||
draggable
|
||||
onDragStart={() => handleDragStart(index)}
|
||||
onDragOver={() => handleDragOver(index)}
|
||||
onDrop={handleDrop}
|
||||
style={{
|
||||
padding: '8px',
|
||||
margin: '4px',
|
||||
border: '1px solid #ccc',
|
||||
backgroundColor: '#f9f9f9',
|
||||
cursor: 'move',
|
||||
userSelect: 'none'
|
||||
}}
|
||||
>
|
||||
{item}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default DragAndDropList;
|
||||
|
|
@ -10,11 +10,11 @@ const App: React.FC = () => {
|
|||
const { subject_id } = useParams<ParamsEnum>();
|
||||
const response = useGetAllUnit({ subject_id: subject_id, pagination: true });
|
||||
const { setOldObjectToEdit } = useObjectToEdit();
|
||||
console.log(response?.data?.data, "response?.data");
|
||||
// console.log(response?.data?.data, "response?.data");
|
||||
const data = response?.data?.data;
|
||||
const lastElement =
|
||||
response?.data?.data && response?.data?.data[data?.length - 1];
|
||||
console.log(lastElement);
|
||||
// console.log(lastElement);
|
||||
|
||||
useEffect(() => {
|
||||
if (lastElement) {
|
||||
|
|
|
|||
|
|
@ -11,11 +11,11 @@ const App: React.FC = () => {
|
|||
const response = useGetAllLesson({ unit_id: unit_id, pagination: true });
|
||||
|
||||
const { setOldObjectToEdit } = useObjectToEdit();
|
||||
console.log(response?.data?.data, "response?.data");
|
||||
// console.log(response?.data?.data, "response?.data");
|
||||
const data = response?.data?.data;
|
||||
const lastElement =
|
||||
response?.data?.data && response?.data?.data[data?.length - 1];
|
||||
console.log(lastElement);
|
||||
// console.log(lastElement);
|
||||
|
||||
useEffect(() => {
|
||||
if (lastElement) {
|
||||
|
|
|
|||
|
|
@ -103,8 +103,7 @@ const AddPage: React.FC = () => {
|
|||
) => {
|
||||
const DataToSend = structuredClone(values);
|
||||
console.log(DataToSend);
|
||||
|
||||
return ;
|
||||
|
||||
setTagsSearch(null);
|
||||
const canAnswersBeShuffled = DataToSend?.canAnswersBeShuffled ? 1 : 0;
|
||||
if (isBseQuestion || DataToSend?.isBase === 1) {
|
||||
|
|
|
|||
|
|
@ -7,13 +7,15 @@ export const getInitialValues = (objectToEdit: Question): any => {
|
|||
const tags = objectToEdit?.tags?.map((item: any, index: number) => {
|
||||
return { ...item, key: index };
|
||||
});
|
||||
console.log(objectToEdit?.canAnswersBeShuffled);
|
||||
|
||||
return {
|
||||
id: objectToEdit?.id ?? null,
|
||||
content: objectToEdit?.content ?? "",
|
||||
image: objectToEdit?.image ?? "",
|
||||
subject_id: objectToEdit?.subject_id ?? "",
|
||||
canAnswersBeShuffled: objectToEdit?.canAnswersBeShuffled ?? 0,
|
||||
canAnswersBeShuffled: objectToEdit?.canAnswersBeShuffled ? 1 : 0,
|
||||
hint: objectToEdit?.hint ?? "",
|
||||
isBase: 0,
|
||||
parent_id: objectToEdit?.parent_id ?? "",
|
||||
QuestionOptions: objectToEdit?.QuestionOptions ?? [],
|
||||
|
|
@ -48,7 +50,8 @@ export const getInitialValuesBase = (objectToEdit: Question): any => {
|
|||
|
||||
return {
|
||||
...item,
|
||||
canAnswersBeShuffled: item?.canAnswersBeShuffled ?? 0,
|
||||
canAnswersBeShuffled: objectToEdit?.canAnswersBeShuffled ? 1 : 0,
|
||||
hint: objectToEdit?.hint ?? "",
|
||||
tags,
|
||||
};
|
||||
});
|
||||
|
|
@ -62,8 +65,8 @@ export const getInitialValuesBase = (objectToEdit: Question): any => {
|
|||
subject_id: objectToEdit?.subject_id ?? "",
|
||||
isBase: 1,
|
||||
parent_id: objectToEdit?.parent_id ?? "",
|
||||
canAnswersBeShuffled: objectToEdit?.canAnswersBeShuffled ?? 0,
|
||||
|
||||
canAnswersBeShuffled: objectToEdit?.canAnswersBeShuffled ? 1 : 0,
|
||||
hint: objectToEdit?.hint ?? "",
|
||||
Questions: questions,
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -60,12 +60,14 @@ export const useColumns = () => {
|
|||
record?.isBase ? t("practical.yes") : t("practical.no"),
|
||||
},
|
||||
{
|
||||
title: `${t("columns.question_options_count")}`,
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
title: t("columns.canAnswersBeShuffled"),
|
||||
dataIndex: "canAnswersBeShuffled",
|
||||
key: "canAnswersBeShuffled",
|
||||
align: "center",
|
||||
render: (text, record) => record?.question_options_count,
|
||||
render: (text, record) =>
|
||||
record?.canAnswersBeShuffled ? t("practical.yes") : t("practical.no"),
|
||||
},
|
||||
|
||||
{
|
||||
title: canAddQuestion ? (
|
||||
<button onClick={() => handelAdd()} className="add_button">
|
||||
|
|
|
|||
|
|
@ -29,6 +29,7 @@ export const menuItems: TMenuItem[] = [
|
|||
abilities: ABILITIES_ENUM?.PASS,
|
||||
abilities_value: ABILITIES_VALUES_ENUM.INDEX,
|
||||
prevPath: 0,
|
||||
|
||||
},
|
||||
{
|
||||
header: "page_header.grade",
|
||||
|
|
|
|||
5
src/enums/UserType.ts
Normal file
5
src/enums/UserType.ts
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
export enum UserTypeEnum {
|
||||
ADMIN = "ADMIN",
|
||||
RE_SELLER = "RE_SELLER",
|
||||
}
|
||||
|
||||
|
|
@ -154,7 +154,8 @@
|
|||
"max_mark": "العلامة الكاملة",
|
||||
"min_mark_to_pass": "علامة النجاح",
|
||||
"isBase": "سؤال رئيسي",
|
||||
"question_options_count": "عدد الخيارات"
|
||||
"question_options_count": "عدد الخيارات",
|
||||
"canAnswersBeShuffled":"يمكن خلط الإجابات"
|
||||
},
|
||||
"practical": {
|
||||
"to_confirm_deletion_please_re_enter": "لتأكيد الحذف، يرجى إعادة الإدخال",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { ReactElement, LazyExoticComponent, ReactNode } from "react";
|
||||
import { Mark_State, Payment_type, term_type } from "./Item";
|
||||
import { ABILITIES_ENUM, ABILITIES_VALUES_ENUM } from "../enums/abilities";
|
||||
import { UserTypeEnum } from "../enums/UserType";
|
||||
|
||||
export type ChildrenType = {
|
||||
children: ReactNode;
|
||||
|
|
@ -14,6 +15,7 @@ type TMenuItemBase = {
|
|||
withOutLayout?: boolean;
|
||||
abilities: ABILITIES_ENUM;
|
||||
abilities_value: ABILITIES_VALUES_ENUM;
|
||||
type?:UserTypeEnum
|
||||
prevPath: number;
|
||||
};
|
||||
|
||||
|
|
@ -37,6 +39,7 @@ export type TCrudRoute = {
|
|||
element: ReactElement | LazyExoticComponent<any>;
|
||||
abilities: ABILITIES_ENUM;
|
||||
abilities_value: ABILITIES_VALUES_ENUM;
|
||||
type?:ABILITIES_ENUM
|
||||
prevPath: number;
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -313,5 +313,6 @@ export interface Question {
|
|||
Questions?: any[];
|
||||
question_options_count?: any;
|
||||
QuestionOptions: QuestionOption[];
|
||||
hint?:string;
|
||||
tags: tags[]; // Assuming tags are strings, adjust as per actual data type
|
||||
}
|
||||
|
|
|
|||
5
src/types/UserType.ts
Normal file
5
src/types/UserType.ts
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
import { Nullable } from "./App";
|
||||
|
||||
// Define the Teacher interface
|
||||
|
||||
export type UserType = "admin" | "reSeller"
|
||||
|
|
@ -28,11 +28,14 @@ class AbilityManager {
|
|||
}
|
||||
return new Set(JSON.parse(abilitiesString));
|
||||
}
|
||||
|
||||
public hasAbility(
|
||||
category: ABILITIES_ENUM,
|
||||
value: ABILITIES_VALUES_ENUM,
|
||||
): boolean {
|
||||
// Allow all abilities if the category is PASS
|
||||
|
||||
|
||||
return true;
|
||||
if (category === ABILITIES_ENUM.PASS) {
|
||||
return true;
|
||||
|
|
@ -44,7 +47,7 @@ class AbilityManager {
|
|||
}
|
||||
|
||||
// Construct the ability string
|
||||
const abilityString = `${category}::${value}`;
|
||||
const abilityString = `${category}`;
|
||||
|
||||
// Check if the constructed ability string exists in the abilities set
|
||||
return this.abilities.has(abilityString);
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user