@extends('adminlayout.admin')
<style>
    .social-media-img:hover{
        height:400px !important;
        width:400px !important;
        z-index:99;
    }

    .bbps{
        border-radius: 0 !important;
        color: #098da4;
        height: 100%;
    }
    .bbps:hover{
        background-color: #098da4;
        color: #fff;
    }
    .bbps em{
        font-size: 40px;
    }
    .upper-div-timing{
        font-size: 12px;
        line-height: 14px;
        padding: 25px;
        float: right !important;
        margin-right: 0px;
        margin-left: 22%;
    }
    .rupees{
        width: 100%;
        color: black;
        border-radius: 5px;
        text-align: center;
    }
    .info{
        width: 60px;
    }
	

.date-filter input{
	height: 32px;
    padding: 2px 2px;
}
.search-btn{
	height: 32px;
    padding: 2px 14px;
    border: none;
    background: #3092e6;
    color: #fff;
    border-radius: 2px;
    margin-left: 2px;
}
.strip {
		margin-bottom: 30px;
		background: linear-gradient(90deg, rgba(84,97,203,1) 42%, rgba(2,172,203,1) 55%);
		border-radius: 30px;
		padding: 8px 20px;
		display: flex;
		justify-content: space-between;
		color: #fff;
	}
	.total-amt {
		font-size: 20px;
		vertical-align: middle;
		padding-left: 8px;
	}
	.inv-serv-page .card {
		background-color: #fff !important;
	}
	.card-top{
		text-align: center;
	}
	.card-top .card-title .subtitle {
		color: #6576ff;
		font-size: 16px;
		font-weight: 600;
	}
	.card-top .card-amount {
		justify-content: center;
	}
	.card-top .card-amount .amount {
		font-size: 1rem;
		color: #000;
		font-weight: 600;
	}
	.strip-2{
		background: rgba(84,97,203,1);
		padding: 8px 20px;
		display: flex;
		justify-content: space-between;
		color: #fff;
		border-top-left-radius: 4px;
		border-top-right-radius: 4px;
	}
	.service-outer{
		background: #fff;
		border-bottom-left-radius: 4px;
		border-bottom-right-radius: 4px;
		display: flex;
		/* align-items: center; */
		justify-content: space-around;
		width: 100%;
		text-align: center;
	}
	.service-inner {
		padding: 8px 5px;
		border-right: 1px solid #ccc;
		width: 100%;
		color: #000;
		font-size: 13px;
	}
	.service-inner:last-child {
		border-right: 0px solid #ccc;
	}
	.serv-title-2 {
		font-weight: 600;
		font-size: 14px;
		margin-top: 10px;
	}
.right-card-title .subtitle {
    color: #ffffff;
    font-size: 18px;
    font-weight: normal;
}
.right-card-title {
    margin-bottom: 20px;
	position: relative;
}
.right-card-title::before {
	position: absolute;
    content: "";
	width: 40px;
    border-bottom: 1.5px solid #ffffff;
    bottom: -14px;
    left: 50%;
    transform: translate(-50%, -50%);
}
.right-sect-inner {
    border-radius: 4px;
	text-align: center;
}
.linear-bg-1{
	background: linear-gradient(45deg, rgba(34,193,195,1) 0%, rgba(253,166,45,1) 100%);
}
.linear-bg-2{
	background: linear-gradient(45deg, rgba(34,108,195,1) 0%, rgba(45,253,233,1) 100%);
}
.right-sect-inner .card-amount .amount {
    color: #ffffff;
    font-weight: normal;
}
.right-sect-inner .card-amount{
	justify-content: center;
}
.inv-serv-page .g-gs>div {
    padding: 10px!important;
}
.p-l-r-10{
	padding-left: 10px !important;
	padding-right: 10px !important;
}
	
	
@media (max-width:768px){
	.total-amt {
		font-size: 15px;
		padding-left: 4px;
}
	.service-inner {
		padding: 8px 5px;
		font-size: 12px;
	}
	.serv-title-2 {
		font-size: 13px;
	}
}

