{function stock_editor_form stock=null substocks=null}
    <div class="fields form">
        {strip}
        {if !empty($stock.id)}
        {if $substocks !== null}
            {$input_var = 'vedit'}
        {else}
            {$input_var = 'edit'}
        {/if}
        {$disabled = ' disabled="disabled"'}
        <input type="hidden" name="{$input_var}[id][]" value="{$stock.id}"{$disabled}>
        {else}
        {if $substocks !== null}
            {$input_var = 'vadd'}
        {else}
            {$input_var = 'add'}
        {/if}
        {$disabled = ''}
        {/if}
        {/strip}
        <div class="field custom-mt-0">
            <div class="name">[`Name`]</div>

            <div class="value">
                <input type="text" data-name="name" name="{$input_var}[name][]" class="small bold long" value="{ifset($stock.name, "[`New stock`]")|escape}" {$disabled}>

                <span class="state-error" style="display: none;"></span>

                {if $substocks === null && empty($stock.id) && count($stocks) < 1}
                <div class="custom-mt-12 small">
                    <label class="s-inventory-stock">
                        <span class="wa-checkbox">
                            <input type="checkbox" name="{$input_var}[inventory][]" checked="checked" value="1">
                            <span>
                                <span class="icon">
                                    <i class="fas fa-check"></i>
                                </span>
                            </span>
                        </span>
                        [`Assign all inventory to this stock`]
                    </label>
                </div>
                {/if}

                <div class="custom-mt-8 small">
                    <label>
                    <span class="wa-checkbox">
                        <input type="checkbox" name="{$input_var}[public][]" value="{if !empty($stock.id)}{$stock.id}{else}1{/if}" class="is-public-checkbox"{if empty($stock.id) || !empty($stock.public)} checked{/if}{$disabled}>
                        <span>
                            <span class="icon">
                                <i class="fas fa-check"></i>
                            </span>
                        </span>
                    </span>
                        [`Visible to customers`]
                    </label>
                </div>

                <div class="custom-mt-12 storefonts-checklist {if empty($stock.public)} hidden{/if}">
                    <em class="hidden gray">(coming soon: limit visibility by storefront)</em>
                </div>
            </div>
        </div>

        <div class="field custom-mt-8">
            <div class="name">[`Indicator`]</div>

            <div class="value">
                <i class="fas fa-home text-yellow"></i>
                ≤ <input class="small shortest" data-name="low_count" type="text" name="{$input_var}[low_count][]" value="{ifset($stock.low_count, shopStockModel::LOW_DEFAULT)}"{$disabled}>
                <span class="hint">[`Low`]</span>
                <span class="state-error" style="display:none"></span>
            </div>
            <div class="value">
                <i class="fas fa-home text-red"></i>
                ≤ <input class="small shortest" data-name="critical_count" type="text" name="{$input_var}[critical_count][]" value="{ifset($stock.critical_count, shopStockModel::CRITICAL_DEFAULT)}"{$disabled}>
                <span class="hint">[`Critical`]</span>
                <span class="state-error" style="display:none"></span>
            </div>
        </div>

        {if $substocks !== null}
            <div class="field">
                <div class="name">[`Stocks and priority`]</div>

                <div class="value">
                    <div class="sortable substocks-wrapper">
                        {foreach array_keys(array_flip($substocks) + $stocks) as $sid}
                        {if !empty($stocks[$sid]) && empty($stocks[$sid].substocks)}
                        {$s = $stocks[$sid]}
                        <div class="substock-checkbox-wrapper">
                            <i class="fas fa-grip-vertical text-light-gray cursor-pointer substocks-handle"></i>

                            <label>
                                <span class="wa-checkbox">
                                    <input type="checkbox" data-stock-id="{$s.id}"{if in_array($s.id, $substocks)} checked{/if}>
                                    <span>
                                        <span class="icon">
                                            <i class="fas fa-check"></i>
                                        </span>
                                    </span>
                                </span>
                                {$s.name|escape}
                            </label>
                        </div>
                        {/if}
                        {/foreach}
                    </div>

                    <div class="state-error" style="display: none;">
                        [`Virtual stock must include at least one real stock.`]
                    </div>

                    <div class="hint">{sprintf('[`Virtual stock is a group of real stocks. The order of real stocks defines the priority for product stock update when order is placed. This is handy for grouping real stocks and points of sale which are located within the same geographical region, and defining rules for automated product stock updates. <a href="%s" target="_blank">Help</a> <i class="icon10 new-window"></i>`]', '[`https://www.shop-script.com/help/12062/stocks/`]')}</div>
                </div>
                <input type="hidden" name="{$input_var}[substocks][]" value="{join(',', $substocks)}" class="substocks"{$disabled}>
            </div>
        {/if}
    </div>
{/function}

