TNCSC_Odoo/addons/community_classifieds/views/classifieds_templates.xml

<?xml version="1.0" encoding="utf-8"?>
<odoo>
    <template id="classifieds_list_page" name="Classifieds">
        <t t-call="website.layout">
            <div class="container" style="margin-top: 24px; margin-bottom: 60px;">
                <div class="d-flex justify-content-between align-items-center mb-3">
                    <h2>Classifieds</h2>
                    <a href="/classifieds/new" class="btn btn-primary">Post a Listing</a>
                </div>
                <div class="row">
                    <t t-foreach="listings" t-as="listing">
                        <div class="col-md-4 mb-3">
                            <div class="card h-100">
                                <div class="card-body">
                                    <h5 class="card-title">
                                        <a t-attf-href="/classifieds/#{listing.id}" t-out="listing.title"/>
                                    </h5>
                                    <p class="card-text text-muted" t-out="dict(listing._fields['category'].selection).get(listing.category)"/>
                                </div>
                            </div>
                        </div>
                    </t>
                    <t t-if="not listings">
                        <p class="text-muted">No listings yet.</p>
                    </t>
                </div>
            </div>
        </t>
    </template>

    <template id="classifieds_detail_page" name="Classified Detail">
        <t t-call="website.layout">
            <div class="container" style="max-width: 640px; margin-top: 24px; margin-bottom: 60px;">
                <h2 t-out="listing.title"/>
                <p class="text-muted" t-out="dict(listing._fields['category'].selection).get(listing.category)"/>
                <div t-out="listing.description"/>
                <t t-foreach="listing.image_ids" t-as="img">
                    <img t-attf-src="/web/image/community.classified.image/#{img.id}/image" style="max-width: 100%; margin-bottom: 8px;" alt="Listing image"/>
                </t>
                <hr/>
                <p t-if="listing.contact_method in ('email', 'both') and listing.contact_email">
                    Email: <span t-out="listing.contact_email"/>
                </p>
                <p t-if="listing.contact_method in ('phone', 'both') and listing.contact_phone">
                    Phone: <span t-out="listing.contact_phone"/>
                </p>
            </div>
        </t>
    </template>

    <template id="classifieds_new_page" name="Post a Classified">
        <t t-call="website.layout">
            <div class="container" style="max-width: 480px; margin-top: 24px; margin-bottom: 60px;">
                <h2>Post a Listing</h2>
                <form method="POST" enctype="multipart/form-data" t-attf-action="/classifieds/new">
                    <input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
                    <div class="mb-3">
                        <label class="form-label">Title</label>
                        <input type="text" class="form-control" name="title" required="required"/>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Category</label>
                        <select class="form-select" name="category">
                            <option value="for_sale">For Sale</option>
                            <option value="housing">Housing</option>
                            <option value="services">Services</option>
                            <option value="jobs">Jobs</option>
                            <option value="other" selected="selected">Other</option>
                        </select>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Description</label>
                        <textarea class="form-control" name="description" rows="4"/>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Contact Method</label>
                        <select class="form-select" name="contact_method">
                            <option value="email" selected="selected">Email</option>
                            <option value="phone">Phone</option>
                            <option value="both">Both</option>
                        </select>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Contact Email</label>
                        <input type="email" class="form-control" name="contact_email"/>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Contact Phone</label>
                        <input type="text" class="form-control" name="contact_phone"/>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Images (up to 3)</label>
                        <input type="file" class="form-control mb-1" name="image1" accept="image/*"/>
                        <input type="file" class="form-control mb-1" name="image2" accept="image/*"/>
                        <input type="file" class="form-control" name="image3" accept="image/*"/>
                    </div>
                    <button type="submit" class="btn btn-primary">Submit for Review</button>
                </form>
            </div>
        </t>
    </template>

    <template id="classifieds_my_page" name="My Classifieds">
        <t t-call="portal.portal_layout">
            <div class="o_portal_my_doc_table">
                <h3>My Classifieds</h3>
                <table class="table">
                    <thead><tr><th>Title</th><th>Status</th><th>Expiry</th><th/></tr></thead>
                    <tbody>
                        <t t-foreach="listings" t-as="listing">
                            <tr>
                                <td t-out="listing.title"/>
                                <td t-out="dict(listing._fields['state'].selection).get(listing.state)"/>
                                <td t-out="listing.expiry_date or ''"/>
                                <td>
                                    <a t-if="listing.state in ('published', 'expired')"
                                       t-attf-href="/classifieds/#{listing.id}/renew" class="btn btn-sm btn-secondary">Renew</a>
                                </td>
                            </tr>
                        </t>
                    </tbody>
                </table>
            </div>
        </t>
    </template>

    <template id="classifieds_membership_required" name="Classifieds: Membership Required">
        <t t-call="website.layout">
            <div class="container" style="max-width: 480px; margin-top: 60px;">
                <p class="alert alert-warning">You need an active membership to post a classified listing.</p>
            </div>
        </t>
    </template>
</odoo>