remotes/origin/editis_13-01-19
commit
fb7ffdd873
15 changed files with 162 additions and 46 deletions
@ -0,0 +1,21 @@ |
|||||||
|
# Generated by Django 2.0.7 on 2018-12-04 11:17 |
||||||
|
|
||||||
|
from django.db import migrations, models |
||||||
|
|
||||||
|
|
||||||
|
class Migration(migrations.Migration): |
||||||
|
|
||||||
|
dependencies = [ |
||||||
|
('content', '0022_auto_20180815_2129'), |
||||||
|
] |
||||||
|
|
||||||
|
operations = [ |
||||||
|
migrations.CreateModel( |
||||||
|
name='FAQ', |
||||||
|
fields=[ |
||||||
|
('id', models.AutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')), |
||||||
|
('question', models.TextField(max_length=1000)), |
||||||
|
('answer', models.TextField(max_length=1000)), |
||||||
|
], |
||||||
|
), |
||||||
|
] |
||||||
@ -0,0 +1,18 @@ |
|||||||
|
{% extends "templates/lilcity/index.html" %} |
||||||
|
{% load static %} |
||||||
|
{% load jsonify_queryset %} |
||||||
|
|
||||||
|
{% block content %} |
||||||
|
<div class="section"> |
||||||
|
<div class="section__center center center_sm"> |
||||||
|
<div class="title">Часто задаваемые вопросы</div> |
||||||
|
<faq :faqs="$root.store.data.faqs"></faq> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
{% endblock content %} |
||||||
|
|
||||||
|
{% block pre_app_js %} |
||||||
|
<script> |
||||||
|
window.LIL_STORE.data.faqs = {{ faqs|safe }}; |
||||||
|
</script> |
||||||
|
{% endblock pre_app_js %} |
||||||
@ -0,0 +1,50 @@ |
|||||||
|
<template> |
||||||
|
<div class="faq"> |
||||||
|
<div class="faq__item" v-for="faq in faqs" :class="{'faq__item_opened': faq.opened}"> |
||||||
|
<div class="faq__item-head" @click="open(faq)"> |
||||||
|
<div class="faq__item-question">{{ faq.question }}</div> |
||||||
|
<div class="faq__item-opener"> |
||||||
|
<svg class="icon" :class="{'icon-arrow-up': faq.opened, 'icon-arrow-down': !faq.opened}"> |
||||||
|
<use xlink:href="/static/img/sprite.svg#icon-arrow-down"></use> |
||||||
|
</svg> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="faq__item-answer" v-show="faq.opened" style="display: none;">{{ faq.answer }}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: 'faq', |
||||||
|
props: ['faqs'], |
||||||
|
methods: { |
||||||
|
open(faq){ |
||||||
|
faq.opened = ! faq.opened; |
||||||
|
for(let f of this.faqs){ |
||||||
|
if(f !== faq){ |
||||||
|
f.opened = false; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
}, |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="sass"> |
||||||
|
.faq |
||||||
|
&__item-head |
||||||
|
display: flex |
||||||
|
background: #f8f8f8 |
||||||
|
padding: 7px 10px 5px |
||||||
|
cursor: pointer |
||||||
|
&__item-question |
||||||
|
flex: 1 |
||||||
|
&__item-opener |
||||||
|
margin-left: 10px |
||||||
|
& .icon |
||||||
|
width: 16px |
||||||
|
height: 16px |
||||||
|
&__item-answer |
||||||
|
padding: 10px 10px |
||||||
|
</style> |
||||||
Loading…
Reference in new issue