<script src="{$wa_app_static_url}js/settings/stocks.js?{$wa->version()}"></script>
<div class="s-settings-form">
    <h1>[`Stocks`]</h1>

    <form method="post" action="?module=settings&action=saveStock" id="s-settings-stocks-form">
        <div class="fields form">
            <div class="fields-group">
                <p class="small">[`Inventory tracking is performed by stocks (warehouses) listed below. Yellow and red indicators are used to visually display low and critical stock levels in both backend and storefront.`]</p>
                <input type="hidden" name="stocks_order" value="">

                <a href="#/stock/add/" class="button small rounded light-gray" id="s-settings-add-stock">
                    <i class="fas fa-plus-circle text-green"></i>
                    [`Add stock`]
                </a>

                {if $stocks}
                <a href="#/stock/add/" class="button small rounded light-gray" id="s-settings-add-virtualstock">
                    <i class="fas fa-plus-circle text-green"></i>
                    [`Add virtual stock`]
                </a>
                {/if}

                <table id="s-settings-stocks">
                    <tbody>
                        {foreach $stocks as $stock}
                        <tr data-{if isset($stock.substocks)}virtualstock-{/if}id="{$stock.id}" class="s-stock">
                            <td class="min-width valign-top s-stock-sort-handle">
                                <i class="fas fa-grip-vertical text-light-gray cursor-pointer stock-rows-handle"></i>
                            </td>

                            <td class="hide-when-editable">
                                <span class="value{if !$stock.public} gray{/if}{if isset($stock.substocks)} italic{/if}">
                                    {$stock.name|escape}

                                    {if !$stock.public}
                                    <i class="fas fa-ban" title="[`Not visible to customers`]"></i>
                                    {/if}
                                </span>
                            </td>

                            <td class="hide-when-editable">
                                <i class="fas fa-home text-yellow"></i>
                                ≤ {$stock.low_count}
                            </td>

                            <td class="hide-when-editable">
                                <i class="fas fa-home text-red"></i>
                                ≤ {$stock.critical_count}
                            </td>

                            <td class="hide-when-editable">
                                <a href="#/stock/edit/{$stock.id}/" title="[`Edit`]" class="nowrap s-edit-stock small">
                                    <i class="fas fa-edit"></i>
                                    [`Edit`]
                                </a>
                            </td>

                            <td class="hidden show-when-editable" colspan="4">
                                {stock_editor_form stock=$stock substocks=ifset($stock.substocks)}
                            </td>

                            <td class="min-width valign-top">
                                <a href="javascript:void(0);" class="s-delete-stock text-red" title="[`Delete`]"><i class="fas fa-trash-alt small"></i></a>
                            </td>
                        </tr>
                        {/foreach}

                        <!-- new stocks to appear here when "Add stock" is clicked -->
                        {capture "new_stock"}{strip}
                        <tr data-id="" class="new-stock">
                            <td class="min-width valign-top s-stock-sort-handle">
                                <i class="fas fa-grip-vertical text-light-gray cursor-pointer stock-rows-handle"></i>
                            </td>
                            <td colspan="4">{stock_editor_form}</td>
                            <td class="min-width valign-top">
                                <a href="javascript:void(0);" title="[`Delete`]" class="s-delete-stock text-red"><i class="fas fa-trash-alt small"></i></a>
                            </td>
                        </tr>
                        {/strip}{/capture}

                        {capture "new_virtualstock"}
                        {strip}
                        <tr data-virtualstock-id="" class="new-stock">
                            <td class="min-width valign-top s-stock-sort-handle">
                                <i class="fas fa-grip-vertical text-light-gray cursor-pointer stock-rows-handle"></i>
                            </td>
                            <td colspan="4">{stock_editor_form substocks=[]}</td>
                            <td class="min-width valign-top">
                                <a href="javascript:void(0);" title="[`Delete`]" class="s-delete-stock text-red"><i class="fas fa-trash-alt small"></i></a>
                            </td>
                        </tr>
                        {/strip}
                        {/capture}
                    </tbody>
                </table>
                <div class="field">
                    <div class="name">
                        [`Update stock`]
                    </div>

                    <div class="value">
                        <div class="wa-select small">
                            <select name="stock_counting_action">
                                <option value="create" {if $stock_counting_action =='create'}selected="selected"{/if}>[`Order was placed`]</option>
                                <option value="processing" {if $stock_counting_action =='processing'}selected="selected"{/if}>[`Order was confirmed and accepted for processing`]</option>
                                <option value="none" {if $stock_counting_action =='none'}selected="selected"{/if}>[`Not updated by order actions`]</option>
                            </select>
                        </div>

                        <div class="hint custom-mt-4">
                            [`Product stock levels will be updated (reduced) when this action is performed to the order.`]<br>
                            [`With option “Not updated by order actions”, products’ stock level is supposed to be updated only during data exchange with accounting software, which is used to manage product stock updates.`]
                        </div>
                    </div>
                </div>

                <div class="field">
                    <div class="name">
                        [`Ordering`]
                    </div>

                    <div class="value">
                        <label>
                            <span class="wa-radio">
                                <input type="radio" name="ignore_stock_count" value="0"{if !$wa->shop->settings('ignore_stock_count')} checked="true"{/if}>
                                <span></span>
                            </span>
                            [`Maximum number of items that can be added to shopping cart is limited by stock level`]

                            <span class="wa-select small custom-mt-4">
                                <select name="limit_main_stock">
                                    <option {if !$wa->shop->settings('limit_main_stock')}selected{/if} value="">[`Limited by the total sum on all stocks`]</option>
                                    <option {if $wa->shop->settings('limit_main_stock')}selected{/if} value="1">[`Limited by the main stock of the particular storefront only`]</option>
                                </select>
                            </span>
                        </label>

                        <div class="custom-mt-12">
                            <label>
                                <span class="wa-radio">
                                    <input type="radio" name="ignore_stock_count" value="1"{if $wa->shop->settings('ignore_stock_count')} checked="true"{/if}>
                                    <span></span>
                                </span>
                                [`Ordering is not limited by stock levels`]
                            </label>

                            <div class="hint custom-mt-4">[`Out-of-stock products can be added to cart and ordered`]</div>
                        </div>
                    </div>
                </div>
                <button type="submit" name="save" data-stock class="button green js-form-submit">
                    [`Save`]
                    <span class="hidden s-msg-after-button"><i class="fas fa-check-circle after-submit"></i></span>
                </button>
            </div>
        </div>
    </form>
