People: filter, add student id, submit homework
This commit is contained in:
rotimi-best
@@ -1,11 +1,17 @@
|
||||
<script>
|
||||
import Modal from '../../../../Modal/index.svelte';
|
||||
import Select from '../../../../Form/Select.svelte';
|
||||
import Preview from './Preview.svelte';
|
||||
import { SELECTABLE_STATUS } from './constants';
|
||||
import { snackbarStore } from '../../../../Snackbar/store';
|
||||
import { onMount } from 'svelte';
|
||||
|
||||
export let open;
|
||||
export let onClose;
|
||||
|
||||
export let submissionId;
|
||||
// export let submissionId;
|
||||
export let data = {};
|
||||
export let status = SELECTABLE_STATUS[0];
|
||||
|
||||
let grades = {};
|
||||
let total = 0;
|
||||
@@ -27,6 +33,16 @@
|
||||
);
|
||||
}
|
||||
|
||||
function handleStatusChange() {
|
||||
console.log(`status`, status);
|
||||
$snackbarStore.open = true;
|
||||
$snackbarStore.message = `Submission updated to '${status.label}'`;
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
console.log('mounting');
|
||||
});
|
||||
|
||||
$: setGrades(data);
|
||||
$: total = calculateTotal(grades);
|
||||
</script>
|
||||
@@ -49,7 +65,13 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="ml-10 w-1/3">
|
||||
<div class="border border-gray-300 rounded-md">
|
||||
<Select
|
||||
bind:value={status}
|
||||
options={SELECTABLE_STATUS}
|
||||
color="primary"
|
||||
onChange={handleStatusChange}
|
||||
/>
|
||||
<div class="border border-gray-300 rounded-md mt-2">
|
||||
<div
|
||||
class="hover:bg-gray-100 border-b border-t-0 border-l-0 border-r-0 border-gray-300 p-3"
|
||||
>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<script>
|
||||
import { fade, fly, slide } from 'svelte/transition';
|
||||
import { fly } from 'svelte/transition';
|
||||
import { group, course } from '../../../store';
|
||||
import { questionnaire } from '../store/exercise';
|
||||
import { questionnaireMetaData } from '../store/answers';
|
||||
@@ -150,19 +150,19 @@
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex flex-col justify-between">
|
||||
<h2 class="text-xl mb-2 mt-0">{$questionnaire.title}</h2>
|
||||
{#if STATUS.IN_PROGRESS === $questionnaireMetaData.status}
|
||||
{#if STATUS.PENDING === $questionnaireMetaData.status}
|
||||
<span
|
||||
class="bg-yellow-600 text-white rounded-full py-2 px-6 text-center"
|
||||
title="Status: Pending Review"
|
||||
>
|
||||
Pending
|
||||
</span>
|
||||
{:else if STATUS.REVIEWED === $questionnaireMetaData.status && getTotalScores() > 0}
|
||||
{:else if STATUS.GRADED === $questionnaireMetaData.status && getTotalScores() > 0}
|
||||
<span
|
||||
class="bg-green-700 text-white rounded-full py-2 px-6 text-center"
|
||||
title="Status: Pending Review"
|
||||
>
|
||||
Reviewed
|
||||
Graded
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,20 @@
|
||||
export const STATUS = {
|
||||
IN_PROGRESS: 0,
|
||||
REVIEWED: 1,
|
||||
};
|
||||
PENDING: 0,
|
||||
IN_PROGRESS: 1,
|
||||
GRADED: 2,
|
||||
};
|
||||
|
||||
export const SELECTABLE_STATUS = [
|
||||
{
|
||||
label: 'Submitted',
|
||||
value: STATUS.PENDING,
|
||||
},
|
||||
{
|
||||
label: 'In progress',
|
||||
value: STATUS.IN_PROGRESS,
|
||||
},
|
||||
{
|
||||
label: 'Graded',
|
||||
value: STATUS.GRADED,
|
||||
},
|
||||
];
|
||||
|
||||
@@ -8,7 +8,7 @@ import { STATUS } from '../Exercise/constants';
|
||||
// currentQuestionIndex: 5,
|
||||
// isFinished: true,
|
||||
// progressValue: 100,
|
||||
// status: STATUS.REVIEWED,
|
||||
// status: STATUS.GRADED,
|
||||
// });
|
||||
const initAnswerState = {
|
||||
answers: {},
|
||||
@@ -16,7 +16,7 @@ const initAnswerState = {
|
||||
currentQuestionIndex: 0,
|
||||
isFinished: false,
|
||||
progressValue: 100,
|
||||
status: STATUS.IN_PROGRESS,
|
||||
status: STATUS.PENDING,
|
||||
};
|
||||
|
||||
export const questionnaireMetaData = writable(initAnswerState);
|
||||
|
||||
@@ -10,4 +10,11 @@ export interface Person {
|
||||
email?: string;
|
||||
role_id: number;
|
||||
profile?: Profile;
|
||||
profile_id?: string;
|
||||
assigned_student_id: string;
|
||||
}
|
||||
|
||||
export interface ProfileRole {
|
||||
label: string;
|
||||
value: string | number;
|
||||
}
|
||||
|
||||
@@ -2,7 +2,7 @@ import { writable } from 'svelte/store';
|
||||
import { lessons } from './components/Lesson/store/lessons';
|
||||
import { ROLE } from '../../utils/constants/roles';
|
||||
|
||||
export const course = writable({});
|
||||
export const course = writable({ id: '' });
|
||||
|
||||
export const mockGroupMember = {
|
||||
id: '434534534535',
|
||||
|
||||
@@ -6,6 +6,8 @@
|
||||
export let options = [];
|
||||
export let labelKey = 'label';
|
||||
export let isRequired = false;
|
||||
export let className = '';
|
||||
export let color = 'default'; // primary
|
||||
export let onChange = () => {}; // This is to know if element is 'dirty'
|
||||
|
||||
// onMount(() => {
|
||||
@@ -13,18 +15,37 @@
|
||||
// });
|
||||
</script>
|
||||
|
||||
<label class="block">
|
||||
{#if label} <span class="text-gray-700">{label}</span> {/if}
|
||||
<label class="block {className}">
|
||||
{#if label} <span class="text-gray-700 mr-2">{label}</span> {/if}
|
||||
<select
|
||||
bind:value
|
||||
class="form-select block w-full mt-1"
|
||||
class="form-select block w-auto mt-1"
|
||||
required={isRequired}
|
||||
on:blur={onChange}
|
||||
on:change={onChange}
|
||||
class:primary={color === 'primary'}
|
||||
>
|
||||
{#each options as option}
|
||||
<option value={option}>
|
||||
<option class="bg-white text-black" value={option}>
|
||||
{option[labelKey]}
|
||||
</option>
|
||||
{/each}
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<style>
|
||||
select.primary {
|
||||
font-weight: 700;
|
||||
cursor: pointer;
|
||||
border-radius: 0.375rem;
|
||||
--tw-text-opacity: 1;
|
||||
color: rgba(255, 255, 255, var(--tw-text-opacity));
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgba(29, 78, 216, var(--tw-bg-opacity));
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' class='text-white' viewBox='0 0 20 20'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
|
||||
}
|
||||
|
||||
select.primary option {
|
||||
background-color: #fff;
|
||||
color: #000;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<div class="root mt-4 mx-auto {width} {className} relative pb-5">
|
||||
{#if $$slots.header}
|
||||
<div
|
||||
class="head flex bg-white items-center justify-between sticky right-0 w-full py-3"
|
||||
class="head flex items-center justify-between sticky right-0 w-full py-3"
|
||||
>
|
||||
<slot name="header" />
|
||||
</div>
|
||||
|
||||
@@ -36,8 +36,8 @@
|
||||
|
||||
{#if $snackbarStore.open}
|
||||
<div
|
||||
transition:fly={{ y: 200, duration: 1000 }}
|
||||
class="root text-white rounded-md flex justify-between items-center z-50 absolute {severityColor}"
|
||||
transition:fly={{ y: 200, duration: 500 }}
|
||||
class="root text-white rounded-md flex justify-between items-center absolute {severityColor}"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
{#if $snackbarStore.severity === SNACKBAR_SEVERITY.SUCCESS}
|
||||
@@ -64,5 +64,6 @@
|
||||
min-width: 288px;
|
||||
padding: 6px 16px;
|
||||
flex-wrap: wrap;
|
||||
z-index: 51;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user