@using BuddyFinance.Integration.Models.Enums
@using BuddyFinance.Integration.Models.Profiles

@removeTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
    ViewData["Title"] = "Profile";
    var model = (BuddyFinance.Integration.Models.Profiles.Profile)ViewData["Profile"];
}

<style>
    iframe {
        position: fixed;
        background: #000;
        border: none;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
</style>

@section scripts{
    <script>
        var ProfileData = null;
    </script>
    <script src="~/lib/angular-base64-upload/angular-base64-upload.js"></script>
    <script src="~/app/Models/enums.js"></script>
    <script src="~/app/Models/ProfileModel.js"></script>
    <script src="~/app/controllers/ProfileController.js?v=@DateTime.Now.ToString("yymmddhmm")"></script>

    <script>
        angular.element(document).ready(function () {

            @if (ViewData["Profile"] != null)
            {
                <text>
                    //ProfileData = Html.Raw(Json.Serialize(model, new JsonSerializerSettings { ContractResolver = new Newtonsoft.Json.Serialization.DefaultContractResolver() }))
                    ProfileData = @Html.Raw(JsonSerializer.Serialize(model))
                </text>
            }

             $("#body").attr("ng-controller", "profileController");
             angular.bootstrap(document.getElementById("body"), ['profile']);

            //angular.bootstrap(document.getElementById("profile"), ['profile']);

            //$.ajax({
            //    url: BuddyFinance.rootPath + "api/profile"
            //}).done(function (response) {
            //    var result = response.Result;

            //    if (result.EmploymentDetail && result.EmploymentDetail.EmploymentStartDate != ''
            //        && result.EmploymentDetail.EmploymentStartDate != null)
            //        result.EmploymentDetail.EmploymentStartDate = moment(result.EmploymentDetail.EmploymentStartDate.substring(0, 10));
            //    //= {
            //    //    startDate: moment(result.EmploymentDetail.EmploymentStartDate.substring(0, 10)) //yyyy-MM-dd
            //    //};

            //    if (result.EmploymentDetail && result.EmploymentDetail.EmploymentEndDate != ''
            //        && result.EmploymentDetail.EmploymentEndDate != null)
            //        result.EmploymentDetail.EmploymentEndDate = moment(result.EmploymentDetail.EmploymentEndDate.substring(0, 10));
            //    //= {
            //    //    startDate: moment(result.EmploymentDetail.EmploymentEndDate.substring(0, 10))
            //    //};


            //    if (result.BankingDetails == null || result.BankingDetails == undefined) {
            //        result.BankingDetails = new BuddyFinance.BankingDetail();
            //    }

            //    if (result.NextOfKin == null || result.NextOfKin == undefined) {
            //        result.NextOfKin = new BuddyFinance.NextOfKin();
            //    }


            //    ProfileData = result;

            //})

        });
    </script>
}

@* ng-controller="profileController" *@
<div class="container" id="profile" style="padding-top: 50px;">
    <div class="row">
        <div class="col-lg-12">
            <ul class="nav nav-tabs detail-menu hidden-xs">
                <li role="presentation" ng-class="window.location.pathname == BuddyFinance.rootPath + 'profile/details' ? 'active': ''"><a ui-sref="details" data-toggle="tab" data-target="#view-data"> <i class="fa fa-user-o"></i>  <span class="hidden-xs">Personal</span></a></li>
                <li role="presentation" ng-class="window.location.pathname == BuddyFinance.rootPath + 'profile/bankingdetails' ? 'active': ''"><a ui-sref="bankingdetails" data-toggle="tab" data-target="#view-data"><i class="fa fa-credit-card"></i> <span class="hidden-xs">Banking</span></a></li>
                <li role="presentation" ng-class="window.location.pathname == BuddyFinance.rootPath + 'profile/employment' ? 'active': ''"><a ui-sref="employment" data-toggle="tab" data-target="#view-data"><i class="fa fa-building-o"></i> <span class="hidden-xs">Employment</span> </a></li>
                @*<li role="presentation" ng-class="window.location.pathname == BuddyFinance.rootPath + 'profile/taxinformation' ? 'active': ''"><a ui-sref="taxinformation" data-toggle="tab" data-target="#view-data"><i class="fa fa-dot-circle-o"></i> <span class="hidden-xs">Tax</span></a></li>*@
                <li role="presentation" ng-class="window.location.pathname == BuddyFinance.rootPath + 'profile/addresses' ? 'active': ''"><a ui-sref="addresses" data-toggle="tab" data-target="#view-data"><i class="fa fa-location-arrow"></i> <span class="hidden-xs">Addresses</span></a></li>
                <li role="presentation" ng-class="window.location.pathname == BuddyFinance.rootPath + 'profile/documents' ? 'active': ''"><a ui-sref="documents" data-toggle="tab" data-target="#view-data"><i class="fa fa-file-text-o"></i> <span class="hidden-xs">Documents</span></a></li>

                @*@if (model.ProfileTypeId == (int)ProfileTypeEnum.Borrower)
            {*@
                @*//ng-show="Profile.ProfileType.Id == ProfileTypeEnum.Borrower"*@
                <li role="presentation" ng-class="window.location.pathname == BuddyFinance.rootPath + 'profile/nextofkin' ? 'active': ''"><a ui-sref="nextofkin" data-toggle="tab" data-target="#view-data"><i class="fa fa-address-card-o"></i> <span class="hidden-xs">Next Of kin</span></a></li>
                @*//}*@


                <li role="presentation" ng-class="window.location.pathname == BuddyFinance.rootPath + 'profile/account' ? 'active': ''"><a ui-sref="account" data-toggle="tab" data-target="#view-data"><i class="fa fa-lock"></i> <span class="hidden-xs">Change Password</span></a></li>
                @*@if (ViewData["Status"] != null && ((int)ViewData["Status"] == (int)ProfileStatusEnum.Pending || (int)ViewData["Status"] == (int)ProfileStatusEnum.Rejected))
            {*@

                @*<li role="presentation" ng-class="window.location.pathname.indexOf(BuddyFinance.rootPath + 'profile/activate') > -1 ? 'active': ''"><a ui-sref="activate" data-toggle="tab" data-target="#view-data"><i class="fa fa-file-text-o"></i> <span class="hidden-xs">Activate</span></a></li>*@


                @if (model.StatusId == (int)ProfileStatusEnum.Rejected)
                {
        <li ng-show="Profile.ProfileStatus.Id == ProfileStatusEnum.Rejected" role="presentation"
            ng-class="window.location.pathname == BuddyFinance.rootPath + 'profile/reapply' ? 'active': ''">
            <a ui-sref="reapply" data-toggle="tab" data-target="#view-data"><i class="fa fa-refresh"></i> <span class="hidden-xs">Re-apply</span></a>
        </li>
 } @*  }*@
            </ul>
        </div>
    </div>

    <div id="view-data" ng-cloak style="padding-top: 10px">
        <div style="max-width: 80%; text-align: center; margin-left: auto; margin-right: auto;">
            <div ng-show="Profile.ProfileStatus.Id == ProfileStatusEnum.Pending" class="alert alert-warning">
                <strong>Pending! </strong> Your application is still pending. Please ensure the information below is complete and correct.
            </div>
            <div ng-show="Profile.ProfileStatus.Id == ProfileStatusEnum.Rejected" class="alert alert-danger">
                <strong>Rejected! </strong> Your application has been rejected of the following reason(s): <br />
                {{Profile.Approval.RejectReason}}. <br /><br />
                Please update your information and click the re-apply button in order to have your application reviewed.
            </div>
            <div ng-show="Profile.ProfileStatus.Id == ProfileStatusEnum.Suspended" class="alert alert-danger">
                <strong>Account Suspendend! </strong> {{Profile.Suspension.Reason}}.
            </div>
        </div>
        <div ui-view></div>
    </div>
</div>

<div class="modal fade" id="previewModal" tabindex="-1" role="dialog" aria-labelledby="previewModalLabel">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="previewModalLabel">Preview Document</h4>
            </div>
            <div class="modal-body" id="previewContent" style="min-height: 500px">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">close</button>
            </div>
        </div>
    </div>
</div>