@model PantheonRA.WebApi.Contracts.TravelOrderDistance
@{
    var distanceNum = (int)ViewBag.Enumerator;
    var distancesId = "DistanceViewModels[" + distanceNum + "].Distance.{0}";
    var homeAddress = string.Empty;
    bool fromCreate = ViewBag.FromCreate != null ? (bool)ViewBag.FromCreate : false;
    var dailyAllowId = string.Format("{0}-{1}", "expand-dailyAllow", distanceNum);
    var isPrintOpt = ViewBag.IsPrintOpt;
    var type = "Distances";
}

<table id="DistancesTable-@distanceNum"
       class="table table-bordered destination-collapse-table input-no-bottom-border to-custom-mobile-table distance-PN"
       data-grid-id="travel-orders">
    <tbody>
        <tr id="@distanceNum">
            <td class="hidden" data-column-id="HiddenFields" data-sortable="false">
                <input type="hidden"
                       id="@string.Format("{0}-{1}", distanceNum, "DeletedDistance")"
                       name="@string.Format(distancesId, "Deleted")"
                       value=@Model.Deleted />

                <input type="hidden"
                       id="@string.Format("{0}-{1}", distanceNum, "OrdinalNumberDistance")"
                       name="@string.Format(distancesId, "OrdinalNumber")"
                       value="@Model.OrdinalNumber" />

                <input type="hidden"
                       id="@string.Format("{0}-{1}", distanceNum, "AcKeyDistance")"
                       name="@string.Format(distancesId, "AcKey")"
                       value="@Model.AcKey" />

                <input type="hidden"
                       id="@string.Format("{0}-{1}", distanceNum, "acSubjectDistance")"
                       name="@string.Format(distancesId, "acSubject")"
                       value="@Model.acSubject" />

                <input type="hidden"
                       id="@string.Format("{0}-{1}", distanceNum, "CityDistance")"
                       name="@string.Format(distancesId, "City")"
                       value="@Model.City" />

                <input type="hidden"
                       id="@string.Format("{0}-{1}", distanceNum, "CountryDistance")"
                       name="@string.Format(distancesId, "Country")"
                       value="@Model.Country" />

                <input type="hidden"
                       id="@string.Format("{0}-{1}", distanceNum, "PostDistance")"
                       name="@string.Format(distancesId, "Post")"
                       value="@Model.Post" />

                <input type="hidden"
                       id="@string.Format("{0}-{1}", distanceNum, "ReturnNoteDistance")"
                       name="@string.Format(distancesId, "ReturnNote")"
                       value="@Model.ReturnNote" />
            </td>

            <td style="width: 15%; border-left:none !important" class="travelorder-dtpicker" data-column-id="DateFrom" data-sortable="false">
                <div class="form-group">
                    <label class="control-label">@Loc.DateFrom</label>
                    <div class="input-group">
                        <span class="input-group-addon" style="border-bottom:none"><i class="far fa-calendar alt"></i></span>
                        <input type="text"
                               id="@string.Format("{0}-{1}", distanceNum, "DateHourFrom")"
                               name="@string.Format(distancesId, "DateHourFrom")"
                               value="@Model.DateHourFrom"
                               class="form-control custom-datetimepicker distance-dt-picker"
                               inputmode="none"
                               onfocusout="updateTravelOrderInput('DistancesTable-@distanceNum', '@distanceNum', '@type');" />
                    </div>
                </div>
            </td>
            <td style="width: 15%" class="DateHourFromMin travelorder-dtpicker" data-column-id="DateTo" data-sortable="false">
                <div class="form-group">
                    <label class="control-label">@Loc.DateTo</label>
                    <div class="input-group">
                        <span class="input-group-addon" style="border-bottom:none"><i class="far fa-calendar alt"></i></span>
                        <input type="text"
                               id="@string.Format("{0}-{1}", distanceNum, "DateHourTo")"
                               name="@string.Format(distancesId, "DateHourTo")"
                               value="@Model.DateHourTo"
                               onfocusout="saveChanges(this.id)"
                               inputmode="none"
                               class="form-control custom-datetimepicker distance-dt-picker"
                               @(fromCreate ? "autofocus" : string.Empty) />
                    </div>
                </div>
            </td>
            <td label="@Loc.CounterBefore" style="width: 10%; white-space: nowrap;" data-column-id="CounterBefore">
                <div class="form-group">
                    <label class="control-label hidden-xs">@Loc.CounterBefore</label>
                    <div>
                        <input type="text"
                               id="@string.Format("{0}-{1}", distanceNum, "KMCounterBeforeString")"
                               name="@string.Format(distancesId, "KMCounterBeforeString")"
                               value="@Model.KMCounterBeforeString"
                               onchange="sumFields(['@string.Format("{0}-{1}", distanceNum, "KMCounterBeforeString")', '@string.Format("{0}-{1}", distanceNum, "KmString")'], '@string.Format("{0}-{1}", distanceNum, "KMCounterAfterString")');
                                         updateTravelOrderInput('DistancesTable-@distanceNum', '@distanceNum', '@type');"
                               class="form-control thousands-no-decimals" />
                    </div>
                </div>
            </td>
            <td label="@Loc.Distance" style="width: 10%" data-column-id="Distance">
                <div class="form-group">
                    <label class="control-label hidden-xs">@Loc.Distance</label>
                    <div>
                        <input type="text"
                               id="@string.Format("{0}-{1}", distanceNum, "KmString")"
                               name="@string.Format(distancesId, "KmString")"
                               value="@Model.KmString"
                               onchange="sumFields(['@string.Format("{0}-{1}", distanceNum, "KMCounterBeforeString")', '@string.Format("{0}-{1}", distanceNum, "KmString")'], '@string.Format("{0}-{1}", distanceNum, "KMCounterAfterString")');
                                         updateTravelOrderInput('DistancesTable-@distanceNum', '@distanceNum', '@type');"
                               class="form-control thousands-no-decimals" />
                    </div>
                </div>
            </td>
            <td label="@Loc.CounterBy" style="width: 10%; white-space: nowrap;" data-column-id="CounterAfter">
                <div class="form-group">
                    <label class="control-label hidden-xs hidden-sm">@Loc.CounterBy</label>
                    <div>
                        <input type="text"
                               id="@string.Format("{0}-{1}", distanceNum, "KMCounterAfterString")"
                               name="@string.Format(distancesId, "KMCounterAfterString")"
                               value="@Model.KMCounterAfterString"
                               class="form-control"
                               onchange="updateTravelOrderInput('DistancesTable-@distanceNum', '@distanceNum', '@type');" />
                    </div>
                </div>
            </td>
            <td label="@Loc.Mileage" class="disabled-td" style="width: 10%;" data-column-id="Mileage">
                <div class="form-group">
                    <label class="control-label hidden-xs hidden-sm">@Loc.Mileage</label>
                    <div>
                        <input type="text"
                               id="@string.Format("{0}-{1}", distanceNum, "Mileage")"
                               name="@string.Format(distancesId, "Mileage")"
                               value="@Model.Mileage.Value.ToString("N2")"
                               class="form-control mileage-input-value"
                               data-km="@Model.KmString"
                               data-num="@distanceNum"
                               readonly />
                    </div>
                </div>
            </td>
            <td label="@Loc.TravelPurpose" style="width: 10%; white-space: nowrap;" data-column-id="TravelPurpose">
                <div class="form-group">
                    <label class="control-label hidden-xs hidden-sm">@Loc.TravelPurpose</label>
                    <div>
                        <input type="text"
                               list="TravelPurposeList"
                               id="@string.Format("{0}-{1}", distanceNum, "Purpose")"
                               name="@string.Format(distancesId, "Purpose")"
                               class="form-control"
                               value="@Model.Purpose"
                               autocomplete="off"
                               placeholder="@Loc.TravelPurpose" 
                               onchange="updateTravelOrderInput('DistancesTable-@distanceNum', '@distanceNum', '@type');" />
                    </div>
                </div>
            </td>
            <td label="@Loc.CostCarrier" style="width: 10%" data-column-id="CostDrv">
                <div class="form-group travelOrder-form-group">
                    <label class="control-label hidden-xs hidden-sm">@Loc.CostCarrier</label>
                    <div class="costDrvDropdown">
                        <select id="@string.Format("{0}-{1}", distanceNum, "CostDrv")"
                                name="@string.Format(distancesId, "CostDrv")"
                                class="form-control select2withAPI costdrv-PN"
                                data-placeholder="@Loc.CostCarrier"
                                data-search-width="150"
                                allow-clear="true"
                                data-url=@Url.Action("GetCostDrv", "CostDrv")
                                onchange="updateTravelOrderInput('DistancesTable-@distanceNum', '@distanceNum', '@type');">
                            <option selected value="@Model.CostDrv">@Model.CostDrv</option>
                        </select>
                    </div>
                </div>
            </td>
            <td label="@Loc.Department" style="width: 10%" data-column-id="Department" data-default-hidden="true">
                <div class="form-group travelOrder-form-group">
                    <label class="control-label hidden-xs hidden-sm">@Loc.Department</label>
                    <div class="departmentDropdown">
                        <select id="@string.Format("{0}-{1}", distanceNum, "Dept")"
                                name="@string.Format(distancesId, "Dept")"
                                class="form-control select2withAPI department-PN"
                                data-placeholder="@Loc.Department"
                                data-search-width="150"
                                allow-clear="true"
                                data-url=@Url.Action("GetDepartments", "Employees")
                                onchange="updateTravelOrderInput('DistancesTable-@distanceNum', '@distanceNum', '@type');">
                            <option selected value="@Model.Dept">@Model.Dept</option>
                        </select>
                    </div>
                </div>
            </td>
        </tr>
    </tbody>
</table>

<datalist id="TravelPurposeList">
    @for (var j = 0; j < Model.TravelPurposes.Count; j++)
    {
        <option>@Model.TravelPurposes[j].Note</option>
    }
</datalist>