<?xml version="1.0" encoding="utf-8"?>
<odoo>

    <!-- ===== Breadcrumbs ===== -->
    <template
        id="portal_my_home_menu_event"
        name="Portal layout: event menu entries"
        inherit_id="portal.portal_breadcrumbs"
        priority="25"
    >
        <xpath expr="//ol[hasclass('o_portal_submenu')]" position="inside">
            <li
                t-if="page_name == 'event' or registration"
                t-attf-class="breadcrumb-item #{'active' if not registration else ''}"
            >
                <a t-if="registration" t-attf-href="/my/events?{{ keep_query() }}">My Events</a>
                <t t-else="">My Events</t>
            </li>
            <li t-if="registration" class="breadcrumb-item active">
                <t t-out="registration.event_id.name"/>
            </li>
        </xpath>
    </template>

    <!-- ===== Portal Home entry ===== -->
    <template
        id="portal_my_home_event"
        name="My Events"
        customize_show="True"
        inherit_id="portal.portal_my_home"
        priority="25"
    >
        <xpath expr="//div[hasclass('o_portal_docs')]" position="before">
            <t t-set="portal_client_category_enable" t-value="True"/>
        </xpath>
        <div id="portal_client_category" position="inside">
            <t t-call="portal.portal_docs_entry">
                <t t-set="title">My Events</t>
                <t t-set="url" t-value="'/my/events'"/>
                <t t-set="text">View the events you are registered for</t>
                <t t-set="placeholder_count" t-value="'event_count'"/>
            </t>
        </div>
    </template>

    <!-- ===== List: /my/events ===== -->
    <template id="portal_my_events" name="My Event Registrations">
        <t t-call="portal.portal_layout">
            <t t-set="breadcrumbs_searchbar" t-value="True"/>

            <t t-call="portal.portal_searchbar">
                <t t-set="title">My Events</t>
            </t>

            <div t-if="not registrations" class="alert alert-warning" role="alert">
                You have no active registrations for any event.
            </div>

            <t t-if="registrations" t-call="portal.portal_table">
                <thead>
                    <tr class="active">
                        <th>Event</th>
                        <th class="text-end">Start Date</th>
                        <th class="text-end">End Date</th>
                        <th class="text-center">Status</th>
                    </tr>
                </thead>
                <t t-foreach="registrations" t-as="reg">
                    <tr>
                        <td>
                            <a t-attf-href="/my/events/#{reg.id}">
                                <t t-out="reg.event_id.name"/>
                            </a>
                        </td>
                        <td class="text-end">
                            <span t-field="reg.event_begin_date" t-options="{'widget': 'date'}"/>
                        </td>
                        <td class="text-end">
                            <span t-field="reg.event_end_date" t-options="{'widget': 'date'}"/>
                        </td>
                        <td class="text-center">
                            <span
                                t-if="reg.state == 'open'"
                                class="badge rounded-pill text-bg-success"
                            ><i class="fa fa-fw fa-check"/> Registered</span>
                            <span
                                t-elif="reg.state == 'done'"
                                class="badge rounded-pill text-bg-primary"
                            ><i class="fa fa-fw fa-star"/> Attended</span>
                            <span
                                t-elif="reg.state == 'draft'"
                                class="badge rounded-pill text-bg-warning"
                            ><i class="fa fa-fw fa-clock-o"/> Pending</span>
                        </td>
                    </tr>
                </t>
            </t>
        </t>
    </template>

    <!-- ===== Detail: /my/events/<id> ===== -->
    <template id="portal_my_event_detail" name="Event Registration Detail">
        <t t-call="portal.portal_layout">
            <div class="row mt16 o_portal_sidebar">

                <!-- Sidebar -->
                <t t-call="portal.portal_record_sidebar">
                    <t t-set="classes" t-value="'col-12 col-lg-3 d-print-none'"/>
                    <t t-set="entries">
                        <ul class="list-group list-group-flush flex-wrap flex-row flex-lg-column">
                            <li class="list-group-item flex-grow-1">
                                <div class="small mb-1 fw-bold text-uppercase">Status</div>
                                <span
                                    t-if="registration.state == 'open'"
                                    class="badge rounded-pill text-bg-success"
                                ><i class="fa fa-check"/> Registered</span>
                                <span
                                    t-elif="registration.state == 'done'"
                                    class="badge rounded-pill text-bg-primary"
                                ><i class="fa fa-star"/> Attended</span>
                                <span
                                    t-elif="registration.state == 'draft'"
                                    class="badge rounded-pill text-bg-warning"
                                ><i class="fa fa-clock-o"/> Pending</span>
                                <span
                                    t-elif="registration.state == 'cancel'"
                                    class="badge rounded-pill text-bg-danger"
                                ><i class="fa fa-times"/> Cancelled</span>
                            </li>
                            <li t-if="registration.event_id.organizer_id" class="list-group-item flex-grow-1">
                                <div class="small mb-1 fw-bold text-uppercase">Organizer</div>
                                <t t-out="registration.event_id.organizer_id.name"/>
                            </li>
                        </ul>
                    </t>
                </t>

                <!-- Main content -->
                <div id="portal_event_content" class="col-12 col-lg-9">
                    <div class="o_portal_html_view shadow p-3">
                        <div class="o_portal_html_loader text-center">
                            <i class="fa fa-circle-o-notch fa-spin fa-2x fa-fw text-black-50"/>
                        </div>

                        <!-- Event header -->
                        <div class="pb-3 border-bottom">
                            <h2>
                                <t t-out="registration.event_id.name"/>
                            </h2>
                            <div class="row">
                                <div class="col-12 col-md-6">
                                    <strong>Start:</strong>
                                    <span t-field="registration.event_begin_date"/>
                                </div>
                                <div class="col-12 col-md-6">
                                    <strong>End:</strong>
                                    <span t-field="registration.event_end_date"/>
                                </div>
                            </div>
                            <t t-if="registration.event_id.address_id">
                                <div class="mt-2">
                                    <strong>Location:</strong>
                                    <span t-field="registration.event_id.address_id"
                                          t-options="{'widget': 'contact', 'fields': ['address']}"/>
                                </div>
                            </t>
                        </div>

                        <!-- Attendee details -->
                        <div class="mt-3">
                            <h4>Registration Details</h4>
                            <table class="table table-sm">
                                <tbody>
                                    <tr>
                                        <th>Name</th>
                                        <td><t t-out="registration.name"/></td>
                                    </tr>
                                    <tr t-if="registration.email">
                                        <th>Email</th>
                                        <td><t t-out="registration.email"/></td>
                                    </tr>
                                    <tr t-if="registration.phone">
                                        <th>Phone</th>
                                        <td><t t-out="registration.phone"/></td>
                                    </tr>
                                    <tr t-if="registration.event_ticket_id">
                                        <th>Ticket Type</th>
                                        <td><t t-out="registration.event_ticket_id.name"/></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>

                        <!-- Chatter with attachments -->
                        <div class="mt-4">
                            <h4>Messages &amp; Documents</h4>
                            <t t-call="portal.message_thread"/>
                        </div>
                    </div>
                </div>
            </div>
        </t>
    </template>

</odoo>
