From 40281b389d9f40c772c5949fd66c2bfbeb72cba5 Mon Sep 17 00:00:00 2001
From: Julian Leucker <leuckerj@gmail.com>
Date: Sat, 9 Jul 2022 17:08:29 +0200
Subject: [PATCH] Hide edit buttons on non-editable form elements
---
.../components/alsijil/LessonDocumentation.js | 24 ++++++++++++-------
1 file changed, 15 insertions(+), 9 deletions(-)
diff --git a/aleksis/apps/alsijil/static/js/vue/components/alsijil/LessonDocumentation.js b/aleksis/apps/alsijil/static/js/vue/components/alsijil/LessonDocumentation.js
index 71294cbe7..973ad7bf2 100644
--- a/aleksis/apps/alsijil/static/js/vue/components/alsijil/LessonDocumentation.js
+++ b/aleksis/apps/alsijil/static/js/vue/components/alsijil/LessonDocumentation.js
@@ -6,7 +6,7 @@ export default {
valid: false,
datePick: "2030-09-29",
showPicker: false,
- // period: 5,
+ dateAndPeriodEditable: false,
}
},
template: `
@@ -25,28 +25,34 @@ export default {
>
<template v-slot:activator="{ on, attrs }">
<v-card-title>
- <span v-text="new Date(datePick).toLocaleDateString()"></span>
- <v-btn right disabled v-bind="attrs" v-on="on" icon><v-icon>mdi-pencil-outline</v-icon></v-btn>
+ <span v-text="new Date(datePick).toLocaleDateString()" class="ma-1"></span>
+ <v-btn right v-bind="attrs" v-on="on" icon v-if="hover && dateAndPeriodEditable">
+ <v-icon>mdi-pencil-outline</v-icon>
+ </v-btn>
</v-card-title>
</template>
<v-date-picker
- scrollable
- no-title
- @input="showPicker = false; $emit('change-date', $event)"
- v-model="datePick"
+ scrollable
+ no-title
+ @input="showPicker = false; $emit('change-date', $event)"
+ v-model="datePick"
></v-date-picker>
</v-menu>
+ </div>
+ </v-hover>
+ <v-hover v-slot="{ hover }">
+ <div>
<v-menu offset-y>
<template v-slot:activator="{ on, attrs }">
<v-card-title>
- <span v-text="period"></span>
+ <span v-text="period" class="ma-1"></span>
<!-- (this.$root.django.gettext('%s. Period'), period)-->
<v-btn
right
v-bind="attrs"
v-on="on"
icon
- disabled
+ v-if="hover && dateAndPeriodEditable"
>
<v-icon>mdi-pencil-outline</v-icon>
</v-btn>
--
GitLab