</div>

{*
 * Stock rules form
 *}

{*
 * Helper to draw condition editor for rules
 *}
{function rule_condition_editor_form conditions=null}
    {if $conditions}
        {foreach $conditions as $rule}

            {str_replace(['%%RULE_ID%%', '%%RULE_TYPE%%', '%%RULE_DATA%%'], [
                $rule.id,
                $rule.rule_type,
                $rule.rule_data
            ], $smarty.capture.new_condition)}

        {/foreach}
    {/if}

    <div class="wa-select smaller custom-mb-12">
        <select class="add-condition-selector">
            <option value="">[`Add condition...`]</option>
            {foreach $rule_condition_types as $ct}
                <option value="{$ct.id|escape}">{$ct.name|escape}</option>
            {/foreach}
        </select>
    </div>
{/function}

{*
 * HTML for new rule condition (before plugins have chance to alter its form)
 *}

{capture "new_condition"}
    <div class="flexbox custom-pb-12 stock-rule-condition condition-type-%%RULE_TYPE%%" data-rule-id="%%RULE_ID%%" style="flex-direction: row-reverse;">
        <div class="custom-ml-8">
            <a href="#" title="[`Delete`]" class="s-delete-condition text-blue"><i class="fas fa-times-circle text-gray"></i></a>
        </div>

        <input type="hidden" name="rules[%%RULE_ID%%][rule_type]" value="%%RULE_TYPE%%">
        <input type="hidden" name="rules[%%RULE_ID%%][rule_data]" value="%%RULE_DATA%%">
    </div>
{/capture}

