WIP Migrate missing styles

This commit is contained in:
Björn Fromme
2022-08-21 18:28:31 +02:00
parent f6d988c9f1
commit 6fd5fe0373
@@ -1,81 +1,77 @@
<template>
<div>
<h1>Teamer</h1>
<p class="text-2xl pb-4">Teamer</p>
<form @submit.prevent="save()">
<div class="row">
<div class="col-xs-12 col-md-6">
<h4>Fährst du Ski oder Board?</h4>
<div class="form-group">
<div class="checkbox" v-for="ability of abilities">
<label>
<input type="checkbox" class="form-control" v-model="userData.abilities"
:value="ability.id" />
<span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>
{{ ability['title'] }}
</label>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<h4 class="mb-2">Fährst du Ski oder Board?</h4>
<div class="flex flex-col space-y-1 pb-4">
<label class="flex items-center"
v-for="ability of abilities" :key="ability.id">
<input type="checkbox"
class="border-zinc-400 focus:border-zinc-800 ring-0 focus:ring-0 text-ep-secondary sbw:text-sbw-secondary"
v-model="userData.abilities"
:value="ability.id"/>
<span class="ml-2">{{ ability.title }}</span>
</label>
</div>
<h4>Mögliche Jobprofile</h4>
<div class="form-group">
<div class="checkbox" v-for="jobProfile of jobProfiles">
<label>
<input type="checkbox" class="form-control" v-model="userData.jobProfiles"
:value="jobProfile.id" />
<span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>
{{ jobProfile['title'] }}
</label>
</div>
<h4 class="mb-2">Mögliche Jobprofile</h4>
<div class="flex flex-col space-y-1 pb-4">
<label class="flex items-center"
v-for="jobProfile of jobProfiles" :key="jobProfile.id">
<input type="checkbox"
class="border-zinc-400 focus:border-zinc-800 ring-0 focus:ring-0 text-ep-secondary sbw:text-sbw-secondary"
v-model="userData.jobProfiles"
:value="jobProfile.id"/>
<span class="ml-2">{{ jobProfile.title }}</span>
</label>
</div>
<h4>Sonstiges</h4>
<div class="form-group">
<div class="checkbox">
<label>
<input type="checkbox" class="form-control" v-model="userData.wantsToLead"/>
<span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>
Ich möchte eine Fahrtenleitung übernehmen.
</label>
</div>
<h4 class="mb-2">Sonstiges</h4>
<div class="flex flex-col space-y-1 pb-4">
<label class="flex items-center">
<input type="checkbox"
class="border-zinc-400 focus:border-zinc-800 ring-0 focus:ring-0 text-ep-secondary sbw:text-sbw-secondary"
v-model="userData.wantsToLead"/>
<span class="ml-2">Ich möchte eine Fahrtenleitung übernehmen</span>
</label>
</div>
<form-group label="Status">
<select id="status" v-model="userData.seniority" class="form-control">
<select id="status" v-model="userData.seniority" class="border-zinc-400 focus:border-zinc-800 ring-0 focus:ring-0 mt-1 w-full">
<option v-for="status in this.status" :value="status.value">{{ status.label }}</option>
</select>
</form-group>
<form-group label="Jackengröße">
<select v-model="userData.jacketSize" class="form-control">
<select v-model="userData.jacketSize" class="border-zinc-400 focus:border-zinc-800 ring-0 focus:ring-0 mt-1 w-full">
<option v-for="size of this.sizes" :value="size">{{ size }}</option>
</select>
</form-group>
<form-group label="Wünsche">
<textarea class="xxlarge form-control" cols="30" rows="3" v-model="userData.notes"></textarea>
<textarea class="w-full" cols="30" rows="3" v-model="userData.notes"></textarea>
</form-group>
</div>
<div class="col-xs-12 col-md-6">
<h4>Verfügbarkeiten</h4>
<div class="checkbox" v-for="timeFrame in timeFrames">
<label>
<input type="checkbox" class="form-control" v-model="userData.availableTimeFrames"
<div>
<h4 class="mb-2">Verfügbarkeiten</h4>
<div class="flex flex-col space-y-1 pb-4">
<label class="flex items-center"
v-for="timeFrame of timeFrames" :key="timeFrame.id">
<input type="checkbox"
class="border-zinc-400 focus:border-zinc-800 ring-0 focus:ring-0 text-ep-secondary sbw:text-sbw-secondary"
v-model="userData.availableTimeFrames"
:value="timeFrame.id"/>
<span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>
{{ timeFrame | period }}
<span class="ml-2">{{ timeFrame | period }}</span>
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" class="form-control" v-model="userData.monthLong"/>
<span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>
Ich habe Zeit und würde gerne über einen Monat am Stück in eine Destination.
<label class="flex items-center">
<input type="checkbox"
class="border-zinc-400 focus:border-zinc-800 ring-0 focus:ring-0 text-ep-secondary sbw:text-sbw-secondary"
v-model="userData.monthLong"/>
<span class="ml-2">Ich habe Zeit und würde gerne über einen Monat am Stück in eine Destination.</span>
</label>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<button type="submit" class="button bg-button" :disabled="loading">
Speichern
</button>
</div>
<div class="col-span-1 md:col-span2">
<button type="submit" class="button bg-button" :disabled="loading">
Speichern
</button>
</div>
</div>
</form>
@@ -145,6 +141,7 @@
})
.finally(() => {
this.endLoading()
this.$emit('loaded')
})
}
},
@@ -166,6 +163,7 @@
.catch(() => {})
.finally(() => {
this.endLoading()
this.$emit('loaded')
})
},
computed: {