{% extends 'base.html.twig' %}

{% block stylesheets %}
    {{ parent() }}
    {{ encore_entry_link_tags('dashboard') }}
    {{ encore_entry_link_tags('dropzone') }}
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    {{ encore_entry_script_tags('dropzone') }}
    {{ encore_entry_script_tags('dashboard_company') }}
{% endblock %}

{% block title %}Promotip: Mijn bedrijf{% endblock %}

{% block body %}
    <div class="container">
        <div class="row overview-dashboard-index">
            <div class="col-12">
                <div class="row p-3 mb-2">
                    <div class="col-12">
                        <h1 class="mb-5">Promotip: Mijn bedrijf</h1>

                        {{ form_start(form, {'attr': {'class': 'form', 'novalidate': 'novalidate'}}) }}

                        <div class="form-label-group row">
                            <div class="col-12">
                                {{ form_widget(form.companyname, { 'attr': {'placeholder': 'Company name'|trans, 'class': 'form-control form-control-lg'} }) }}
                                {{ form_label(form.companyname, 'Company Name'|trans) }}
                                {{ form_errors(form.companyname) }}
                            </div>
                        </div>

                        <div class="form-label-group row">
                            <div class="col-12 col-md-6">
                                {{ form_widget(form.address, { 'attr': {'placeholder': 'Address'|trans, 'class': 'form-control form-control-lg'} }) }}
                                {{ form_label(form.address, 'Address'|trans) }}
                                {{ form_errors(form.address) }}
                            </div>
                            <div class="col-6 col-md-3">
                                {{ form_widget(form.housenumber, { 'attr': {'placeholder': 'Housenumber'|trans, 'class': 'form-control form-control-lg'} }) }}
                                {{ form_label(form.housenumber, 'Number'|trans) }}
                                {{ form_errors(form.housenumber) }}
                            </div>
                            <div class="col-6 col-md-3">
                                {{ form_widget(form.box, { 'attr': {'placeholder': 'Box'|trans, 'class': 'form-control form-control-lg'} }) }}
                                {{ form_label(form.box, 'Box'|trans) }}
                                {{ form_errors(form.box) }}
                            </div>
                        </div>

                        <div class="form-label-group row">
                            <div class="col-12">
                                <select name="location" class="select2-location form-control"></select>
                                {{ form_errors(form.geoPlacesId) }}

                                {{ form_widget(form.geoPlacesId, { 'attr': {'placeholder': 'Zipcode & City'|trans, 'class': 'form-control form-control-lg'} }) }}
                            </div>
                        </div>

                        <div class="form-label-group row">
                            <div class="col-12">
                                {{ form_widget(form.phonenumber, { 'attr': {'placeholder': 'Phone'|trans, 'class': 'form-control form-control-lg'} }) }}
                                {{ form_label(form.phonenumber, 'Phone'|trans) }}
                                {{ form_errors(form.phonenumber) }}
                                <small class="form-text text-muted">Optioneel</small>
                            </div>
                        </div>

                        <div class="form-label-group row">
                            <div class="col-12">
                                {{ form_widget(form.website, { 'attr': {'placeholder': 'Website'|trans, 'class': 'form-control form-control-lg'} }) }}
                                {{ form_label(form.website, 'Website'|trans) }}
                                {{ form_errors(form.website) }}
                            </div>
                        </div>

                        <div class="form-label-group row">
                            <div class="col-12">
                                {{ form_widget(form.emailaddress, { 'attr': {'placeholder': 'E-mail'|trans, 'class': 'form-control form-control-lg'} }) }}
                                {{ form_label(form.emailaddress, 'E-mail'|trans) }}
                                {{ form_errors(form.emailaddress) }}
                                <small class="form-text text-muted">{% trans %}This e-mail address will be visible on the website{% endtrans %}</small>
                            </div>
                        </div>

                        <div class="form-label-group row">
                            <div class="col-12">
                                {{ form_widget(form.vatnumber, { 'attr': {'placeholder': 'VAT'|trans, 'class': 'form-control form-control-lg'} }) }}
                                {{ form_label(form.vatnumber, 'VAT number'|trans) }}
                                {{ form_errors(form.vatnumber) }}
                                <small class="form-text text-muted">Optioneel</small>
                            </div>
                        </div>

                        <div class="form-label-group row">
                            <div class="col-12">
                                {{ form_label(form.description, 'Introduction'|trans, {'label_attr': {'style' : 'position: relative; left: 0;'}}) }}
                                {{ form_widget(form.description, { 'attr': {'placeholder': 'Introduction'|trans, 'class': 'form-control form-control-lg'} }) }}
                                {{ form_errors(form.description) }}
                            </div>
                        </div>

                        <div class="form-label-group row">
                            <div class="col-12">
                                <small class="form-text text-muted">Voeg enkele beschrijvende tags over uw bedrijf toe</small>
                                <select name="tags[]" class="select2-tags form-control" multiple="multiple">
                                    {% for tag in tags %}
                                        <option value="{{ tag.tag.name }}" selected="selected">{{ tag.tag.name }}</option>
                                    {% endfor %}
                                </select>
                            </div>
                        </div>

                        <div class="form-label-group row">
                            <div class="col-12">
                                <div class="checkbox mb-4">
                                    <label style="color: #000;">
                                        Alleen afspraak
                                        <input type="checkbox" name="only_appointment" {% if(company.getOnlyAppointment) %} checked="checked" {% endif %}>
                                    </label>
                                </div>
                            </div>
                        </div>

                        <div class="form-label-group row">
                            <div class="col-12">
                                <div class="checkbox mb-4">
                                    <label style="color: #000;">
                                        Alleen webshop
                                        <input type="checkbox" name="webshop_only" {% if(company.getWebshopOnly) %} checked="checked" {% endif %}>
                                    </label>
                                </div>
                            </div>
                        </div>

                        <h3 class="fw-300">{% trans %}Opening hours{% endtrans %}</h3>
                        <div class="form-group">
                            <table class="table">
                                <tbody>
                                {% for day in range(1, 7) %}
                                    <tr>
                                        <td class="align-middle xs-td">
                                            <strong>
                                                {% if day == 1 %}
                                                    {% trans %}Monday{% endtrans %}
                                                {% elseif day == 2 %}
                                                    {% trans %}Tuesday{% endtrans %}
                                                {% elseif day == 3 %}
                                                    {% trans %}Wednesday{% endtrans %}
                                                {% elseif day == 4 %}
                                                    {% trans %}Thursday{% endtrans %}
                                                {% elseif day == 5 %}
                                                    {% trans %}Friday{% endtrans %}
                                                {% elseif day == 6 %}
                                                    {% trans %}Saturday{% endtrans %}
                                                {% elseif day == 7 %}
                                                    {% trans %}Sunday{% endtrans %}
                                                {% endif %}
                                            </strong>
                                        </td>
                                        <td class="xs-td">
                                            <select name="openingHour[{{ day }}][from][0]" class="form-control xs-form-field">
                                                <option value="">{% trans %}Closed{% endtrans %}</option>
                                                {% for i in range(0, 23) %}
                                                    <option value="{{ "%02d"|format(i) ~ ':00' }}"{% if (opening_hours[day].from[0] is defined and opening_hours[day].from[0] == "%02d"|format(i) ~ ':00') %} selected="selected"{% endif %}>{{ "%02d"|format(i) ~ ':00' }}</option>
                                                    <option value="{{ "%02d"|format(i) ~ ':30' }}"{% if (opening_hours[day].from[0] is defined and opening_hours[day].from[0] == "%02d"|format(i) ~ ':30') %} selected="selected"{% endif %}>{{ "%02d"|format(i) ~ ':30' }}</option>
                                                {% endfor %}
                                            </select>
                                        </td>
                                        <td class="align-middle text-gray open-1 xs-td">
                                            {% trans %}till{% endtrans %}
                                        </td>
                                        <td class="open-1 xs-td">
                                            <select name="openingHour[{{ day }}][till][0]" class="form-control xs-form-field">
                                                <option value="">{% trans %}Closed{% endtrans %}</option>
                                                {% for i in range(0, 23) %}
                                                    <option value="{{ "%02d"|format(i) ~ ':00' }}"{% if (opening_hours[day].till[0] is defined and opening_hours[day].till[0] == "%02d"|format(i) ~ ':00') %} selected="selected"{% endif %}>{{ "%02d"|format(i) ~ ':00' }}</option>
                                                    <option value="{{ "%02d"|format(i) ~ ':30' }}"{% if (opening_hours[day].till[0] is defined and opening_hours[day].till[0] == "%02d"|format(i) ~ ':30') %} selected="selected"{% endif %}>{{ "%02d"|format(i) ~ ':30' }}</option>
                                                {% endfor %}
                                            </select>
                                        </td>
                                    </tr>
                                {% endfor %}
                                </tbody>
                            </table>
                        </div>

                        <button type="submit" class="btn btn-lg btn-primary">{% trans %}Save{% endtrans %}</button>
                        {{ form_end(form) }}
                    </div>
                    <div class="col-lg-4">
                        {# Add any additional content for the right column here #}
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}