refactoring and reworking how to edit rules

This commit is contained in:
2019-01-16 17:34:00 +01:00
parent b1b60ee95f
commit 0624a29b0b
3 changed files with 193 additions and 93 deletions
+36 -23
View File
@@ -38,6 +38,7 @@
<div id="body">
<main class="container">
<div id="termine">
<div class="card" v-if="shifts.length > 0">
<div class="card-content">
<h3 class="card-title">Termine</h3>
@@ -140,28 +141,36 @@
</li>
</ul>
</div>
<div class="card" id="Einstellungen">
<div class="card-content">
<h3 class="card-title">Regeln für die Dauer</h3>
<div class="" id="Einstellungen">
<div class="">
<h3 class="title">Regeln für die Dauer</h3>
<div>
<span class="chip orange">Titel der Veranstaltung</span>
<span class="chip indigo">Art des Dienstes</span>
</div>
<ul class="collection highlight">
<li class="collection-item" v-for="r in rules" :key="rules.indexOf(r)" @click="selectRule(r)">
<span v-if="rules.indexOf(r) != 0" class="title">sonst </span>
<span class="title" v-if="rules.indexOf(r) < rules.length -1">wenn: </span>
<span class="secondary-content">{{ r.duration }} min</span>
<div>
<span v-if="Array.isArray(r.art)">
<span class="chip indigo" :class="{'lighten-3' : r.art.length > 1, 'lighten-2' : r.art.length == 1}" v-for="a in r.art" :key="r.art.indexOf(a)">{{a}}</span>
</span>
<span v-if="Array.isArray(r.title)">
<span class="chip orange" :class="{'lighten-3' : r.title.length > 1, 'lighten-2' : r.title.length == 1}" v-for="t in r.title" :key="r.title.indexOf(t)">{{t}}</span>
</span>
<div class="collection">
<a class="collection-item avatar" v-for="(r,i) in rules" :key="'rule-'+i" @click="editRule(r)">
<i class="circle">#{{ i+1 }}</i>
<span class="title">{{ r.Name}} </span>
<div class="secondary-content">
<span class="badge new" data-badge-caption="Minuten">{{ r.Dauer }}</span>
</div>
</li>
</ul>
<div>
<span class="chip indigo"
:class="'lighten-'+(r.Arten.length > 1 ? '3' : '1')"
v-for="a in r.Arten">
{{a.tag}}
</span>
<span class="chip orange"
:class="'lighten-'+(r.Titel.length > 1 ? '3' : '1')"
v-for="t in r.Titel">
{{t.tag}}
</span>
</div>
</a>
</div>
</div>
</div>
@@ -170,17 +179,21 @@
<div class="modal-content">
<h4>Regel anpassen</h4>
<div class="row">
<div class="range-field col m6 s12">
<div class="range-field col s12 m6 l4">
<label class="active" for="rule_duration">Dauer in Minuten: {{selectedRule.Dauer}}</label>
<input id="rule_duration" type="range" v-model="selectedRule.duration" min="30" max="300" step="10">
<input id="rule_duration" type="range" v-model="selectedRule.Dauer" min="30" max="300" step="10">
</div>
<div class="input-field col s12 m8 l6">
<div class="range-field col s12 m6 l8">
<label class="active" for="rule_name">Name</label>
<input id="rule_name" type="text" v-model="selectedRule.Name">
</div>
<div class="input-field col s12">
<label class="active" for="shift_kind">Arten</label>
<div id="rule_arten" class="chips-initial"></div>
<chip-input name="regel_arten" :init-data="selectedRule.Arten" @change="updateArten">
</div>
<div class="input-field col m8 l6 s12">
<div class="input-field col s12">
<label class="active" for="rule_titel">Titel</label>
<div id="rule_titel" class="chips-inital"></div>
<chip-input name="regel_titel" :init-data="selectedRule.Titel" @change="updateTitel">>
</div>
</div>
</div>