diff --git a/main/models.py b/main/models.py
index a02fb785fb493ea6f037e07bf39ae72e74f95ca8..6f9546a3c5e7732053fc4ac7f2ca4ef6295b269c 100644
--- a/main/models.py
+++ b/main/models.py
@@ -310,7 +310,7 @@ class MainArticlesPage(
first_day_of_last_month = last_month.replace(day=1)
sorted_article_qs = MainArticlePage.objects.filter(
- date__gt=first_day_of_last_month
+ date__gt=first_day_of_last_month, article_type=ARTICLE_TYPES.WORK_TIMELINE
).order_by("-date")
article_data_list = []
@@ -336,7 +336,7 @@ class MainArticlesPage(
ctx = super().get_context(request, args, kwargs)
article_list = self.get_article_data_list(1)
ctx["article_data_list"] = article_list
- ctx["show_next_articles"] = MainArticlePage.objects.count() > len(article_list)
+ ctx["show_next_articles"] = MainArticlePage.objects.filter(article_type=ARTICLE_TYPES.WORK_TIMELINE).count() > len(article_list)
return ctx
def get_articles_response(self, request):
@@ -345,8 +345,8 @@ class MainArticlesPage(
"article_data_list": article_list
}
data = {
- 'html': render(request, 'main/blocks/articles_block.html', context).content.decode("utf-8"),
- 'last_article': article_list[-1] == MainArticlePage.objects.all().order_by('-date').last()
+ 'html': render(request, 'main/blocks/articles_timeline_block.html', context).content.decode("utf-8"),
+ 'last_article': article_list[-1] == MainArticlePage.objects.filter(article_type=ARTICLE_TYPES.WORK_TIMELINE).order_by('-date').last()
}
return JsonResponse(data=data, safe=False)
diff --git a/main/templates/main/blocks/articles_article_list_block.html b/main/templates/main/blocks/articles_article_list_block.html
new file mode 100644
index 0000000000000000000000000000000000000000..ea43fa6d4ef8204a6a0bd6b10009ce70213ccbba
--- /dev/null
+++ b/main/templates/main/blocks/articles_article_list_block.html
@@ -0,0 +1,14 @@
+<section class="grid-container mb-4 justify-start xl:mb-14">
+ <div class="grid-content-with-right-side">
+ <div class="leading-6">
+ <h2 class="head-4xl mb-5 xl:hidden">
+ Články
+ </h2>
+ {{> molecules-person-article-preview }}
+ {{> molecules-person-article-preview }}
+ </div>
+ <div class="flex justify-center">
+ {{> atoms-button-animated(btn-text: "Zobrazit další", classes-btn-hidden: "bg-black") }}
+ </div>
+ </div>
+</section>
diff --git a/main/templates/main/blocks/articles_block.html b/main/templates/main/blocks/articles_block.html
deleted file mode 100644
index 0946fd767187bffa672df29961311a1cb06cf00b..0000000000000000000000000000000000000000
--- a/main/templates/main/blocks/articles_block.html
+++ /dev/null
@@ -1,28 +0,0 @@
-{% for month_article_data in article_data_list %}
- <div class="mb-4">
- <h3 class="head-7xl mb-4 xl:hidden">
- {{ month_article_data.month_text }}
- </h3>
- <div class="flex flex-col justify-between xl:flex-row">
- <div class="xl:pt-8">
- {% for article_page in month_article_data.left_column %}
- {% include 'main/includes/work_article_preview.html' %}
- {% empty %}
- <div class="p-7 flex flex-col max-w-xl mb-8" />
- {% endfor %}
- </div>
- <div class="relative border border-violet-400 mx-8 hidden xl:block">
- <div class="absolute bg-violet-400 p-1 text-white font-bold" style="transform: translateX(-50%); top: -1rem">
- {{ month_article_data.month_text }}
- </div>
- </div>
- <div class="xl:pt-14">
- {% for article_page in month_article_data.right_column %}
- {% include 'main/includes/work_article_preview.html' %}
- {% empty %}
- <div class="p-7 flex flex-col max-w-xl mb-8" />
- {% endfor %}
- </div>
- </div>
- </div>
-{% endfor %}
\ No newline at end of file
diff --git a/main/templates/main/blocks/articles_timeline_block.html b/main/templates/main/blocks/articles_timeline_block.html
new file mode 100644
index 0000000000000000000000000000000000000000..f192f8ed8d55db41c6d92f6957b1c3ed17dc924e
--- /dev/null
+++ b/main/templates/main/blocks/articles_timeline_block.html
@@ -0,0 +1,29 @@
+{% for month_article_data in article_data_list %}
+ <div class="mb-4">
+ <h2 class="head-4xl mb-5 xl:hidden">
+ {{ month_article_data.month_text }}
+ </h2>
+ <div class="article-timeline-grid justify-between">
+ <div class="article-timeline-grid__left-article xl:pt-8">
+ {% for article_page in month_article_data.left_column %}
+ {% include 'main/includes/work_article_preview.html' %}
+ {% empty %}
+ <div class="p-7 flex flex-col max-w-xl mb-8"/>
+ {% endfor %}
+ </div>
+ <div class="article-timeline-grid__timeline relative border border-violet-400 hidden xl:block">
+ <div class="article-timeline--month absolute bg-violet-400 p-1 text-white font-bold">
+ {{ month_article_data.month_text }}
+
+ </div>
+ </div>
+ <div class="article-timeline-grid__right-article xl:pt-14">
+ {% for article_page in month_article_data.right_column %}
+ {% include 'main/includes/work_article_preview.html' %}
+ {% empty %}
+ <div class="p-7 flex flex-col max-w-xl mb-8"/>
+ {% endfor %}
+ </div>
+ </div>
+ </div>
+{% endfor %}
\ No newline at end of file
diff --git a/main/templates/main/main_articles_page.html b/main/templates/main/main_articles_page.html
index 863661a7912957e8d44b8ff500549df7b5d7023f..264e5b223575a768423d1ca57d37b4b363177099 100644
--- a/main/templates/main/main_articles_page.html
+++ b/main/templates/main/main_articles_page.html
@@ -2,65 +2,80 @@
{% load wagtailcore_tags wagtailimages_tags shared_filters %}
{% block content %}
- {% include 'main/includes/layout/simple_page_header.html' %}
+ {% include 'main/includes/layout/simple_page_header.html' %}
- <main role="main">
- <div class="grid-container mb-2 xl:mb-12">
- <div class="grid-content leading-6">
- <h2 class="head-xl mb-2">
- {{ page.perex }}
- </h2>
- <h2 class="head-xl mb-2">
- Projděte si archiv tiskových zpráv a souhrn našich nejvýraznějších aktivit
- </h2>
- </div>
- </div>
-
- <div class="grid-container article-section">
- <div class="grid-full mb-8">
- <div id="searchResultWrapper">
- {% include 'main/blocks/articles_block.html' with article_data_list=article_data_list %}
+ <main role="main">
+ <div class="grid-container mb-2 xl:mb-12">
+ <div class="grid-content leading-6">
+ <h2 class="head-xl mb-2">
+ {{ page.perex }}
+ </h2>
+ <h2 class="head-xl mb-2">
+ Projděte si archiv tiskových zpráv a souhrn našich nejvýraznějších aktivit
+ </h2>
+ </div>
</div>
- {% if show_next_articles %}
- <div class="text-center">
- <a
- onclick="showMoreArticles(event, this)"
- href="#"
- data-url="{{ page_url }}?months="
- data-months="2"
- class="btn btn__slide__wrap"
- >
- <span class="btn text-sm bg-black text-white w-32 lg:text-base">
- Zobrazit další
- </span>
- <span class="btn text-sm bg-white text-black w-32 lg:text-base">
- Zobrazit další
- </span>
- </a>
- </div>
- </div>
-
- {% endif %}
- </div>
- </main>
+ <div class="__js-root">
+ <ui-view-provider :initial="{timeline: true, articles: false}" :sync-location="true"
+ v-slot="{ isCurrentView, toggleView }">
+ <div class="grid-container article-section mb-8">
+ <div class="grid-full">
+ <div class="switch">
+ <a @click="toggleView('timeline')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('timeline')}">Poslanecká sněmovna</a>
+ <a @click="toggleView('articles')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('articles')}">Vláda</a>
+ </div>
+ </div>
+ </div>
+ <template v-if="isCurrentView('timeline')">
+ <div class="mt-20">
+ <div class="grid-container article-section">
+ <div class="grid-full mb-8">
+ <div id="searchResultWrapper">
+ {% include 'main/blocks/articles_timeline_block.html' with article_data_list=article_data_list %}
+ </div>
+ </div>
+ <div class="flex justify-center">
+ <a
+ onclick="showMoreArticles(event, this)"
+ href="#"
+ data-url="{{ page_url }}?months="
+ data-months="2"
+ class="btn btn__slide__wrap"
+ >
+ <span class="btn text-sm bg-black text-white w-32 lg:text-base">
+ Zobrazit další
+ </span>
+ <span class="btn text-sm bg-white text-black w-32 lg:text-base">
+ Zobrazit další
+ </span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </template>
+ <template v-if="isCurrentView('articles')">
- <script type="text/javascript">
- async function showMoreArticles(event, btn) {
- event.preventDefault()
-
- const searchResultWrapper = document.getElementById('searchResultWrapper')
- const url = btn.getAttribute('data-url') + btn.getAttribute('data-months')
+ </template>
+ </ui-view-provider>
+ </div>
+ </main>
- const response = await fetch(url, {
- method: "GET",
- headers: {"X-Requested-With": "XMLHttpRequest"},
- })
- const data = await response.json()
+ <script type="text/javascript">
+ async function showMoreArticles(event, btn) {
+ event.preventDefault()
- if (data.last_article) { btn.hide() }
+ const searchResultWrapper = document.getElementById('searchResultWrapper')
+ const url = btn.getAttribute('data-url') + btn.getAttribute('data-months')
- searchResultWrapper.innerHTML = data.html
- btn.setAttribute('data-months', parseInt(btn.getAttribute('data-months')) + 1)
- }
- </script>
+ const response = await fetch(url, {
+ method: "GET",
+ headers: {"X-Requested-With": "XMLHttpRequest"},
+ })
+ const data = await response.json()
+ searchResultWrapper.innerHTML = data.html
+ btn.setAttribute('data-months', parseInt(btn.getAttribute('data-months')) + 1)
+ }
+ </script>
{% endblock content %}