<?php
include('dbconnect.php');
include('header.php');
?>

        <!-- ==================================================== -->
        <!-- Start right Content here -->
        <!-- ==================================================== -->

        <div class="page-content">

            <!-- Start Container Fluid -->
            <div class="container-fluid">

                <!-- ========== Page Title Start ========== -->
                <div class="row">
                    <div class="col-12">
                        <div class="page-title-box">
                            <h4 class="mb-0 fw-semibold">Lead Source</h4>
                            <ol class="breadcrumb mb-0">
                                <li class="breadcrumb-item"><a href="javascript: void(0);">Source</a></li>
                                <li class="breadcrumb-item active">List</li>
                            </ol>
                        </div>
                    </div>
                </div>
                <!-- ========== Page Title End ========== -->
				
				<div class="row">
                         <div class="col-lg-12">
                              <div class="card">
                                   <div class="card-header border-0">
                                        <div class="row justify-content-between">
                                             <div class="col-lg-6">
                                                  <div class="row align-items-center">
                                                       <!--div class="col-lg-6">
                                                            <form class="app-search d-none d-md-block me-auto">
                                                                 <div class="position-relative">
                                                                      <input type="search" class="form-control" placeholder="Search Agent" autocomplete="off" value="">
                                                                      <iconify-icon icon="solar:magnifer-broken" class="search-widget-icon"></iconify-icon>
                                                                 </div>
                                                            </form>
                                                       </div-->
                                                       <!--div class="col-lg-4">
                                                            <h5 class="text-dark fw-medium mb-0">311 <span class="text-muted"> Agent</span></h5>
                                                       </div-->
                                                  </div>
                                             </div>
                                             <div class="col-lg-6">
                                                  <div class="text-md-end mt-3 mt-md-0">
                                                       <!--button type="button" class="btn btn-outline-primary me-1"><i class="ri-settings-2-line me-1"></i>More Setting</button-->
                                                       <!--button type="button" class="btn btn-outline-primary me-1"><i class="ri-filter-line me-1"></i> Filters</button-->
                                                       <button type="button" class="btn btn-success me-1" data-bs-toggle="offcanvas" data-bs-target="#rightOffcanvas" aria-controls="rightOffcanvas"><i class="ri-add-line"></i> Create New</button>
										
                                                  </div>
                                             </div><!-- end col-->
                                        </div>
                                   </div>
                              </div>
                         </div>
                    </div>
					
					<!-- right offcanvas -->
					<div class="offcanvas offcanvas-end" tabindex="-1" id="rightOffcanvas" aria-labelledby="rightOffcanvasLabel">
    <div class="offcanvas-header">
        <h4 class="offcanvas-title mt-0" id="rightOffcanvasLabel">Create Custom Source</h4>
        <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
    </div>
    <div class="offcanvas-body d-flex flex-column">
        <!-- Form container that takes the available space -->
        <form class="row g-3 flex-grow-1" name="userForm" action="#" method="POST" onsubmit="return validateForm()">
            <div class="col-md-12">
                <label for="validationDefault01" class="form-label">Custom Source</label>
                <input type="text" class="form-control" name="source_name" id="validationDefault01" value="" placeholder="Enter Source Name">
            </div>

            <!-- Button container placed at the bottom of the form -->
            <div class="col-12 mt-auto d-flex justify-content-between">
                <button type="button" class="btn btn-primary" data-bs-dismiss="offcanvas">Cancel</button>
                <button class="btn btn-primary" type="submit">Create</button>
            </div>
        </form>
    </div>
</div>



                <div class="row">
                    <div class="col-xl-12">
                        <div class="card">
						
                            <div class="card-body">
                                <div>
                                    <div class="py-3">
                                        <div id="table-gridjs"></div>
                                    </div>
                                     

									 
                                    <div class="">
                                        <!--div class="highlight-toolbar border-top-0">
                                            <ul class="nav nav-pills">
                                                <li class="nav-item">
                                                    <a href="#gridjs-basic-html" data-bs-toggle="tab" aria-expanded="false" class="nav-link active">
                                                        <span class="fs-12 text-uppercase">html</span>
                                                    </a>
                                                </li>
                                                <li class="nav-item">
                                                    <a href="#gridjs-basic-javascript" data-bs-toggle="tab" aria-expanded="true" class="nav-link">
                                                        <span class="fs-12 text-uppercase">javascript</span>
                                                    </a>
                                                </li>
                                            </ul>
                                            <button class="btn btn-sm btn-outline-success btn-copy-clipboard" data-clipboard-action="copy">Copy</button>
                                        </div-->
                                        <div class="tab-content">
                                            <div class="tab-pane show active" id="gridjs-basic-html">
                                                <!--div class="code">
                                                    <pre class="language-html">
                                                        <code>
                                                            &lt;div id=&quot;table-gridjs&quot;&gt;&lt;/div&gt;
                                                        </code>
                                                    </pre>
                                                </div-->
                                            </div>
                                            <div class="tab-pane" id="gridjs-basic-javascript">
                                                <!--div class="code">
                                                    <pre class="language-javascript">
                                                    <code>
                                                        // Basic Table
                                                        if (document.getElementById("table-gridjs"))
                                                             new gridjs.Grid({
                                                                  columns: [{
                                                                       name: 'ID',
                                                                       formatter: (function (cell) {
                                                                            return gridjs.html('<span class="fw-semibold">' + cell + '</span>');
                                                                       })
                                                                  },
                                                                       "Name",
                                                                  {
                                                                       name: 'Email',
                                                                       formatter: (function (cell) {
                                                                            return gridjs.html('<a href="#">' + cell + '</a>');
                                                                       })
                                                                  },
                                                                       "Position", "Company", "Country",
                                                                  {
                                                                       name: 'Actions',
                                                                       width: '120px',
                                                                       formatter: (function (cell) {
                                                                            return gridjs.html("<a href='#' class='text-reset text-decoration-underline'>" + "Details" + "</a>");
                                                                       })
                                                                  },
                                                                  ],
                                                                  pagination: {
                                                                       limit: 5
                                                                  },
                                                                  sort: true,
                                                                  search: true,
                                                                  data: [
                                                                       ["11", "Alice", "alice@example.com", "Software Engineer", "ABC Company", "United States"],
                                                                       ["12", "Bob", "bob@example.com", "Product Manager", "XYZ Inc", "Canada"],
                                                                       ["13", "Charlie", "charlie@example.com", "Data Analyst", "123 Corp", "Australia"],
                                                                       ["14", "David", "david@example.com", "UI/UX Designer", "456 Ltd", "United Kingdom"],
                                                                       ["15", "Eve", "eve@example.com", "Marketing Specialist", "789 Enterprises", "France"],
                                                                       ["16", "Frank", "frank@example.com", "HR Manager", "ABC Company", "Germany"],
                                                                       ["17", "Grace", "grace@example.com", "Financial Analyst", "XYZ Inc", "Japan"],
                                                                       ["18", "Hannah", "hannah@example.com", "Sales Representative", "123 Corp", "Brazil"],
                                                                       ["19", "Ian", "ian@example.com", "Software Developer", "456 Ltd", "India"],
                                                                       ["20", "Jane", "jane@example.com", "Operations Manager", "789 Enterprises", "China"]
                                                                  ]
                                                             }).render(document.getElementById("table-gridjs"));
                                                    </code>
                                                </pre>
                                                </div-->
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>


                    </div> <!-- end card body -->

                   


                </div> <!-- end row -->

            </div>
            <!-- End Container Fluid -->
