Revert "Updated License Note field with buttons"

This reverts commit 65b77cff85.
This commit is contained in:
Johannes Jöns 2024-07-11 13:10:04 +02:00
parent 00a9e63bd3
commit 768b36da56
2 changed files with 52 additions and 37 deletions

View file

@ -158,7 +158,42 @@
</v-card-actions>
</v-form>
</v-card>
</v-dialog>
</v-dialog>
<!-- -->
<!-- EDIT SECTION -->
<!-- -->
<v-btn icon class="mr-3" @click="edit = true">
<Pencil />
</v-btn>
<v-dialog v-model="edit" width="600" persistent>
<v-card max-width="600">
<v-form @submit.prevent="submit">
<v-card-title>
<span class="headline">Edit License</span>
</v-card-title>
<v-card-subtitle>
<span> Edit a License inside the Database</span>
</v-card-subtitle>
<v-card-text>
<!-- PLACEHOLDER FOR ELEMENTS -->
</v-card-text>
<v-card-actions>
<v-row>
<v-col cols="10" align="right" no-gutters>
<v-btn
class="ms-auto"
text="Cancel"
@click="edit = false"
></v-btn>
</v-col>
<v-col>
<v-btn class="ms-auto" text="Save" type="submit"></v-btn>
</v-col>
</v-row>
</v-card-actions>
</v-form>
</v-card>
</v-dialog>
</div>
<!-- Search -->
@ -290,7 +325,11 @@ const addNotes = ref<string | undefined>("");
const addStartDate = ref<Date | undefined>();
const addStopDate = ref<Date | undefined>();
//
// EDIT SECTION
//
const edit = ref(false);
</script>
<style scoped>

View file

@ -4,6 +4,7 @@
width="96vw"
rounded="lg"
class="mt-3"
style="border-left: 0.5rem outset #0fa4af"
>
<v-expansion-panels>
<v-expansion-panel>
@ -77,39 +78,28 @@
</div>
</v-expansion-panel-title>
<v-expansion-panel-text>
Notes:
<v-row
class="flex-nowrap"
class="flex-nowrap bg-surface-variant"
no-gutters
>
<v-col
class="flex-grow-1 flex-shrink-0 overflow-x-auto border-e-md"
cols="10"
class="flex-grow-0 flex-shrink-0"
cols="7"
>
{{ props.notes }}
Notes: {{ props.notes }}
</v-col>
<v-col
class="flex-grow-0 flex-shrink-1 overflow-x-auto"
cols="2"
align="end"
class="flex-grow-0 flex-shrink-1"
cols="5"
>
<!-- -->
<!-- EDIT SECTION -->
<!-- -->
<v-btn class="mr-3" flat size="small">
<Pencil />
</v-btn>
<!-- -->
<!-- DELETE BTN -->
<!-- -->
<v-btn class="mr-3" flat size="small" color="red" variant="text">
<Trash />
</v-btn>
I'm 5 column wide and I shrink if there's not enough space
</v-col>
</v-row>
</v-expansion-panel-text>
</v-expansion-panel>
</v-expansion-panels>
@ -117,8 +107,7 @@
</template>
<script setup lang="ts">
import { Infinity, KeyRound, CalendarCheck, CalendarX, Pencil, Trash } from "lucide-vue-next";
import { ref } from "vue";
import { Infinity, KeyRound, CalendarCheck, CalendarX } from "lucide-vue-next";
const props = defineProps({
licenseName: String,
@ -128,19 +117,6 @@ const props = defineProps({
amount: Number,
notes: String,
});
//
// EDIT SECTION
//
const edit = ref(false);
</script>
<style scoped>