@using EnVisage.Code
@using EnVisage.Models
@using EnVisage.Code.HtmlHelpers
@model EnVisage.Models.ExpenditureCategoryModel
@{
    ViewBag.Title = Model.Id != Guid.Empty ? "Edit " + Model.Name : "Add New Expenditure Category";
}

@section scripts
{
  <script type="text/javascript">
      emulateNavUrl = "/ExpenditureCategory";
  </script>

  <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
    <script src="~/Scripts/CustomValidation.js"></script>

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

		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.ClientIdFor(model => model.Type) option:selected').text() == "Labor")
                  $('#@Html.ClientIdFor(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 () {
            //loadRateList('@Model.Id');

        if ('@Model.UseType' == "Fee") {
            //loadFeeCalculationList('@Model.Id');
          }

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

    });

  }

    @*function loadRate(id) {
        var url = "@Url.Action("LoadRate")?expenditureCategory=@Model.Id";
        if (id != null)
            url += "&rateId=" + id;
        $('#rateTable').load(url, null, function () { $(".datepicker").datepicker(); });
    }*@

    @*function loadRateList(id) {

        $('#rateTable').load("@Url.Action("LoadRateList")?expenditureCategoryId=" + id);
    }*@

    @*function loadDeleteRate(id) {

       $('#rateTable').load("@Url.Action("DeleteRate")?rateId=" + 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.ClientIdFor(model => model.UseType) option:selected').text();
        if (val == 'Calculated')
            $('#listCalcCat').show();
        else $('#listCalcCat').hide();
    }

    function categoryChanged() {
        console.log('showing');
        var val = $('#@Html.ClientIdFor(model => model.Type) option:selected').text();
        if (val == 'Labor')
            $('#@Html.ClientIdFor(model => model.UseType) option:contains("Cost")').hide();
        else $('#@Html.ClientIdFor(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 == EnVisage.Models.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 == EnVisage.Models.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)
            }
          <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">
                @if (Model.Id == Guid.Empty)
                {
                  @Html.DropDownListFor(model => model.ExpenditureId, Utils.GetExpenditures(), new { @class = "form-control" })
                }
                else
                {
                  @Html.DropDownListFor(model => model.ExpenditureId, Utils.GetExpenditures(), 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">
                @if (Model.Id == Guid.Empty)
                {
                    @Html.DropDownListFor(model => model.Type, Utils.GetCategoryTypes(), new { @class = "form-control disabled", @onchange = "categoryChanged()"})
                }
                else
                {
                    @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.UseType, "Usage", new { @class = "control-label col-sm-2" })
              <div class="col-sm-10">
                @if (Model.Id == Guid.Empty)
                {
                  @Html.DropDownListFor(model => model.UseType, Utils.GetUseTypes(), new { @class = "form-control", @onchange = "usageChanged()" })
                }
                else
                {
                  @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">

                            @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>