{strip}

{$_title = '[`Deals`]'}

<div class="c-deals-page shadowed" id="c-funnel-page">
    {* HEADER *}
    <header class="c-deals-header">
        <div class="c-layout">
            <div class="c-column left">

                <ul class="c-nav-wrapper menu-h dropdown">
                    <li class="c-add-wrapper">
                        <a class="bold c-add-link" href="{$wa_app_url}deal/new/"><i class="icon16 add"></i>[`New deal`]</a>
                    </li>

                    {* TYPE FILTER *}
                    <li class="c-filter-wrapper">
                        <a class="inline-link" href="javascript:void(0);">
                            {if !empty($funnel.color)}
                                <i class="icon16 funnel-state svg-icon" data-color="{$funnel.color}"></i>
                            {/if}
                            <b><i>{$funnel.name|escape}</i></b>&nbsp;<i class="icon10 darr"></i>
                        </a>
                        <ul class="menu-v with-icons">
                            {foreach $funnels as $_funnel}
                                <li class="{if $funnel.id == $_funnel.id}selected{/if}">
                                    {if isset($_funnel.deal_count)}
                                        <span class="count">{$_funnel.deal_count}</span>
                                    {/if}
                                    <a href="?funnel={$_funnel.id}">
                                        {if !empty($_funnel.color)}
                                            <i class="icon16 funnel-state svg-icon" data-color="{$_funnel.color}"></i>
                                        {/if}
                                        {$_funnel.name|escape}
                                    </a>
                                </li>
                            {/foreach}
                        </ul>
                    </li>

                    {* STAGES *}
                    <li class="c-filter-wrapper {if $funnel.id == 'all'}is-locked{/if}">
                        <a class="inline-link" href="javascript:void(0);">
                            {if !empty($stage.color)}
                                <i class="icon16 funnel-state svg-icon" data-color="{$stage.color}"></i>
                            {/if}
                            <b><i>{$stage.name|escape}</i></b>&nbsp;<i class="icon10 darr"></i>
                        </a>
                        <ul class="menu-v with-icons">
                            {foreach $filter_stages as $_stage}
                                <li class="t-menu-item {if $stage.id == $_stage.id}selected{/if}">
                                    {if isset($_stage.deal_count)}
                                        <span class="count">{$_stage.deal_count}</span>
                                    {/if}
                                    <a href="{crmHelper::getUrl("stage", $_stage.id)}">
                                        {if !empty($_stage.color)}
                                            <i class="icon16 funnel-state svg-icon" data-color="{$_stage.color}"></i>
                                        {/if}
                                        {$_stage.name|escape}
                                    </a>
                                </li>
                            {/foreach}
                        </ul>
                    </li>

                    {* USERS *}
                    <li class="c-filter-wrapper">
                        <a class="inline-link" href="javascript:void(0);">
                            {if !empty($selected_filter_contact.photo_url_16)}
                                <i class="icon16 userpic20" style="background-image: url({$selected_filter_contact.photo_url_16})"></i>
                            {/if}
                            <b><i>{$wa->crm->contactName($selected_filter_contact.name)}</i></b>&nbsp;<i class="icon10 darr"></i>
                        </a>
                        <ul class="menu-v with-icons">
                            {foreach $filter_contacts as $_contact}
                                <li class="t-menu-item {if $selected_filter_contact.id === $_contact.id}selected{/if}">
                                    <a href="{crmHelper::getUrl("user", $_contact.id)}">
                                        {if !empty($_contact.photo_url_16)}
                                            <i class="icon16 userpic20" style="background-image: url({$_contact.photo_url_16})"></i>
                                        {/if}
                                        {$wa->crm->contactName($_contact.name)}
                                    </a>
                                </li>
                            {/foreach}
                        </ul>
                    </li>

                    {* REMINDERS *}
                    <li class="c-filter-wrapper c-reminders-filter" id="js-reminders-filter">
                        <a class="inline-link" href="javascript:void(0);">
                            {if !empty($selected_filter_reminders)}
                                {foreach $selected_filter_reminders as $_filter}
                                    <i class="{$_filter.icon_class}" title="{$_filter.name}"></i>
                                {/foreach}
                            {else}
                                <b><i>[`Filter`]</i></b>
                            {/if}
                            &nbsp;<i class="icon10 darr"></i>
                        </a>
                        <ul class="menu-v with-icons js-hidden-list">
                            {foreach $filter_reminders as $_filter}
                                <li class="c-item {if !empty($filter_reminders[$_filter.id])}selected{/if}" data-id="{$_filter.id|escape}">
                                    <label>
                                        <div class="c-layout fixed">
                                            <div class="c-column middle" style="width: 40px; text-align: center;">
                                                <input class="js-checkbox" type="checkbox" {if !empty($selected_filter_reminders[$_filter.id])}checked{/if}>
                                                <i class="{$_filter.icon_class}" title="{$_filter.name}"></i>
                                            </div>
                                            <div class="c-column middle">
                                                {$_filter.name|escape}
                                            </div>
                                        </div>
                                    </label>
                                </li>
                            {/foreach}

                            {if !empty($selected_filter_reminders) && count($selected_filter_reminders) !== count($filter_reminders)}
                                <li class="c-item js-show-all">
                                    <a href="javascript:void(0);">[`Show all`]</a>
                                </li>
                            {/if}

                            <li class="c-item js-buttons" style="display: none;">
                                <div class="c-layout">
                                    <div class="c-column middle">
                                        <input class="js-submit" type="button" value="[`Apply`]">
                                    </div>
                                    <div class="c-column middle right">
                                        <a class="inline-link js-revert hint" href="javascript:void(0);"><b><i>[`Cancel`]</i></b></a>
                                    </div>
                                </div>
                            </li>
                        </ul>

                        <script>
                            ( function($) {
                                new CRMDealRemindersFilter({
                                    $wrapper: $("#js-reminders-filter"),
                                    filters: {$filter_reminders|json_encode},
                                    selected_filters: {$selected_filter_reminders|json_encode},
                                    redirect_uri: "{crmHelper::getUrl("reminder", "none")}"
                                });
                            })(jQuery);
                        </script>
                    </li>

                    {* TAGS *}
                    <li class="c-filter-wrapper c-tags-filter {if empty($tag_cloud)}is-locked{/if}">
                        <a class="inline-link" href="javascript:void(0);">
                            <i class="icon16 tags"></i>
                            <b><i>{if !empty($active_deal_tag)}{$active_deal_tag.name|escape}{else}[`Tag`]{/if}</i></b>
                            {if !empty($tag_cloud)}&nbsp;<i class="icon10 darr"></i>{/if}
                        </a>
                        {if !empty($tag_cloud)}
                            <ul class="menu-v with-icons" style="width: 250px;">
                                {if !empty($active_deal_tag)}
                                    <li>
                                        <a href="{crmHelper::getUrl('tag', 'all')}">[`Show all`]</a>
                                    </li>
                                {/if}

                                <li class="c-tags-wrapper">
                                    {foreach $tag_cloud as $_tag}
                                        <a class="{if !empty($active_deal_tag) && $active_deal_tag.id === $_tag.id}selected{/if}" href="{crmHelper::getUrl("tag", {$_tag.id})}" style="font-size: {$_tag.size}%; opacity: {$_tag.opacity};">
                                            {$_tag.name|escape}
                                        </a>
                                    {/foreach}
                                </li>
                            </ul>
                        {/if}
                    </li>

                    {* FIELDS *}
                    {foreach $fields as $_field}
                        <li class="c-filter-wrapper c-fields-filter {if empty($fields)}is-locked{/if}">
                            <a class="inline-link" href="javascript:void(0);">
                                <b>
                                    <i>
                                        {if !empty($active_fields[$_field.id])}
                                            {$active_fields[$_field.id]|escape}
                                        {else}
                                            {$_field.name|escape}
                                        {/if}
                                    </i>
                                </b>
                                {if !empty($_field)}&nbsp;<i class="icon10 darr"></i>{/if}
                            </a>
                            {if !empty($_field)}
                                <ul class="menu-v with-icons" style="width: 250px;">
                                    {if !empty($active_fields[$_field.id])}
                                        <li class="t-menu-item">
                                            <a href="{crmHelper::getUrl({'field-'|cat:$_field.id}, 'all')}">[`Show all`]</a>
                                        </li>
                                    {/if}
                                    {foreach $_field.options as $field_key => $field_option}
                                        <li class="t-menu-item {if !empty($active_fields[$_field.id]) && $active_fields[$_field.id] == $field_option}selected{/if}">
                                            <a href="{crmHelper::getUrl({'field-'|cat:$_field.id}, {$field_key})}">{$field_option}</a>
                                        </li>
                                    {/foreach}
                                </ul>
                            {/if}
                        </li>
                    {/foreach}

                </ul>

            </div>
            <div class="c-column right">

                <ul class="c-view-toggle menu-h">
                    <li class="">
                        <a href="{crmHelper::getUrl("view", "thumbs")}" title="[`Kanban board`]"><i class="icon16 view-thumbs"></i></a>
                    </li>
                    <li class="selected">
                        <a href="{crmHelper::getUrl("view", "list")}" title="[`List view`]"><i class="icon16 view-table"></i></a>
                    </li>
                </ul>

            </div>
        </div>
    </header>

    {* CONTENT *}
    <main class="c-deals-board">
        {if count($funnels) > 1}

            <div class="c-deals-table-wrapper js-deals-table-wrapper">

                {* BODY *}

                {if $deals}

                    <table class="c-table zebra single-lined" id="c-table-body">
                        <tbody>
                            {foreach $deals as $_deal}
                                {$_stage = ifset($stages[$_deal.stage_id])}
                                {$_now = date('Y-m-d H:i:s')}

                                {$_is_open = false}
                                {if $_deal.status_id == "OPEN"}
                                    {$_is_open = true}
                                {/if}

                                <tr class="c-deal-wrapper js-deal-wrapper {if $_deal.reminder_datetime && $_deal.reminder_datetime < $_now}overdue{/if}"
                                        data-id="{$_deal.id}"
                                        data-open="{if $_is_open}open{/if}"
                                        data-can-delete="{if $_deal.can_delete}1{else}0{/if}">
                                    <td class="c-column-checkbox">
                                        <input type="checkbox" class="js-check-deal">
                                    </td>
                                    <td class="c-column-2">
                                        <div>
                                            {if $_deal.status_id == "WON"}
                                                <span class="c-state-wrapper is-won">
                                                    <span class="c-state">
                                                        <span class="c-status">[`WON`]</span> {if !empty($_deal.closed_datetime)}<span class="hint">{$_deal.closed_datetime|wa_datetime}</span>{/if}
                                                    </span>
                                                </span>
                                            {elseif $_deal.status_id == "LOST"}
                                                <span class="c-state-wrapper is-lost">
                                                    <span class="c-state">
                                                        <span class="c-status">[`LOST`]</span>  {if !empty($_deal.closed_datetime)}<span class="hint">{$_deal.closed_datetime|wa_datetime}</span>{/if}
                                                    </span>
                                                </span>
                                            {else}
                                                <span class="c-state-wrapper" {if !empty($_stage.color)}style="background-color: {$_stage.color};"{/if}>
                                                    <span class="c-state">{$_stage.name|escape}</span>
                                                </span>
                                            {/if}

                                            <i class="shortener"></i>
                                            <a class="c-full-line-link" href="{$wa_app_url}deal/{$_deal.id}/"></a>
                                        </div>
                                    </td>
                                    <td class="c-column-date">
                                        <div>
                                            {waDateTime::format('shortdate', strtotime($_deal.create_datetime))}

                                            <i class="shortener"></i>
                                            <a class="c-full-line-link" href="{$wa_app_url}deal/{$_deal.id}/"></a>
                                        </div>
                                    </td>
                                    <td class="c-column-exclamation">
                                        {if !empty($_deal.source)}
                                            {if ($_deal.source.type) == 'FORM'}
                                                {assign var="field_type" value="text"}
                                            {elseif ($_deal.source.type) == 'EMAIL'}
                                                {assign var="field_type" value="email"}
                                            {elseif ($_deal.source.type) == 'SHOP'}
                                                {assign var="field_type" value=""}
                                            {/if}
                                            {if ($_deal.source.type) == 'IM'}
                                                <i class="icon16" style="background-image: url('{$_deal.source.icon}'); background-size: contain;" title="{$_deal.source.name}"></i>
                                            {else if !empty($field_type)}
                                                <i class="icon16 {$field_type}" title="{$_deal.source.name}"></i>
                                            {/if}
                                        {/if}
                                        {if $_deal.status_id == 'OPEN'}
                                            {if empty($_deal.reminder_datetime)}
                                                <i class="icon16 exclamation" title="[`No reminders assigned`]"></i>
                                            {else}
                                                <i class="c-reminder-marker {$_deal.reminder_state|default:""}" title="{$_deal.reminder_title|default:""}"></i>
                                            {/if}
                                            {if $_deal.message_unread}
                                                <span class="c-message-icon" title="[`Unread messages`]"><i class="icon16 email"></i></span>
                                            {/if}
                                        {/if}
                                    </td>
                                    <td class="c-column-3">
                                        <div>
                                            <a class="c-deal-link js-deal-link" href="{$wa_app_url}deal/{$_deal.id}/">
                                                {if !empty($_deal.contact.photo_url_32)}
                                                    <i class="icon16 userpic20" style="background-image: url({$_deal.contact.photo_url_32})" title="{$wa->crm->contactName($_deal.contact.name)}"></i>
                                                {/if}
                                                <span class="c-name">{strip_tags($_deal.name)|escape}</span>
                                            </a>

                                            {$_shop_order = $deals[$_deal.id].shop_order|default:[]}
                                            {if $_shop_order}
                                                {if $_shop_order.id > 0}
                                                    <i class="icon16 userpic20" style="background-image: url('{$wa_url}wa-apps/shop/img/shop.png');"></i>
                                                    {if $_shop_order.paid_date}
                                                        <span class="c-paid-order-stamp" title="{sprintf('[`Order was paid on %s`]', $_shop_order.paid_date|wa_date:'humandate')}"><span class="c-inner-stamp"></span><span class="c-text">[`Paid`]</span></span>
                                                    {/if}
                                                {/if}
                                            {/if}


                                            <i class="shortener"></i>
                                            <a class="c-full-line-link" href="{$wa_app_url}deal/{$_deal.id}/"></a>
                                        </div>
                                    </td>
                                    <td class="c-column-tags">
                                        <div>
                                            {if !empty($deal_tags[$_deal.id])}
                                                {$_tags = $deal_tags[$_deal.id]}
                                                <ul class="c-tags-list">
                                                    {foreach $_tags as $_t}
                                                        <li>
                                                            <a class="c-tag" href="{$wa_app_url}deal/?tag={$_t.id}">{$_t.name|escape}</a>
                                                        </li>
                                                    {/foreach}
                                                </ul>
                                            {/if}

                                            <i class="shortener"></i>
                                            <a class="c-full-line-link" href="{$wa_app_url}deal/{$_deal.id}/"></a>
                                        </div>
                                    </td>
                                    <td class="c-column-4">
                                        <div>
                                            {if $_deal.amount && $_deal.amount != 0}
                                                <span class="c-price">
                                                    {$_deal.original_amount|wa_format_amount_currency:$_deal.original_currency_id}
                                                </span>
                                            {/if}

                                            <i class="shortener"></i>
                                            <a class="c-full-line-link" href="{$wa_app_url}deal/{$_deal.id}/"></a>
                                        </div>
                                    </td>
                                    <td class="c-column-5">
                                        <div>
                                            {if !empty($_deal.user) && $_deal.user.id}
                                                {if !empty($_deal.user.photo_url_16)}
                                                    <i class="icon16 userpic20" style="background-image: url({$_deal.user.photo_url_16})"></i>
                                                {/if}
                                                <span class="c-name">{$wa->crm->contactName($_deal.user.name)}</span>
                                            {/if}

                                            <i class="shortener"></i>
                                            <a class="c-full-line-link" href="{$wa_app_url}deal/{$_deal.id}/"></a>
                                        </div>
                                    </td>
                                </tr>
                            {/foreach}
                        </tbody>
                    </table>

                    {* FIXED TABLE HEADER *}
                    <div class="c-table-header-wrapper js-table-header-wrapper">
                        {* HEADER *}
                        <table class="c-table js-table-header zebra single-lined">
                            <thead>
                                <tr class="c-list-header white">
                                    <td class="c-column-checkbox">
                                        <input class="c-checkbox-all js-checkbox-all" type="checkbox" name="">
                                    </td>
                                    <td class="c-column-2">

                                        <a title="[`sort by column`]" href="{if !empty($sort) && $sort == "stage_id"}{crmHelper::getUrl("asc", !$asc)}{else}{crmHelper::getUrl("sort", "stage_id")}{/if}">
                                            [`Stage`]
                                            {if !empty($sort) && $sort == "stage_id"}
                                                <i class="icon10 {if !empty($asc)}uarr{else}darr{/if}"></i>
                                            {/if}
                                        </a>

                                    </td>
                                    <td class="c-column-date">

                                        <a title="[`sort by column`]" href="{if !empty($sort) && $sort == "create_datetime"}{crmHelper::getUrl("asc", !$asc)}{else}{crmHelper::getUrl("sort", "create_datetime")}{/if}">
                                            [`Date created`]
                                            {if !empty($sort) && $sort == "create_datetime"}
                                                <i class="icon10 {if !empty($asc)}uarr{else}darr{/if}"></i>
                                            {/if}
                                        </a>

                                    </td>
                                    <td class="c-column-exclamation"></td>
                                    <td class="c-column-3">

                                        <a title="[`sort by column`]" href="{if !empty($sort) && $sort == "name"}{crmHelper::getUrl("asc", !$asc)}{else}{crmHelper::getUrl("sort", "name")}{/if}">
                                            [`Deal`]
                                            {if !empty($sort) && $sort == "name"}
                                                <i class="icon10 {if !empty($asc)}uarr{else}darr{/if}"></i>
                                            {/if}
                                        </a>

                                    </td>
                                    <td class="c-column-tags">
                                        [`Tags`]
                                    </td>
                                    <td class="c-column-4">

                                        <a title="[`sort by column`]" href="{if !empty($sort) && $sort == "amount"}{crmHelper::getUrl("asc", !$asc)}{else}{crmHelper::getUrl("sort", "amount")}{/if}">
                                            [`Price`]
                                            {if !empty($sort) && $sort == "amount"}
                                                <i class="icon10 {if !empty($asc)}uarr{else}darr{/if}"></i>
                                            {/if}
                                        </a>

                                    </td>
                                    <td class="c-column-5">

                                        <a title="[`sort by column`]" href="{if !empty($sort) && $sort == "user_name"}{crmHelper::getUrl("asc", !$asc)}{else}{crmHelper::getUrl("sort", "user_name")}{/if}">
                                            [`Owner`]
                                            {if !empty($sort) && $sort == "user_name"}
                                                <i class="icon10 {if !empty($asc)}uarr{else}darr{/if}"></i>
                                            {/if}
                                        </a>

                                    </td>
                                </tr>
                            </thead>
                        </table>

                        {* ACTIONS *}
                        <div class="c-deals-actions-wrapper js-table-actions">
                            <div class="c-layout">
                                <div class="c-column c-column-checkbox">
                                    <input class="c-checkbox-all js-checkbox-all" type="checkbox" name="">
                                </div>
                                <div class="c-column">
                                    <ul class="c-deals-actions-list menu-h">
                                        <li class="c-operation-li">
                                            <a href="javascript:void(0);" class="c-operation-link js-deals-export"><i class="icon16 export"></i> [`Export`] (<span class="c-count js-count"></span>)</a>
                                        </li>
                                        <li class="c-operation-li">
                                            <a href="javascript:void(0);" class="c-operation-link js-deals-merge"><i class="icon16 merge"></i> [`Merge`] (<span class="c-count js-count"></span>)</a>
                                        </li>
                                        <li class="c-operation-li">
                                            <a href="javascript:void(0);" class="c-operation-link js-deals-change-responsible"><i class="icon16 user"></i> [`Change the owner`] (<span class="c-count js-count"></span>)</a>
                                        </li>
                                        <li class="c-operation-li">
                                            <a href="javascript:void(0);" class="c-operation-link js-deals-change-funnel"><i class="icon16 funnel"></i> [`Change funnel / stage`] (<span class="c-count js-count"></span>)</a>
                                        </li>
                                        <li class="c-operation-li">
                                            <a href="javascript:void(0);" class="c-operation-link js-deals-set-tags"><i class="icon16 tags"></i> [`Tags`] (<span class="c-count js-count"></span>)</a>
                                        </li>
                                        <li class="c-operation-li">
                                            <a href="javascript:void(0);" class="c-operation-link js-deals-close"><i class="icon16 yes-bw"></i> [`Close`] (<span class="c-count js-open-count"></span>)</a>
                                        </li>

                                        <li class="c-operation-li">
                                            <a href="javascript:void(0);" class="c-operation-link js-deals-delete"><i class="icon16 delete"></i> [`Delete`] (<span class="c-count js-count"></span>)</a>
                                        </li>

                                    </ul>
                                </div>
                            </div>
                        </div>

                    {else}

                        <div class="c-contacts-page">
                            <p class="c-description c-no-contacts">
                                [`No deals found for given conditions`]
                            </p>
                        </div>

                    {/if}

                </div>
            </div>


            {if empty($lazyloading_disable) && !empty($deals)}
                <div class="c-loading-wrapper block double-padded js-lazyload" data-offset="{$offset}" style="text-align: center">
                    <i class="icon16 loading"></i> <span style="color:#aaa;">[`Loading`]...</span>
                </div>
            {/if}

        {else}
            <div class="block double-padded">
                <h1 class="c-page-header">[`Welcome to your new funnel!`]</h1>
                <p><a href="{$wa_app_url}deal/new/">[`Start by creating your first deal`]</a></p>
            </div>
        {/if}
    </main>

    <script>
        ( function($) {
            $.crm.title.set({$_title|json_encode});
            $.crm.renderSVG("#c-funnel-page");

            new CRMDealsList({
                $wrapper: $("#c-funnel-page"),
                funnel_id: {if !empty($funnel)}{$funnel.id|json_encode}{else}false{/if},
                stage_id: {if !empty($stage.id)}{$stage.id|json_encode}{else}false{/if},
                contact_id: {if !empty($selected_filter_contact.id)}{$selected_filter_contact.id|json_encode}{else}false{/if},
                limit: {$limit},
                locales: {
                    "delete_confirm_title": "[`Delete %s deals`]",
                    "delete_confirm_text": "<p>[`Contacts of deal participants will not be deleted.`]<br>[`Deal deletion cannot be undone.`]</p>",
                    "delete_confirm_button": "[`Delete`]"
                }
            });
        })(jQuery);
    </script>
</div>

{/strip}