Skip to content

Commit 79476f1

Browse files
rockstarr-programmerrrockstarr-programmerr
committed
improve UI
1 parent 5742c9f commit 79476f1

File tree

2 files changed

+79
-70
lines changed

2 files changed

+79
-70
lines changed

‎src/views/classroom/ClassroomExercisesListening.vue

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,12 @@
11
<template>
2-
<div>
3-
ClassroomExercisesListening
4-
</div>
2+
<v-card>
3+
<v-card-title>
4+
Listening exercises
5+
</v-card-title>
6+
<v-card-text>
7+
Coming soon
8+
</v-card-text>
9+
</v-card>
510
</template>
611

712
<script lang="ts">

‎src/views/classroom/ClassroomExercisesReadingTeacher.vue

Lines changed: 71 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1,76 +1,80 @@
11
<template>
2-
<div>
3-
<p>
2+
<v-card>
3+
<v-card-title>
4+
Reading exercises
5+
</v-card-title>
6+
<v-card-subtitle>
47
Choose the exercises you want to use in this class.
5-
</p>
6-
7-
<v-progress-circular
8-
v-if="loading"
9-
color="primary"
10-
indeterminate
11-
></v-progress-circular>
12-
13-
<p v-else-if="exercises.length === 0">
14-
You haven't created any exercise yet.
15-
<router-link :to="{ name: 'ReadingExerciseCreate' }">
16-
Create exercise
17-
</router-link>
18-
</p>
19-
20-
<div v-else>
21-
<v-btn-toggle>
22-
<v-btn
23-
small
24-
@click="selectAll"
8+
</v-card-subtitle>
9+
<v-card-text>
10+
<v-progress-circular
11+
v-if="loading"
12+
color="primary"
13+
indeterminate
14+
></v-progress-circular>
15+
16+
<p v-else-if="exercises.length === 0">
17+
You haven't created any exercise yet.
18+
<router-link :to="{ name: 'ReadingExerciseCreate' }">
19+
Create exercise
20+
</router-link>
21+
</p>
22+
23+
<div v-else>
24+
<v-btn-toggle>
25+
<v-btn
26+
small
27+
@click="selectAll"
28+
>
29+
Select all
30+
</v-btn>
31+
<v-btn
32+
small
33+
@click="unselectAll"
34+
>
35+
Unselect all
36+
</v-btn>
37+
</v-btn-toggle>
38+
39+
<v-row
40+
no-gutters
41+
class="mt-3"
2542
>
26-
Select all
27-
</v-btn>
43+
<v-col
44+
v-for="exercise of exercises"
45+
:key="exercise.pk"
46+
cols="3"
47+
>
48+
<v-checkbox
49+
v-model="exercise.isChosen"
50+
dense
51+
hide-details
52+
>
53+
<template #label>
54+
<router-link
55+
:to="{
56+
name: 'ReadingExerciseDetail',
57+
params: { pk: exercise.pk }
58+
}"
59+
>
60+
{{ exercise.identifier }}
61+
</router-link>
62+
</template>
63+
</v-checkbox>
64+
</v-col>
65+
</v-row>
66+
2867
<v-btn
29-
small
30-
@click="unselectAll"
68+
color="primary"
69+
class="mt-5"
70+
:loading="saving"
71+
@click="save"
3172
>
32-
Unselect all
73+
Save
3374
</v-btn>
34-
</v-btn-toggle>
35-
36-
<v-row
37-
no-gutters
38-
class="mt-3"
39-
>
40-
<v-col
41-
v-for="exercise of exercises"
42-
:key="exercise.pk"
43-
cols="3"
44-
>
45-
<v-checkbox
46-
v-model="exercise.isChosen"
47-
dense
48-
hide-details
49-
>
50-
<template #label>
51-
<router-link
52-
:to="{
53-
name: 'ReadingExerciseDetail',
54-
params: { pk: exercise.pk }
55-
}"
56-
>
57-
{{ exercise.identifier }}
58-
</router-link>
59-
</template>
60-
</v-checkbox>
61-
</v-col>
62-
</v-row>
63-
64-
<v-btn
65-
color="primary"
66-
class="mt-5"
67-
:loading="saving"
68-
@click="save"
69-
>
70-
Save
71-
</v-btn>
72-
</div>
73-
</div>
75+
</div>
76+
</v-card-text>
77+
</v-card>
7478
</template>
7579

7680
<script lang="ts">

0 commit comments

Comments
 (0)