Add page layout to all views

This commit is contained in:
philipp lang 2023-04-29 23:41:26 +02:00
parent 372e6ee8c4
commit b48a10250c
14 changed files with 307 additions and 325 deletions

View File

@ -17,7 +17,7 @@
</div>
</div>
<div class="grow flex flex-col">
<div :class="pageClass" class="grow flex flex-col">
<slot></slot>
</div>
</div>
@ -27,6 +27,14 @@
import {menuStore} from '../../stores/menuStore.js';
export default {
inheritAttrs: false,
props: {
pageClass: {
default: () => '',
required: false,
type: String,
},
},
data: function () {
return {
menuStore: menuStore(),

View File

@ -1,4 +1,5 @@
<template>
<page-layout>
<div class="p-6 grid h-full items-center justify-center">
<div class="rounded border-primary-700 border border-solid p-6">
<div class="text-lg text-gray-200 text-sm">
@ -8,18 +9,13 @@
</div>
<form @submit.prevent="submit" class="grid gap-3 mt-5">
<f-text v-model="values.mglnr" label="Mitgliedsnummer" name="mglnr" id="mglnr"></f-text>
<f-text
v-model="values.password"
type="password"
label="Passwort"
name="password"
id="password"
></f-text>
<f-text v-model="values.password" type="password" label="Passwort" name="password" id="password"></f-text>
<f-text v-model="values.group_id" label="Gruppierungsnummer" name="group_id" id="group_id"></f-text>
<button type="submit" class="btn w-full btn-primary mt-6 inline-block">Jetzt initialisieren</button>
</form>
</div>
</div>
</page-layout>
</template>
<script>

View File

@ -1,4 +1,5 @@
<template>
<page-layout>
<form id="actionform" class="grow p-3" @submit.prevent="submit">
<popup heading="Neue Untertätigkeit" v-if="mode === 'edit' && currentSubactivity !== null" @close="currentSubactivity = null">
<subactivity-form class="mt-4" v-if="currentSubactivity" :value="currentSubactivity" @stored="reloadSubactivities" @updated="mergeSubactivity"></subactivity-form>
@ -16,11 +17,21 @@
<a href="#" @click.prevent="currentSubactivity = option" class="transition hover:bg-yellow-600 group w-5 h-5 rounded-full flex items-center justify-center flex-none">
<svg-sprite src="pencil" class="text-yellow-800 w-3 h-3 group-hover:text-yellow-200 transition"></svg-sprite>
</a>
<f-switch inline size="sm" :key="option.id" v-model="inner.subactivities" name="subactivities[]" :id="`subactivities-${option.id}`" :value="option.id" :label="option.name"></f-switch>
<f-switch
inline
size="sm"
:key="option.id"
v-model="inner.subactivities"
name="subactivities[]"
:id="`subactivities-${option.id}`"
:value="option.id"
:label="option.name"
></f-switch>
</div>
</div>
<save-button form="actionform"></save-button>
</form>
</page-layout>
</template>
<script>

View File

@ -1,10 +1,8 @@
<template>
<div class="pb-6">
<page-layout page-class="pb-6">
<popup heading="Bitte bestätigen" v-if="deleting !== null">
<div>
<p class="mt-4">
Diese Aktivität löschen?
</p>
<p class="mt-4">Diese Aktivität löschen?</p>
<div class="grid grid-cols-2 gap-3 mt-6">
<a href="#" @click.prevent="remove" class="text-center btn btn-danger">Löschen</a>
<a href="#" @click.prevent="deleting = null" class="text-center btn btn-primary">Abbrechen</a>
@ -22,13 +20,7 @@
<td>
<div class="flex space-x-1">
<i-link :href="activity.links.edit" class="inline-flex btn btn-warning btn-sm" v-tooltip="`bearbeiten`"><svg-sprite src="pencil"></svg-sprite></i-link>
<i-link
href="#"
@click.prevent="deleting = activity"
class="inline-flex btn btn-danger btn-sm"
v-tooltip="`Entfernen`"
><svg-sprite src="trash"></svg-sprite
></i-link>
<i-link href="#" @click.prevent="deleting = activity" class="inline-flex btn btn-danger btn-sm" v-tooltip="`Entfernen`"><svg-sprite src="trash"></svg-sprite></i-link>
</div>
</td>
</tr>
@ -37,15 +29,13 @@
<div class="px-6">
<v-pages class="mt-4" :value="data.meta" :only="['data']"></v-pages>
</div>
</div>
</page-layout>
</template>
<script>
import indexHelpers from '../../mixins/indexHelpers';
export default {
data: function () {
return {
deleting: null,
@ -60,9 +50,9 @@ export default {
onSuccess(page) {
_self.inner = page.props.data;
_self.deleting = null;
}
},
});
}
},
},
components: {
@ -70,6 +60,5 @@ export default {
},
mixins: [indexHelpers],
};
</script>

View File

@ -1,4 +1,5 @@
<template>
<page-layout>
<form class="p-6 grid gap-4 justify-start" @submit.prevent="submit">
<f-text id="year" v-model="inner.year" label="Jahr" required></f-text>
@ -6,6 +7,7 @@
<button type="submit" class="btn btn-primary">Absenden</button>
</form>
</page-layout>
</template>
<script>

View File

@ -1,4 +1,5 @@
<template>
<page-layout>
<form target="_BLANK" class="max-w-4xl w-full mx-auto gap-6 grid-cols-2 grid p-6">
<f-text id="eventName" name="eventName" class="col-span-2" v-model="values.eventName" label="Veranstaltungs-Name" required></f-text>
<f-text id="dateFrom" name="dateFrom" type="date" v-model="values.dateFrom" label="Datum von" required></f-text>
@ -44,6 +45,7 @@
v-text="compiler.title"
></button>
</form>
</page-layout>
</template>
<script>

View File

@ -1,5 +1,5 @@
<template>
<page-layout title="Dashboard">
<page-layout>
<div class="gap-6 md:grid-cols-2 xl:grid-cols-4 grid p-6">
<v-block v-for="(block, index) in blocks" :key="index" :title="block.title">
<v-component :data="block.data" :is="block.component"></v-component>

View File

@ -1,4 +1,5 @@
<template>
<page-layout>
<div class="p-3 grid gap-3 this-grid grow">
<box heading="Stammdaten" class="area-stamm hidden xl:block">
<stamm :inner="inner"></stamm>
@ -29,10 +30,7 @@
<box class="area-membershipcourse hidden xl:block">
<tabs v-model="tabs.membershipcourse">
<courses v-show="tabs.membershipcourse.active === 'course'" :value="inner.courses"></courses>
<memberships
v-show="tabs.membershipcourse.active === 'membership'"
:value="inner.memberships"
></memberships>
<memberships v-show="tabs.membershipcourse.active === 'membership'" :value="inner.memberships"></memberships>
</tabs>
</box>
<box heading="Ausbildungen" class="area-courses xl:hidden">
@ -50,6 +48,7 @@
<vmap :inner="inner"></vmap>
</box>
</div>
</page-layout>
</template>
<script>

View File

@ -1,4 +1,5 @@
<template>
<page-layout>
<form class="flex grow relative" id="memberedit" @submit.prevent="submit">
<save-button form="memberedit"></save-button>
<popup heading="Ein Konflikt ist aufgetreten" v-if="conflict === true">
@ -102,6 +103,7 @@
</box>
</div>
</form>
</page-layout>
</template>
<script>

View File

@ -1,5 +1,5 @@
<template>
<div class="pb-6">
<page-layout page-class="pb-6">
<div class="px-6 py-2 flex border-b border-gray-600 items-center space-x-3">
<f-text :value="getFilter('search')" @input="setFilter('search', $event)" id="search" name="search" label="Suchen …" size="sm"></f-text>
<f-switch v-show="hasModule('bill')" id="ausstand" @input="setFilter('ausstand', $event)" :items="getFilter('ausstand')" label="Nur Ausstände" size="sm"></f-switch>
@ -109,7 +109,7 @@
></member-memberships>
<member-courses v-if="single !== null && sidebar === 'courses.index'" @close="closeSidebar" :courses="courses" :value="data.data[single]"></member-courses>
</transition>
</div>
</page-layout>
</template>
<script>

View File

@ -1,10 +1,12 @@
<template>
<page-layout>
<div class="grid grid-cols-2">
<div class="p-6" v-for="type, index in types" :key="index">
<p class="text-white" v-for="paragraph, index in type.text" :key="index" v-text="paragraph"></p>
<div class="p-6" v-for="(type, index) in types" :key="index">
<p class="text-white" v-for="(paragraph, index) in type.text" :key="index" v-text="paragraph"></p>
<a :href="type.link.href" target="_BLANK" class="btn btn-primary mt-3 inline-block" v-text="type.link.label"></a>
</div>
</div>
</page-layout>
</template>
<script>
@ -16,14 +18,13 @@ export default {
},
props: {
types: {}
types: {},
},
methods: {
submit() {
this.$inertia.post(`/allpayment`, this.inner)
}
}
this.$inertia.post(`/allpayment`, this.inner);
},
},
};
</script>