<script>

$(document).ready(function() {
    if (document.getElementById("table-gridjs")) {
        new gridjs.Grid({
            columns: [{
                name: "S.No.",
                formatter: function(e) {
                    return gridjs.html('<span class="fw-semibold">' + e + "</span>")
                }
            }, "Name","Source Code","Created Date",                 
            {
                name: "Actions",
                width: "120px",
                formatter: function(e) {
                    return gridjs.html('<li class="list-inline-item fs-20 dropdown d-none d-md-flex"><a href="javascript: void(0);" class="dropdown-toggle arrow-none text-dark show" data-bs-toggle="dropdown" aria-expanded="true"><i class="ri-more-2-fill"></i></a><div class="dropdown-menu dropdown-menu-end"><a class="dropdown-item" href="javascript: void(0);" data-bs-toggle="offcanvas" data-bs-target="#rightOffcanvas" aria-controls="rightOffcanvas">Edit Source</a><a class="dropdown-item" href="javascript: void(0);" data-bs-toggle="offcanvas" data-bs-target="#rightOffcanvas" aria-controls="rightOffcanvas">Delete Source</a></div></li>')
                }
            }],
            pagination: {
                limit: 10
            },
            sort: true,
            search: true,
            server: {
                url: '<?php echo $base_url;?>source-fetch-data.php',  // The PHP script that fetches data
                then: data => data,     // Process the fetched data
                // You can handle any other server-side processing here if necessary
            }
        }).render(document.getElementById("table-gridjs"));
    }
});
</script>	
<script>
        // JavaScript Validation Function
        function validateForm() {
            var sourcename = document.forms["userForm"]["source_name"].value;
            var errorMessage = "";

            // Check if the name is empty
            if (sourcename == "") {
                errorMessage += "Source is required.\n";
            }


            // If there is any error, display it and prevent form submission
            if (errorMessage != "") {
                alert(errorMessage);
                return false; // prevent form submission
            }
            return true; // form is valid
        }
    </script>
	
<?php
include('footer.php');
?>

 <?php
// Check if the form is submitted
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // Retrieve form data
    $source_count=mysqli_num_rows(mysqli_query($conn,"Select tbl_lead_source_id from tbl_lead_source"));
	if($source_count> 0 ){
		$source_code='SRC000'.$source_count+1;
	}else{
		$source_code='SRC0001';
	}
    
	$sql="insert into tbl_lead_source set source_name='".$_POST['source_name']."',cdate='".date('y-m-d h:i:s')."',flag=0,cuser='ADMIN',source_code='".$source_code."'";
	$result=mysqli_query($conn,$sql);
	
	if($result){
		
		
		 echo "<script>
                Swal.fire({
                    title: 'Success!',
                    text: 'Requested Completed...',
                    icon: 'success',
                    confirmButtonClass: 'btn btn-primary w-xs mt-2',
                    buttonsStyling: false,
                    showCloseButton: false
                }).then(function() {
                    window.location.href = 'lead_source.php';
                });
            </script>";
            exit;
	}
	else{
	    echo "<script>
                Swal.fire({
                    title: 'Error!',
                    text: 'Requested Incomplete Please Try Again!...',
                    icon: 'error',
                    confirmButtonClass: 'btn btn-primary w-xs mt-2',
                    buttonsStyling: false,
                    showCloseButton: false
                }).then(function() {
                    window.location.href = 'lead_source.php';
                });
            </script>";
            exit;
// 		print("<script language='javascript'>alert('Requested Incomplete Please Try Again!...');window.location.href='users-list.php'");
// 		exit;
	}
    
    
}

?>