{% extends "base.html" %}
{% import "/components/header.html" as header %}
{% import "/components/footer.html" as footer %}
{% import "competition/card.html" as card %}
{% import "components/profile_card.html" as profile_card %}
{% import "components/profile_nav.html" as profile_nav %}

{% block title %}Мои конкурсы{% endblock %}



{% block content %}
{{ header.section(user) }}
<section class="c_dg3k4">
    <div class="c_gtoe9">
        {{ profile_card.profile_card(user) }}
        <div class="c_ru432">
            {{ profile_nav.profile_nav(user, 'competitions') }}
            <div class="c_3ihvi" id="main"><a class="c_ctfod b_289i1 ba" href="/form/competition"><span class="c_d2l0b b_al8e7">Добавить</span></a></div>
            <div class="c_tihtk">
            {% for competition in cards %}
                {{ card.section(competition, true, link='/profile/partner/competition/{}#main'.format(competition._id)) }}
            {% endfor %}
            </div>
        </div>
    </div>
</section>
<script>
document.querySelectorAll('.c_2fr39.b_tfnz2#deleteBtn').forEach(btn => {
  btn.addEventListener('click', async (e) => {
    const article = btn.closest('article');
    const competitionId = btn.dataset.competitionId || btn.dataset['competition_id'];
    if (!competitionId) return console.error('competition_id not found');
    try {
      const res = await fetch('/api/partner/competition/delete', {
        method: 'DELETE',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ competition_id: competitionId })
      });
      if (!res.ok) throw new Error(await res.text());
      if (article) article.remove();
    } catch (err) {
      console.error('Delete failed:', err);
    }
  });
});

async function postCompetition(button) {
    const compId = button.dataset.competition_id;
    const emailsNotify = button.parentElement.querySelector('#emailsNotify')
    const serviceSocial = button.parentElement.querySelector('#serviceSocial')
    const userSocial = button.parentElement.querySelector('#userSocial')
    const usersSocial = button.parentElement.querySelector('#usersSocial')
    const formData = new FormData();
    formData.append('competition_id', compId);
    formData.append('emailsNotify', emailsNotify.checked);
    formData.append('serviceSocial', serviceSocial.checked);
    formData.append('userSocial', userSocial.checked);
    formData.append('usersSocial', usersSocial.checked);

    emailsNotify.checked = false
    serviceSocial.checked = false
    userSocial.checked = false
    usersSocial.checked = false

    try {
        const res = await fetch('/api/competition/publish', { method: 'POST', body: formData });

        if (res.ok) {
            showToast({message: 'Успешно опубликовано', status: 'info'});
        } else {
            const errorText = await res.json();
            showToast({message: errorText.detail, status: 'error'});
        }
    } catch (err) {

        showToast({message: err, status: 'error'});
    }
}

document.querySelectorAll('#rePublishCompetition').forEach(btn => {
  if (!btn.dataset.competition_id) return;

  btn.addEventListener('click', e => {
    e.preventDefault();
    postCompetition(btn);
  });
});

</script>


{{ footer.section(user) }}
{% endblock %}

{% block head %}
{{ header.style() }}
{{card.style()}}
{{ profile_nav.style() }}
<style>

/* Mobile */
@media (max-width: 699px) {
.c_mrl59 { align-items: center; background: #5F1798; border-radius: 25px; bottom: -15px; display: flex; height: 50px; justify-content: center; position: absolute; right: -15px; width: 50px; }



}

/* Tablet */
@media (min-width: 700px) and (max-width: 900px) {
.c_iiehk { align-items: center; border-radius: 5px; display: flex; flex-direction: column; gap: 20px; width: 335px; }
.c_nnsh6>a>img{display: none;}
.c_nnsh6 { align-content: center; align-items: center; align-self: stretch; display: flex; flex-wrap: wrap; gap: 0 5px; justify-content: center; padding: 3px 0; }
.c_3ihvi { align-items: flex-start; align-self: stretch; display: flex; flex-direction: column; gap: 15px; justify-content: center; padding: 15px 85px; }
.c_tihtk { align-content: flex-start; align-items: flex-start; display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; padding-left: 8px; }
.c_ru432 { align-items: center; align-self: stretch; background: #FFF; border-radius: 5px; display: flex; flex-direction: column; padding: 15px 0; }
.c_gtoe9 { align-items: center; align-self: stretch; display: flex; flex-direction: column; gap: 30px; padding: 0 49px; }
.c_dg3k4 { align-items: center; background: #F6EBFF; display: flex; flex-direction: column; padding: 50px 0; }
}
.b_ornr9 {height: 444px;}
/* Desktop */
@media (min-width: 901px) {
.c_iiehk { align-items: flex-end; border-radius: 5px; display: flex; flex-direction: column; gap: 20px; width: 310px; }
.c_nnsh6>a>img{display: none;}

}</style>
{{ footer.style() }}
{% endblock %}