{config_load file=$language_path section="general"}
{config_load file=$language_path section="un_classification"}

{if $ALLOCATION_MODE}
<style>
#un_classifications_link{
    display: block;
    margin-top: 30px;
    width: 100%;
    text-align: right;
    font-size: 0.8em;
}
.formgrid {
    margin-top: 20px;
    margin-bottom: 20px;
    display: grid;
    grid-template-columns: 200px 1fr; /* linke Spalte fix, rechte flexibel */
    gap: 5px 5px; /* vertikal / horizontaler Abstand */
    align-items: start;
    width: 260px;
}

.formgrid label {
    padding-top: 6px;
    width:180px;
}

.formgrid input,
.formgrid select {
    box-sizing: border-box;
}
</style>
<script>
    $(function(){
        if(!$('select[name="un_classifications_id"]').length){
            $('input.allocate').hide();
        }
    });
</script>
<p style="width: 800px;">{#un_classifications_allocation_intro#}</p>
{$FORM}
{$INPUT_UN_CLASSIFICATIONS}
    <div class="formgrid">
    <label for="Adr_class">{#adr_class#}:</label>{$INPUT_ADR_Class}
    <label for="Packaging_Group">{#packaging_group#}:</label>{$INPUT_Packaging_Group}
    <label for="Bk">{#bk#}:</label>{$INPUT_Bk}
    <label for="TUNNEL_CATEGORY">{#TUNNEL_CATEGORY#}:</label>{$INPUT_TUNNEL_CATEGORY}
    </div>
{$INPUT_ALLOCATE}
</form>
<div id="un_classifications_link">
{$BUTTON_UN_CLASSIFICATIONS}
</div>



{elseif $ALLOCATION_PRODUCT_MODE}


<style>
#un_classifications_link{
    display: block;
    margin-top: 30px;
    width: 100%;
    text-align: right;
    font-size: 0.8em;
}
.formgrid {
    margin-top: 20px;
    margin-bottom: 20px;
    display: grid;
    grid-template-columns: 200px 1fr; /* linke Spalte fix, rechte flexibel */
    gap: 5px 5px; /* vertikal / horizontaler Abstand */
    align-items: start;
    width: 260px;
}

.formgrid label {
    padding-top: 6px;
    width:180px;
}

.formgrid input,
.formgrid select {
    box-sizing: border-box;
}
</style>
<script>
    $(function(){
        if(!$('select[name="un_classifications_id"]').length){
            $('input.allocate').hide();
        }
    });
</script>
<div class="main">
    <p style="width: 800px;">{#un_classifications_allocation_product_intro#}</p>
    {$FORM}
    {$INPUT_UN_CLASSIFICATIONS}
    <div class="formgrid">
    <label for="Adr_class">{#adr_class#}:</label>{$INPUT_ADR_Class}
    <label for="Packaging_Group">{#packaging_group#}:</label>{$INPUT_Packaging_Group}
    <label for="Bk">{#bk#}:</label>{$INPUT_Bk}
    <label for="TUNNEL_CATEGORY">{#TUNNEL_CATEGORY#}</label>{$INPUT_TUNNEL_CATEGORY}
    </div>
    {$INPUT_ALLOCATE}
    </form>
    <div id="un_classifications_link">
    {$BUTTON_UN_CLASSIFICATIONS}
    </div>

</div>
{else}




<script>
    var text_create = '{#item_add#}';
    var text_edit = '{#item_edit#}';
    var really_delete = '{#item_really_delete#}'
    var un_baselink = '{$BASELINK}';
    function un_add(){
        var base_html = $('.create_un').html();
        $('#modal_window').dialog({
            title: text_create,
            width: 'auto',
            height: 'auto',
        }).html(base_html);
    }
    function un_delete(id){
        if( confirm(really_delete) ){
            window.location.href = un_baselink+'&delete='+id;
        }
    }

    function un_edit(id){
        var base_clone = $('.create_un').clone();
        var _title = $('a[data-uncid='+id+']').text();
        var _desc = $('.un_desc[data-uncid='+id+']').text();
        base_clone.find('input#un_title').val(_title).attr('value',_title);
        base_clone.find('textarea#un_description').text(_desc).attr('text',_desc);
        base_clone.find('input#un_title').after('<input type="hidden" name="un_classifications_id" value="'+id+'" />');
        $('#modal_window').dialog({
            title: text_edit,
            width: 'auto',
            height: 'auto',
        }).html(base_clone.html());
    }

    function un_allocateds(id){
        window.location.href = 'categories.php?un_classifications_id='+id;
    }
</script>

<style>
table.un_items{
    margin-top: 20px;
}
table.un_items thead th:nth-child(2){
    width: 800px;
}
table.un_items tbody td .un_desc {
    white-space: pre;
}
table.un_items tbody td input[type="button"] {
    width: 180px;
    margin: 2px;
}
.create_un{
    display: none;
}
.un_desc{
    font-style:italic;
    font-size: 0.9em;
}
.formgrid {
    display: grid;
    grid-template-columns: 200px 1fr; /* linke Spalte fix, rechte flexibel */
    gap: 10px 20px; /* vertikal / horizontaler Abstand */
    align-items: start;
    width: 750px;
}

.formgrid label {
    padding-top: 6px;
    width:400px;
}

.formgrid input,
.formgrid textarea {
    width: 100%;
    box-sizing: border-box;
}
</style>

{yes_admin_page_menu main_title={#un#} buttons=$PAGE_HEADING_MENU_BUTTONS}


{$TABLE}

<div class="create_un main">
    <form action="{$BASELINK}" method="post">
        <fieldset>
            <div class="formgrid">
                <label for="un_title">{#un_title#}</label>
                <input type="text" maxlength="128" size="64" id="un_title" name="un_title" />

                <label for="un_description">{#un_description#}</label>
                <textarea cols="64" rows="3" id="un_description" name="un_description"></textarea>
            </div>
            <input type="submit" value="{#save#}" class="ui-button ui-corner-all ui-state-default" />
        </fieldset>
    </form>
</div>

{/if}