{* Helper to draw rulegroup rows *}
{function rulegroup group=null}
    <tr class="s-stock-rule">
        <td class="min-width valign-top">
            <i class="fas fa-grip-vertical text-light-gray cursor-pointer stock-rows-handle"></i>
        </td>
        <td class="valign-top">
            {if $group}
                {rule_condition_editor_form conditions=$group.conditions}
            {else}
                {rule_condition_editor_form}
            {/if}
        </td>
        <td class="valign-top">
            <div class="wa-select small">
                <select class="stock-selector">
                    {if $group && empty($stocks[$group.parent_stock_id])}
                        <option value="{$group.parent_stock_id|escape}" selected>Deleted stock_id={$group.parent_stock_id|escape}</option>
                    {/if}
                    {foreach $stocks as $stock_id => $s}
                        <option value="{$stock_id|escape}"{if $group && $group.parent_stock_id == $stock_id} selected{/if}>{$s.name|escape}</option>
                    {/foreach}
                </select>
            </div>
        </td>
        <td class="min-width valign-top">
            <a href="#" title="[`Delete`]" class="s-delete-rule text-red"><i class="fas fa-trash-alt small"></i></a>
        </td>
    </tr>
{/function}

{$_show_rules = false}
{if !empty($rule_groups) || (!empty($stocks) && $stocks|count > 1)}
    {$_show_rules = true}
{/if}

<div class="custom-my-32 {if !$_show_rules}hidden{/if}">
    <form method="post" action="?module=settings&action=saveStockRules" id="s-settings-stock-rules-form">
        <div class="fields form">
            <div class="fields-group">
                <h5 class="heading">[`Stock linking rules`]</h5>
                <p class="small">[`When order is placed, ordered items will be automatically linked with a stock according to the rules defined below. E.g. different stocks may be preferred depending on selected shipping option or particular customer location. When no matching stock rule were found, ordered items will be linked to the current storefront default stock.`]</p>
                <a href="#/stock/add/" class="button small rounded light-gray" id="s-settings-add-rule">
                    <i class="fas fa-plus-circle text-green"></i>
                    [`Add rule`]
                </a>
                <table id="s-settings-stock-rules-table">
                    <thead>
                        <tr class="white">
                            <th class="min-width"></th>
                            <th>[`Condition`] ([`OR`])</th>
                            <th>[`Stock`]</th>
                            <th class="min-width"></th>
                        </tr>
                    </thead>
                    <tbody>
                        {foreach $rule_groups as $group}
                            {rulegroup group=$group}
                        {/foreach}
                        {capture "new_rule"}{strip}
                            {rulegroup}
                        {/strip}{/capture}
                        {foreach $storefront_rule_groups as $row}
                            <tr class="s-stock-rule disabled">
                                <td class="min-width"></td>
                                <td>[`Storefront`] {waIdna::dec($row.storefront)|escape}</td>
                                <td>
                                  {$row.stock_name|escape} <a href="?action=storefronts"><i class="fas fa-cog text-gray"></i></a>
                                </td>
                                <td class="min-width"></td>
                            </tr>
                        {/foreach}
                    </tbody>
                </table>
                <button type="submit" name="save" data-rule class="button green js-form-submit">
                    [`Save`]
                    <span class="hidden s-msg-after-button"><i class="fas-fa-check-circle after-submit"></i></span>
                </button>
            </div>
        </div>
    </form>
