{% extends 'wgcomm/base.html' %}

{% block title %}
    Personnel positioning
{% endblock %}

{% block main_content %}
    <!--app-content open-->
    <div class="app-content main-content mt-0">
        <div class="side-app">
            <!-- CONTAINER -->
            <div class="main-container container-fluid">

                <!-- PAGE-HEADER -->
                <div class="page-header">
                    <div>
                        <h1 class="page-title">Personnel positioning</h1>
                    </div>
                    <div class="ms-auto pageheader-btn">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item">Console</li>
                            <li class="breadcrumb-item"><a href="javascript:void(0);">Personnel</a></li>
                            <li class="breadcrumb-item active" aria-current="page">Location</li>
                        </ol>
                    </div>
                </div>
                <!-- PAGE-HEADER END -->
                {% with messages = get_flashed_messages() %}
                    {% if messages %}
                        <div class="form-group">
                            <ul>
                                {% for message in messages %}
                                    <li class="text-danger">{{ message }}</li>
                                {% endfor %}
                            </ul>
                        </div>
                    {% endif %}
                {% endwith %}
                <!--ROW OPENED-->
                <div class="row">
                    <div class="col-lg-12 col-md-12">
                        <div class="card">
                            {#                            <form action="{{ url_for('wgcomm.web_department_add') }}" method="post">#}
                            {#                                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">#}
                            {#                                {{ wgform._csrf }}#}
                            <div class="card-header border-bottom">
                                <h4 class="mb-0">Personnel Information</h4>
                            </div>
                            <div class="card-body">
                                {#                                    <div class="form-group">#}
                                {#                                        {{ wgform.f_GroupNO.label }}#}
                                {#                                        {{ wgform.f_GroupNO( class="form-control") }}#}
                                {#                                    </div>#}
                                {#                                    <div class="form-group">#}
                                {#                                        {{ wgform.f_GroupName.label }}#}
                                {#                                        {{ wgform.f_GroupName( class="form-control") }}#}
                                {#                                    </div>#}
                                <div class="form-group">
                                    <label for="f_ConsumerName">Name:</label>
                                    <input class="form-control" id="f_ConsumerName" minlength="1" name="f_ConsumerName"
                                           type="text" value="">
                                </div>
                            </div>
                            <script>
                                function consumerlocation(source) {
                                    console.log('consumerlocation');
                                    let consumername = document.getElementById('f_ConsumerName');
                                    let consumernameval = ''
                                    if (consumername) {
                                        {#console.log(consumername.innerText);#}
                                        consumernameval = consumername.value;
                                    } else {
                                        {#console.log('元素不存在orContent为None---111');#}
                                        //return; //
                                    }
                                    if (consumernameval !== '') {  // (consumername && consumername.innerText.trim() !== '') {
                                        // 元素存在且Content不为None
                                        {#console.log('元素Content不为None');#}
                                    } else {
                                        // 元素不存在orContent为None
                                        {#console.log('元素不存在orContent为None');#}
                                        let divInfologLocation = document.getElementById('divInfologLocation');
                                        if (divInfologLocation) {
                                            divInfologLocation.innerText = "Please enter name"
                                        }
                                        return
                                    }
                                    let data = {
                                        consumername: consumernameval  //consumername.innerText.trim()
                                    }
                                    wgajax.post({
                                        url: "/extern_console_location_query_realize", //parm_url , //"/department_del",
                                        data: data
                                    }).done(function (msg) {
                                        divInfologLocation = document.getElementById('divInfologLocation');
                                        if (divInfologLocation) {
                                            divInfologLocation.innerText = msg
                                        }
                                        // console.log(msg);
                                        wgjslog.log(msg)
                                        if (msg === "OK") {
                                            {#document.getElementById(cardid).innerHTML = "";#}
                                            {#document.getElementById(loseid).remove();#}
                                        }

                                    }).fail(function (error) {
                                        wgjslog.alert(error); //2023-12-25 14:05:03
                                    })
                                }
                            </script>
                            <div class="row p-5">
                                <div class="btn-list">
                                    {#                                    <div class="btn-list text-end">#}
                                    {#                                        <button id="submitcancel" name="submitcancel" class="btn btn-outline-danger"#}
                                    {#                                                type="submit" value="Cancel">#}
                                    {#                                            <i class="fe fe-x-circle"></i>#}
                                    {#                                            Cancel#}
                                    {#                                        </button>#}
                                    <button id="submitsave" name="submitsave" class="btn btn-primary" type="submit"
                                            value="Location" onclick="consumerlocation(this)">
                                        <i class="fe fe-check-circle"></i>
                                        Location
                                    </button>
                                    {#                                         <button  class="btn btn-primary"  onclick="consumerlocation(this)"><i class="fe fe-check-circle"></i>Location</button>#}
                                </div>
                            </div>
                            {#                                <div class="card-body">#}
                            {##}
                            {#                                    <div class="form-group">#}
                            {#                                        <label for="f_ConsumerName">Location Info:</label>#}
                            {#                                        <input class="form-control" id="f_ConsumerName" minlength="1" name="f_ConsumerName" type="text" value="">#}
                            {#                                    </div>#}
                            {#                                </div>#}
                            <div class='card-body pt-0 text-start' id='divInfologAll'>
                                {#                                                    <div style='padding-top: 8px'>#}
                                {#                                                    </div>#}
                                <label for="f_ConsumerName">Location Info:</label>
                                <br>
                                <div>
                                    <span id='divInfologLocation'></span>
                                </div>

                            </div>
                            {#                                <div class="col-xl-3 col-md-3 col-sm-3">#}
                            {#                                    <div class="card p-0 ">#}
                            {#                                        <div class='d-flex align-items-center px-3 pt-3'>#}
                            {#                                            <div class='float-end ms-auto'>#}
                            {#                                                <div class='card-body pt-0 text-start' id='divInfologAll'>#}
                            {#                                                    <div style='padding-top: 8px'>#}
                            {#                                                    </div>#}
                            {#                                                    <span id='divInfologLocation'></span>#}
                            {#                                                </div>#}
                            {#                                            </div>#}
                            {#                                        </div>#}
                            {#                                    </div>#}
                            {#                                </div>#}
                            {#                            </form>#}
                        </div>
                    </div>
                </div>
                <!--ROW CLOSED-->
            </div>
        </div>
    </div>
    <!-- CONTAINER CLOSED -->
{% endblock %}