@using EnVisage.Code
@using EnVisage.Models
@model ExpenditureCategoryModel
@{
    ViewBag.Title = Model.Id != Guid.Empty ? "Edit " + Model.Name : "Add New Expenditure Category";
    var expenditures = ViewBag.Expenditures as IEnumerable<SelectListItem>;
}

@section scripts
{
    <script type="text/javascript">
        emulateNavUrl = "/ExpenditureCategory";
        var datePickerOptions = {
            format: 'm/d/yyyy',
            autoclose: true,
            startDate: '@(Constants.MIN_SELECTABLE_DATE)',
            endDate: '@(Constants.MAX_SELECTABLE_DATE)'
        };

        init.push(function () {

            @if (Model.Id != Guid.Empty)
            {
                <text>
                StartEdit('ExpenditureCategory', '@Model.Id', "#btnDelete", "#btnsave", "erorMsgPlaceholder");
                </text>
            }
            $(".datepicker").datepicker(datePickerOptions);

            $('#btnsave').click(function () {
                if ($(this).parents('form').valid())
                    blockUI();
            });

            if ($('#@Html.IdFor(model => model.Type) option:selected').text() == "Labor")
                $('#@Html.IdFor(model => model.UseType) option:contains("Cost")').hide();

        });

        function ResetCalculateCategoryEdit() {
            $('#editCalcCat #Id').val('00000000-0000-0000-0000-000000000000');
            $('#editCalcCat #ProcessOrder').val('');
            $('#editCalcCat #ChildId').prop('selectedIndex', 0);
            $('#editCalcCat #FactorType').prop('selectedIndex', 0);
            $('#editCalcCat #FactorInt').val('');
        }
        function SaveCalculateCategoryEdit() {
            var calcs = [];
            if ($('#serialzidCalcs').val())
                calcs = JSON.parse($('#serialzidCalcs').val());
            var length = calcs.length;
            calcs[length] = {
                Id: $('#editCalcCat #Id').val(),
                ParentId: $('Id').val(),
                ChildId: $('#editCalcCat #ChildId').find(":selected").val(),
                FactorType: $('#editCalcCat #FactorType').find(":selected").val(),
                ProcessOrder: $('#editCalcCat #ProcessOrder').val(),
                FactorInt: $('#editCalcCat #FactorInt').val()
            }
            var htmlToAppend = '<tr id=\'' + length + '\'><td>' + $('#editCalcCat #ProcessOrder').val() + '</td><td>' + $('#ExpenditureId option:selected').text() + '</td><td>' + $('#Type').val() + '</td><td>Calculated</td>' +
                '<td>' + $('#editCalcCat #FactorType').find(":selected").text() + '</td><td>' + $('#editCalcCat #FactorInt').val() + '</td><td>' +
              '<a class="btn btn-primary lockable" onclick="LoadCalculateCategoryEdit1(\'' + length + '\');" href="#">Edit</a> ' +
                '<a class="btn btn-danger lockable" onclick="LoadCalculateCategoryDelete(\'' + length + '\');" href="#">Delete</a></td></tr>';
            $('#calcCatTable').append(htmlToAppend)
            $('#serialzidCalcs').val(JSON.stringify(calcs));

            $('#editCalcCat').modal("hide");
            //ResetCalculateCategoryEdit();
        }

        function LoadCalculateCategoryDelete(id) {
            var calcs = [];
            if ($('#serialzidCalcs').val())
                calcs = JSON.parse($('#serialzidCalcs').val());
            calcs = calcs.slice(id, 1);
            $('#serialzidCalcs').val(JSON.stringify(calcs));
            $('#' + id).remove();
        }

        function LoadCalculateCategoryEdit1(id) {
            if (id == '00000000-0000-0000-0000-000000000000') {
                ResetCalculateCategoryEdit();
                $('#editCalcCat').modal("show");
            }
            else {
                var calcs = jQuery.parseJSON($('#serialzidCalcs').val());
                var item = calcs[id];
                $('#editCalcCat #Id').val('00000000-0000-0000-0000-000000000000');
                $('#editCalcCat #ProcessOrder').val(item['ProcessOrder']);
                $('#editCalcCat #ChildId').prop('selectedIndex', 0);
                $('#editCalcCat #FactorType option:eq(' + item['FactorType'] + ')').prop('selected', true);
                $('#editCalcCat #FactorInt').val(item['FactorInt']);
                $('#editCalcCat').modal("show");
            }
        }
    </script>
}

