<?php require_once(ROOT_URL . '/includes/jump/jump_functions.php') ?>
<script>
$('#navBox').html(
    '<li class="breadcrumb-item">Tools <i class="fad fa-angle-double-right mx-2 mt-1"" aria-hidden="true"></i></li><li class="breadcrumb-item active">Jump List Management</li>'
);
</script>

<div class="note note-secondary">
    <p>Modify the content of the lists available throughout your system. Items added to the groups here will be
        available to you in addition to the preset options</p>
</div>



<ul id="jump-nav" class="nav nav-tabs" role="tablist">

    <!--<li class="nav-item"><a class="nav-link " href="#exam" id="exam-tab" role="tab" data-toggle="tab" aria-controls="exam" aria-expanded="true"  onClick="loadItems('examtype','list','el')">Exam Type</a></li>
<li class="nav-item"><a class="nav-link" href="#form" role="tab" id="form-tab" data-toggle="tab" aria-controls="form" onClick="loadItems('formtypes','list','ftl')">Form Type</a></li>-->
    <li class="nav-item"><a data-mdb-tab-init class="nav-link" href="#phrase" role="tab" id="phrases-tab"
            data-toggle="tab" aria-controls="phrases" onClick="loadItems('phrases','list','phl')">Engineering
            Phrases</a></li>
    <li class="nav-item"><a data-mdb-tab-init class="nav-link" href="#elecphrase" role="tab" id="elecPhrases-tab"
            data-toggle="tab" aria-controls="elecPhrase" onClick="loadItems('elecphrases','list','ephl')">Electrical
            Phrases</a></li>
    <li class="nav-item"><a data-mdb-tab-init class="nav-link active" href="#plants" role="tab" id="plant-tab"
            data-toggle="tab" aria-controls="plant" onClick="loadItems('plant','list','pl')">Plant List</a></li>
    <li class="nav-item"><a data-mdb-tab-init class="nav-link" href="#SurveyorKills" role="tab" id="skills-tab"
            data-toggle="tab" aria-controls="skills" onClick="loadItems('surveyorSkills','list','pls')">Surveyor
            Skills</a></li>
    <!--<li class="nav-item"><a class="nav-link" href="#Results" role="tab" id="results-tab" data-toggle="tab" aria-controls="results" onClick="loadItems('results','list','rl')">Results</a></li>-->
</ul>


<div id="jump-nav-content" class="tab-content">


    <div role="tabpanel" class="tab-pane fade" id="exam" aria-labelledby="exam-tab">
        <div class="col-md-12 text-end">
            <a data-placement="bottom" data-toggle="tooltip" title="New entry" id="en" class="btn btn-outline-success"
                href="javascript:void(0)" onClick="new('examtype')"><i class="fad fa-plus" aria-hidden="true"></i> New
                Entry</a>
        </div>
        <div id="examtype"></div>
    </div>

    <div role="tabpanel" class="tab-pane fade" id="form" aria-labelledby="form-tab">
        <div class="col-md-12 text-end">
            <a data-placement="bottom" data-toggle="tooltip" title="New entry" id="ftn" class="btn btn-outline-success"
                href="javascript:void(0)" onClick="new('formtypes')"><i class="fad fa-plus" aria-hidden="true"></i> New
                Entry</a>
        </div>
        <div id="formtypes"></div>
    </div>


    <div role="tabpanel" class="tab-pane fade" id="phrase" aria-labelledby="phrases-tab">
        <div class="col-md-12 text-end">

            <a data-placement="bottom" data-toggle="tooltip" title="New entry" id="phn" class="btn btn-outline-success"
                href="javascript:void(0)" onClick="newItem('phrases','list','phl')"><i class="fad fa-plus"
                    aria-hidden="true"></i> New
                Entry</a>
        </div>
        <div id="phrases"></div>
    </div>

    <div role="tabpanel" class="tab-pane fade" id="elecphrase" aria-labelledby="elecPhrases-tab">
        <div class="col-md-12 text-end">

            <a data-placement="bottom" data-toggle="tooltip" title="New entry" id="ephn" class="btn btn-outline-success"
                href="javascript:void(0)" onClick="newItem('elecphrases','list','ephl')"><i class="fad fa-plus"
                    aria-hidden="true"></i>
                New
                Entry</a>
        </div>
        <div id="elecphrases"></div>
    </div>


    <div role="tabpanel" class="tab-pane fade show active" id="plants" aria-labelledby="plant-tab">
        <div class="col-md-12 text-end">

            <a data-placement="bottom" data-toggle="tooltip" title="New entry" id="pn" class="btn btn-outline-success"
                href="javascript:void(0)" onClick="newItem('plant','list','pl')"><i class="fad fa-plus"
                    aria-hidden="true"></i> New
                Entry</a>
        </div>
        <div id="plant"></div>
    </div>


    <div role="tabpanel" class="tab-pane fade" id="Results" aria-labelledby="Results-tab">
        <div class="col-md-12 text-end">

            <a data-placement="bottom" data-toggle="tooltip" title="New entry" id="rn" class="btn btn-outline-success"
                href="javascript:void(0)" onClick="new('results')"><i class="fad fa-plus" aria-hidden="true"></i> New
                Entry</a>
        </div>
        <div id="results"></div>
    </div>

    <div role="tabpanel" class="tab-pane fade" id="SurveyorKills" aria-labelledby="skills-tab">
        <div class="col-md-12 text-end">

            <a data-placement="bottom" data-toggle="tooltip" title="New entry" id="rn" class="btn btn-outline-success"
                href="javascript:void(0)" onClick="newItem('surveyorSkills','list','pls')"><i class="fad fa-plus"
                    aria-hidden="true"></i>
                New
                Entry</a>
        </div>
        <div id="surveyorSkills"></div>
    </div>



