<?xml version="1.0"?>
<t t-name="event.event_report_template_full_page_ticket">
    <div class="row page">
        <div t-attf-class="o_event_full_page_ticket_container page w-100 #{'o_event_full_page_ticket_responsive_html' if responsive_html else 'o_event_full_page_ticket'}">
            <div class="o_event_full_page_ticket_wrapper">
                <div t-if="responsive_html" class="d-flex justify-content-center">
                    <a class="btn o_event_download_ticket_btn mb-2" title="Download Tickets" t-attf-href="/event/{{ event.id }}/my_tickets?registration_ids={{ attendee.ids }}&amp;tickets_hash={{ event._get_tickets_access_hash(attendee.ids) }}">
                        Download Tickets <i class="ms-1 fa fa-download"/>
                    </a>
                </div>
                <div class="o_event_full_page_ticket_details">
                    <div class="d-flex flex-column-reverse flex-sm-row">
                        <div class="o_event_full_page_left_details ps-3 pt-3 pb-2 pe-2">
                            <div class="o_event_full_page_left_details_top mb-3">
                                <h2 class="o_event_full_page_ticket_event_name fw-bold pt-3" t-field="event.name"/>
                                <t t-set="first_ticket" t-value="event.event_ticket_ids[0] if event.event_ticket_ids else None"/>
                                <h4 t-if="attendee" class="o_event_full_page_ticket_font_faded o_event_full_page_ticket_type" t-field="attendee.event_ticket_id.name"/>
                                <h4 t-elif="first_ticket" t-out="first_ticket.name" class="o_event_full_page_ticket_font_faded pe-4"/>
                                <h4 class="fw-bold mb-3 pb-2" t-if="attendee" t-field="attendee.name"/>
                                <h4 class="fw-bold mb-3 pb-2" t-elif="not attendee"><span>John Doe</span></h4>
                                <t t-set="answer_badge_classes" t-valuef="#{'badge' if responsive_html else 'px-2 py-1 d-inline-block'} bg-200 text-black my-1 me-1 fw-semibold o_event_full_page_ticket_answer"/>
                                <div t-if="attendee" class="mb-3">
                                    <span t-foreach="attendee.registration_answer_choice_ids" t-att-class="answer_badge_classes" t-as="answer" t-out="answer.display_name"/>
                                </div>
                                <div t-else="" class="mb-3">
                                    <span t-foreach="event.question_ids.filtered(lambda q: q.question_type == 'simple_choice' and q.answer_ids)" t-att-class="answer_badge_classes" t-as="question" t-out="question.answer_ids[0].name"/>
                                </div>
                            </div>
                            <div t-attf-class="row gy-0 gx-2 #{'o_event_full_page_left_details_bottom_qr_only' if not event.use_barcode else ''}">
                                <div t-if="event.address_id" class="col-md-6 col-12 mb-3 mb-md-0 o_event_full_page_ticket_column">
                                    <div class="d-flex">
                                        <i class="fa fa-map-marker fa-2x fa-fw me-2 mt-1"/>
                                        <div t-call="event.event_report_template_formatted_event_address">
                                            <t t-set="multi_line_address" t-value="True"/>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6 col-12 mb-3 o_event_full_page_ticket_column">
                                    <div class="d-flex">
                                        <i class="fa fa-calendar fa-2x fa-fw me-2 mt-1"/>
                                        <div t-if="attendee">
                                            <span t-field="attendee.event_begin_date" class="text-nowrap" t-options="{&quot;widget&quot;: &quot;datetime&quot;, &quot;tz_name&quot;: event.date_tz, &quot;format&quot;: &quot;short&quot;}"/><br/>
                                            <span class="me-1">to</span><span t-field="attendee.event_end_date" class="text-nowrap" t-options="{&quot;widget&quot;: &quot;datetime&quot;, &quot;tz_name&quot;: event.date_tz, &quot;format&quot;: &quot;short&quot;}"/>
                                        </div>
                                        <div t-elif="event.is_one_day">
                                            <span t-field="event.date_begin" class="text-nowrap" t-options="{&quot;widget&quot;: &quot;datetime&quot;, &quot;date_only&quot;: True, &quot;tz_name&quot;: event.date_tz}"/><br/>
                                            <span class="me-1">from</span><span t-field="event.date_begin" class="text-nowrap" t-options="{&quot;widget&quot;: &quot;datetime&quot;, &quot;time_only&quot;: True, &quot;hide_seconds&quot;: True, &quot;tz_name&quot;: event.date_tz, &quot;format&quot;: &quot;short&quot;}"/>
                                            <span class="me-1">to</span><span t-field="event.date_end" class="text-nowrap" t-options="{&quot;widget&quot;: &quot;datetime&quot;, &quot;time_only&quot;: True, &quot;hide_seconds&quot;: True, &quot;tz_name&quot;: event.date_tz, &quot;format&quot;: &quot;short&quot;}"/>
                                        </div>
                                        <div t-else="">
                                            <span t-field="event.date_begin" class="text-nowrap" t-options="{&quot;widget&quot;: &quot;datetime&quot;, &quot;tz_name&quot;: event.date_tz, &quot;format&quot;: &quot;short&quot;}"/><br/>
                                            <span class="me-1">to</span><span t-field="event.date_end" class="text-nowrap" t-options="{&quot;widget&quot;: &quot;datetime&quot;, &quot;tz_name&quot;: event.date_tz, &quot;format&quot;: &quot;short&quot;}"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div t-attf-class="o_event_full_page_ticket_barcode text-center text-sm-start #{'o_event_full_page_ticket_qr_only' if not event.use_barcode else ''}">
                            <div class="o_event_full_page_ticket_barcode_container px-2">
                                <t t-if="not attendee or (attendee and attendee.barcode)">
                                    <div t-att-class="'pb-3' if event.use_barcode else ''">
                                        <img t-attf-src="/report/barcode/QR/{{attendee.barcode if attendee and attendee.barcode else '12345678901234567890'}}?&amp;width=152&amp;height=152&amp;quiet=0" alt="QR Code"/>
                                    </div>
                                    <t t-if="event.use_barcode">
                                        <img class="o_event_barcode" t-attf-src="/report/barcode/?barcode_type=Code128&amp;value={{attendee.barcode if attendee and attendee.barcode else '12345678901234567890'}}&amp;width=168&amp;height=100&amp;humanreadable=1&amp;quiet=0" alt="Barcode"/>
                                    </t>
                                </t>
                            </div>
                        </div>
                    </div>
                    <div t-if="not responsive_html" t-field="event.ticket_instructions" class="o_event_full_page_extra_instructions ps-3 pt-3 pb-2 pe-2"/>
                </div>
            </div>
            <div class="page oe_structure"/>
        </div>
    </div>
</t>