<script type="text/javascript">
    if ('@Model.Id' != '@Guid.Empty') {
        init.push(function () {
            if ('@Model.UseType' == "Fee") {
                //loadFeeCalculationList('@Model.Id');
            }

            if ('@Model.UseType' == "Calculated") {
                //loadCalculatesCategoryList('@Model.Id');
            }

        });

    }

    function loadFeeCalculation(id) {
        var url = "@Url.Action("LoadFeeCalculation")?expenditureCategory=@Model.Id";
        if (id != null)
            url += "&rateId=" + id;
        $('#feeCalculation').load(url);

        @*$('#feeCalculation').load("@Url.Action("LoadFeeCalculation")?feeCalculationId=" + id + "&expenditureCategory=" + '@Model.Id');*@
    }

    function loadFeeCalculationList(id) {

        $('#feeCalculation').load("@Url.Action("LoadFeeCalculationList")?expenditureCategoryId=" + id);
    }

    function loadDeleteFeeCalculation(id) {

        $('#feeCalculation').load("@Url.Action("DeleteFeeCalculation")?feeCalculationId=" + id);
    }

    function loadCalculatesCategory(id) {

        var url = "@Url.Action("LoadCalculatesCategory")?expenditureCategory=@Model.Id";
        if (id != null)
            url += "&rateId=" + id;
        $('#calculatesCategories').load(url, null, function () { $(".datepicker").datepicker(datePickerOptions); });
        @*$('#calculatesCategories').load("@Url.Action("LoadCalculatesCategory")?calculatesCategoryId=" + id + "&expenditureCategory=" + '@Model.Id');*@
    }
    function usageChanged() {
        console.log('showing');
        var val = $('#@Html.IdFor(model => model.UseType) option:selected').text();
        if (val == 'Calculated')
            $('#listCalcCat').show();
        else $('#listCalcCat').hide();
    }

    function categoryChanged() {
        console.log('showing');
        var val = $('#@Html.IdFor(model => model.Type) option:selected').text();
        if (val == 'Labor')
            $('#@Html.IdFor(model => model.UseType) option:contains("Cost")').hide();
        else $('#@Html.IdFor(model => model.UseType) option:contains("Cost")').show();
    }
    @* function loadCalculatesCategoryList(id) {

        $('#calculatesCategories').load("@Url.Action("LoadCalculatesCategoryList")?expenditureCategoryId=" + id);
    }

    function loadDeleteCalculatesCategory(id) {

        $('#calculatesCategories').load("@Url.Action("DeleteCalculatesCategory")?calculatesCategoryId=" + id);
    }*@


</script>

