@{
    ViewBag.Title = "Profile";
}
@using NEducation.Content.Texts;
@model NEducation.NEduService.response


<link type="text/css" rel="stylesheet" href="~/Content/assets/css/personal.css" />

@section navMenu{

    <a href="/Home/" class="nav-link">Home</a>
    <a href="/Voca/" class="nav-link">Vocabulary</a>
    <a href="/Grammar/" class="nav-link">Grammar</a>
    @*<a href="/Music/" class="nav-link">Music</a>*@
    <a href="/Listening/" class="nav-link">Listening</a>
}

@section menu{
    @*<a href="/Home/Instruction" class="header-menu-link ">Method</a>
        <a href="/Home/library" class="header-menu-link ">Library</a>*@
    @*<a href="javascript:void(0)" class="header-menu-link menu-link-course">Program</a>
        <p class="link-course-group">*@
    <a href="/Common" class="header-menu-link ">Home</a>
    <a href="/Common/Course" class="header-menu-link ">Library</a>
    <a href="/Voca/" class="header-menu-link ">VOCABULARY</a>
    <a href="/Grammar/" class="header-menu-link ">GRAMMAR</a>
    <a href="/Listening/" class="header-menu-link ">LISTENING</a>
    @*<a href="/Music/" class="header-menu-link ">MUSIC</a>*@
    @*</p>*@
    @*<a href="/Home/Register" class="header-menu-link ">Sign up (Free trial)</a>
        <a href="/Home/Login" class="header-menu-link ">Sign in</a>*@
    @*<a href="/Home/support" class="header-menu-link ">Help</a>*@
}


<div class="main-body">
    <div class="setting-container">
        <div class="setting-container-cover">
            <div class="row">
                <div class="col-xs-12 col-sm-12">
                    <div class="setting-tab-pane">
                        <div class="tab-content">
                            <div role="tabpanel" class="tab-pane fade in active" id="product">
                                <div class="setting-default setting-product">
                                    <form class="table-responsive">
                                        @Html.AntiForgeryToken()
                                        <table class="table setting-product-table">
                                            <thead>
                                                <tr>
                                                    <th>Course</th>
                                                    <th>Active date</th>
                                                    <th>Expire date</th>
                                                    <th>Status</th>
                                                    <th>Action</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @if (Model.status != null && Model.status != "")
                                                {
                                                    // for subscibed account
                                                    <tr>
                                                        <td>
                                                            <p>
                                                                <a href="#">All</a>
                                                            </p>
                                                        </td>
                                                        <td>
                                                            <p>@DateTime.ParseExact(Model.registerTime, "yyyyMMddHHmmss", null).ToString("dd/MM/yyyy")</p>
                                                        </td>
                                                        <td>
                                                            <p>@DateTime.ParseExact(Model.expireTime, "yyyyMMddHHmmss", null).ToString("dd/MM/yyyy")</p>
                                                        </td>
                                                        <td>
                                                            @if (Model.status == "1")
                                                            {
                                                                <p class="color-active">Active</p>
                                                            }
                                                            else if (Model.status == "2")
                                                            {
                                                                <p class="color-active">Pending</p>
                                                            }
                                                            else
                                                            {
                                                                <p class="color-expire">Expired</p>
                                                            }
                                                        </td>
                                                        <td>
                                                            @if (Model.status != "1")
                                                            {
                                                                <button class="button-extend" onclick="RenewSub();">Renew</button>
                                                            }
                                                        </td>
                                                    </tr>
                                                }

                                                @if (Model.listCourseBuyRes != null && Model.listCourseBuyRes.Length > 0)
                                                {
                                                    // for unsubed account
                                                    foreach (NEducation.NEduService.courseBuyRes courseInfo in Model.listCourseBuyRes)
                                                    {
                                                        var expireDate = @DateTime.ParseExact(courseInfo.expireTime, "yyyyMMddHHmmss", null);
                                                        <tr>
                                                            <td>
                                                                <p>
                                                                    <a href="@Url.Action("Lesson",
                                                                           courseInfo.courseType == "1" ? "Voca" :
                                                                           (courseInfo.courseType == "2" ? "Grammar"  :
                                                                           (courseInfo.courseType == "3" ? "Listen" :  "Music")),
                                                                           new { courseId = courseInfo.courseId, courseName = courseInfo.courseName })">@courseInfo.courseName</a>
                                                                    </p>
                                                                </td>
                                                                <td>
                                                                    <p>@DateTime.ParseExact(courseInfo.buyTime, "yyyyMMddHHmmss", null).ToString("dd/MM/yyyy")</p>
                                                                </td>
                                                                <td>
                                                                    <p>
                                                                        @expireDate.ToString("dd/MM/yyyy")
                                                                    </p>
                                                                </td>
                                                                <td>
                                                                    @if (expireDate > DateTime.Now)
                                                                    {
                                                                        <p class="color-active">Active</p>
                                                                    }
                                                                    else
                                                                    {
                                                                        <p class="color-expire">Expired</p>
                                                                    }
                                                                </td>
                                                                <td>
                                                                    @if (expireDate < DateTime.Now)
                                                                    {
                                                                        @*<a href="@Url.Action("BuyCourse", "Home", new { courseId = courseInfo.courseId, courseName = courseInfo.courseName })"
                                                                            class="button-extend ">Renew</a>*@
                                                                        <button class="button-extend" onclick="BuyCourse(@courseInfo.courseId);">Renew</button>
                                                                    }
                                                                </td>
                                                            </tr>
                                                        }
                                                    }

                                            </tbody>
                                        </table>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@*<div id="message-dialog" class="modal fade" tabindex="-1" role="dialog">
        <div class="modal-dialog fault-dialog">
            <div class="modal-content">
                <div class="modal-content-feedback">
                    <a class="modal-button-close" href="javascript:void(0)" data-dismiss="modal"></a>
                    <p class="fault-title text-center"><span>@Lang.Result</span> </p>
                    <div class="modal-body">
                        <div class="row">
                            <div class="col-xs-12">
                                <p class="fault-subtitle" id="message-content"></p>
                            </div>
                            <div class="col-xs-12 text-center">
                                <a href="javascript:void(0)" class="send-fault" data-dismiss="modal">Close</a>
                            </div>
                        </div>
                        <!--end feedback content-->
                    </div>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->*@

<script type="text/javascript">
    function BuyCourse(courseId) {
        $.ajax({
            url: urlConfig("/Home/BuyCourse"),
            data: {
                __RequestVerificationToken: $('input[name=__RequestVerificationToken]').val(),
                courseId: courseId
            },
            type: "POST"
        }).success(function (data) {
            if (data.error_code != "0") {
                // fail
                $('#message-dialog').modal('show');
                $('#message-content').html(data.error_content);
            } else {
                $('#message-dialog').modal('show');
                $('#message-content').html(data.error_content);
                //this.style.display = "none";
            }
        });
    };

    function RenewSub(courseId) {
        $.ajax({
            url: urlConfig("/Home/Subscribe"),
            data: {
                __RequestVerificationToken: $('input[name=__RequestVerificationToken]').val(),
                courseId: courseId
            },
            type: "POST"
        }).success(function (data) {
            if (data.error_code != "0") {
                // fail
                $('#message-dialog').modal('show');
                $('#message-content').html(data.error_content);
            } else {
                $('#message-dialog').modal('show');
                $('#message-content').html(data.error_content);
                //this.style.display = "none";
            }
        });
    };
</script>