.insttitle{
  color: #fff !important;
}
	
	
</style>
@section('content')
 
    <div class="nk-content nk-content-fluid">
        <div class="container-xl wide-lg">
            <div class="nk-content-body">
              
			  
			  <!-- new design -->
			  
			  <div class="nk-block-head nk-block-head-sm">
					<div class="nk-block-between" style="justify-content: flex-end;">
						<div class="nk-block-head-content">
							<div class="date-filter">
								From <input type="date" placeholder="From Date">
								To <input type="date" placeholder="To Date">
								<button type="search" class="search-btn">Search</button>
							</div>
						</div><!-- .nk-block-head-content -->
					</div><!-- .nk-block-between -->
				</div><!-- .nk-block-head -->
				<div class="nk-block inv-serv-page">
					<div class="row">
						<div class="col-md-12 p-l-r-10">
							<div class="strip">
								<div class="total-buy">
									<span>Total Buy: </span> 
									<span class="total-amt">₹{{number_format($totalBuyAmount,2 )}}</span>
								</div>
								<div class="total-sell">
									<span>Total Sell: </span>
									<span class="total-amt">₹{{number_format($totalSellAmount,2 )}}</span>
								</div>
							</div>
						</div>
					</div>
				
					<div class="row g-gs">
						<div class="col-md-9">
							<div class="row g-gs">
								<div class="col-md-4">
									<div class="card card-bordered card-full">
										<div class="card-inner card-top">
											<div>
												<div class="card-title">
													<h6 class="subtitle">Total Deposit</h6>
												</div>
											</div>
											<div class="card-amount">
												<span class="amount"> ₹{{number_format($totalBuyAmount,2 )}} 
												</span>
											</div>
											
										</div>
									</div><!-- .card -->
								</div><!-- .col -->
								<div class="col-md-4">
									<div class="card card-bordered card-full">
										<div class="card-inner card-top">
											<div>
												<div class="card-title">
													<h6 class="subtitle">Total Withdraw</h6>
												</div>
											</div>
											<div class="card-amount">
												<span class="amount"> ₹{{number_format($totalSellAmount,2 )}}
												</span>
											</div>
										</div>
									</div><!-- .card -->
								</div><!-- .col -->
								<div class="col-md-4">
								<a href="{{route('MonthalyWithdrawReport')}}">
									<div class="card card-bordered  card-full">
										<div class="card-inner card-top">
											<div>
												<div class="card-title">
													<h6 class="subtitle">Total Monthaly Withdraw</h6>
												</div>
											</div>
											<div class="card-amount">
												<span class="amount"> ₹{{number_format($totalMonthalyAmount,2 )}}
												</span>
											</div>
										</div>
									</div><!-- .card -->
									</a>
								</div><!-- .col -->
							    @foreach($profitData['investmentList'] as $investment)
								<div class="col-md-12 col-xxl-12">
									<div class="strip-2">
										<div class="total-buy">
											<a class="insttitle" href="{{ route('InvestmentDetail', $investment->id) }}"><span>{{$investment->title}}</span> </a>
										</div>
									</div>
									<div class="card-bordered service-outer">
										<div class="service-inner">
											<div class="serv-title">
												Today Investor
											</div>
											 <div class="serv-title-2">
												<span>{{getInvestorsCount($investment->id,'', date('Y-m-d'))}}</span>
											 </div>
										</div>
										<div class="service-inner">
											<div class="serv-title">
												Total Investor
											</div>
											 <div class="serv-title-2">
												<span>{{count($investment->totalInvestor)}}</span>
											 </div>
										</div>
										<div class="service-inner">
											<div class="serv-title">
												Invested Amount
											</div>
											 <div class="serv-title-2">
												<span>₹{{totalInvestedAmount($investment->id)}}</span>
											 </div>
										</div>
										<div class="service-inner">
											<div class="serv-title">
												Profit Amount
											</div>
											 <div class="serv-title-2">
												<span>₹{{getTotalProfitAmount($investment->id)}}</span>
											 </div>
										</div>
										<div class="service-inner">
											<div class="serv-title">
												Monthaly Investor
											</div>
											 <div class="serv-title-2">
												<span>{{getInvestorsCount($investment->id,2)}}</span>
											 </div>
										</div>
										<div class="service-inner">
											<div class="serv-title">
												Maturity Investor
											</div>
											 <div class="serv-title-2">
												<span>{{getInvestorsCount($investment->id,1)}}</span>
											 </div>
										</div>
									</div>
									<div class="card-bordered service-outer">
										<div class="service-inner">
											<div class="serv-title">
											   TDS
											</div>
											 <div class="serv-title-2">
												<span> ₹{{number_format(getTdsAmount($investment->id),2)}}</span>
											 </div>
										</div>
										<div class="service-inner">
											<div class="serv-title">
												Service Charge
											</div>
											 <div class="serv-title-2">
												<span> ₹{{number_format(getServiceChargeAmount($investment->id),2)}}</span>
											 </div>
										</div>
										<div class="service-inner">
											<div class="serv-title">
												Suvidha Kendra
											</div>
											 <div class="serv-title-2">
												<span>₹{{number_format(getSkCommission($investment->id),2)}}</span>
											 </div>
										</div>
										<div class="service-inner">
											<div class="serv-title">
												Franchise 
											</div>
											 <div class="serv-title-2">
												<span> ₹{{number_format(getFranchiseCommission($investment->id),2)}}</span>
											 </div>
										</div>
										<div class="service-inner">
											<div class="serv-title">
												Partner 
											</div>
											 <div class="serv-title-2">
												<span> ₹{{number_format(getPartnerCommission($investment->id),2)}}</span>
											 </div>
										</div>
										<div class="service-inner">
											<div class="serv-title">
												Admin 
											</div>
											 <div class="serv-title-2">
												<span> ₹{{number_format(getAdminCommission($investment->id),2)}}</span>
											 </div>
										</div>
									</div>
								</div><!-- .col -->
							@endforeach		
							
							   
								<div class="col-md-12 col-xxl-12">
									<div id="plangraph" style="height: 370px; width: 100%;"></div>
								</div><!-- .col -->
								
								<div class="col-md-12 col-xxl-12">
									<div class="card card-bordered card-full">
										<div class="card-inner">
											<div class="row">
												<div class="col-md-12 col-xxl-12">
													<div class="card-title">
														<h6 class="title">Recent Activities</h6>
													</div>
												
													<div class="activity-tab">
														<ul class="nav nav-tabs">
															<li class="nav-item">
																<a class="nav-link active" data-bs-toggle="tab" href="javascript:void(0)">Buy</a>
															</li>
															<li class="nav-item">
																<a class="nav-link" data-bs-toggle="tab" href="javascript:void(0)">Sell</a>
															</li>
														</ul>
														<div class="tab-content">
															<div class="tab-pane active" id="tabItem1">
																<p>no record</p>
															</div>
															<div class="tab-pane" id="tabItem2">
																<p>content</p>
															</div>
														</div>
													</div>
												</div>
											</div>
										</div>
									</div><!-- .card -->
								</div><!-- .col -->
							
							</div>
						</div> <!-- col-9 -->
						
						<div class="col-md-3">
							<div class="row g-gs">
								<div class="col-md-12">
									<div class="card">
										<div class="right-sect-inner linear-bg-1">
											<div class="card-inner">
												<div>
													<div class="right-card-title">
														<h6 class="subtitle">Total Request</h6>
													</div>
												</div>
												<div class="card-amount">
													<span class="amount"> {{$totalRequsted}} 
													</span>
												</div>
											</div>
										</div>
									</div><!-- .card -->
								</div> <!-- col-12 -->
								
								<div class="col-md-12">
									<div class="card">
										<div class="right-sect-inner linear-bg-2">
											<div class="card-inner">
												<div>
													<div class="right-card-title">
														<h6 class="subtitle">Total Invested</h6>
													</div>
												</div>
												<div class="card-amount">
													<span class="amount"> {{$totalDeposit}}  
													</span>
												</div>
											</div>
										</div>
									</div><!-- .card -->
								</div> <!-- col-12 -->
								
								<div class="col-md-12">
									<div class="card">
										<div class="right-sect-inner linear-bg-1">
											<div class="card-inner">
												<div>
													<div class="right-card-title">
														<h6 class="subtitle">Total TDS</h6>
													</div>
												</div>
												<div class="card-amount">
													<span class="amount">  ₹{{number_format(getTdsAmount(),2)}}  
													</span>
												</div>
											</div>
										</div>
									</div><!-- .card -->
								</div> <!-- col-12 -->
								
								<div class="col-md-12">
									<div class="card">
										<div class="right-sect-inner linear-bg-2">
											<div class="card-inner">
												<div>
													<div class="right-card-title">
														<h6 class="subtitle">Total Service Charge</h6>
													</div>
												</div>
												<div class="card-amount">
													<span class="amount">  ₹{{number_format(getServiceChargeAmount(),2)}}  
													</span>
												</div>
											</div>
										</div>
									</div><!-- .card -->
								</div> <!-- col-12 -->
								
								<div class="col-md-12">
									<div class="card">
										<div class="right-sect-inner linear-bg-1">
											<div class="card-inner">
												<div>
													<div class="right-card-title">
														<h6 class="subtitle">Suvidha Kendra Commission</h6>
													</div>
												</div>
												<div class="card-amount">
													<span class="amount">  ₹{{number_format(getSkCommission(),2)}}  
													</span>
												</div>
											</div>
										</div>
									</div><!-- .card -->
								</div> <!-- col-12 -->
								
								<div class="col-md-12">
									<div class="card">
										<div class="right-sect-inner linear-bg-2">
											<div class="card-inner">
												<div>
													<div class="right-card-title">
														<h6 class="subtitle">Franchise Commission</h6>
													</div>
												</div>
												<div class="card-amount">
													<span class="amount">  ₹{{number_format(getFranchiseCommission(),2)}}  
													</span>
												</div>
											</div>
										</div>
									</div><!-- .card -->
								</div> <!-- col-12 -->
								<div class="col-md-12">
									<div class="card">
										<div class="right-sect-inner linear-bg-1">
											<div class="card-inner">
												<div>
													<div class="right-card-title">
														<h6 class="subtitle">Partner Commission</h6>
													</div>
												</div>
												<div class="card-amount">
													<span class="amount">  ₹{{number_format(getPartnerCommission(),2)}}  
													</span>
												</div>
											</div>
										</div>
									</div><!-- .card -->
								</div> <!-- col-12 -->
								
								<div class="col-md-12">
									<div class="card">
										<div class="right-sect-inner linear-bg-2">
											<div class="card-inner">
												<div>
													<div class="right-card-title">
														<h6 class="subtitle">Admin Commission</h6>
													</div>
												</div>
												<div class="card-amount">
													<span class="amount">  ₹{{number_format(getAdminCommission(),2)}}  
													</span>
												</div>
											</div>
										</div>
									</div><!-- .card -->
								</div> <!-- col-12 -->
								
								
								
							</div>
						</div> <!-- col-3 -->
					
						
					</div>
				</div>
			  
			  <!-- new design end -->
			  
			  
               
            </div>
        </div>
    </div>