<div id="erorMsgPlaceholder"></div>
<div class="row">
    <div class="col-sm-12">
        <ul id="uidemo-tabs-default-demo" class="nav nav-tabs">
            <li class="active">
                <a href="#general" data-toggle="tab">General<span class="badge badge-primary"></span></a>
            </li>
            @if (Model.UseType == ExpenditureCategoryModel.UseTypes.Calculated && Model.Id != Guid.Empty)
            {
                <li>
                    <a href="#calculatesCategories" data-toggle="tab">Calculates Categories <span class=" badge badge-primary"></span></a>
                </li>
            }
            else
            {
                <li class="disabled disabledTab">
                    <a>Calculates Categories<span class="badge badge-primary"></span></a>
                </li>
            }
            @if (Model.UseType == ExpenditureCategoryModel.UseTypes.Fee && Model.Id != Guid.Empty)
            {
                <li>
                    <a href="#feeCalculation" data-toggle="tab">Fee Calculation <span class="badge badge-primary"></span></a>
                </li>
            }
            else
            {
                <li class="disabled disabledTab">
                    <a>Fee Calculation <span class="badge badge-primary"></span></a>
                </li>
            }

            @if (Model.Id == Guid.Empty)
            {
                <li class="disabled disabledTab">
                    <a>Rate<span class="badge badge-primary"></span></a>
                </li>
            }
            else
            {
                <li>
                    <a href="#rateTable" data-toggle="tab">Rate<span class="badge badge-primary"></span></a>
                </li>
            }

        </ul>

        <div class="tab-content tab-content-bordered">
            <div class="tab-pane fade in active" id="general">
                @using (Html.BeginForm())
                {
                    @Html.AntiForgeryToken()

                    if (Model.Id != Guid.Empty)
                    {
                        @Html.HiddenFor(t => t.ExpenditureId)
                        @Html.HiddenFor(t => t.UseType)
                        @Html.HiddenFor(t => t.Type)
                        @Html.HiddenFor(t => t.ResourceCount)
                    }
                    <div class="form-horizontal">
                        @Html.ValidationSummary(true)
                        @Html.HiddenFor(model => model.Id)


                        <div class="form-group">
                            @Html.LabelFor(model => model.ExpenditureId, "Expenditure", new { @class = "control-label col-sm-2  disabled" })
                            <div class="col-sm-10">
                                @(Model.Id == Guid.Empty ? 
                                    Html.DropDownListFor(model => model.ExpenditureId, expenditures, new {@class = "form-control"}) : 
                                    Html.DropDownListFor(model => model.ExpenditureId, expenditures, new {@class = "form-control disabled", disabled = "disabled"}))
                                @Html.ValidationMessageFor(model => model.ExpenditureId)
                            </div>
                        </div>

                        <div class="form-group">
                            @Html.LabelFor(model => model.Name, new { @class = "col-sm-2 control-label" })
                            <div class="col-sm-10">
                                @Html.TextBoxFor(model => model.Name, new { @class = "form-control" })
                                @Html.ValidationMessageFor(model => model.Name)
                            </div>
                        </div>

                        <div class="form-group">
                            @Html.LabelFor(model => model.GLId, "GL Account Name", new { @class = "control-label col-sm-2" })
                            <div class="col-sm-10">
                                @Html.DropDownListFor(model => model.GLId, Utils.GetGLAccounts(), new { @class = "form-control disabled" })
                                @Html.ValidationMessageFor(model => model.GLId)
                            </div>
                        </div>

                        <div class="form-group">
                            @Html.LabelFor(model => model.UOMId, new { @class = "control-label col-sm-2" })
                            <div class="col-sm-10">
                                @Html.DropDownListFor(model => model.UOMId, Utils.GetUnitsOfMeasure(), new { @class = "form-control disabled" })
                                @Html.ValidationMessageFor(model => model.UOMId)
                            </div>
                        </div>

                        <div class="form-group">
                            @Html.LabelFor(model => model.CreditId, new { @class = "control-label col-sm-2" })
                            <div class="col-sm-10">
                                @Html.DropDownListFor(model => model.CreditId, Utils.GetCreditDepartments(), new { @class = "form-control disabled" })
                                @Html.ValidationMessageFor(model => model.CreditId)
                            </div>
                        </div>

                        <div class="form-group">
                            @Html.LabelFor(model => model.Type, "Category Type", new { @class = "control-label col-sm-2" })
                            <div class="col-sm-10">
                                @(Model.Id == Guid.Empty ? 
                                    Html.DropDownListFor(model => model.Type, Utils.GetCategoryTypes(), new {@class = "form-control disabled", onchange = "categoryChanged()"}) : 
                                    Html.DropDownListFor(model => model.Type, Utils.GetCategoryTypes(), new {@class = "form-control disabled", onchange = "categoryChanged()", disabled = "disabled"}))
                                @Html.ValidationMessageFor(model => model.Type)
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.AllowResourceAssignment, "Allow Resource assignments", new { @class = "control-label col-sm-2" })
                            <div class="col-sm-10">
                                @{ 
                                    var isChecked = (Model.AllowResourceAssignment);
                                    var checkedStr = "";
                                    if (isChecked || Model.Id == Guid.Empty)
                                    {
                                        checkedStr = "checked";
                                    }
                                    @(Model.ResourceCount > 0 ? 
                                        Html.CheckBoxFor(m => m.AllowResourceAssignment, new {@class = "control-label", @checked = checkedStr, disabled = "disabled"}) : 
                                        Html.CheckBoxFor(m => m.AllowResourceAssignment, new {@checked = checkedStr}))
                                }
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.UseType, "Usage", new { @class = "control-label col-sm-2" })
                            <div class="col-sm-10">
                                @(Model.Id == Guid.Empty ? 
                                        Html.DropDownListFor(model => model.UseType, Utils.GetUseTypes(), new {@class = "form-control", onchange = "usageChanged()"}) : 
                                        Html.DropDownListFor(model => model.UseType, Utils.GetUseTypes(), new {@class = "form-control", disabled = "disabled"}))
                                @Html.ValidationMessageFor(model => model.UseType)
                            </div>
                        </div>

                        @*  <div class="form-group">
                                @Html.LabelFor(model => model.CGEFX, "CGEFX", new { @class = "control-label col-sm-2" })
                                <div class="col-sm-10">
                                    @Html.DropDownListFor(model => model.CGEFX, Utils.GetCGEFX(), new { @class = "form-control disabled" })
                                    @Html.ValidationMessageFor(model => model.CGEFX)
                                </div>
                            </div>*@

                        <div class="form-group">
                            @Html.LabelFor(model => model.SystemAttributeOne, "System Attribute One", new { @class = "control-label col-sm-2" })
                            <div class="col-sm-10">
                                @Html.DropDownListFor(model => model.SystemAttributeOne, Utils.GetSystemAttributeOne(), new { @class = "form-control disabled" })
                                @Html.ValidationMessageFor(model => model.SystemAttributeOne)
                            </div>
                        </div>

                        <div class="form-group">
                            @Html.LabelFor(model => model.WksSubjectToFee, new { @class = "control-label col-md-2" })
                            <div class="col-md-10">
                                @Html.TextBoxFor(model => model.WksSubjectToFee)
                                @Html.ValidationMessageFor(model => model.WksSubjectToFee)
                            </div>
                        </div>
                        <div class="form-group" id="listCalcCat" style="display: none">
                            @if (SecurityManager.CheckSecurityObjectPermission(Areas.ExpenditureCategories, AccessLevel.Write))
                            {
                                ViewBag.AllowEdit = true;
                                <div class="control-label col-md-2">
                                    <a class="btn btn-primary lockable assign  " href="#" onclick="LoadCalculateCategoryEdit1('@Guid.Empty');"><i class="fa fa-plus"></i>Add Calculates Category</a>
                                </div>
                            }
                            <div class="col-md-10">
                                <input id="serialzidCalcs" type="hidden" name="serialzidCalcs" data-val="true">
                                <div class="table-light table-responsive">
                                    <table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered">
                                        <thead>
                                            <tr>
                                                <th>
                                                    Order
                                                </th>
                                                <th>
                                                    Name
                                                </th>
                                                <th>
                                                    Type
                                                </th>
                                                <th>
                                                    Use Type
                                                </th>
                                                <th>
                                                    Factor Type
                                                </th>
                                                <th>
                                                    Factor
                                                </th>
                                                <th></th>

                                            </tr>
                                        </thead>
                                        <tbody id="calcCatTable">
                                            @if (Model.CalculatesCategories != null)
                                            {
                                                foreach (var category in Model.CalculatesCategories)
                                                {
                                                    <tr>
                                                        <td>@category.ProcessOrder</td>
                                                        <td>
                                                            @category.ParentExpenditureCategory.Expenditure.Name
                                                        </td>
                                                        <td>@(category.ParentExpenditureCategory.Type.HasValue ? ((ExpenditureCategoryModel.CategoryTypes)category.ParentExpenditureCategory.Type.Value).ToDisplayValue() : string.Empty)</td>
                                                        <td>@(category.ParentExpenditureCategory.UseType.HasValue ? ((ExpenditureCategoryModel.UseTypes)category.ParentExpenditureCategory.UseType.Value).ToDisplayValue() : string.Empty)</td>
                                                        <td>@(category.FactorType.HasValue ? ((CalculatesCategoryModel.FactorTypes)category.FactorType.Value).ToDisplayValue() : string.Empty)</td>
                                                        <td>@(category.FactorInt.HasValue ? category.FactorInt.Value.ToString() : string.Empty)</td>
                                                        @if (ViewBag.AllowEdit != null && ViewBag.AllowEdit == true)
                                                        {
                                                            <td>
                                                                <a href="#" onclick="LoadCalculateCategoryEdit1('@category.Id');" class="btn btn-primary lockable"><i class="fa fa-edit"></i>Edit</a>
                                                                <a class="btn btn-danger  lockable" href="#" onclick="LoadCalculateCategoryDelete('@category.Id');"><i class="fa fa-trash-o"></i>Delete</a>
                                                            </td>
                                                        }
                                                    </tr>
                                                }
                                            }
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-md-offset-2 col-md-10">
                                <a class="btn btn-primary" href="@Url.Action("Index", "ExpenditureCategory")"><i class="fa fa-backward"></i>Back to list</a>
                                <button type="submit" class="btn btn-success" id="btnsave"><i class="fa fa-save"></i>Save</button>
                            </div>
                        </div>
                    </div>
                }
            </div>
            <div class="tab-pane fade" id="calculatesCategories">
                @{ Html.RenderPartial("_calculatesContainer", Model.CalculatesCategories);}
            </div>
            <div class="tab-pane fade" id="feeCalculation">
                @{ Html.RenderPartial("_feesContainer", Model.Fees);}
            </div>
            <div class="tab-pane fade" id="rateTable">
                @{ Html.RenderPartial("_ratesContainer", Model.Rates);}
            </div>
        </div>
    </div>

    <!-- Modal -->
    <div id="editView" class="modal fade" tabindex="-1" role="dialog" style="display: none;" data-backdrop="static">
        <div class="modal-dialog">
            <div class="modal-content" id="editCC">
                <script type="text/javascript">
                    function saveCalculatesCategory() {
                    }
                </script>


            </div>
            <!-- / .modal-content -->
        </div>
        <!-- / .modal-dialog -->
    </div>
    <!-- /.modal -->
    <!-- / Modal -->
    <!-- Modal -->
    <div id="editCalcCat" class="modal fade" tabindex="-1" role="dialog" style="display: none;" data-backdrop="static">
        <div class="modal-dialog">
            <div class="modal-content">

                <input id="Id" type="hidden" name="Id" data-val-required="The Id field is required." data-val="true">
                <input name="DeleteExpenditure2ExpenditureId" id="DeleteExpenditure2ExpenditureId" type="hidden" />

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title">Edit Calculated Category</h4>
                </div>

                <div class="modal-body">
                    <div id="erorMsgPlaceholder"></div>
                    <div class="form-group">

                        <label class="col-sm-2 control-label" for="ProcessOrder">ProcessOrder</label>
                        <div class="col-sm-10">
                            <input class="form-control" data-val="true" data-val-number="The field ProcessOrder must be a number." id="ProcessOrder" min="1" name="ProcessOrder" value="" type="number">
                            <span class="field-validation-valid" data-valmsg-for="ProcessOrder" data-valmsg-replace="true"></span>
                        </div>

                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="ChildId">ChildId</label>
                        <div class="col-sm-10">
                            <select id="ChildId" class="form-control" name="ChildId" data-val-required="The ChildId field is required." data-val="true">
                                <option value="0710fc6e-2d83-4133-bac9-ad4a5acc8ea6">345646 ((CIT) Education Funding Capital I, LLC)</option>
                            </select>
                            <span class="field-validation-valid" data-valmsg-replace="true" data-valmsg-for="ChildId"></span>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="FactorType">FactorType</label>
                        <div class="col-sm-10">
                            <select id="FactorType" class="form-control" name="FactorType" data-val-number="The field FactorType must be a number." data-val="true">
                                <option value="1">Divide</option>
                                <option value="0">Multipiy</option>
                            </select>
                            <span class="field-validation-valid" data-valmsg-replace="true" data-valmsg-for="FactorType"></span>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="FactorInt">FactorInt</label>
                        <div class="col-sm-10">
                            <input id="FactorInt" class="form-control" type="text" value="" name="FactorInt" data-val-number="The field FactorInt must be a number." data-val="true">
                            <span class="field-validation-valid" data-valmsg-replace="true" data-valmsg-for="FactorInt"></span>
                        </div>
                    </div>

                    @Html.ValidationSummary(false, "The Calculates Category could not be saved due to the following errors:")
                    <div class="modal-footer" style="margin-bottom: 0;">
                        <div class="col-sm-offset-2 col-sm-10">
                            @*<a class="btn btn-primary" href="#" onclick="loadCalculatesCategoryList('@Model.ParentId');"><i class="fa fa-backward"></i> Back to list</a>*@
                            @*<a href="@Url.Action("ResetEditCalculatesCategory")?parentCategoryId=@Model.ParentId" class="btn btn-primary"><i class="fa fa-backward"></i> Back to list</a>*@
                            <button type="button" class="btn btn-success  lockable" id="btnsave" onclick="SaveCalculateCategoryEdit()"><i class="fa fa-save"></i>Save</button>

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

            </div>
        </div>
        <!-- / .modal-dialog -->
    </div>
    <!-- /.modal -->
    <!-- / Modal -->
</div>