{**********************************************************************
* ProxmoxCloudVps product developed. (2017-10-06)
* *
*
*  CREATED BY MODULESGARDEN       ->       http://modulesgarden.com
*  CONTACT                        ->       contact@modulesgarden.com
*
*
* This software is furnished under a license and may be used and copied
* only  in  accordance  with  the  terms  of such  license and with the
* inclusion of the above copyright notice.  This software  or any other
* copies thereof may not be provided or otherwise made available to any
* other person.  No title to and  ownership of the  software is  hereby
* transferred.
*
*
**********************************************************************}

{**
* @author Sławomir Miśkowicz <slawomir@modulesgarden.com>
*}
<div class="lu-widget  lu-p-1x">
    <div class="lu-widget__body">
        {if $rawObject->isShowTitle() && (($rawObject->getRawTitle() || $rawObject->getTitle()) && $rawObject->isViewHeader())}
            <div class="lu-widget__header">
                <div class="lu-widget__top lu-top">
                    <div class="lu-top__title">
                        {if $rawObject->getIcon()}<i class="{$rawObject->getIcon()}"></i>{/if}
                        {if $rawObject->isRawTitle()}{$rawObject->getRawTitle()}{elseif $rawObject->getTitle()}{$MGLANG->T($rawObject->getTitle())}{/if}
                    </div>
                <div class="lu-top__toolbar"><a href="#" id="pm-add-new-virtual-network-button" data-toggle="lu-tooltip" class="lu-btn lu-btn--primary" data-title="{$MGLANG->T('Add New Virtual Network')}">
                        <i class="lu-zmdi lu-zmdi-plus"></i>
                        <span class="lu-btn__text">{$MGLANG->T('Add New Virtual Network')}</span>
                    </a></div>
                </div>
            </div>
        {/if}
        <div class="lu-widget__content lu-p-1x">
            {if !$customTplVars.virtualInterfaces}
            <div class="lu-alert lu-alert--outline lu-alert--icon lu-alert--info lu-alert--bordered lu-m-b-0x lu-alert--dismiss mg-message">
                <div class="lu-alert__body">
                    {$MGLANG->T('additional_ip_add_info')}
                </div>
            </div>
            {/if}
            <div class="lu-widget hidden pm-virtual-network-content-default" >
                <div class="lu-widget__body">
                    <div class="lu-widget__header">
                        <div class="lu-widget__top lu-top">
                            <div class="lu-top__title">
                                {$MGLANG->T('Virtual Network')}
                            </div>
                            <div class="lu-top__toolbar">
                                <a href="#"
                                        class="lu-btn lu-btn--xs lu-btn--default lu-btn--icon lu-btn--link lu-btn--plain pm-delete-virtual-network-button">
                                    <i class="lu-btn__icon lu-zmdi lu-zmdi-close"></i>
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="lu-widget__content lu-row">
                        <div class="lu-form-group lu-col-md-6">
                            <label class="lu-form-label">{$MGLANG->T('Select Virtual Network')}</label>
                            <select name="virtualNetwork[id]" class="lu-form-control pm-vn-select">
                                {foreach from=$customTplVars.virtualNetwork key=opValue item=option}
                                    <option value="{$opValue}">{$option}</option>
                                {/foreach}
                            </select>
                        </div>
                        <div class="lu-form-group lu-col-md-6">
                            <label class="lu-form-label">{$MGLANG->T('Select IP Address')}</label>
                            <select name="virtualNetwork[ip]" class="lu-form-control  pm-vn-ip-select">
                                {foreach from=$customTplVars.ips key=opValue item=option}
                                    <option class="vn-ip-{$option.networkId}" {if $option.networkId!="public"}style="display: none;"{/if}  {if $option.ip == $customTplVars.ipSelected}selected{/if}  value="{$option.ip}">{$option.ip}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                </div>
            </div>
            {foreach from=$customTplVars.virtualInterfaces key=keyIndex item=virtualInterface}
                <div class="lu-widget" >
                    <div class="lu-widget__body">
                        <div class="lu-widget__header">
                            <div class="lu-widget__top lu-top">
                                <div class="lu-top__title">
                                    {$MGLANG->T('Virtual Network')}
                                </div>
                                <div class="lu-top__toolbar">
                                    <a href="#"
                                       class="lu-btn lu-btn--xs lu-btn--default lu-btn--icon lu-btn--link lu-btn--plain pm-delete-virtual-network-button">
                                        <i class="lu-btn__icon lu-zmdi lu-zmdi-close"></i>
                                    </a>
                                </div>
                            </div>
                        </div>
                        <div class="lu-widget__content lu-row">
                            <div class="lu-form-group lu-col-md-6">
                                <label class="lu-form-label">{$MGLANG->T('Select Virtual Network')}</label>
                                <input type="hidden" name="virtualInterface{$keyIndex}[id]" value="{$virtualInterface.id}">
                                <select name="virtualInterface{$keyIndex}[vn_id]" class="lu-form-control pm-vn-select">
                                    {foreach from=$customTplVars.virtualNetwork key=opValue item=option}
                                        {if $virtualInterface.vn_id==$opValue }
                                            <option value="{$opValue}" selected>{$option}</option>
                                        {/if}
                                    {/foreach}
                                </select>
                            </div>
                            <div class="lu-form-group lu-col-md-6">
                                <label class="lu-form-label">{$MGLANG->T('Select IP Address')}</label>
                                <select name="virtualInterface{$keyIndex}[ip]" class="lu-form-control  pm-vn-ip-select">
                                    <option class="vn-ip-{$virtualInterface.vn_id}"
                                            {if $option.ip == $customTplVars.ipSelected}selected{/if}  value="{$virtualInterface.ip}">{$virtualInterface.ip}</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
            {/foreach}
        </div>
    </div>
</div>