@model GODATA.Models.Ticket.CustomerModel

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

@*@using (Ajax.BeginForm("Create", "Ticket_CustomerInventory", new AjaxOptions { HttpMethod = "POST", OnBegin = "onBeginadd", OnSuccess = "onSuccessAddCustomer" }))
{*@
    @Html.ValidationSummary(true)
    @Html.HiddenFor(model => model.CustomerStateName, new { id = "customerStateName" })
    @Html.HiddenFor(model => model.CustomerOwnerStateName, new { id = "customerOwnerStateName" })

    @Html.HiddenFor(model => model.CustomerId, new { id = "CustomerId" })
    @Html.HiddenFor(model => model.CustomerType, new { id = "CustomerType" })



   <div id="divaddCustomer">
     <div>
        <div style="margin: 10px 0 2px 0;">
            <span>
                <p>Vehicle Details</p>
            </span>
        </div>
        <div>
            <table class="themeTable" cellpadding="5" cellspacing="0" width="100%">

                <tr>
                    <td class="tableCelllabel">
                        <span class="darktxt">Breakdown Reason </span><span class="error" style="color: #ee1d23">* </span>
                    </td>

                    <td class="tableCellinfo">

                        <select id="nature_of_problem_creation" multiple="multiple" style="width:160px;" onchange="setnatureofproblemCreation();"data-placeholder="-Select-"></select>


                        <span id="spanDescription_creation" class="error" style="display: none; color: #ee1d23; float: left;">* </span>

                    </td>
                </tr>
                <tr>
                    <td class="tableCelllabel">
                        <span class="darktxt">
                            @Html.LabelFor(model => model.VehicleRegistrationNumber)@*Registration Number*@
                        </span><span class="error" style="color: red"> * </span>
                    </td>
                    <td class="tableCellinfo">

                        @Html.Partial("../Inventory/RegistrationNo", new ViewDataDictionary { { "RegNo", @ViewBag.VRegNo }, { "id", "VehicleRegistrationNumber" }, { "name", "VehicleRegistrationNumber" }, { "BlurFunction", "checkIsVehicleExist" } })

                        @Html.ValidationMessageFor(model => model.VehicleRegistrationNumber)
                    </td>
                    <td class="tableCelllabel">
                        <span class="darktxt">
                            @Html.LabelFor(model => model.VehicleNumberPlate)
                        </span><span class="error" style="color: red"> * </span>
                    </td>
                    <td class="tableCellinfo">

                        <input type="text" class="form-control" maxlength="20" id="VehicleNumberPlate" name="VehicleNumberPlate" placeholder="Chassis No." value="@(@ViewBag.ChassisNumber)">
                        @Html.ValidationMessageFor(model => model.VehicleNumberPlate)
                    </td>
                </tr>
                <tr>
                    <td class="tableCelllabel">
                        <span class="darktxt">
                            @Html.LabelFor(model => model.CustomerVehicleModelTagging)
                        </span><span class="error" style="color: red"> * </span>
                    </td>
                    <td class="tableCellinfo">
                        <select id="ddproductVariant" name="ddproductVariant" onchange="getmodelno();">
                            <option value="Select" selected>Select</option>
                            <option value="Diesel">Diesel</option>
                            <option value="ELECTRIC">ELECTRIC</option>
                            <option value="CNG">CNG</option>
                        </select>
                        <span class="error" id="spnproductvariant" style="color: red"> * </span>
                    </td>

                    <td class="tableCelllabel">
                        <span class="darktxt">
                            @Html.LabelFor(model => model.VehicleModelNumber)
                        </span><span class="error" style="color: red"> * </span>
                    </td>

                    <td class="tableCellinfo SelectDD">
                        @*@Html.EditorFor(model => model.VehicleModelNumber)*@
                        @Html.DropDownListFor(model => model.VehicleModelNumber, (IEnumerable<SelectListItem>)ViewBag.VehicleModelNo, "-Select-", new { @id = "ddVehicleModleNo", @onchange = "getVehicleModelTagging()" })
                        @Html.ValidationMessageFor(model => model.VehicleModelNumber)
                    </td>
                    <td class="tableCellinfo" style="display:none;">

                        <input class="text-box single-line valid" data-val="true" data-val-required="*" id="CustomerVehicleModelTagging" name="CustomerVehicleModelTagging" type="text" value="LMD">
                        @Html.ValidationMessageFor(model => model.CustomerVehicleModelTagging)
                    </td>



                </tr>
                <tr>
                    <td class="tableCelllabel">
                        <span class="darktxt">
                            @Html.LabelFor(model => model.VehicleType)
                        </span><span class="error" style="color: red"> * </span>
                    </td>

                    <td class="tableCellinfo SelectDD" style="display:none">
                        <select id="ddVehicleType" name="VehicleType" onchange="GetVehicleTypeval();">
                            <option value="Select">-Select-</option>
                            <option value="LMD">LMD</option>
                            <option value="Bus">Bus</option>
                            <option value="HD">HD</option>
                        </select>
                    </td>
                    <td class="tableCellinfo">

                        <input type="text" id="txtvehicletype" disabled>
                    </td>


                    <td class="tableCelllabel">
                        <span class="darktxt">
                            @Html.LabelFor(model => model.KamUser)
                        </span>
                    </td>

                    @if (ViewBag.IsKamUser == "True")
                    {
                        <td class="tableCellinfo SelectDD">
                            <select id="ddKamUser" name="KamUser">
                                <option value="Yes" selected>Yes</option>
                                <option value="No">No</option>

                            </select>
                            <span id="spanKamUser" class="error" style="display: none; color: red">*</span>
                        </td>
                    }
                    else
                    {

                        <td class="tableCellinfo SelectDD">
                            <select id="ddKamUser1" name="KamUser">
                                <option value="Yes">Yes</option>
                                <option value="No" selected>No</option>

                            </select>
                            <span id="spanKamUser1" class="error" style="display: none; color: red">*</span>
                        </td>
                    }

                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div>
        <div style="margin: 10px 0 2px 0;">
            <span>
                <p>Customer/Driver Details
                @*<input type="checkbox" name="thirdPartyInfoupdatedornot" id="thirdPartyInfoupdatedornot"  style="width: 12px;margin-left: 6px;" /> (Changes Made to VECV DBM Data)</p>*@
                
               
               
            </span>
        </div>
        <div>
            <table class="themeTable" cellpadding="5" cellspacing="0" width="100%">
                <tbody>
                    <tr>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                                <label>Driver No</label></span><span class="error" style="color: red"> * </span>
                        </td>
                        <td class="tableCellinfo">

                            @Html.EditorFor(model => model.CustomerOwnerMobileNo1)
                            @Html.ValidationMessageFor(model => model.CustomerOwnerMobileNo1)
                        </td>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                                <label>Driver Name</label></span><span class="error" style="color: red"> * </span>
                        </td>
                        <td class="tableCellinfo">
                            @Html.EditorFor(model => model.CustomerOwnerName)
                            @Html.ValidationMessageFor(model => model.CustomerOwnerName)
                        </td>
                    </tr>
                    <tr>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                               <label>Customer No</label>
                            </span><span class="error" style="color: red"> * </span>
                        </td>
                        <td class="tableCellinfo">
                            @Html.EditorFor(model => model.CustomerMobileNumber1)
                            @Html.ValidationMessageFor(model => model.CustomerMobileNumber1)
                        </td>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                                <label>Customer Name</label>
                            </span><span class="error" style="color: red"> * </span>
                        </td>
                        <td class="tableCellinfo">
                            @Html.EditorFor(model => model.CustomerCustomerName)
                            @Html.ValidationMessageFor(model => model.CustomerCustomerName)
                        </td>

                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div style="display:none;">
        <div style="margin: 10px 0 2px 0;">
            <span>
                @*<p>Customer Details</p>*@
                <p>Customer Details <input type="checkbox" onchange="chkBoxSameasCustomerChange()" style="width: 12px;margin-left: 6px;"/> (Customer info same as above) </p>
                  
            </span>
        </div>
        <div >
            <table class="themeTable" cellpadding="5" cellspacing="0" width="100%">
                <tbody>
                    
                    <tr>

                        <td class="tableCelllabel">
                            <span class="darktxt">
                                @Html.LabelFor(model => model.CustomerOwnerEmailId)
                            </span>
                            @*<span class="error" color: red"> * </span>*@
                        </td>
                        <td class="tableCellinfo">
                            @Html.EditorFor(model => model.CustomerOwnerEmailId)
                            @Html.ValidationMessageFor(model => model.CustomerOwnerEmailId)
                        </td>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                                @Html.LabelFor(model => model.CustomerOwnerAddress)
                            </span>
                        </td>
                        <td class="tableCellinfo">
                            @Html.EditorFor(model => model.CustomerOwnerAddress)

                        </td>
                    </tr>

                    <tr>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                                @Html.LabelFor(model => model.CustomerOwnerState)
                            </span><span class="error" style="color: red"> * </span>
                        </td>
                        <td class="tableCellinfo SelectDD">
                            @Html.DropDownListFor(model => model.CustomerOwnerState, (IEnumerable<SelectListItem>)ViewBag.StateList, "-Select-", new { @id = "ddOwnerState", @onchange = "LoadCityList(id)" })
                            @Html.ValidationMessageFor(model => model.CustomerOwnerState)
                        </td>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                                @Html.LabelFor(model => model.CustomerOwnerCity)
                            </span><span class="error" style="color: red"> * </span>
                        </td>
                        <td class="tableCellinfo SelectDD">
                            <select id="ddOwnerCity" name="CustomerOwnerCity">
                                <option value="-Select-">-Select-</option>
                            </select>
                            <span id="spanOwnerCity" class="error" style="display: none; color: red">*</span>
                            @Html.ValidationMessageFor(model => model.CustomerOwnerCity)
                        </td>

                    </tr>

                    <tr>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                                @Html.LabelFor(model => model.CustomerEmailId)
                        </td>
                        <td class="tableCellinfo">
                            @Html.EditorFor(model => model.CustomerEmailId)
                            @Html.ValidationMessageFor(model => model.CustomerEmailId)
                        </td>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                                @Html.LabelFor(model => model.CustomerAddress)
                            </span>
                        </td>
                        <td class="tableCellinfo">
                            @Html.EditorFor(model => model.CustomerAddress)

                        </td>
                    </tr>
                    <tr>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                                @Html.LabelFor(model => model.CustomerState)
                            </span>
                        </td>
                        <td class="tableCellinfo SelectDD">
                            @Html.DropDownListFor(model => model.CustomerState, (IEnumerable<SelectListItem>)ViewBag.StateList, "-Select-", new { @id = "ddCustomerState", @onchange = "LoadCityList(id)" })

                        </td>
                        <td class="tableCelllabel">
                            <span class="darktxt">
                                @Html.LabelFor(model => model.CustomerCity)
                            </span>
                        </td>
                        <td class="tableCellinfo SelectDD">
                            <select id="ddCustomerCity" name="CustomerCity">
                                <option value="-Select-">-Select-</option>
                            </select>
                            <span id="spanCustomerCity" class="error" style="display: none; color: red">*</span>

                        </td>
                    </tr>

                    @*added on 6-07-2020 for kam user*@
                    <tr>
                        <td class="tableCellinfo SelectDD">
                            @*@Html.EditorFor(model => model.VehicleModelNumber)*@
                            @*@Html.DropDownListFor(model => model.InstallationDate, (IEnumerable<SelectListItem>)ViewBag.VehicleType, "-Select-", new { @id = "ddVehicleType" })*@


                            @(Html.Kendo().DatePicker()
              .Name("InstallationDate")
              .Start(CalendarView.Month)
              .Depth(CalendarView.Month)
              .Format("dd MMM yyyy")
        // .Value(DateTime.Now)
              .Max(DateTime.Now)
               .HtmlAttributes(new { @class = "kendo-make-readonly" })
              )
                            @Html.ValidationMessageFor(model => model.InstallationDate)
                        </td>

                    </tr>

                   
                </tbody>
            </table>
        </div>
    </div>
    <br />
    <div class="Create_Wrp" style="background: #f5f5f5; border-top: 1px solid #dedede; padding: 6px 0 6px 10px; margin-left: -8px; margin-bottom: -7px; width: 100.6%; margin-top: 5px;">
<input  type="hidden" id=hdncreateRegno"/>

        <input type="submit" value="Create" class="button_blue" onclick="onSuccessAddCustomer();"style="margin: 0px; height: 13px; width: auto;" />
        <input type="button" value="Cancel" class="button_blue" style="background: #ee2e22 !important; margin: 0px; height: 13px; width: auto;" onclick="btnCancelAddCustomer('#divAddCustomer');" />
    </div>
       </div>
@*}*@
    
