gzbender
7 years ago
parent
a98587c9ca
commit
bb8871141f
12 changed files with 296 additions and 109 deletions
@ -0,0 +1,26 @@ |
|||||||
|
# Generated by Django 2.0.7 on 2019-06-06 21:05 |
||||||
|
|
||||||
|
from django.conf import settings |
||||||
|
from django.db import migrations, models |
||||||
|
import django.db.models.deletion |
||||||
|
|
||||||
|
|
||||||
|
class Migration(migrations.Migration): |
||||||
|
|
||||||
|
dependencies = [ |
||||||
|
('user', '0031_user_review_url'), |
||||||
|
] |
||||||
|
|
||||||
|
operations = [ |
||||||
|
migrations.CreateModel( |
||||||
|
name='Child', |
||||||
|
fields=[ |
||||||
|
('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')), |
||||||
|
('first_name', models.CharField(max_length=30, verbose_name='Имя ребенка')), |
||||||
|
('last_name', models.CharField(blank=True, default='', max_length=150, verbose_name='Фамилия ребенка')), |
||||||
|
('gender', models.CharField(choices=[('n', 'не указан'), ('m', 'Мужчина'), ('f', 'Женщина')], default='n', max_length=1, verbose_name='Пол ребенка')), |
||||||
|
('birthday', models.DateField(blank=True, null=True, verbose_name='День рождения ребенка')), |
||||||
|
('user', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='childs', to=settings.AUTH_USER_MODEL)), |
||||||
|
], |
||||||
|
), |
||||||
|
] |
||||||
@ -0,0 +1,21 @@ |
|||||||
|
# Generated by Django 2.0.7 on 2019-06-07 20:48 |
||||||
|
|
||||||
|
from django.db import migrations |
||||||
|
|
||||||
|
|
||||||
|
def add_childs(apps, schema_editor): |
||||||
|
User = apps.get_model('user', 'User') |
||||||
|
Child = apps.get_model('user', 'Child') |
||||||
|
for user in User.objects.exclude(child_first_name=''): |
||||||
|
Child.objects.get_or_create(user=user, first_name=user.child_first_name, last_name=user.child_last_name, |
||||||
|
gender=user.child_gender, birthday=user.child_birthday) |
||||||
|
|
||||||
|
class Migration(migrations.Migration): |
||||||
|
|
||||||
|
dependencies = [ |
||||||
|
('user', '0032_child'), |
||||||
|
] |
||||||
|
|
||||||
|
operations = [ |
||||||
|
migrations.RunPython(add_childs), |
||||||
|
] |
||||||
@ -0,0 +1,119 @@ |
|||||||
|
<template> |
||||||
|
<div class="user-child-form form__group"> |
||||||
|
<div class="form__title">Карточка ребёнка</div> |
||||||
|
<div class="user-child-form__description"> |
||||||
|
Вся информация конфиденциальна и не передается третьим лицам. Необходима только для персонализации наград, |
||||||
|
поздравлений с Днем Рождения и других персонализированных акций. |
||||||
|
</div> |
||||||
|
<div class="tabs"> |
||||||
|
<div class="user-child-form__tabs tabs__nav"> |
||||||
|
<a class="user-child-form__tab tabs__btn" v-for="(child, index) in childs" :key="index" href="#" |
||||||
|
v-bind:class="{active: selectedIndex == index}" @click.prevent="select(index)"> |
||||||
|
{{ child.first_name ? (child.first_name + ' ' + child.last_name) : ('Ребенок ' + index) }}</a> |
||||||
|
<a href="#" class="tabs__btn" @click.prevent="add()">Добавить ребенка</a> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="tabs__container"> |
||||||
|
<div v-for="(child, index) in childs" :key="index" class="tabs__item js-tabs-item" |
||||||
|
v-bind:style="{display: selectedIndex == index ? 'block' : ''}"> |
||||||
|
<div class="form__fieldset"> |
||||||
|
<input type="hidden" name="child_id" :value="child.id" /> |
||||||
|
<div class="form__field field" v-bind:class="{error: child.errors && child.errors.gender}"> |
||||||
|
<div class="field__label">ИМЯ РЕБЕНКА</div> |
||||||
|
<div class="field__wrap"> |
||||||
|
<input name='child_first_name' class="field__input" type="text" placeholder="Имя" |
||||||
|
v-model="child.first_name"> |
||||||
|
</div> |
||||||
|
<div v-if="child.errors && child.errors.first_name" class="field__error">{{ child.errors.first_name }}</div> |
||||||
|
</div> |
||||||
|
<div class="form__field field" v-bind:class="{error: child.errors && child.errors.last_name}"> |
||||||
|
<div class="field__label">ФАМИЛИЯ РЕБЕНКА</div> |
||||||
|
<div class="field__wrap"> |
||||||
|
<input name='child_last_name' id="child-last-name" class="field__input" type="text" placeholder="Фамилия" |
||||||
|
v-model="child.last_name"> |
||||||
|
</div> |
||||||
|
<div v-if="child.errors && child.errors.last_name" class="field__error">{{ child.errors.last_name }}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="form__fieldset"> |
||||||
|
<div class="form__field field" v-bind:class="{error: child.errors && child.errors.birthday}"> |
||||||
|
<div class="field__label">ДАТА РОЖДЕНИЯ</div> |
||||||
|
<div class="field__wrap"> |
||||||
|
<vue-datepicker input-class="field__input" name="child_birthday" language="ru" format="dd/MM/yyyy" |
||||||
|
v-model="child.birthday" placeholder="dd/mm/yyyy"/> |
||||||
|
</div> |
||||||
|
<div v-if="child.errors && child.errors.birthday" class="field__error">{{ child.errors.birthday }}</div> |
||||||
|
</div> |
||||||
|
<div class="form__field field" v-bind:class="{error: child.errors && child.errors.gender}"> |
||||||
|
<div class="field__label">ПОЛ</div> |
||||||
|
<div class="field__wrap"> |
||||||
|
<lil-select :value.sync="child.gender" :options="genders" value-key="0" title-key="1"/> |
||||||
|
<input name='child_gender' type="hidden" v-model="child.gender"> |
||||||
|
</div> |
||||||
|
<div v-if="child.errors && child.errors.gender" class="field__error">{{ child.errors.gender }}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<a href="#" @click.prevent="remove(index)">Удалить</a> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import DatePicker from 'vuejs-datepicker'; |
||||||
|
import LilSelect from './inputs/LilSelect'; |
||||||
|
|
||||||
|
export default { |
||||||
|
name: "childs", |
||||||
|
props: ['childs'], |
||||||
|
data() { |
||||||
|
return { |
||||||
|
selectedIndex: 0, |
||||||
|
selectedChild: null, |
||||||
|
genders: [ |
||||||
|
['n', 'М / Ж'], |
||||||
|
['f', 'Ж'], |
||||||
|
['m', 'М'], |
||||||
|
] |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
add(){ |
||||||
|
this.childs.push({ |
||||||
|
first_name: '', |
||||||
|
last_name: '', |
||||||
|
birthday: '', |
||||||
|
errors: {}, |
||||||
|
}); |
||||||
|
this.select(this.childs.length - 1); |
||||||
|
}, |
||||||
|
remove(index){ |
||||||
|
if(! confirm('Вы действительно хотите удалить данные о ребенке?')){ |
||||||
|
return; |
||||||
|
} |
||||||
|
this.childs.splice(index, 1); |
||||||
|
if(! this.childs.length){ |
||||||
|
this.add(); |
||||||
|
} |
||||||
|
else if(this.selectedIndex == index){ |
||||||
|
this.select(0); |
||||||
|
} |
||||||
|
}, |
||||||
|
select(index){ |
||||||
|
this.selectedIndex = index; |
||||||
|
this.selectedChild = this.childs[index]; |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted(){ |
||||||
|
for(let i in this.childs){ |
||||||
|
if(this.childs[i].errors){ |
||||||
|
this.select(i); |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
components: { |
||||||
|
'vue-datepicker': DatePicker, |
||||||
|
LilSelect, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
Loading…
Reference in new issue