gitmedia/thats-me
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

edit page: change order of elements

Browse source
This commit is contained in:
Tilman Behrend 2025-09-18 09:13:08 +02:00
parent fd5bc7faea
commit d9621e6a90
1 changed files with 66 additions and 66 deletions
Download patch file Download diff file Expand all files Collapse all files

132
frontend/src/pages/EditPage.vue
View file

@ -16,7 +16,7 @@
<!-- Tab 1: Basics - Only Image and Emotional Level -->
<q-tab-panel name="basics" class="q-pa-none">
<div class="q-gutter-md q-mt-md">
<div class="q-gutter-md ">
<!-- Emotional Level -->
<div class="q-mb-md">
@ -104,80 +104,80 @@
<!-- Tab 2: Content - Title, Headline, Date/Time, Description -->
<q-tab-panel name="content" class="q-pa-none">
<div class="q-gutter-md q-mt-md">
<!-- Title (formerly Subheadline) - Now mandatory -->
<q-input
v-model="form.subheadline"
label="Title *"
filled
:rules="[val => !!val || 'Title is required']"
/>
<div class="q-gutter-md ">
<!-- Headline - Now optional -->
<!-- Date and Time -->
<div class="row q-gutter-md q-mb-md">
<div class="col">
<q-input
v-model="form.headline"
label="Headline"
v-model="form.date"
label="Date *"
filled
/>
<!-- Date and Time -->
<div class="row q-gutter-md q-mb-md">
<div class="col">
<q-input
v-model="form.date"
label="Date *"
filled
type="date"
:rules="[val => !!val || 'Date is required']"
>
<template v-slot:prepend>
<q-icon name="event" />
</template>
</q-input>
</div>
<div class="col">
<q-input
v-model="form.time"
label="Time"
filled
type="time"
>
<template v-slot:prepend>
<q-icon name="access_time" />
</template>
</q-input>
</div>
type="date"
:rules="[val => !!val || 'Date is required']"
>
<template v-slot:prepend>
<q-icon name="event" />
</template>
</q-input>
</div>
<!-- Description (formerly Text) -->
<div class="col">
<q-input
v-model="form.text"
label="Description"
v-model="form.time"
label="Time"
filled
type="textarea"
rows="4"
/>
type="time"
>
<template v-slot:prepend>
<q-icon name="access_time" />
</template>
</q-input>
</div>
</div>
<!-- Title (formerly Subheadline) - Now mandatory -->
<q-input
v-model="form.subheadline"
label="Title *"
filled
:rules="[val => !!val || 'Title is required']"
/>
<!-- Headline - Now optional -->
<q-input
v-model="form.headline"
label="Headline"
filled
/>
<!-- Description (formerly Text) -->
<q-input
v-model="form.text"
label="Description"
filled
type="textarea"
rows="4"
/>
</div>
<!-- Tab Navigation for Content -->
<div class="row q-gutter-md q-mt-lg justify-between">
<q-btn
label="Back"
icon="arrow_back"
color="grey"
flat
@click="goToPreviousTab"
class="col-auto"
/>
<q-btn
label="Continue"
icon-right="arrow_forward"
color="primary"
@click="goToNextTab"
class="col-auto"
/>
<q-btn
label="Back"
icon="arrow_back"
color="grey"
flat
@click="goToPreviousTab"
class="col-auto"
/>
<q-btn
label="Continue"
icon-right="arrow_forward"
color="primary"
@click="goToNextTab"
class="col-auto"
/>
</div>
</q-tab-panel>
@ -388,7 +388,7 @@
<!-- Category Selection -->
<div class="q-mb-md">
<q-separator class="q-mt-lg q-mb-lg" />
<q-separator class="q-mb-md" />
<q-label class="text-subtitle2 q-mb-sm">Category</q-label>
<!-- Main Category Selection with vue-select -->
@ -441,7 +441,7 @@
<!-- Delete Entry Section -->
<div class="q-mb-md q-mt-lg">
<q-separator class="q-mt-lg q-mb-lg" />
<q-separator class="q-mb-md" />
<q-label class="text-subtitle2 q-mb-sm text-negative">Danger Zone</q-label>
<p class="text-caption text-grey q-mb-md">
Once you delete this entry, it cannot be recovered. Please be certain.