</div>

{*
 * dialogs section
 *}

<div class="dialog" id="s-settings-delete-last-stock">
    <div class="dialog-background"></div>

    <div class="dialog-body">
        <form method="post" action="?module=settings&action=stockDelete">
            <header class="dialog-header">
                <h1>[`Delete stock`]</h1>
            </header>

            <main class="dialog-content">
                [`All products available on this stock will be saved on the balance of corresponding SKUs.`]
                <input type="hidden" name="delete_stock" value="0" checked>
            </main>

            <footer class="dialog-footer">
                {$wa->csrf()}
                <button type="submit" class="button red js-dialog-submit">[`Delete`]</button>
                <button type="button" class="button light-gray js-dialog-close">[`Cancel`]</button>
            </footer>
        </form>
    </div>
</div>

<div class="dialog" id="s-settings-delete-stock">
    <div class="dialog-background"></div>

    <div class="dialog-body">
        <form method="post" action="?module=settings&action=stockDelete">
            <header class="dialog-header">
                <h1>[`Delete stock`]</h1>
            </header>

            <div class="dialog-content">
                <div>
                    <label>
                        <span class="wa-radio">
                            <input type="radio" name="delete_stock" value="0" checked>
                            <span></span>
                        </span>
                        [`Delete stock and write off products`]
                    </label>

                    <div class="hint custom-mt-4">[`All rest products belonging to this stock will be written-off after stock deleting`]</div>
                </div>

                <div class="custom-mt-12">
                    <label>
                        <span class="wa-radio">
                            <input type="radio" name="delete_stock" value="1">
                            <span></span>
                        </span>
                        [`Delete stock and transfer products`]
                    </label>

                    <div class="hint custom-mt-4">[`All products available on this stock will be transferred to another stock.`]</div>
                </div>

                <div class="custom-mt-12">
                    <div class="wa-select small">
                        <select name="dst_stock" disabled="disabled">
                            {foreach $stocks as $stock}{if empty($s.substocks)}
                            <option value="{$stock.id}">{$stock.name|escape}</option>
                            {/if}{/foreach}
                        </select>
                    </div>
                </div>
            </div>

            <footer class="dialog-footer">
                {$wa->csrf()}
                <button type="submit" class="button red js-dialog-submit">[`Delete`]</button>
                <button type="button" class="button light-gray js-dialog-close">[`Cancel`]</button>
            </footer>
        </form>
    </div>
</div>

<script>
document.title = "[`Stocks`] — " + {json_encode($wa->accountName(false))};
$.settings.stocksInit({
    validate_errors: {
        number: "[`Value must be a positive number`]",
        no_less: "[`This value must be no less than next field count`]",
        no_greater: "[`This value must be no greater than previous field count`]",
        empty: "[`Empty value`]"
    },
    new_rule: {json_encode($smarty.capture.new_rule)},
    new_stock: {json_encode($smarty.capture.new_stock)},
    new_virtualstock: {json_encode($smarty.capture.new_virtualstock)}
});
$.settings.stockRulesInit(
    {json_encode(trim($smarty.capture.new_rule))},
    {json_encode(trim($smarty.capture.new_condition))},
    "[`At least one condition is required`]"
);
</script>

<div class="hidden">
{foreach $plugins_html as $html}
<div>{$html}</div>
{/foreach}
</div>

<script>setTimeout($.settings.stockConditionsInit, 30);</script>