{yes_admin_page_menu main_title=$HEADING_TITLE buttons=$PAGE_HEADING_MENU_BUTTONS}
<style>
    a.edit, a.del{
        text-decoration: none;
        font-size: 1.5em;
    }
    #update{
        display: none;
    }
    #update button#action{
        padding: 4px;
    }
</style>
<script>
    function add_shipping_status(){
        $('form[name="shipping_status_form"]').attr('action','shipping_status.php?action=insert');
        $('#update button#action').text('Erzeugen');
        $('#update').dialog({
            modal: true,
            width: 'auto',
            height: 'auto',
            title: 'Shipping Status Add'
        });
    }
    var DELETE = '{$DELETE}';
    var CANCEL = '{$CANCEL}';
    var TEXT_YES = '{$YES}';
    $(function(){
        $('a.del').each(function(){
            $(this).on('click',function(){
                let ssid = $(this).data('shippingstatusid');
                $('#modal_window').dialog({
                    modal: true,
                    width: 'auto',
                    height: 'auto',
                    title: 'Delete',
                    buttons: [{
                      text: TEXT_YES,
                      click: function(){
                            window.location.href='shipping_status.php?action=deleteconfirm&oID='+ssid;
                      },
                    },{
                      text: CANCEL,
                      click: function(){
                          $('#modal_window').dialog('destroy');
                      },
                    }]
                }).html(DELETE+'?');
                /*if(confirm(DELETE+'?')){
                }*/
            });
        });
        $('a.edit').each(function(){
            $(this).on('click',function(){
                let ssid = $(this).data('shippingstatusid');
                $('form[name="shipping_status_form"]').attr('action','shipping_status.php?action=save&id='+ssid);
                $.ajax({
                    url: 'shipping_status.php?action=get_json_data&id='+ssid,
                    dataType: 'json',
                    success: function(json){
                        for(let j=0;j<json.languages.length;j++){
                            let lang_id = json.languages[j].language_id;
                            let val = json.languages[j].shipping_status_name;
                            $('#update input[name="shipping_status_name['+lang_id+']"]').val( val );
                        }
                        $('#update input[name="shipping_status_image"]').val( json.meta.shipping_status_image );
                    },
                    error: function( xhr ){
                        alert('Cant get json data for shipping status '+ssid);
                    }
                });
                $('#update button#action').text('Aktualisieren');
                $('#update').dialog({
                    modal: true,
                    width: 'auto',
                    height: 'auto',
                    title: 'Shipping Status Edit'
                });
            });
        });
        $('button#action').on('click',function(){
            $('form[name="shipping_status_form"] input[name^="shipping_status_name"]').each(function(){
                let val = $(this).val();
                if(val.trim().length < 1){
                    alert('Name invalid');
                    return false;
                }
            });
            $('form#name="shipping_status_form').submit();
        });
    });
</script>
<br clear="all" />

<table class="yesListTable_minimal">
    <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Image</th>
            <th>&nbsp;</th>
        </tr>
    </thead>
    <tbody>
        {foreach from=$SHIPPING_STATUS item=s}
        <tr>
            <td class="id">{$s.shipping_status_id}</td>
            <td class="name">{$s.shipping_status_name}</td>
            <td class="image">{if $s.shipping_status_image != ''}<img style="max-width:100px; max-height: 100px;" src="images/icons/{$s.shipping_status_image}" />{/if}</td>
            <td>
                <a class="edit" data-shippingstatusid="{$s.shipping_status_id}" href="javascript:;">&#9998;</a>
                &nbsp;
                <a class="del" data-shippingstatusid="{$s.shipping_status_id}" href="javascript:;">&#128465;</a>
            </td>
        </tr>
        {/foreach}
    </tbody>
</table>

<div id="update">
    <form name="shipping_status_form" method="post" enctype="multipart/form-data">
        <fieldset>
            {foreach from=$LANGUAGES item=l}
            <label for="name_{$l.id}"><br />Name {$l.name}</label>
            <input id="name_{$l.id}" value="" type="text" maxlength="32" name="shipping_status_name[{$l.id}]"/>
            {/foreach}
            <br />
            <label for="image"><br />Image</label>
            <input type="file" id="image" name="shipping_status_image" />
            <br />
            <br />
            <button class="ui-button ui-corner-all ui-state-default" id="action"></button>
        </fieldset>
    </form>
</div>