View File

@ -1,8 +1,10 @@
<template>
<page-layout>
<div class="flex grow relative">
<v-tabs v-model="active" :entries="$page.props.setting_menu"></v-tabs>
<slot></slot>
</div>
</page-layout>
</template>
<script>

View File

@ -1,58 +1,32 @@
<template>
<page-layout>
<form id="subedit" class="p-3 grid gap-3" @submit.prevent="submit">
<save-button form="subedit"></save-button>
<box heading="Beitrag">
<div class="grid gap-4 sm:grid-cols-2">
<f-text id="name" v-model="inner.name" label="Name" size="sm" required></f-text>
<f-select
id="fee_id"
name="fee_id"
:options="fees"
v-model="inner.fee_id"
label="Nami-Beitrag"
size="sm"
required
></f-select>
<f-select id="fee_id" name="fee_id" :options="fees" v-model="inner.fee_id" label="Nami-Beitrag" size="sm" required></f-select>
<f-switch id="split" label="Rechnung aufsplitten" v-model="inner.split" size="sm"></f-switch>
<f-switch
id="for_promise"
label="Für Versprechen benutzen"
v-model="inner.for_promise"
size="sm"
></f-switch>
<f-switch id="for_promise" label="Für Versprechen benutzen" v-model="inner.for_promise" size="sm"></f-switch>
</div>
</box>
<box heading="Positionen">
<div class="flex flex-col space-y-4">
<div v-for="(pos, index) in inner.children" :key="index" class="flex space-x-2 items-end">
<f-text :id="`name-${index}`" v-model="pos.name" label="Name" size="sm" required></f-text>
<f-text
:id="`amount-${index}`"
v-model="pos.amount"
label="Beitrag"
size="sm"
mode="area"
required
></f-text>
<a
href="#"
@click.prevent="inner.children.splice(index, 1)"
class="btn btn-sm btn-danger icon flex-none"
>
<f-text :id="`amount-${index}`" v-model="pos.amount" label="Beitrag" size="sm" mode="area" required></f-text>
<a href="#" @click.prevent="inner.children.splice(index, 1)" class="btn btn-sm btn-danger icon flex-none">
<svg-sprite src="trash" class="w-5 h-5"></svg-sprite>
</a>
</div>
<a
href="#"
@click.prevent="inner.children.push({name: '', amount: 0})"
class="btn btn-sm flex btn-primary flex self-start mt-4"
>
<a href="#" @click.prevent="inner.children.push({name: '', amount: 0})" class="btn btn-sm flex btn-primary flex self-start mt-4">
<svg-sprite src="plus" class="w-5 h-5"></svg-sprite>
Position hinzufügen
</a>
</div>
</box>
</form>
</page-layout>
</template>
<script>
@ -71,9 +45,7 @@ export default {
methods: {
submit() {
this.mode === 'create'
? this.$inertia.post(`/subscription`, this.inner)
: this.$inertia.patch(`/subscription/${this.inner.id}`, this.inner);
this.mode === 'create' ? this.$inertia.post(`/subscription`, this.inner) : this.$inertia.patch(`/subscription/${this.inner.id}`, this.inner);
},
},

View File

@ -1,5 +1,5 @@
<template>
<div>
<page-layout>
<table cellspacing="0" cellpadding="0" border="0" class="custom-table custom-table-sm">
<thead>
<th>Name</th>
@ -19,13 +19,11 @@
<div v-text="subscription.fee_name"></div>
</td>
<td>
<i-link :href="`/subscription/${subscription.id}/edit`" class="inline-flex btn btn-warning btn-sm"
><svg-sprite src="pencil"></svg-sprite
></i-link>
<i-link :href="`/subscription/${subscription.id}/edit`" class="inline-flex btn btn-warning btn-sm"><svg-sprite src="pencil"></svg-sprite></i-link>
</td>
</tr>
</table>
</div>
</page-layout>
</template>
<script>