<style>
.profitWrap
{
	padding: 5px;
}
</style>
<script>
function getProfit(para, todate, fromdate)
{
	$('.profitbox').removeClass('active');
	$('#'+para+'profit').addClass('active');
	 var url = "{{ url('admin/get-profit') }}"+'/'+fromdate+'/'+todate;
                $.ajax({
                    url: url,                   
                    type: "GET",                  
                    dataType: 'json',
                    success: function(response) {
                         console.log(response);						
					    if (response.status == "1") {
							$('#profitamount').html(response.totalProfit);
						}
                    },
                    error: function(error) {
                        console.log(error.responseText);
                    }
                });
}
</script>
@endsection
<script src="https://code.responsivevoice.org/responsivevoice.js?key=S6BfrffE"></script>
@if(get_notification_count() != "0")
<script>
    setTimeout(responsiveVoice.speak("You have received new notifications. Please see."),3000);
</script>
@endif
 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
@if(Auth::user()->hasRole('super_admin', 'admin', 'partner', 'franchise', 'suvidha_kendra'))
@if($notification!='')
    <script>
        jQuery.noConflict();
        $(window).on('load', function() {
            Swal.fire({
                title: "{{ $notification->notification }}!",
                html: "<img src='{{ asset($notification->image) }}' width='100%' >",
                // icon: "success",
                timer: 10000,
                showCancelButton: true,
                showCloseButton: true,
            });
        });
    </script>
	
@endif
@endif
<script type="text/javascript">
window.onload = function () {

var chart = new CanvasJS.Chart("plangraph", {
	theme: "light1", // "light2", "dark1", "dark2"
	animationEnabled: false, // change to true		
	title:{
		text: ""
	},
	data: [
	{
		// Change type to "bar", "area", "spline", "pie",etc.
		type: "column",
		dataPoints: [			
		]
	}
	]
});
chart.render();

}
</script>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"> </script>
<style>
.canvasjs-chart-credit
{
    display: none !important;
}
</style>