<?xml version="1.0" encoding="utf-8"?>
<odoo>
    <template id="portal_my_tasks_priority_widget_template" name="Priority Widget Template">
        <t t-set="priority_label" t-value="priority_labels[task.priority]"/>
        <span t-attf-class="o_priority_star d-inline-block fa fa-star#{' text-warning' if task.priority != '0' else '-o opacity-75'} #{classes if classes else ''}" t-att-title="priority_label"/>
        <span t-attf-class="o_priority_star d-inline-block fa fa-star#{' text-warning' if task.priority in ['2', '3'] else '-o opacity-75'} #{classes if classes else ''}" t-att-title="priority_label"/>
        <span t-attf-class="o_priority_star d-inline-block fa fa-star#{' text-warning' if task.priority == '3' else '-o opacity-75'} #{classes if classes else ''}" t-att-title="priority_label"/>
    </template>

    <template id="portal_my_tasks_state_widget_template" name="Status Widget Template">
        <span
            t-att-title="dict(task.fields_get(allfields=['state'])['state']['selection'])[task.state]"
            t-attf-class="#{'fa' if task.state in ['1_done','1_canceled','04_waiting_normal'] else 'o_status rounded-circle' } #{'fa-check-circle text-success' if task.state == '1_done' else 'fa-times-circle text-danger' if task.state == '1_canceled' else 'bg-warning' if task.state == '02_changes_requested' else 'bg-success' if task.state == '03_approved' else 'fa-hourglass-o' if task.state == '04_waiting_normal' else ''}"
        />
    </template>
    <template id="portal_my_tasks_badge_widget_template" name="badge Widget Template">
        <span t-attf-class="badge rounded-pill o_tag o_badge_color_#{task.stage_id_color}"
            t-attf-title="#{task.stage_id.name}" t-out="task.stage_id.name"
        />
    </template>

    <template id="portal_tasks_list" name="Tasks List">
        <t t-if="grouped_tasks">
            <t t-call="portal.portal_table">
                <thead>
                    <tr>
                        <!-- Allows overrides in modules -->
                        <t t-set="group_by_in_header_list" t-value="['priority', 'milestone_id']"></t>
                        <t t-if="multiple_projects" t-set="group_by_in_header_list" t-value="group_by_in_header_list + ['project_id']"/>
                        <!-- Computes the right colspan once and use it everywhere -->
                        <t t-set="grouped_tasks_colspan" t-value="5 if groupby in group_by_in_header_list else 6"></t>
                        <t t-set="grouped_tasks_colspan" t-if="not allow_milestone" t-value="grouped_tasks_colspan - 1"></t>
                        <t t-set="grouped_tasks_colspan" t-if="not multiple_projects" t-value="grouped_tasks_colspan - 1"/>
                        <th t-attf-colspan="{{2 if groupby != 'priority' else 1}}"/>
                        <th>Name</th>
                        <th>Assignees</th>
                        <th t-if="groupby != 'project_id' and multiple_projects">Project</th>
                        <th t-if="groupby != 'milestone_id' and allow_milestone" name="project_portal_milestones">Milestone</th>
                        <th t-if="groupby != 'state'"/>
                        <th t-if="groupby != 'stage_id'" class="text-end">Stage</th>
                    </tr>
                </thead>
                <t t-foreach="grouped_tasks" t-as="tasks">
                    <tbody t-if="tasks">
                        <tr name="grouped_tasks_groupby_columns" t-if="groupby != 'none'" class="table-light">
                            <th name="groupby_name_col" t-att-colspan="grouped_tasks_colspan">
                                <t t-if="groupby == 'project_id' and multiple_projects">
                                    <!-- This div is necessary for documents_project_sale -->
                                    <div name="project_name" class="d-flex w-100 align-items-center">
                                        <span t-if="tasks[0].sudo().project_id" t-field="tasks[0].sudo().project_id.name"/>
                                        <span t-else="">No Project</span>
                                    </div>
                                </t>
                                <t t-elif="groupby == 'milestone_id'">
                                    <span t-if="tasks[0].sudo().milestone_id and tasks[0].sudo().allow_milestones"
                                        class="text-truncate"
                                        t-field="tasks[0].sudo().milestone_id.name"/>
                                    <span t-else="">No Milestone</span>
                                </t>
                                <t t-if="groupby == 'stage_id'">
                                    <!-- This div is necessary for documents_project_sale -->
                                    <div name="stage_name" class="d-flex w-100 align-items-center">
                                        <span class="text-truncate" t-field="tasks[0].sudo().stage_id.name"/>
                                    </div>
                                </t>
                                <t t-if="groupby == 'priority'">
                                    <span class="text-truncate" t-field="tasks[0].sudo().priority"/>
                                </t>
                                <t t-if="groupby == 'state'">
                                    <span class="text-truncate" t-field="tasks[0].sudo().state"/>
                                </t>
                                <t t-if="groupby == 'partner_id'">
                                    <span t-if="tasks[0].sudo().partner_id"
                                        class="text-truncate"
                                        t-field="tasks[0].sudo().partner_id.name"/>
                                    <span t-else="">No Customer</span>
                                </t>
                            </th>
                            <th name="state_col" t-if="groupby != 'state'"/>
                            <th name="stage_id_col" t-if="groupby != 'stage_id'"/>
                        </tr>
                    </tbody>
                    <tbody t-if="tasks">
                        <t t-foreach="tasks" t-as="task">
                            <tr>
                                <td class="text-start">
                                    #<span t-esc="task.id"/>
                                </td>
                                <td t-if="groupby != 'priority'" class="text-end">
                                    <t t-call="project.portal_my_tasks_priority_widget_template"/>
                                </td>
                                <td>
                                    <a t-attf-href="/my/#{task_url}/#{task.id}?{{ keep_query() }}"><span t-att-title="task.name" t-field="task.name"/></a>
                                </td>
                                <td>
                                    <t t-set="assignees" t-value="task.sudo().user_ids"/>
                                    <div t-if="assignees" class="flex-nowrap ps-3">
                                        <img class="o_avatar rounded" t-attf-src="#{image_data_uri(assignees[:1].avatar_128)}" alt="User"/>
                                        <span class="align-middle" t-att-title="'\n'.join(assignees.mapped('name'))">
                                            <span t-field="assignees[:1].name"/><span t-if="len(assignees) &gt; 1" class="badge ms-1 rounded-pill bg-light"> +<span t-out="len(assignees) - 1"/></span>
                                        </span>
                                    </div>
                                </td>
                                <td t-if="groupby != 'project_id' and multiple_projects">
                                    <span title="Current project of the task" t-out="task.project_id.name" />
                                </td>
                                <td t-if="groupby != 'milestone_id' and allow_milestone" name="project_portal_milestones">
                                    <t t-if="task.milestone_id and task.allow_milestones">
                                        <span t-esc="task.milestone_id.name" />
                                    </t>
                                </td>
                                <td t-if="groupby != 'state'" align="right" class="align-middle">
                                    <t t-call="project.portal_my_tasks_state_widget_template">
                                        <t t-set="path" t-value="'tasks'"/>
                                    </t>
                                </td>
                                <td t-if="groupby != 'stage_id'" class="text-end lh-1">
                                    <t t-call="project.portal_my_tasks_badge_widget_template"/>
                                </td>
                            </tr>
                        </t>
                    </tbody>
                </t>
            </t>
        </t>
    </template>

    <template id="portal_my_tasks" name="My Tasks">
        <t t-call="portal.portal_layout">
            <t t-set="breadcrumbs_searchbar" t-value="True"/>

            <t t-call="portal.portal_searchbar">
                <t t-set="title">Tasks</t>
            </t>
            <t t-if="not grouped_tasks">
                <div class="alert alert-warning" role="alert">
                    There are no tasks.
                </div>
            </t>
            <t t-call="project.portal_tasks_list"/>
        </t>
    </template>

    <template id="task_link_preview_front_end" inherit_id="portal.frontend_layout" primary="True">
        <xpath expr="//t[@t-if='not_uses_default_logo'][1]" position="before">
            <t t-if="preview_object.displayed_image_id">
                <meta property="og:image" t-attf-content="/web/image/{{ preview_object.displayed_image_id.id }}/300x200?access_token={{ preview_object.displayed_image_id.generate_access_token()[0] }}"/>
            </t>
        </xpath>
        <xpath expr="//t[@t-if='not_uses_default_logo'][2]" position="before">
            <t t-if="preview_object.displayed_image_id">
                <meta property="twitter:image" t-attf-content="/web/image/{{ preview_object.displayed_image_id.id }}/300x200?access_token={{ preview_object.displayed_image_id.generate_access_token()[0] }}"/>
            </t>
        </xpath>
    </template>

    <template id="task_link_preview_portal_layout" inherit_id="portal.portal_layout" primary="True">
        <xpath expr="//t[@t-call='portal.frontend_layout']" position="attributes">
            <attribute name="t-call">project.task_link_preview_front_end</attribute>
        </xpath>
    </template>

    <template id="portal_my_task" name="My Task" inherit_id="portal.portal_sidebar" primary="True">
        <xpath expr="//t[@t-call='portal.portal_layout']" position="attributes">
            <attribute name="t-call">project.task_link_preview_portal_layout</attribute>
        </xpath>
        <xpath expr="//t[@t-call='project.task_link_preview_portal_layout']" position="before">
            <t t-set="o_portal_fullwidth_alert" groups="project.group_project_user">
                <t t-call="portal.portal_back_in_edit_mode">
                    <t t-set="backend_url" t-value="'/odoo/action-project.action_view_my_task/%s' % (task.id)"/>
                </t>
            </t>
        </xpath>
        <xpath expr="//div[hasclass('o_portal_sidebar')]" position="inside">
            <t t-set="title" t-value="task.name"/>

            <div class="row o_project_portal_sidebar">
                <t t-call="portal.portal_record_sidebar">
                    <t t-set="classes" t-value="'col-lg-4 col-xxl-3 d-print-none'"/>

                    <t t-set="entries">
                        <div class="d-flex flex-wrap flex-column gap-4">
                            <div id="task-nav" class="d-flex align-items-center flex-grow-1 p-0" t-ignore="true" role="complementary">
                                <ul class="nav flex-column">
                                    <li class="nav-item" id="nav-header">
                                        <a class="nav-link p-0" href="#card_header">
                                            Task
                                        </a>
                                    </li>
                                    <li class="nav-item" id="nav-chat">
                                        <a class="nav-link p-0" href="#task_chat">
                                            History
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <div id="task-links" t-if="task_link_section" class="d-flex align-items-center flex-grow-1 ps-0" t-ignore="true" role="complementary">
                                <ul class="nav flex-column">
                                    <t t-foreach="task_link_section" t-as="task_link">
                                        <li class="nav-item">
                                            <a class="nav-link p-0" t-att-href="task_link['access_url']" t-att-target="task_link.get('target', '_self')">
                                                <t t-out="task_link['title']"/>
                                            </a>
                                        </li>
                                    </t>
                                </ul>
                            </div>

                            <div t-if="task.user_ids or task.partner_id" class="d-flex flex-column gap-4 mt-3">
                                <div t-if="task.user_ids">
                                    <h6 class="flex-basis-100"><small class="text-muted">Assignees</small></h6>
                                    <t t-foreach="task.user_ids" t-as="user">
                                        <t t-call="portal.portal_my_contact">
                                            <t t-set="_spacingClass" t-value="'mb-3' if len(task.user_ids) > 1 else ''"/>
                                            <t t-set="_contactAvatar" t-value="image_data_uri(user.avatar_128)"/>
                                            <t t-set="_contactName" t-value="user.name"/>
                                            <div t-out="user" t-options='{"widget": "contact", "fields": ["email", "phone"]}'/>
                                        </t>
                                    </t>
                                </div>
                                <div class="col-12 d-flex flex-column" t-if="task.partner_id">
                                    <h6><small class="text-muted">Customer</small></h6>
                                    <t t-if="task.partner_id">
                                        <t t-call="portal.portal_my_contact">
                                            <t t-set="_contactAvatar" t-value="image_data_uri(task.partner_id.avatar_512)"/>
                                            <t t-set="_contactName" t-value="task.partner_id.display_name"/>
                                            <div t-field="task.partner_id" t-options='{"widget": "contact", "fields": ["email", "phone"]}'/>
                                        </t>
                                    </t>
                                </div>
                            </div>
                        </div>
                    </t>
                </t>
                <div id="task_content" class="o_portal_content col-12 col-lg-8 col-xxl-9">
                    <div id="card">
                        <div id="card_header" data-anchor="true">
                            <div class="row justify-content-between mb-3">
                                <div class="col-12 col-md-9">
                                    <div class="d-flex gap-2">
                                        <h3 class="my-0">
                                            <span t-field="task.name"/>
                                            <small class="text-muted d-none d-md-inline">(#<span t-field="task.id"/>)</small>
                                        </h3>
                                    </div>
                                </div>
                                <div class="col-auto">
                                    <small class="text-end">Stage:</small>
                                    <t t-call="project.portal_my_tasks_badge_widget_template"/>
                                </div>
                            </div>
                        </div>
                        <div id="card_body">
                            <div class="float-end">
                                <t t-call="project.portal_my_tasks_state_widget_template">
                                    <t t-set="path" t-value="'task'"/>
                                </t>
                            </div>
                            <div class="row mb-4 container">
                                <div class="col-12 col-md-6 flex-grow-1">
                                    <div t-if="project_accessible"><strong>Project:</strong> <a t-attf-href="/my/projects/#{task.project_id.id}" t-field="task.project_id"/></div>
                                    <div t-else=""><strong>Project:</strong> <a t-field="task.project_id"/></div>
                                    <div t-if="task.milestone_id and task.allow_milestones"><strong>Milestone:</strong> <span t-field="task.milestone_id"/></div>
                                    <div>
                                        <strong>Priority:</strong>
                                        <t t-call="project.portal_my_tasks_priority_widget_template"/>
                                    </div>
                                    <div t-if="task.date_deadline"><strong>Deadline:</strong> <span t-field="task.date_deadline" t-options='{"widget": "datetime"}'/></div>
                                    <div name="portal_my_task_allocated_hours">
                                        <strong t-if="task.allocated_hours > 0">Allocated Time:</strong>
                                        <t t-call="project.portal_my_task_allocated_hours_template"/>
                                    </div>
                                </div>
                                <div class="col-12 col-md-6 d-empty-none" name="portal_my_task_second_column"></div>
                            </div>

                            <div class="row" t-if="task.description or task.attachment_ids">
                                <div t-if="not is_html_empty(task.description)" class="mb-4 mb-md-0">
                                    <h5 class="mb-1">Description</h5>
                                    <hr class="mt-1 mb-2"/>
                                    <div class="py-1 px-2 bg-100 small overflow-auto table-responsive mb-4" t-field="task.description"/>
                                </div>
                                <div t-if="task.attachment_ids" class="o_project_portal_attachments">
                                    <h5 class="mb-1">Attachments</h5>
                                    <hr class="mt-1 mb-2"/>
                                    <div class="row">
                                        <t t-foreach="task.attachment_ids" t-as="attachment">
                                            <div class="col-md-6">
                                                <ul class="list-unstyled">
                                                    <li class="oe_attachments">
                                                        <a t-attf-href="/web/content/#{attachment.id}?download=true&amp;access_token=#{attachment.access_token}"
                                                        target="_blank" data-no-post-process="" class="d-flex align-items-center rounded bg-light p-2">
                                                            <div class='oe_attachment_embedded o_image o_image_small me-2 me-lg-3'
                                                                t-att-title="attachment.name" t-att-data-mimetype="attachment.mimetype"
                                                                t-attf-data-src="/web/image/#{attachment.id}/50x40?access_token=#{attachment.access_token}">
                                                            </div>
                                                            <div class='oe_attachment_name text-truncate'><t t-esc='attachment.name'/></div>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </t>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <hr/>
                    <div id="task_chat" data-anchor="true">
                        <h3>Communication history</h3>
                        <t t-call="portal.message_thread">
                            <t t-set="token" t-value="task.access_token"/>
                        </t>
                    </div>
                </div>
            </div>
        </xpath>
    </template>

    <template id="portal_my_task_allocated_hours_template">
        <strong t-if="task.allocated_hours > 0" class="d-none">Allocated Time:</strong>
        <span t-out="task.allocated_hours" t-options='{"widget": "float_time"}'/>
    </template>
</odoo>
