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

@using ReportWeb.Models;
@using ReportWeb.Source;
@using SuperCms.Extensions;

@model List<SvAdv>

@{
    void MsgTypeToText(string msgType)
    {
        if (msgType == "0")
        {
            <span>SMS Text</span>
        }
        else if (msgType == "1")
        {
            <span>SMS Flash</span>
        }
        else if (msgType == "200")
        {
            <span>USSD Push</span>
        }
        else if (msgType == "201")
        {
            <span>USSD Flash</span>
        }
    }

    void StatusToText(int status)
    {
        if (status == 0)
        {
            <span>Inactive</span>
        }
        else if (status == 1)
        {
            <span>Active</span>
        }
    }
}

@{
    int? codeType = ViewBag.codeType;
}

<input type="hidden" value="@(codeType ?? LuckyCardUtils.CodeType.LUCKY_CARD)" id="codeType" />
<div class="app-content content">
    <div class="content-wrapper">
        <div class="content-header row">
            <div class="content-header-left col-md-6 col-xs-12 mb-1">
                <h2 class="content-header-title">Services Advertise Counter @(codeType == LuckyCardUtils.CodeType.LUCKY_CALL ? " CALL" : " CARD")</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="#">Services Adv Counter</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="reload"><i class="icon-reload"></i></a></li>*@
                                        <li><a data-action="expand"><i class="icon-expand2"></i></a></li>
                                        @*<li><a data-action="close"><i class="icon-cross2"></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">
                                                    <div class="form-group">
                                                        <label for="teamName">Month</label>
                                                        <select class="form-control" id="searchMonth" name="searchMonth">
                                                            @for (int i = 1; i <= 12; i++)
                                                            {
                                                                if (i == DateTime.Now.Month)
                                                                {
                                                                    <option value="@i" selected>@i</option>
                                                                }
                                                                else
                                                                {
                                                                    <option value="@i">@i</option>
                                                                }
                                                            }
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <label for="teamName">Year</label>
                                                        <select class="form-control" id="searchYear" name="searchYear">
                                                            @for (int i = -1; i <= 10; i++)
                                                            {
                                                                if (i == 0)
                                                                {
                                                                    <option value="@(DateTime.Now.Year + i)" selected>@(DateTime.Now.Year + i)</option>
                                                                }
                                                                else
                                                                {
                                                                    <option value="@(DateTime.Now.Year + i)">@(DateTime.Now.Year + i)</option>
                                                                }
                                                            }
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <button type="button" class="btn btn-primary" onclick="searchSvAdvSchedule()" id="btnSearch">
                                                        <i class="icon-search"></i> Search
                                                    </button>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="col-12">
                        <div class="card">
                            <div class="card-content">
                                <div class="col-md-12 table-responsive">
                                    <table class="table table-striped table-hover">
                                        <thead class="thead-inverse">
                                            <tr>
                                                <th scope="col">#</th>
                                                <th scope="col" class="text-center">Report Date</th>
                                                <th scope="col" class="text-center">Service</th>
                                                <th scope="col" class="text-center">Target Percent</th>
                                                <th scope="col" class="text-center">Count CDR</th>
                                                <th scope="col" class="text-center">Start Time</th>
                                                <th scope="col" class="text-center">End Time</th>
                                            </tr>
                                        </thead>
                                        <tbody id="gridbody">
                                            @if (Model != null)
                                            {
                                                for (int i = 0; i < Model.Count; i++)
                                                {
                                                    SvAdv adv = Model[@i];
                                                    <tr>
                                                        <td scope="row">@(i + 1)</td>

                                                        <td class="text-center">@adv.report_date.ToString("dd/MM/yyyy")</td>
                                                        <td class="text-center">@(adv.schedule_detail_id == 0 ? "LUCKY_CARD" : adv.sv_code == null || adv.sv_code == "" ? "UNKNOWN" : adv.sv_code)</td>
                                                        <td class="text-right">@(adv.sv_code == null || adv.sv_code == "" ? "Remain" : adv.percent+"%")</td>
                                                        <td class="text-right">@(adv.counter)</td>
                                                        <td class="text-center">@adv.start_time.ToString("dd/MM/yyyy HH:mm:ss")</td>
                                                        <td class="text-center">@adv.end_time.ToString("dd/MM/yyyy HH:mm:ss")</td>
                                                    </tr>
                                                }
                                            }
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>

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

    </div>
</div>


@section Scripts {
    <script>

        //function loadServiceAdv(scheduleId) {
        //    startSpinner('adv-info');
        //    $("#scheduleId").val(scheduleId);
        //    $.ajax({
        //        url: subDomain + "/Admin/GetServiceAdvPartial",
        //        data: {
        //            scheduleId: scheduleId
        //        },
        //        type: "POST",
        //        success: function (data) {
        //            //console.log(data);
        //            $("#adv-info").html(data);

        //            stopSpinner('adv-info');
        //        },
        //        error: function () {
        //            stopSpinner('adv-info');
        //        }
        //    });
        //};



        // Service Adv Schedule
        function searchSvAdvSchedule() {
            console.log("Search");
            startSpinner('btnSearch');
            $.ajax({
                url: subDomain + "/Admin/SearchSvAdvCounter",
                data: {
                    month: $("#searchMonth").val(),
                    year: $("#searchYear").val(),
                    codeType: $("#codeType").val()
                },
                type: "POST",
                success: function (data) {
                    stopSpinner('btnSearch');
                    console.log(data);
                    if (data.error != "0") {
                        setTimeout(function () {
                            showModal('message-dialog');
                            $('#message-content').html(data.content.split("\n").join("<br />"));
                        }, 1000);
                    } else {
                        //showModal('message-dialog');
                        //$('#message-content').html(data.content.split("\n").join("<br />"));
                        updateGridData(data.listService);
                    }
                },
                error: function (data) {
                    stopSpinner('btnSearch');
                    console.log(data.error);
                }
            })
        }

        function updateGridData(val) {
            console.log(val);
            $("#gridbody").html("");
            var html = "";
            if (val != undefined) {
                for (var i = 0; i < val.length; i++) {
                    var service = val[i];
                    html += "<tr>";
                    html += "<td scope='row'>" + (i + 1) + "</td>";

                    html += "<td class='text-center'>" + moment(service.report_date).format("DD/MM/YYYY") + "</td>";
                    html += "<td class='text-center'>" + (service.schedule_detail_id == 0 ? "LUCKY_CARD" : (service.sv_code == null || service.sv_code == "") ? "UNKNOWN" : service.sv_code) + "</td>";
                    html += "<td class='text-right'>" + (service.sv_code == null || service.sv_code == "" ? "Remain" : service.percent + "%") + "</td>";
                    html += "<td class='text-right'>" + service.counter + "</td>";
                    html += "<td class='text-center'>" + moment(service.start_time).format("DD/MM/YYYY HH:mm:ss") + "</td>";
                    html += "<td class='text-center'>" + moment(service.end_time).format("DD/MM/YYYY HH:mm:ss") + "</td>";



                    html += "</tr>";

                }
            }
            $("#gridbody").html(html);
        }


    </script>
}