donation/app/Views/templates/header.php
2021-01-01 23:52:38 +05:30

572 lines
14 KiB
PHP

<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<style>
input[type="date"]::-webkit-datetime-edit, input[type="date"]::-webkit-inner-spin-button, input[type="date"]::-webkit-clear-button
{
color: #fff;
position: relative;
}
input[type="date"]::-webkit-datetime-edit-year-field{
position: absolute !important;
border-left:1px solid #8c8c8c;
padding: 2px;
color:#000;
left: 56px;
}
input[type="date"]::-webkit-datetime-edit-month-field{
position: absolute !important;
border-left:1px solid #8c8c8c;
padding: 2px;
color:#000;
left: 26px;
}
input[type="date"]::-webkit-datetime-edit-day-field{
position: absolute !important;
color:#000;
padding: 2px;
left: 4px;
}
.my_navbar{
height : 50px;
}
.nav_right{
float: right;
}
.nav-side-menu {
overflow: auto;
font-family: verdana;
font-size: 13px;
font-weight: 200;
background-color: #2e353d;
position: fixed;
top: 0px;
width: 250px;
height: 100%;
color: #e1ffff;
}
.nav-side-menu .brand {
background-color: #23282e;
line-height: 50px;
display: block;
text-align: center;
font-size: 14px;
}
.nav-side-menu .toggle-btn {
display: none;
}
.nav-side-menu ul,
.nav-side-menu li {
list-style: none;
padding: 0px;
margin: 0px;
line-height: 35px;
cursor: pointer;
/*
.collapsed{
.arrow:before{
font-family: FontAwesome;
content: "\f053";
display: inline-block;
padding-left:10px;
padding-right: 10px;
vertical-align: middle;
float:right;
}
}
*/
}
.nav-side-menu ul :not(collapsed) .arrow:before,
.nav-side-menu li :not(collapsed) .arrow:before {
font-family: FontAwesome;
content: "\f078";
display: inline-block;
padding-left: 10px;
padding-right: 10px;
vertical-align: middle;
float: right;
}
.nav-side-menu ul .active,
.nav-side-menu li .active {
border-left: 3px solid #d19b3d;
background-color: #4f5b69;
}
.nav-side-menu ul .sub-menu li.active,
.nav-side-menu li .sub-menu li.active {
color: #d19b3d;
}
.nav-side-menu ul .sub-menu li.active a,
.nav-side-menu li .sub-menu li.active a {
color: #d19b3d;
}
.nav-side-menu ul .sub-menu li,
.nav-side-menu li .sub-menu li {
background-color: #181c20;
border: none;
line-height: 28px;
border-bottom: 1px solid #23282e;
margin-left: 0px;
}
.nav-side-menu ul .sub-menu li:hover,
.nav-side-menu li .sub-menu li:hover {
background-color: #020203;
}
.nav-side-menu ul .sub-menu li:before,
.nav-side-menu li .sub-menu li:before {
font-family: Fontawesome;
content: "\f105";
display: inline-block;
padding-left: 20px;
padding-right: 10px;
vertical-align: middle;
}
.nav-side-menu li {
padding-left: 0px;
border-left: 3px solid #2e353d;
border-bottom: 1px solid #23282e;
}
.nav-side-menu li a {
text-decoration: none;
color: #e1ffff;
}
.nav-side-menu li a i {
padding-left: 10px;
width: 20px;
padding-right: 20px;
}
.nav-side-menu li:hover {
border-left: 3px solid #d19b3d;
background-color: #4f5b69;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
@media (max-width: 767px) {
.nav-side-menu {
position: relative;
width: 80%;
margin-bottom: 10px;
}
.nav-side-menu .toggle-btn {
display: block;
cursor: pointer;
position: absolute;
right: 10px;
top: 10px;
z-index: 10 !important;
padding: 3px;
background-color: #ffffff;
color: #000;
width: 40px;
text-align: center;
}
.brand {
text-align: left !important;
font-size: 22px;
padding-left: 20px;
line-height: 50px !important;
}
}
@media (min-width: 767px) {
.nav-side-menu .menu-list .menu-content {
display: block;
}
}
body {
margin: 0px;
padding: 0px;
}
.nav-side-menu ul .sub-menu ul .sub-line li.active,
.nav-side-menu li .sub-menu li .sub-line li.active {
color: #d19b3d;
}
.nav-side-menu ul .sub-menu li .sub-line li.active a,
.nav-side-menu li .sub-menu li .sub-line li.active a {
color: #d19b3d;
}
.nav-side-menu ul .sub-menu li .sub-line li,
.nav-side-menu li .sub-menu li .sub-line li {
background-color: #181c20;
border: none;
line-height: 28px;
border-bottom: 1px solid #23282e;
margin-left: 0px;
}
.nav-side-menu ul .sub-menu li .sub-line li:hover,
.nav-side-menu li .sub-menu li .sub-line li:hover {
background-color: #020203;
}
.nav-side-menu ul .sub-menu li .sub-line li:before,
.nav-side-menu li .sub-menu li .sub-line li:before {
font-family: FontAwesome;
content: "\f105";
display: inline-block;
padding-left: 100px;
padding-right: 10px;
vertical-align: middle;
}
.nav-side-menu .sub-menu li {
padding-left: 20px;
border-left: 3px solid #2e353d;
border-bottom: 1px solid #23282e;
}
.nav-side-menu .sub-menu li a {
text-decoration: none;
color: #e1ffff;
}
.sub-menu li a i {
padding-left: 10px;
width: 20px;
padding-right: 20px;
}
.nav-side-menu li .sub-menu li:hover {
border-left: 3px solid #d19b3d;
background-color: #4f5b69;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
@media (max-width: 767px) {
.nav-side-menu .sub-menu {
position: relative;
width: 100%;
margin-bottom: 10px;
}
.nav-side-menu .sub-menu .toggle-btn {
display: block;
cursor: pointer;
position: absolute;
right: 10px;
top: 10px;
z-index: 10 !important;
padding: 3px;
background-color: #ffffff;
color: #000;
width: 40px;
text-align: center;
}
.sub-line ul .sub-press li.active,
.sub-line li .sub-press li.active {
color: #d19b3d;
}
.sub-line ul .sub-press li.active a,
.sub-line li .sub-press li.active a {
color: #d19b3d;
}
.sub-line ul .sub-press li,
.sub-line li .sub-press li {
background-color: #181c20;
border: none;
line-height: 28px;
border-bottom: 1px solid #23282e;
margin-left: 0px;
}
.sub-line ul .sub-press li:hover,
.sub-line li .sub-press li:hover {
background-color: #020203;
}
.sub-line ul .sub-press li:before,
.sub-line li .sub-press li:before {
font-family: Arial;
content: "\f105";
display: inline-block;
padding-left: 50px;
padding-right: 10px;
vertical-align: middle;
}
.sub-line li {
padding-left: 20px;
border-left: 3px solid #2e353d;
border-bottom: 1px solid #23282e;
}
.sub-line li a {
text-decoration: none;
color: #e1ffff;
}
.sub-line li a i {
padding-left: 50px;
width: 20px;
padding-right: 20px;
}
.sub-line li:hover {
border-left: 3px solid #d19b3d;
background-color: #4f5b69;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
@media (max-width: 767px) {
.sub-line {
position: relative;
width: 100%;
margin-bottom: 10px;
}
.sub-line .toggle-btn {
display: block;
cursor: pointer;
position: absolute;
right: 10px;
top: 10px;
z-index: 10 !important;
padding: 3px;
background-color: #ffffff;
color: #000;
width: 40px;
text-align: center;
}
</style>
<meta charset="utf-8">
<title></title>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!--- nav left ---->
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<!--- nav left end ---->
<!-- Bootstrap DatePicker -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker.css" type="text/css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(function () {
$('#txtDate').datepicker({
format: "dd/mm/yyyy"
});
});
$(function () {
$('#txtDate2').datepicker({
format: "dd/mm/yyyy"
});
}); });
</script>
<!-- Bootstrap DatePicker End-->
<script>
$(document).ready(function(){
$("#cause_form").submit(function(){
var formData = new FormData($(this)[0]);
$.ajax({
url: '<?= base_url(); ?>/add_donation_cause',
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
});
return false;
});
});
</script>
<script>
$.ajax({
url:"<?= base_url(); ?>/fetch_country",
method:"GET",
data:{},
success:function(data)
{
$('#country0').html(data);
}
});
$.ajax({
url:"<?= base_url(); ?>/fetch_donor_id",
method:"GET",
data:{},
success:function(data)
{
$('#donor_id').html(data);
}
});
$.ajax({
url:"<?= base_url(); ?>/fetch_cause_name",
method:"GET",
data:{},
success:function(data)
{
$('#cause_name').html(data);
}
});
$(document).ready(function(){
//fetch state and sity values
$('#country0').change(function(){
var country_id = $('#country0').val();
if(country_id != '')
{
$.ajax({
url:"<?= base_url(); ?>/fetch_state",
method:"POST",
data:{country_id:country_id},
success:function(data)
{
$('#state0').html(data);
}
});
}
else
{
$('#state0').html('<option value="">Select State</option>');
}
});
$('#state0').change(function(){
var state_id = $('#state0').val();
if(state_id != '')
{
$.ajax({
url:"<?= base_url(); ?>/fetch_city",
method:"POST",
data:{state_id:state_id},
success:function(data)
{
$('#city0').html(data);
}
});
}
else
{
$('#city0').html('<option value="">Select City</option>');
}
});
});
</script>
</head>
<body>
<nav class=" navbar my_navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="<?= base_url(); ?> ">Donation</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<?php if(session()->has('logged_user')): ?>
<div class="nav_right">
<li class="nav-item">
<a class="nav-link " href="#">Edit</a>
</li>
<li class="nav-item">
<a class="nav-link" href="<?= base_url() ?>/dashboard/logout">Logout <span class="sr-only">(current)</span></a>
</li>
</div>
<?php else:?>
<li class="nav-item">
<a class="nav-link" href="<?= base_url(); ?>">Login <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="<?= base_url()."/register"; ?>">Register</a>
</li>
<?php endif;?>
</ul></div>
</nav>
<?php if(session()->has('logged_user')): ?>
<div class="nav-side-menu">
<div class="brand">DONATION</div>
<i class="fa fa-bars fa-2x toggle-btn" data-toggle="collapse" data-target="#menu-content"></i>
<div class="menu-list">
<ul id="menu-content" class="menu-content collapse out">
<li>
<a href="#">
<i class="fa fa-dashboard fa-lg"></i><a href="<?= base_url() ?>/dashboard"> Dashboard</a>
</a>
</li>
<li data-toggle="collapse" data-target="#new" class="collapsed">
<a href="#"><i class="fa fa-user fa-lg"></i> Donor Management <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="new">
<li><a href="<?= base_url() ?>/My_controller/all_donor">View Donors</a></li>
<li><a href="<?= base_url() ?>/My_controller/donor_register">Add New Donor</a>s</li>
</ul>
<li data-toggle="collapse" data-target="#products" class="collapsed">
<a href="#"><i class="fa fa-book fa-lg"></i> Receipts <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="products">
<li><a href="<?= base_url() ?>/dashboard/all_receipt">All Receipts</a></li>
<li><a href="<?= base_url() ?>/dashboard/receipts">Generate Receipts</a></li>
</ul>
<li data-toggle="collapse" data-target="#service" class="collapsed">
<a href="#"><i class="fa fa-newspaper-o fa-lg"></i> Transaction <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="service">
<li><a href="<?= base_url() ?>/dashboard/all_transaction">All Transaction</a></li>
<li><a href="<?= base_url() ?>/dashboard/transaction">Upload Transaction</a></li>
</ul>
<li data-toggle="collapse" data-target="#donation_data" class="collapsed">
<a href="#"><i class="fa fa-money fa-lg"></i> Donation Data <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="donation_data">
<li><a href="<?= base_url() ?>/dashboard/all_donation_data">Donation Data List</a></li>
<li><a href="<?= base_url() ?>/dashboard/donation_data">Add Donation Data</a></li>
</ul>
<li data-toggle="collapse" data-target="#donation_cause" class="collapsed">
<a href="#"><i class="fa fa-pencil-square-o fa-lg"></i>Donation Cause <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="donation_cause">
<li><a href="<?= base_url() ?>/dashboard/donation_cause">Add Donation Cause</a></li>
<li><a href="<?= base_url() ?>/dashboard/all_donation_cause">All Donation Cause</a></li>
</ul>
<li>
<a href="#">
<i class="fa fa-user fa-lg"></i> Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" href="<?= base_url() ?>/dashboard/logout">Logout <span class="sr-only">(current)</span></a>
</li>
</ul>
</div>
</div>
<?php endif;?>