<script>
    checkIfVRegistrationNoIsSame();
    checkIsVehicleExist();
    checkIfContactNoIsSame();
    checkIsOwnerExist();
    loadNatureOfProblemListCreation();
  
function GetVehicleTypeval(){

var ddlval=$("#ddVehicleType").val();

$('#txtvehicletype').val(ddlval);
}
    function bindVehicleProductVariant() {
        //// empty data source dropdown.
        //$("#ddVehicleModleNo").text("");

        //// by default add select text.
        //$("#ddVehicleModleNo").append($('<option></option>').val("").html("-Select-"));

        //// add data to dropdown.
        //if (vehicleProductVariantList) {
        //    //console.log('v p v');
        //    for (var counter = 0; counter < vehicleProductVariantList.length; counter++) {
        //        $("#ddVehicleModleNo").append($('<option></option>').val(vehicleProductVariantList[counter].Value).html(vehicleProductVariantList[counter].Text));
        //    }
        //}
    }
    bindVehicleProductVariant();

    setTimeout(function () {
        setFocus();
        GetVehicleDetailsBasedOnRegistrationNoThirdParty();
    }, 1000);

    function setFocus() {
        //alert();
        document.getElementById("VehicleRegistrationNumber").focus();
    }
    //on begin
    function onBegin() {
       // alert("begin");
        //if ($('#ddOwnerCity').find('option:selected').text() == "-Select-") {
        //    $("#spanOwnerCity").show();
        //    return false;
        //} 
        return true;
    } function onBeginadd() {
        alert("begin");
    }
function vehicletypeset(){

}

    
   function getmodelno() {
        var prodVariant = $('#ddproductVariant').val();
      

        var apiUrl = url + "Api/Admin?dealer=&dealer1=&dealer2&dealer3";
        var htmlval = " <option>select</option>";
        $.ajax({
            type: "Post",
            url: apiUrl,
            data: { Token: securityToken, UserId: userId, fuelValue: prodVariant },
            success: function (data) {              
                for (keyVar in data) {
                    console.log(data);
                    if (data.hasOwnProperty(keyVar)) {
                        htmlval += "<option value='" + data[keyVar].VehicleTypeId + "'>" + data[keyVar].VehicleTypeName+"</option>";
                    }

                }
                $('#ddVehicleModleNo').html('');
                $('#ddVehicleModleNo').append(htmlval);
            },
            complete: function () {
               
            }
        });
    }


</script>
<style type="text/css">
    .SelectDD select {
        width: 166px;
        padding: 0px 0px;
        text-indent: 3px;
    }

    .themeTable tbody td {
        width: 24% !important;
    }

    #divaddCustomer {height: 500px !important;
    }


     div.k-window {
        
        box-shadow: 20px 20px 30px #555 !important;
        border-radius: 0;
        padding-top: 0 !important;
    }

    .k-window-titlebar {
        border-radius: 0px !important;
    }

    .k-i-close {
        background-color: #fff;
        border-radius: 2px;
        width: inherit !important;
    }

    .k-window-titlebar.k-header {
        background: url("/Content/css/images/infowindow_head-bg.png") repeat-x left top;
        height: 18px !important;
        background-color: transparent !important;
        line-height: 16px;
    }

    .tableCellinfo .text-box {
        width: 164px;
    }

    .regNoTextTransform {
        text-transform: uppercase;
    }
	
	.k-widget.k-window.responsive_popup.k-window2 {
        margin-left: 60px; /* adjust value as needed */
    }

    .k-widget.k-window.responsive_popup {
        margin-left: 60px; /*adjust value as needed */
    }
</style>