rzmk/learnhouse
1
0
Fork 0
mirror of https://github.com/rzmk/learnhouse.git synced 2025-12-19 04:19:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add indication of elem nature in course edit

Browse source
This commit is contained in:
swve 2023-06-22 20:35:30 +02:00
parent 3a898eb29a
commit 018e20c10e
7 changed files with 202 additions and 230 deletions
Download patch file Download diff file Expand all files Collapse all files

17
front/components/Pages/CourseEdit/Draggables/Activity.tsx
View file

@ -4,6 +4,7 @@ import { Draggable } from "react-beautiful-dnd";
import { EyeOpenIcon, Pencil2Icon } from '@radix-ui/react-icons'
import styled from "styled-components";
import { getUriWithOrg } from "@services/config/config";
import { FileText, Video, Sparkles } from "lucide-react";
function Activity(props: any) {
@ -12,16 +13,24 @@ function Activity(props: any) {
{(provided) => (
<div
className="flex flex-row items-center py-2 my-3 rounded-md justify-center bg-gray-50 hover:bg-gray-100 space-x-2 w-auto" key={props.activity.id} {...provided.draggableProps} {...provided.dragHandleProps} ref={provided.innerRef}>
<p>{props.activity.name} </p>
<div >
{props.activity.type === "video" && <Video size={16} />}
{props.activity.type === "documentpdf" && <FileText size={16} />}
{props.activity.type === "dynamic" && <Sparkles size={16} />}
</div>
<p className="first-letter:uppercase">{props.activity.name} </p>
<Link
href={getUriWithOrg(props.orgslug, "") + `/course/${props.courseid}/activity/${props.activity.id.replace("activity_", "")}`}
rel="noopener noreferrer"> <EyeOpenIcon />
className=" hover:cursor-pointer p-1 rounded-md bg-slate-200"
rel="noopener noreferrer">
<EyeOpenIcon className="text-slate-700"/>
</Link>
<Link
href={getUriWithOrg(props.orgslug, "") + `/course/${props.courseid}/activity/${props.activity.id.replace("activity_", "")}/edit`}
className=" hover:cursor-pointer p-1 rounded-md bg-slate-200"
rel="noopener noreferrer">
<Pencil2Icon />
<Pencil2Icon className="text-slate-700" />
</Link>
</div>
)}

20
front/components/Pages/CourseEdit/Draggables/Chapter.tsx
View file

@ -2,7 +2,7 @@ import React from "react";
import styled from "styled-components";
import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd";
import Activity from "./Activity";
import { PlusSquare } from "lucide-react";
import { PlusSquare, Trash, Trash2 } from "lucide-react";
function Chapter(props: any) {
return (
@ -13,20 +13,22 @@ function Chapter(props: any) {
{...provided.draggableProps}
ref={provided.innerRef}
// isDragging={snapshot.isDragging}
className="backdrop-blur-md"
key={props.info.list.chapter.id}
>
<h3 className="pt-3 font-bold text-md">
{props.info.list.chapter.name}
<h3 className="flex space-x-2 pt-3 font-bold text-md items-center">
<p>{props.info.list.chapter.name}
</p>
<button
<div
className="hover:cursor-pointer p-1 rounded-md bg-slate-100"
onClick={() => {
props.deleteChapter(props.info.list.chapter.id);
}}
>
X
</button>
<Trash2 className="text-slate-500" size={16} />
</div>
</h3>
<Droppable key={props.info.list.chapter.id} droppableId={props.info.list.chapter.id} type="activity">
{(provided) => (
@ -39,7 +41,7 @@ function Chapter(props: any) {
<div onClick={() => {
props.openNewActivityModal(props.info.list.chapter.id);
}} className="flex space-x-2 items-center py-2 my-3 rounded-md justify-center outline outline-3 text-slate-500 outline-slate-200 bg-slate-50 hover:cursor-pointer">
}} className="flex space-x-2 items-center py-2 my-3 rounded-md justify-center text-slate-500 outline-slate-200 bg-slate-50 hover:cursor-pointer">
<PlusSquare className="" size={17} />
<div className="text-sm mx-auto my-auto items-center font-bold">Add Activity</div>
</div>
@ -58,7 +60,7 @@ function Chapter(props: any) {
const ChapterWrapper = styled.div`
margin-bottom: 20px;
padding: 4px;
background-color: #ffffffc5;
background-color: #ffffff9d;
width: 900px;
font-size: 15px;
display: block;