</div>

<div id="loadingObject" style="position: fixed; top:50%; width:100%">
    <h1 class="text-center"><i class="fad fa-flux-capacitor fa-spin fa-3x fa-fw"
            style="--fa-primary-color: #0055A6; --fa-secondary-color: gray;"></i><br>Loading Data <br><small>Please
            wait</small>
    </h1>
</div>


<script>
function loadItems(t, m, l) {
    $('#loadingObject').css('display', 'block');
    $.post(ROOT_URL + '/includes/jump/jump_functions.php', {
        FUNCTION: "load",
        type: t,
        format: m,
        tenant: TENANT_URL
    }, function(data) {
        $('#' + t).html(data)
        $('#' + l).closest('.col-md-12').find('a').removeClass("active");
        $('#' + l).addClass("active");
        $('#loadingObject').css('display', 'none');
    })
}

function newItem(t, m, l) {

    var dest = ROOT_URL + '/includes/jump/jump_new_form.php?type=' + t + '&format=' + m + '&l=' + l + '&tenant=' +
        TENANT_URL;
    loadModalContent(dest, 'newForm', 'modal-lg', 1060, 'true', 'New ' + t + ' Entry');
}





function update(t) {
    event.preventDefault();
    $.ajax({
        url: ROOT_URL + '/includes/jump/jump_functions.php',
        type: 'POST',
        data: $('#' + t).serialize(),
        success: function(result) {
            alert(result)
            if ($.trim(result) == "s") {


                showResponse('success', 'Your entry has been updated successfully');

            } else {
                showResponse('danger', 'The code is already in the system')
            }
        }


    });
}

function remove(t, i) {
    var dest = '<p>Sure you wish to remove this entry?</p>'
    loadModalContent(dest, 'confirmBox', 'modal-md', 1060, 'true', 'Confirm Removal', 'cancelConfirm', () => delItem(t,
        i))

}

function delItem(t, i) {
    $.post(ROOT_URL + '/includes/jump/jump_functions.php', {
        FUNCTION: 'remove',
        table: t,
        id: i,
        tenant: TENANT_URL
    }, function(result) {
        if ($.trim(result) == "s") {
            showResponse('success', 'Your entry has been removed successfully');
            loadItems(t, 'list', '')
            killModal('confirmBox')

        }
    })
}

function edit(id) {
    var target = ROOT_URL + '/includes/jump/jump_edit-plant.php'
    var dest = encodeURI(target + "?id=" + id + '&tenant=' + TENANT_URL)
    loadModalContent(dest, 'editBox', 'modal-xl', 1060, 'true', 'Edit Entry')

}

loadItems('plant', 'list', 'pl')
</script>