@{
    ViewBag.Title = "Statistics";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@using SuperAdmin.Models;
@using SuperAdmin.Models.Http;
@using SuperAdmin.Controllers;
@using SuperAdmin.Source;

@model PlayerObj
@{
    string msisdn = "";
    if (Model != null) {
        msisdn = Model.msisdn;
    }
}

<style>
    img {
        max-width: 100%;
    }
</style>

<div class="content-header row">
    <div class="content-header-left col-md-6 col-xs-12 mb-1">
        <h2 class="content-header-title">Player</h2>
    </div>
    <div class="content-header-right breadcrumbs-right breadcrumbs-top col-md-6 col-xs-12">
        <div class="breadcrumb-wrapper col-xs-12">
            <ol class="breadcrumb">
                <li class="breadcrumb-item">
                    <a href="Index">Admin</a>
                </li>
                <li class="breadcrumb-item">
                    <a href="#">Player</a>
                </li>
            </ol>
        </div>
    </div>
</div>

<div class="content-body">
    <!-- Basic form layout section start -->
    <section id="basic-form-layouts">
        <div class="row service-height">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h4 class="card-title" id="basic-layout-form">Search</h4>
                        <a class="heading-elements-toggle"><i class="icon-ellipsis font-medium-3"></i></a>
                        <div class="heading-elements">
                            <ul class="list-inline mb-0">
                                <li><a data-action="collapse"><i class="icon-minus4"></i></a></li>
                                <li><a data-action="expand"><i class="icon-expand2"></i></a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="card-content collapse show">
                        <div class="card-body">
                            <div class="card-block">
                                <div class="form-body">
                                    @Html.AntiForgeryToken()
                                    <div class="row">
                                        <div class="col-md-4 col-sm-4 col-6">
                                            <div class="form-group">
                                                <label>Sub ID</label>
                                                <div class='input-group'>
                                                    <input type="text" class="form-control" id="subIdSearch" name="subIdSearch" autocomplete="on">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-4 col-sm-4 col-6">
                                            <div class="form-group">
                                                <label>Phone number</label>
                                                <div class='input-group'>
                                                    <input type="text" class="form-control" id="msisdnSearch" name="msisdnSearch" autocomplete="on" value="@msisdn">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <button type="button" class="btn btn-primary" onclick="search()" id="btnSearch">
                                                <i class="icon-search"></i> Search
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-12" style="padding-top: 10px">
                <div class="row" id="player_info">

                </div>
            </div>


        </div>
    </section>
    <!-- // Basic form layout section end -->
</div>

<div class="modal fade text-xs-left" id="modal-lock" tabindex="-1" role="dialog" aria-labelledby="myModalLabel17" style="display: none;" aria-hidden="true">
    <div class="modal-dialog modal-md" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="modalLabelService">Lock account</h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            @*<input type="hidden" id="subIdLock" />*@
            <div class="modal-body">
                <div class="row" id="div-info">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="wsName">Sub Id:</label>
                            <span id="subIdLock"></span>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="wsName">Phone number:</label>
                            <span id="msisdnLock"></span>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="form-group">
                            <label for="wsName">Note</label>
                            <textarea type="text" class="form-control" id="noteLock" name="noteLock" autocomplete="off"></textarea>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" id="btnLock" class="btn btn-outline-primary" onclick="updateStatus('1')">Lock</button>
                <button type="button" class="btn grey btn-outline-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>


@section Scripts {
    <script>


        $(document).ready(function () {
            var msisdn = $("#msisdnSearch").val();
            if (msisdn != null && msisdn != "") {
                search();
            }
        });

        function search() {
            console.log("Search data");
            startSpinner('btnSearch');
            $.ajax({
                url: "/Admin/PlayerSearch",
                data: {
                    subId: $("#subIdSearch").val(),
                    msisdn: $("#msisdnSearch").val()
                },
                type: "POST",
                success: function (data) {
                    stopSpinner('btnSearch');
                    $("#player_info").html(data);
                    console.log("sub ID: " + $("#subId").html());
                },
                error: function (data) {
                    stopSpinner('btnSearch');
                    console.log(data.error);
                }
            })
        }

        function updateStatus(status) {
            var subId = $("#subId").html();
            console.log(subId);
            // get service info
            $.ajax({
                url: "/Admin/PlayerLockAction",
                data: {
                    subId: subId,
                    isLock: status,
                    note: $("#noteLock").val()
                },
                type: "POST",
                success: function (data) {
                    console.log(data);
                    if (data.error != "0") {
                        Swal.fire('Error!', data.content, 'error');
                    } else {
                        if (status == '0') {
                            // unlock
                            Swal.fire('Unlock success!', '', 'success').then((result) => {
                                hideModal("modal-lock");
                                search();
                            });
                        } else if (status == '1') {
                            // lock
                            Swal.fire('Lock success!', '', 'success').then((result) => {
                                hideModal("modal-lock");
                                search();
                            });
                        }
                    }
                },
                error: function (data) {
                    console.log(data.error);
                }
            })
        }

        function lock() {
            $("#subIdLock").html($("#subId").html());
            $("#msisdnLock").html($("#msisdn").html());
            showModal("modal-lock");
        }

    </script>
}