odoo-aakriti-events-rental/addons/theme_aakriti_events/views/portal_templates.xml

<?xml version="1.0" encoding="utf-8"?>
<odoo>
    <!-- Inherit and Override Portal List View -->
    <template id="portal_my_rental_requests_inherit" inherit_id="event_rental.portal_my_rental_requests">
        <xpath expr="//table" position="replace">
            <div class="card border-0 shadow-sm mt-3" style="border-radius: 12px; overflow: hidden;">
                <table class="table table-hover bg-white mb-0" style="font-size: 0.9rem;">
                    <thead class="bg-light">
                        <tr>
                            <th class="border-0">Reference</th>
                            <th class="border-0">Event Date</th>
                            <th class="border-0">Event Type</th>
                            <th class="border-0 text-right">Total Amount</th>
                            <th class="border-0 text-center">Status</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr t-foreach="requests" t-as="req">
                            <td>
                                <a t-att-href="'/my/rentals/%s' % req.id" t-out="req.name" class="font-weight-bold" style="color: #0b223e;"/>
                            </td>
                            <td><span t-field="req.event_date"/></td>
                            <td><span t-field="req.event_type"/></td>
                            <td class="text-right">
                                <span t-field="req.amount_total" t-options="{'widget': 'monetary', 'display_currency': res_company.currency_id}"/>
                            </td>
                            <td class="text-center">
                                <span t-if="req.status == 'draft'" class="badge badge-secondary p-2">Draft</span>
                                <span t-elif="req.status == 'under_review'" class="badge badge-info p-2 text-white" style="background-color: #17a2b8;">Under Review</span>
                                <span t-elif="req.status == 'approved'" class="badge badge-success p-2" style="background-color: #28a745;">Approved</span>
                                <span t-elif="req.status == 'quotation_sent'" class="badge badge-warning p-2" style="background-color: #ffc107;">Quotation Sent</span>
                                <span t-elif="req.status == 'confirmed'" class="badge badge-success p-2" style="background-color: #28a745;">Confirmed</span>
                                <span t-elif="req.status == 'delivered'" class="badge badge-primary p-2" style="background-color: #007bff;">Delivered</span>
                                <span t-elif="req.status == 'returned'" class="badge badge-info p-2 text-white" style="background-color: #17a2b8;">Returned</span>
                                <span t-elif="req.status == 'completed'" class="badge badge-success p-2" style="background-color: #28a745;">Completed</span>
                                <span t-elif="req.status == 'rejected'" class="badge badge-danger p-2" style="background-color: #dc3545;">Rejected</span>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </xpath>
    </template>

    <!-- Inherit and Override Portal Request Details View -->
    <template id="portal_rental_request_detail_template_inherit" inherit_id="event_rental.portal_rental_request_detail_template">
        <xpath expr="//div[@class='card p-4']" position="replace">
            <div class="row">
                <!-- Main details -->
                <div class="col-lg-8 mb-4">
                    <div class="card border-0 shadow-sm p-4" style="border-radius: 12px; background: white;">
                        <div class="d-flex justify-content-between align-items-center mb-4 pb-3 border-bottom">
                            <h3 class="font-weight-bold mb-0" style="color: #0b223e;">
                                Request <t t-out="rental_request.name"/>
                            </h3>
                            <span class="h5 mb-0">
                                <span t-if="rental_request.status == 'draft'" class="badge badge-pill badge-secondary p-2">Draft</span>
                                <span t-elif="rental_request.status == 'under_review'" class="badge badge-pill badge-info p-2 text-white" style="background-color: #17a2b8;">Under Review</span>
                                <span t-elif="rental_request.status == 'approved'" class="badge badge-pill badge-success p-2" style="background-color: #28a745;">Approved</span>
                                <span t-elif="rental_request.status == 'quotation_sent'" class="badge badge-pill badge-warning p-2" style="background-color: #ffc107;">Quotation Sent</span>
                                <span t-elif="rental_request.status == 'confirmed'" class="badge badge-pill badge-success p-2" style="background-color: #28a745;">Confirmed</span>
                                <span t-elif="rental_request.status == 'delivered'" class="badge badge-pill badge-primary p-2" style="background-color: #007bff;">Delivered</span>
                                <span t-elif="rental_request.status == 'returned'" class="badge badge-pill badge-info p-2 text-white" style="background-color: #17a2b8;">Returned</span>
                                <span t-elif="rental_request.status == 'completed'" class="badge badge-pill badge-success p-2" style="background-color: #28a745;">Completed</span>
                                <span t-elif="rental_request.status == 'rejected'" class="badge badge-pill badge-danger p-2" style="background-color: #dc3545;">Rejected</span>
                            </span>
                        </div>

                        <!-- Call to Action for Quotation & Online Payment -->
                        <div t-if="rental_request.status == 'quotation_sent' and rental_request.sale_order_id" class="alert alert-success p-4 mb-4 text-center" style="border-radius: 10px; background-color: #d4edda; border-color: #c3e6cb; color: #155724;">
                            <h5 class="font-weight-bold mb-2">🎉 Quotation Ready for Approval</h5>
                            <p class="mb-3">Your rental request has been reviewed and approved. Please click below to review pricing, make payments, and confirm booking.</p>
                            <a t-att-href="rental_request.sale_order_id.get_portal_url()" class="btn btn-success font-weight-bold px-4 py-2 shadow-sm" style="border-radius: 30px; background-color: #28a745; border-color: #28a745;">
                                View and Pay Quotation Online
                            </a>
                        </div>

                        <!-- Booking details -->
                        <div class="row mb-4">
                            <div class="col-md-6 mb-3">
                                <h6 class="font-weight-bold text-muted mb-2">Rental Period</h6>
                                <p class="mb-1"><strong>Start:</strong> <span t-field="rental_request.start_date"/></p>
                                <p class="mb-0"><strong>End:</strong> <span t-field="rental_request.end_date"/></p>
                            </div>
                            <div class="col-md-6 mb-3">
                                <h6 class="font-weight-bold text-muted mb-2">Location &amp; Type</h6>
                                <p class="mb-1"><strong>Venue:</strong> <span t-field="rental_request.location"/></p>
                                <p class="mb-0"><strong>Event Type:</strong> <span t-field="rental_request.event_type"/></p>
                            </div>
                        </div>

                        <!-- Products lines -->
                        <h5 class="font-weight-bold mb-3 mt-4" style="color: #0b223e;">Requested Products</h5>
                        <div class="table-responsive">
                            <table class="table mb-0" style="font-size: 0.9rem;">
                                <thead class="bg-light">
                                    <tr>
                                        <th>Product</th>
                                        <th class="text-center">Quantity</th>
                                        <th class="text-right">Price</th>
                                        <th class="text-right">Subtotal</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr t-foreach="rental_request.line_ids" t-as="line">
                                        <td><span t-field="line.product_id.name"/></td>
                                        <td class="text-center"><span t-field="line.quantity"/></td>
                                        <td class="text-right">
                                            <span t-field="line.price_unit" t-options="{'widget': 'monetary', 'display_currency': res_company.currency_id}"/>
                                        </td>
                                        <td class="text-right">
                                            <span t-field="line.price_subtotal" t-options="{'widget': 'monetary', 'display_currency': res_company.currency_id}"/>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>

                <!-- Sidebar details -->
                <div class="col-lg-4">
                    <!-- Pricing Card -->
                    <div class="card border-0 shadow-sm p-4 mb-4" style="border-radius: 12px; background: white;">
                        <h5 class="font-weight-bold mb-3" style="color: #0b223e;">Billing Details</h5>
                        <div class="d-flex justify-content-between mb-2" style="font-size: 0.9rem;">
                            <span class="text-muted">Rental Total:</span>
                            <span>
                                <t t-out="sum(rental_request.line_ids.mapped('price_subtotal'))" t-options="{'widget': 'monetary', 'display_currency': res_company.currency_id}"/>
                            </span>
                        </div>
                        <div class="d-flex justify-content-between mb-2" style="font-size: 0.9rem;">
                            <span class="text-muted">Delivery Charges:</span>
                            <span><span t-field="rental_request.delivery_charge" t-options="{'widget': 'monetary', 'display_currency': res_company.currency_id}"/></span>
                        </div>
                        <div class="d-flex justify-content-between mb-2" style="font-size: 0.9rem;">
                            <span class="text-muted">Setup Charges:</span>
                            <span><span t-field="rental_request.setup_charge" t-options="{'widget': 'monetary', 'display_currency': res_company.currency_id}"/></span>
                        </div>
                        <hr class="my-2"/>
                        <div class="d-flex justify-content-between mb-3">
                            <strong>Grand Total:</strong>
                            <strong class="h5 font-weight-bold mb-0" style="color: #0b223e;">
                                <span t-field="rental_request.amount_total" t-options="{'widget': 'monetary', 'display_currency': res_company.currency_id}"/>
                            </strong>
                        </div>
                        <div t-if="rental_request.sale_order_id" class="pt-2">
                            <a t-att-href="rental_request.sale_order_id.get_portal_url()" class="btn btn-outline-primary btn-block py-2 font-weight-bold" style="border-radius: 30px; border-color: #0b223e; color: #0b223e; font-size: 0.85rem;">
                                View Original Sales Quotation
                            </a>
                        </div>
                    </div>

                    <!-- Documents status -->
                    <div class="card border-0 shadow-sm p-4 mb-4" style="border-radius: 12px; background: white;">
                        <h5 class="font-weight-bold mb-3" style="color: #0b223e;">Document Status</h5>
                        <t t-foreach="rental_request.document_ids" t-as="doc">
                            <div class="d-flex align-items-center justify-content-between p-2 mb-2 bg-light" style="border-radius: 8px; font-size: 0.85rem;">
                                <div>
                                    <strong><span t-field="doc.doc_type"/></strong>
                                </div>
                                <div>
                                    <span t-if="doc.verification_status == 'pending'" class="badge badge-warning p-1">Pending</span>
                                    <span t-elif="doc.verification_status == 'verified'" class="badge badge-success p-1">Verified</span>
                                    <span t-elif="doc.verification_status == 'rejected'" class="badge badge-danger p-1">Rejected</span>
                                </div>
                            </div>
                        </t>
                    </div>

                    <!-- Delivery logistics -->
                    <div class="card border-0 shadow-sm p-4" style="border-radius: 12px; background: white;" t-if="rental_request.status in ('confirmed', 'delivered', 'returned', 'completed')">
                        <h5 class="font-weight-bold mb-3" style="color: #0b223e;">Logistics Tracking</h5>
                        <div style="font-size: 0.9rem;">
                            <p class="mb-2"><strong>Delivery:</strong> 
                                <span t-if="rental_request.delivery_status == 'pending'" class="badge badge-warning">Pending Delivery</span>
                                <span t-elif="rental_request.delivery_status == 'delivered'" class="badge badge-primary">Delivered to Venue</span>
                                <span t-elif="rental_request.delivery_status == 'picked_up'" class="badge badge-info text-white">Picked Up</span>
                                <span t-elif="rental_request.delivery_status == 'returned'" class="badge badge-success">Returned &amp; Closed</span>
                            </p>
                            <p t-if="rental_request.delivery_date" class="mb-0"><strong>Scheduled On:</strong> <span t-field="rental_request.delivery_date"/></p>
                        </div>
                    </div>
                </div>
            </div>
        </xpath>
    </template>
</odoo>