Skip to content
Snippets Groups Projects
Commit 7fd6194d authored by Thilo Wischmeyer's avatar Thilo Wischmeyer Committed by Thilo Wischmeyer
Browse files

New slot syntax for activators 

The upgrade guide says "We understand this is considerably more verbose." They
weren't kidding.
parent 6f7a4503
No related branches found
No related tags found
1 merge request!247Resolve "Update Vuetify"
Hide whitespace changes
Inline Side-by-side
Showing
with 221 additions and 177 deletions
frontend/src/components/BaseLayout.vue
+ 23
− 18
View file @ 7fd6194d
...@@ -41,13 +41,16 @@ ...@@ -41,13 +41,16 @@
top top
style="min-width: 150px" style="min-width: 150px"
> >
<v-switch <template #activator="{ on }">
slot="activator" <div v-on="on">
v-model="darkMode" <v-switch
class="dark-mode-switch" v-model="darkMode"
:disabled="!darkModeUnlocked" class="dark-mode-switch"
:label="mini ? '' : 'dark mode'" :disabled="!darkModeUnlocked"
/> :label="mini ? '' : 'dark mode'"
/>
</div>
</template>
<span v-if="darkModeUnlocked">Experimental: styling issues may occur!</span> <span v-if="darkModeUnlocked">Experimental: styling issues may occur!</span>
<span v-else>You need to visit the feedback site below first!</span> <span v-else>You need to visit the feedback site below first!</span>
</v-tooltip> </v-tooltip>
...@@ -93,17 +96,19 @@ ...@@ -93,17 +96,19 @@
offset-y offset-y
left left
> >
<v-btn <template #activator="{ on }">
id="user-options" <v-btn
slot="activator" id="user-options"
text text
style="text-transform: none" style="text-transform: none"
> v-on="on"
<v-icon left> >
account_circle <v-icon left>
</v-icon> account_circle
{{ username }} ({{ userRole }})<v-icon>arrow_drop_down</v-icon> </v-icon>
</v-btn> {{ username }} ({{ userRole }})<v-icon>arrow_drop_down</v-icon>
</v-btn>
</template>
<user-options /> <user-options />
</v-menu> </v-menu>
</v-toolbar-items> </v-toolbar-items>
......
frontend/src/components/FreeLocksButton.vue
+ 12
− 10
View file @ 7fd6194d
<template> <template>
<v-tooltip bottom> <v-tooltip bottom>
<v-btn <template #activator="{ on }">
slot="activator" <v-btn
text text
icon icon
:disabled="!activeAssignmentsExist" :disabled="!activeAssignmentsExist"
:loading="loading" :loading="loading"
@click="freeLocks" @click="freeLocks"
> v-on="on"
<v-icon>vpn_key</v-icon> >
</v-btn> <v-icon>vpn_key</v-icon>
</v-btn>
</template>
<span>Free all locked Submissions</span> <span>Free all locked Submissions</span>
</v-tooltip> </v-tooltip>
</template> </template>
......
frontend/src/components/InstanceActions.vue
+ 10
− 8
View file @ 7fd6194d
...@@ -8,14 +8,16 @@ ...@@ -8,14 +8,16 @@
:key="i" :key="i"
bottom bottom
> >
<v-btn <template #activator="{ on }">
slot="activator" <v-btn
text text
icon icon
@click="a.action" @click="a.action"
> v-on="on"
<v-icon>{{ a.icon }}</v-icon> >
</v-btn> <v-icon>{{ a.icon }}</v-icon>
</v-btn>
</template>
{{ a.text }} {{ a.text }}
</v-tooltip> </v-tooltip>
</template> </template>
......
frontend/src/components/export/DataExport.vue
+ 8
− 5
View file @ 7fd6194d
...@@ -30,11 +30,14 @@ ...@@ -30,11 +30,14 @@
<v-row> <v-row>
<v-col cols="4"> <v-col cols="4">
<v-tooltip top> <v-tooltip top>
<v-checkbox <template #activator="{ on }">
slot="activator" <div v-on="on">
v-model="setPasswords" <v-checkbox
label="Set passwords" v-model="setPasswords"
/> label="Set passwords"
/>
</div>
</template>
<span>Setting this will cause all student passwords <span>Setting this will cause all student passwords
to be reset upon export. The new passwords will be contained in the to be reset upon export. The new passwords will be contained in the
export file. export file.
......
frontend/src/components/export/ExportDialog.vue
+ 31
− 29
View file @ 7fd6194d
<template> <template>
<v-menu offset-y> <v-menu offset-y>
<v-tooltip <template #activator="{ on: menu }">
slot="activator" <v-tooltip left>
bottom <template #activator="{ on: tooltip }">
> <v-btn
<v-btn id="export-btn"
id="export-btn" slot="activator"
slot="activator" :icon="!corrected"
:icon="!corrected" :text="!corrected"
:text="!corrected" :color="corrected ? 'success' : undefined"
:color="corrected ? 'success' : undefined" style="text-transform: none;"
style="text-transform: none;" v-on="{ ...tooltip, ...menu }"
> >
<v-icon :left="corrected"> <v-icon :left="corrected">
file_download file_download
</v-icon> </v-icon>
<span v-if="corrected"> <span v-if="corrected">
Export Export
</span> </span>
</v-btn> </v-btn>
Export </template>
<span Export
v-if="corrected" <span
id="corrected-tooltip" v-if="corrected"
>(All submissions have been corrected!)</span> id="corrected-tooltip"
<span >(All submissions have been corrected!)</span>
v-else <span
id="uncorrected-tooltip" v-else
>(UNCORRECTED submissions left! Export will be incomplete.)</span> id="uncorrected-tooltip"
</v-tooltip> >(UNCORRECTED submissions left! Export will be incomplete.)</span>
</v-tooltip>
</template>
<v-list> <v-list>
<v-list-item <v-list-item
v-for="(item, i) in menuItems" v-for="(item, i) in menuItems"
......
frontend/src/components/feedback_labels/FeedbackLabel.vue
+ 10
− 8
View file @ 7fd6194d
<template> <template>
<v-tooltip top> <v-tooltip top>
<v-chip <template #activator="{ on }">
slot="activator" <v-chip
:close="removable" :close="removable"
:color="colour" :color="colour"
@input="onClose" v-on="on"
> @input="onClose"
{{ name }} >
</v-chip> {{ name }}
</v-chip>
</template>
<span> {{ description }} </span> <span> {{ description }} </span>
</v-tooltip> </v-tooltip>
</template> </template>
......
frontend/src/components/feedback_list/FeedbackSearchOptions.vue
+ 9
− 7
View file @ 7fd6194d
...@@ -40,13 +40,15 @@ ...@@ -40,13 +40,15 @@
style="max-width: 60%" style="max-width: 60%"
/> />
<v-tooltip top> <v-tooltip top>
<a <template #activator="{ on }">
slot="activator" <a
href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp#character-classes" href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp#character-classes"
target="_blank" target="_blank"
> v-on="on"
<v-icon>help</v-icon> >
</a> <v-icon>help</v-icon>
</a>
</template>
<span>Go to RegEx documentation</span> <span>Go to RegEx documentation</span>
</v-tooltip> </v-tooltip>
</v-row> </v-row>
......
frontend/src/components/student_list/StudentList.vue
+ 15
− 13
View file @ 7fd6194d
...@@ -68,19 +68,21 @@ ...@@ -68,19 +68,21 @@
</v-btn> </v-btn>
{{ props.item.name }} {{ props.item.name }}
<v-tooltip top> <v-tooltip top>
<template slot="activator"> <template #activator="{ on }">
<v-icon <div v-on="on">
v-if="!props.item.isActive" <v-icon
small v-if="!props.item.isActive"
> small
lock >
</v-icon> lock
<v-icon </v-icon>
v-else <v-icon
small v-else
> small
lock_open >
</v-icon> lock_open
</v-icon>
</div>
</template> </template>
<span v-if="!props.item.isActive">Participant doesn't have access.</span> <span v-if="!props.item.isActive">Participant doesn't have access.</span>
<span v-else>Participant has access.</span> <span v-else>Participant has access.</span>
......
frontend/src/components/student_list/StudentListMenu.vue
+ 8
− 6
View file @ 7fd6194d
...@@ -5,12 +5,14 @@ ...@@ -5,12 +5,14 @@
bottom bottom
offset-y offset-y
> >
<v-btn <template #activator="{ on }">
slot="activator" <v-btn
icon icon
> v-on="on"
<v-icon>menu</v-icon> >
</v-btn> <v-icon>menu</v-icon>
</v-btn>
</template>
<v-list> <v-list>
<v-list-item <v-list-item
v-for="item in items" v-for="item in items"
......
frontend/src/components/student_list/StudentListReverseMapper.vue
+ 9
− 7
View file @ 7fd6194d
...@@ -8,13 +8,15 @@ ...@@ -8,13 +8,15 @@
display-text="Select map file" display-text="Select map file"
/> />
<v-tooltip top> <v-tooltip top>
<v-btn <template #activator="{ on }">
slot="activator" <v-btn
icon icon
@click="readMapFileAndApply" v-on="on"
> @click="readMapFileAndApply"
<v-icon>vpn_key</v-icon> >
</v-btn> <v-icon>vpn_key</v-icon>
</v-btn>
</template>
<span>Apply mapping</span> <span>Apply mapping</span>
</v-tooltip> </v-tooltip>
</v-row> </v-row>
......
frontend/src/components/submission_notes/base/FeedbackComment.vue
+ 16
− 12
View file @ 7fd6194d
...@@ -23,24 +23,28 @@ ...@@ -23,24 +23,28 @@
top top
size="20px" size="20px"
> >
<v-icon <template #activator="{ on }">
slot="activator" <v-icon
size="20px" size="20px"
> v-on="on"
visibility >
</v-icon> visibility
</v-icon>
</template>
<span>Will be visible to student</span> <span>Will be visible to student</span>
</v-tooltip> </v-tooltip>
<v-tooltip <v-tooltip
v-else v-else
top top
> >
<v-icon <template #activator="{ on }">
slot="activator" <v-icon
size="20px" size="20px"
> v-on="on"
visibility_off >
</v-icon> visibility_off
</v-icon>
</template>
<span>Won't be visible to student</span> <span>Won't be visible to student</span>
</v-tooltip> </v-tooltip>
</div> </div>
......
frontend/src/components/submission_notes/toolbars/AnnotatedSubmissionBottomToolbar.vue
+ 33
− 26
View file @ 7fd6194d
...@@ -47,13 +47,16 @@ ...@@ -47,13 +47,16 @@
v-if="showFinalCheckbox" v-if="showFinalCheckbox"
top top
> >
<v-checkbox <template #activator="{ on }">
slot="activator" <div v-on="on">
v-model="isFinal" <v-checkbox
label="Final" v-model="isFinal"
class="final-checkbox" label="Final"
hide-details class="final-checkbox"
/> hide-details
/>
</div>
</template>
<span>If unchecked this submission will be marked for review by the lecturer</span> <span>If unchecked this submission will be marked for review by the lecturer</span>
</v-tooltip> </v-tooltip>
<v-spacer /> <v-spacer />
...@@ -61,28 +64,32 @@ ...@@ -61,28 +64,32 @@
v-if="skippable" v-if="skippable"
top top
> >
<v-btn <template #activator="{ on }">
id="skip-submission" <v-btn
slot="activator" id="skip-submission"
text text
@click="skipSubmission" v-on="on"
> @click="skipSubmission"
Skip >
</v-btn> Skip
</v-btn>
</template>
<span>Skip this submission</span> <span>Skip this submission</span>
</v-tooltip> </v-tooltip>
<v-tooltip top> <v-tooltip top>
<v-btn <template #activator="{ on }">
id="submit-feedback" <v-btn
slot="activator" id="submit-feedback"
color="primary" color="primary"
:loading="loading" :loading="loading"
block block
:disabled="!scoreIsValid" :disabled="!scoreIsValid"
@click="submit" v-on="on"
> @click="submit"
Submit >
</v-btn> Submit
</v-btn>
</template>
<span>Submit and continue</span> <span>Submit and continue</span>
</v-tooltip> </v-tooltip>
</v-card-actions> </v-card-actions>
......
frontend/src/components/submission_notes/toolbars/AnnotatedSubmissionTopToolbar.vue
+ 32
− 26
View file @ 7fd6194d
...@@ -42,15 +42,17 @@ ...@@ -42,15 +42,17 @@
v-if="sourceCodeAvailable" v-if="sourceCodeAvailable"
top top
> >
<v-btn <template #activator="{ on }">
slot="activator" <v-btn
icon icon
@click="downloadSourceCode" v-on="on"
> @click="downloadSourceCode"
<v-icon> >
cloud_download <v-icon>
</v-icon> cloud_download
</v-btn> </v-icon>
</v-btn>
</template>
<span>Download original source code (.ipynb, etc.)</span> <span>Download original source code (.ipynb, etc.)</span>
</v-tooltip> </v-tooltip>
<v-btn <v-btn
...@@ -62,29 +64,33 @@ ...@@ -62,29 +64,33 @@
VIEW ORIGINAL SUBMISSION VIEW ORIGINAL SUBMISSION
</v-btn> </v-btn>
<v-tooltip top> <v-tooltip top>
<v-btn <template #activator="{ on }">
v-if="showClipboard" <v-btn
slot="activator" v-if="showClipboard"
icon icon
@click="copyToClipboard" v-on="on"
> @click="copyToClipboard"
<v-icon>content_copy</v-icon> >
</v-btn> <v-icon>content_copy</v-icon>
</v-btn>
</template>
<span>{{ copyMessage }}</span> <span>{{ copyMessage }}</span>
</v-tooltip> </v-tooltip>
<v-tooltip <v-tooltip
v-if="solutionHidden" v-if="solutionHidden"
top top
> >
<v-btn <template #activator="{ on }">
slot="activator" <v-btn
icon icon
@click="showSolution" v-on="on"
> @click="showSolution"
<v-icon> >
keyboard_arrow_left <v-icon>
</v-icon> keyboard_arrow_left
</v-btn> </v-icon>
</v-btn>
</template>
<span>Show Solution</span> <span>Show Solution</span>
</v-tooltip> </v-tooltip>
......
frontend/src/components/tutor_list/TutorList.vue
+ 5
− 2
View file @ 7fd6194d
...@@ -38,9 +38,10 @@ ...@@ -38,9 +38,10 @@
v-if="props.item.reservedSubmissions" v-if="props.item.reservedSubmissions"
top top
> >
<template slot="activator"> <template #activator="{ on }">
<v-icon <v-icon
small small
v-on="on"
@click="deleteAssignmentsOfTutor(props.item)" @click="deleteAssignmentsOfTutor(props.item)"
> >
clear clear
...@@ -56,16 +57,18 @@ ...@@ -56,16 +57,18 @@
@click="changeActiveStatus(props.item)" @click="changeActiveStatus(props.item)"
> >
<v-tooltip top> <v-tooltip top>
<template slot="activator"> <template #activator="{ on }">
<v-icon <v-icon
v-if="!props.item.isActive" v-if="!props.item.isActive"
small small
v-on="on"
> >
lock lock
</v-icon> </v-icon>
<v-icon <v-icon
v-else v-else
small small
v-on="on"
> >
lock_open lock_open
</v-icon> </v-icon>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment