<%@ Page Language="C#" AutoEventWireup="true" CodeFile="useregistration.aspx.cs" MasterPageFile="~/module/dashboardPage.master" Inherits="module_useregistration" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    	<!--start page wrapper -->
   
	<script type="text/javascript">
	    var path4 = null;
	    $(document).ready(function () {
	        var url4 = window.URL;
	        $("#File1").on("change", function () {
	            filenm = this.files[0];
	            var img = new Image();
	            img.onload = function () {
	                uploadfile4(filenm); alert(filenm);
	            }
	            img.src = url4.createObjectURL(filenm);
	        });
	        var url5 = window.URL;
	        $("#File2").on("change", function () {
	            filenm = this.files[0];
	            var img = new Image();
	            img.onload = function () {
	                uploadfile5(filenm); alert(filenm);
	            }
	            img.src = url5.createObjectURL(filenm);
	        });
	        GetData();
	    });
	    function uploadfile4(file) {

	        var formdata = new FormData();
	        formdata.append('file', $("#File1")[0].files[0]);

	        $.ajax({
	            url: "regHandler.ashx",
	            type: "POST",
	            data: formdata,
	            success: function (data) {
	                fileup = "~/Document/" + data;

	              //  $("#File5").attr("src", fileup);
	                path4 = data;
	                
	            },
	            contentType: false,
	            processData: false,
	            error: function (result) {

	            }
	        });
	    }
	    function uploadfile5(file) {

	        var formdata = new FormData();
	        formdata.append('file', $("#File2")[0].files[0]);

	        $.ajax({
	            url: "regHandler.ashx",
	            type: "POST",
	            data: formdata,
	            success: function (data) {
	                fileup = "~/Document/" + data;

	                //  $("#File5").attr("src", fileup);
	                path4 = data;
	                
	            },
	            contentType: false,
	            processData: false,
	            error: function (result) {

	            }
	        });
	    }
	    function savedata() {
           
	        if ($("#btnadd").val() == "Submit") {
	            if ($("#txtuname").val() != '') {
	                var obj = {};
	             
	                obj.usernm = $("#txtuname").val();
	                obj.pwds = $("#txtpwds").val();
	                obj.name = $("#txtname").val();
	                obj.designations = $("select[id$=ddldesi]").val();
	                obj.images = path4;
	                $.ajax({
	                    url: 'useregistration.aspx/Add_Complaint',
	                    method: 'post',
	                    contentType: 'application/json;charset=utf-8',
	                    dataType: 'json',
	                    data: JSON.stringify(obj),
	                    success: function () {
	                        //alert("Advice added successfully");
	                        noty({ text: 'Saved Sucessfully', layout: 'topRight', type: 'information' });
	                        setTimeout(function () { $.noty.closeAll(); }, 3000);
	                      
	                        $("#txtname").val('');
	                     
	                        $("#txtuname").val('');
	                        $("#txtpwds").val(''); path4 = null;
	                        $("select[id$=ddldesi]").val("").change();
	                        GetData();
	                    },
	                    error: function () {
	                        //alert("Error in insert");
	                        noty({ text: 'Error in insert', layout: 'topRight', type: 'warning' });
	                        setTimeout(function () { $.noty.closeAll(); }, 3000);
	                     
	                        $("#txtname").val('');

	                        $("#txtuname").val('');
	                        $("#txtpwds").val(''); path4 = null;
	                    }

	                });
	            }
	            else {
	                noty({ text: 'Select Role For User', layout: 'topRight', type: 'information' });
	                setTimeout(function () { $.noty.closeAll(); }, 3000);
	            }
	        }




	    }
	    function updatedata() {
	        var obj1 = {};
	        obj1.id = dd1;
	       
	        obj1.name = $("#txtname1").val();
	    
	        obj1.usernm = $("#txtusername1").val();
	        obj1.pwds = $("#txtpwd1").val();
	        obj1.designations = $("select[id$=ddldesi1]").val();
	        obj1.images = path4;
	        $.ajax({
	            url: 'useregistration.aspx/Update',
	            method: 'post',
	            contentType: 'application/json;charset=utf-8',
	            dataType: 'json',
	            data: JSON.stringify(obj1),
	            success: function (data) {
	                //alert("Medicine Edit");
	                if (data.d == "submit") {
	                    noty({ text: 'Updated Sucessfully', layout: 'topRight', type: 'information' });
	                    setTimeout(function () { $.noty.closeAll(); }, 3000);
	                  
	                    $("#txtname1").val("");
	              
	                    $("#txtusername1").val("");
	                    $("select[id$=ddldesi1]").val("").change();
	                    $("#txtpwd1").val(""); path4 = null;
	                    GetData();
	                } else {
	                    noty({ text: 'Saved Sucessfully', layout: 'topRight', type: 'information' });
	                    setTimeout(function () { $.noty.closeAll(); }, 3000);
	                }
	            },
	            error: function () {
	                //alert("Error in insert");
	                noty({ text: 'Error In Insert', layout: 'topRight', type: 'warning' });
	                setTimeout(function () { $.noty.closeAll(); }, 3000);
	            }

	        });
	    }
	    var count = 1;
	    function GetData() {
	        $.ajax({
	            url: 'useregistration.aspx/Show',
	            method: 'post',
	            contentType: 'application/json;charset=utf-8',
	            dataType: 'json',
	            success: function (_data) {
	                var table = $('#tt').DataTable();
	                _data = JSON.parse(_data.d);
	                //alert(_data);
	                table.clear();

	                for (var i = 0; i < _data.length; i++) {
	                    table.row.add([
                    count, _data[i].name, _data[i].username,_data[i].designation, _data[i].password,
                    '<button  value="Edit" onclick="EditData(' + _data[i].usersid + ')" type="button" data-bs-toggle="modal" data-bs-target="#exampleScrollableModal" class="btn1 btn-outline-success"><i class="bx bx-edit-alt me-0"></i></button>&nbsp;<button  id=d' + _data[i].usersid + ' value="Delete" onclick="DeleteData(' + _data[i].usersid + ')" type="button" class="btn1 btn-outline-danger"  title="Delete"><i class="bx bx-trash me-0"></i></button>',

	                    ]).draw(false);
	                    count++;
	                }
	            },
	            error: function () {
	                //alert("Error in display");

	            }
	        });
	    };
	    function EditData(id) {
	        $.ajax({
	            url: 'useregistration.aspx/Edit',
	            method: 'post',
	            contentType: 'application/json;charset=utf-8',
	            dataType: 'json',
	            data: "{Id: '" + id + "'}",
	            success: function (_data) {
	                _data = JSON.parse(_data.d);
	             
	                $("#txtname1").val(_data[0].name);
	                $("#txtcontact1").val(_data[0].contact);
	                $("#txtusername1").val(_data[0].username);
	                $("#txtpwd1").val(_data[0].password);
	                $("select[id$=ddldesi1]").val(_data[0].designation).change();
	                path4 = _data[0].profilepic;
	                dd1 = id;
	            },
	            error: function (error) {
	                //alert("error in edit");
	                noty({ text: 'Error In Insert', layout: 'topRight', type: 'information' });
	                setTimeout(function () { $.noty.closeAll(); }, 3000);
	              
	            }
	        });
	    
	    }
	    function DeleteData(id1) {

	        $.ajax({

	            url: "useregistration.aspx/DeleteData",
	            contentType: "application/JSON; charset=utf-8",
	            method: "post",
	            datatype: "JSON",
	            data: "{Id:'" + id1 + "'}",
	            success: function (data) {
	                GetData();
	                noty({ text: 'Delete Successfully', layout: 'topRight', type: 'information' });
	                setTimeout(function () { $.noty.closeAll(); }, 3000);

	            }
	        });
	    }
	</script>	
    <div class="page-wrapper">
			<div class="page-content">
                <div class="row">
					<div class="col-md-12 mx-auto" >
					
				<div class="card">
					<div class="card-body">
						<div class="card-title d-flex align-items-center">

							<h6>User Registration</h6>
						</div>
						<hr />
						
						
						<form class="row g-2">
							<div class="col-md-2" >
								
								<label for="inputEmailAddress" class="form-label">User Name</label>
												<input type="text" class="form-control" id="txtuname" placeholder="User Name" />
							</div>
							<div class="col-md-2">
								
								<label for="inputEmailAddress" class="form-label">Password</label>
						    <input type="password" class="form-control" id="txtpwds" placeholder="Password" />
							</div>
							<div class="col-md-2">
								<label>Name</label>
								<input type="text" class="form-control" id="txtname" placeholder="Profile Name" />
							</div>	
                              <div class="col-md-2">
								<label>Designation *</label>
								<select id="ddldesi" class="form-select">
                                    <option value="">Select Designation</option>
                                       <option value="admin">Administrator</option>
                                       <option value="principal">Principal</option>
                                       <option value="president">President</option>
								</select>
							</div>
                            <div class="col-md-2">
								<label>Upload Profile</label>
							
                                    	<input class="form-control" id="File1"
																type="file" name="files"
																accept=".jpg, .png, image/jpeg, image/png" />
							</div>	
                            <div class="col-md-1">
							<button type="button" id="btnadd" class="btn btn-primary" onclick="savedata()" value="Submit">Save</button>
						</div>
                            </form>
                        </div>
                    </div>
                        </div>
                    </div>
                <hr />
                <div class="card">
					<div class="card-body">
						<div class="table-responsive">

							<table id="tt" class="table table-striped table-bordered">

								<thead>
									<tr>
										<th>Sr.No</th>
										<th>Name</th>
                                        <th>User Name</th>
                                         <th>Designation</th>
                                        <th>Password</th>
										
										<th>Action</th>

									</tr>
								</thead>
								<tbody>
								<%--	<tr>
										<td>1</td>
										<td>Siwan</td>
										<td><span class="badge bg-primary">Active</span></td>
										<td><button type="button" class="btn1 btn-outline-success"><i
													class='bx bx-edit-alt me-0'></i></button> <button type="button"
												class="btn1 btn-outline-danger"><i
													class='bx bx-trash me-0'></i></button></td>
									</tr>
									<tr>
										<td>2</td>
										<td>ajmer</td>
										<td><span class="badge bg-primary">Active</span></td>
										<td><button type="button" class="btn1 btn-outline-success"><i
													class='bx bx-edit-alt me-0'></i></button> <button type="button"
												class="btn1 btn-outline-danger"><i
													class='bx bx-trash me-0'></i></button></td>

									</tr>--%>

								</tbody>

							</table>
						</div>
					</div>
				</div>
                	<!-- Modal -->
					<div class="modal fade" id="exampleScrollableModal" role="dialog" tabindex="-1" aria-hidden="true">
						<div class="modal-dialog modal-lg">
							<div class="modal-content">
								<div class="modal-header">
									<h5 class="modal-title">Update User</h5>
									<button type="button" class="btn-close" data-bs-dismiss="modal"
										aria-label="Close"></button>
								</div>
                                <div class="modal-body">
								<div class="card">
									<div class="card-body">
										<div class="row">
											
                            
                            <div class="col-md-2">
								<p>Name*</p>
								<input class="form-control mb-3" type="text" id="txtname1" placeholder="Enter Name"
									aria-label="default input example" />
							</div>
                            <%-- <div class="col-md-3">
								<p>Contact*</p>
								<input class="form-control mb-3" type="text" id="txtcontact1" maxlength="10" placeholder="Enter Contact"
									aria-label="default input example" />
							</div>--%>
                               <div class="col-md-3">
								<p>User ID*</p>
								<input class="form-control mb-3" type="text" id="txtusername1" maxlength="10" placeholder="Enter Contact"
									aria-label="default input example" />
							</div>
                                <div class="col-md-3">
								<p>Password*</p>
								<input class="form-control mb-3" type="text" id="txtpwd1" maxlength="10" placeholder="Enter Contact"
									aria-label="default input example" />
							</div> 
                                                <div class="col-md-3">
								<p>Designation *</p>
								<select id="ddldesi1" class="form-select">
                                    <option value="">Select Designation</option>
                                       <option value="admin">Administrator</option>
                                       <option value="principal">Principal</option>
                                       <option value="president">President</option>
								</select>
							</div>
                                             <div class="col-md-2">
                                    	<p> Upload Profile *</p>
                                    	<input class="form-control" id="File2"
																type="file" name="files"
																accept=".jpg, .png, image/jpeg, image/png">
                                </div>
						</div>
                            </div>
					
										</div>



									</div>
							
								<div class="modal-footer">
									<button type="button" class="btn btn-secondary" id="btnadd1" onclick="updatedata()" data-bs-dismiss="modal">Update</button>
									<button type="button" class="btn btn-primary">Cancel</button>

								</div>
							</div>
					</div>
				</div>
                </div>
                </div>
       
    </asp:Content>