Subversion Repositories SmartDukaan

Rev

Rev 29290 | Rev 29335 | Go to most recent revision | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
25979 tejbeer 1
<script type="text/javascript">
28200 tejbeer 2
	$(function() {
27605 tejbeer 3
 
28200 tejbeer 4
		var object = {
5
			timePicker : true,
6
			locale : {
7
				format : 'DD/MM/YYYY hh A'
8
			}
9
		};
10
 
11
		$('input[name="scheduleTime"]').daterangepicker(
12
				$.extend(getSingleDatePicker(), object), dateRangeCallback);
13
 
14
		$('input[name="editScheduleTime"]').daterangepicker(
15
				$.extend(getSingleDatePicker(), object), dateRangeCallback);
25979 tejbeer 16
	});
17
 
28200 tejbeer 18
	$(".lead-request").click(function() {
19
		$("#newEntryLeadModal").modal({
20
			backdrop : false
21
		});
22
 
23
	});
24
 
25
	$(".lead-edit-request").click(function() {
26
		$("#editLeadData").modal({
27
			backdrop : false
28
		});
29
 
30
	});
31
 
32
	$('#statusFilter').multiselect({
33
		includeSelectAllOption : true,
34
		multiple : true,
35
		maxHeight : 200,
36
		buttonWidth : '180px',
37
		numberDisplayed : 1,
38
		nonSelectedText : 'Status',
39
		nSelectedText : ' - Status Selected',
40
		allSelectedText : 'All Status Selected',
41
		enableFiltering : true,
42
		enableCaseInsensitiveFiltering : true
43
	});
44
 
45
	$('#colorFilter').multiselect({
46
		includeSelectAllOption : true,
47
		multiple : true,
48
		maxHeight : 200,
49
		buttonWidth : '180px',
50
		numberDisplayed : 1,
51
		nonSelectedText : 'Color Status',
52
		nSelectedText : ' - Color Selected',
53
		allSelectedText : 'All Status Selected',
54
		enableFiltering : true,
55
		enableCaseInsensitiveFiltering : true
56
	});
25979 tejbeer 57
</script>
58
 
59
 
60
 
61
<section class="wrapper">
62
	<div class="row">
63
		<div class="col-lg-12">
28200 tejbeer 64
			<h3 class="page-header">
65
				<i class="icon_document_alt"></i>LEAD DASHBOARD
66
			</h3>
25979 tejbeer 67
			<ol class="breadcrumb">
28200 tejbeer 68
				<li><i class="fa fa-home"></i><a
69
					href="${rc.contextPath}/dashboard">Home</a></li>
70
				<li><i class="icon_document_alt"></i>Lead</li>
71
				<li><button class="btn btn-primary newLead" data-toggle="modal"
72
						data-target="#newEntryLeadModal" type="button">New</button></li>
25979 tejbeer 73
			</ol>
74
		</div>
75
	</div>
28200 tejbeer 76
 
77
	<table style="Width: 100%">
27609 tejbeer 78
		<tr>
28200 tejbeer 79
			<td align="left" style="Width: 20%">
80
				<div class="row">
81
					<div class="col-lg-2 form-group" style="width: 12%;">
82
						<select id="statusFilter" name="statusFilter" placeholder="Status"
83
							class="form-control input-sm">
84
							<option value="" disabled selected>Status</option> #foreach($ls
85
							in $leadStatus) #if($ls == $selectedLeadStatus)
86
							<option value="$ls" selected>$ls</option> #else
87
							<option value="$ls">$ls</option> #end #end
88
						</select>
89
					</div>
90
 
91
					<div class="col-lg-2">
92
						<button class="btn btn-primary show-lead" type="button"
29268 manish 93
							>Submit</button>
28200 tejbeer 94
					</div>
29268 manish 95
 
28200 tejbeer 96
				</div>
97
			</td>
27609 tejbeer 98
		</tr>
28200 tejbeer 99
 
27642 tejbeer 100
		<tr>
28200 tejbeer 101
			<td align="left" style="Width: 20%">
102
				<div class="row">
103
					<div class="col-lg-2 form-group" style="width: 12%;">
104
						<select id="colorFilter" name="colorFilter" placeholder="Status"
105
							class="form-control input-sm">
106
							<option value="" disabled selected>Status</option>
107
							<option value="All">All</option>
108
							<option value="yellow">yellow</option>
109
							<option value="green">green</option>
110
 
111
						</select>
112
					</div>
113
 
29268 manish 114
					<div class="col-lg-1">
28200 tejbeer 115
						<button class="btn btn-primary show-colowise-lead" type="button"
29268 manish 116
							>Submit</button>
28200 tejbeer 117
					</div>
29268 manish 118
			    </div>
119
			   </td>
120
			</tr>
121
	    <tr>
122
	    <td align="left">
123
	       <div class="row">
124
		          <div class="row col-lg-5" style="width:518px;height:272px;">
125
	             	<canvas id="chart-leadstatus"  style="width:auto"></canvas>
29291 amit.gupta 126
 
127
	             	<canvas id="chart-lead-search" class=""  style="width:auto"></canvas>
128
 
29268 manish 129
                  </div>
130
 
131
         <div class="col-lg-8">
132
           <table class="table table-border table-condensed table-bordered" id="lead-weakwise-table" style="width:100%">
133
 
134
             <thead class="row htable" style="background:#F5F5F5;">
135
 
136
           <tr style="color:black;">
137
                <th></th>
138
                <th>Week 4</th>
139
                <th>Week 3</th>
140
                 <th>Week 2</th>
141
                  <th colspan="7">Week</th>
142
                  <th></th>
143
                 </tr>
144
 
145
              <tr style="color:black;">
146
                <th>Created By</th>
147
                <th>$weekDates.get(0) - $weekDates.get(1)</th>
148
                <th>$weekDates.get(2) - $weekDates.get(3)</th>
149
                 <th>$weekDates.get(4) - $weekDates.get(5)</th>
150
 
151
                 #foreach($lwDay in $lwDays )
152
                 <th>$lwDay.getMonth().format($dateMonthChYear)</th>
153
                 #end
154
 
155
                  <th>Result</th>
156
               </tr>
157
             </thead>
158
               <tbody>
29288 amit.gupta 159
                #foreach($leadCreator in $leadCreators)
29268 manish 160
               <tr>
161
 
162
               <td>
29290 amit.gupta 163
               $leadCreator
29268 manish 164
               </td>
29288 amit.gupta 165
              #if($leadLasts.get($leadCreator))
166
               <td>
167
                 $leadLasts.get($leadCreator)
29268 manish 168
               </td>
169
               #else
29288 amit.gupta 170
               <td style="background:#ff9999;">  0
171
               </td>
29268 manish 172
               #end
29288 amit.gupta 173
              #if($leadThirds.get($leadCreator))
29268 manish 174
               <td>
29288 amit.gupta 175
                 $leadThirds.get($leadCreator)
29268 manish 176
               </td>
177
               #else
178
               <td style="background:#ff9999;">  0
179
               </td>
180
               #end
29288 amit.gupta 181
               #if( $leadSeconds.get($leadCreator))
29268 manish 182
                <td>
29288 amit.gupta 183
               $leadSeconds.get($leadCreator)
29268 manish 184
               </td>
185
               #else
186
               <td style="background:#ff9999;">0 </td>
187
               #end
188
 
189
 
190
                #foreach($lwDay in $lwDays )
191
 
29290 amit.gupta 192
                #if($leadFirsts.get($leadCreator).get($lwDay.getMonth()))
29268 manish 193
               <td>
29290 amit.gupta 194
               $leadFirsts.get($leadCreator).get($lwDay.getMonth())
29268 manish 195
 
196
               </td>
197
               #else
198
               <td style="background:#ff9999;">0</td>
199
               #end
200
 
201
               #end
202
 
29290 amit.gupta 203
           #if($leadFirsts.get($leadCreator).get($lastDate))
29268 manish 204
 
29290 amit.gupta 205
             #if($leadFirsts.get($leadCreator).get($lastDate) >= 5)
29268 manish 206
               <td style="color:green;">Appreciate</td>
207
 
208
               #else
209
 
210
               <td>Meet more prospects</td>
211
               #end
212
               #else
213
              <td style="color:red;">
214
                 No leads created yesterday
215
               </td>
216
               #end
217
 
218
               </tr>
219
 
220
              #end
221
               </tbody>
222
 
223
            </table>
224
         </div>
225
          </div>
226
 
227
 
28200 tejbeer 228
				</div>
229
			</td>
27642 tejbeer 230
		</tr>
28200 tejbeer 231
	</table>
29268 manish 232
 
233
 
28200 tejbeer 234
 
25979 tejbeer 235
	<div id="lead-request-table">
236
		<div class="row">
28200 tejbeer 237
			<div class="col-lg-12">
238
				<table class="table table-border table-condensed table-bordered"
239
					id="lead-table">
240
					<thead>
241
						<tr>
242
							<th>Source</th>
243
							<th>First Name</th>
244
							<th>Last Name</th>
245
							<th>Mobile</th>
246
							<th>Address</th>
247
							<th>City</th>
248
							<th>State</th>
249
							<th>Created By</th>
250
							<th>Status</th>
251
							<th>Created On</th>
252
							<th>Updated On</th>
253
							<th>ScheduleTimestamp</th>
254
							<th>Closure Timestamp</th>
255
							<th>Assign To</th>
256
							<th>view</th>
257
							<th>Action</th>
258
						</tr>
259
					</thead>
260
					<tbody>
261
						#if(!$lead.isEmpty()) #foreach( $request in $lead )
262
						#if($request.getColor() == "Green")
263
						<tr class="open-lead" bgcolor="#98FB98" data="$request.getId()">
264
							#else
265
						<tr class="open-lead" bgcolor="$request.getColor()"
266
							data="$request.getId()">
267
							#end #if($request.getSource())
268
							<td>$request.getSource()</td> #else
269
							<td></td> #end
270
							<td>$request.getFirstName()</td>
271
							<td>$request.getLastName()</td>
272
							<td>$request.getLeadMobile()</td>
273
							<td>$request.getAddress()</td>
274
							<td>$request.getCity()</td>
275
							<td>$request.getState()</td>
276
							<td>$request.getCreatedBy()</td>
277
							<td>$request.getStatus()</td>
278
							<td>$request.getCreatedTimestamp().format($dateTimeFormatter)</td>
279
							<td>$request.getUpdatedTimestamp().format($dateTimeFormatter)</td>
280
							#if($leadActivityMap.get($request.getId()).getSchelduleTimestamp())
281
							<td>$leadActivityMap.get($request.getId()).getSchelduleTimestamp().format($dateTimeFormatter)</td>
282
							#else
283
							<td>00/00/0000 00:00</td> #end
284
							#if($request.getClosureTimestamp())
285
							<td>$request.getClosureTimestamp().format($dateTimeFormatter)</td>
286
							#else
287
							<td>00/00/0000 00:00</td> #end
288
							#if($authIdAndAuthUserMap.get($request.getAssignTo()))
29221 manish 289
							<td>$authIdAndAuthUserMap.get($request.getAssignTo()).getFirstName() $authIdAndAuthUserMap.get($request.getAssignTo()).getLastName()</td>
28200 tejbeer 290
							#else
291
							<td></td> #end
292
							<td><button class="btn btn-primary view"
293
									data-requestid="$request.getId()" data-toggle="modal"
294
									data-target="#fetchLeadActivityData" type="button">View</button></td>
295
							<td><button class="btn btn-primary editLead"
296
									data-leadid="$request.getId()" data-toggle="modal"
297
									data-target="#editLeadData" type="button">Edit</button></td>
298
						</tr>
299
						#end #else
300
						<tr>
301
							<td colspan="12" style="text-align: center;">NO MATCHING
302
								DATA FOUND FOR CRITERIA</td>
303
						</tr>
304
						#end
305
					</tbody>
306
				</table>
307
			</div>
25979 tejbeer 308
		</div>
28200 tejbeer 309
	</div>
310
 
311
 
312
	<div id="fetchLeadActivityData" class="modal" role="dialog">
313
		<div class="modal-dialog">
314
			<div class="modal-content"></div>
25979 tejbeer 315
		</div>
28200 tejbeer 316
	</div>
25979 tejbeer 317
 
28200 tejbeer 318
 
319
 
320
	<div id="editLeadData" class="modal" role="dialog">
321
		<div class="modal-dialog">
322
			<div class="modal-content">
323
				<div class="modal-header">
324
					<button type="button" class="close" data-dismiss="modal">&times;</button>
325
					<h4 class="modal-title">Edit Lead</h4>
326
				</div>
327
				<div class="modal-body">
328
					<div id="lead-edit-request">
329
						<div class="row">
330
							<div class="col-lg-3">
331
								<div class="input-group">
332
									<select class="form-control input-sm" id="assignTo"
333
										name="assignTo" placeholder="Assign">
334
										<option value="" disabled selected>Assign To</option>
335
										#foreach($authUser in $authUsers)
29268 manish 336
										<option value="$authUser.getId()">$authUser.getFirstName() $authUser.getLastName()</option>
28200 tejbeer 337
										#end
338
									</select>
339
								</div>
340
							</div>
341
 
342
							<div class="col-lg-3 form-group">
343
								<input placeholder="Remark" id="remark" name="remark"
344
									type="text" value="" class="form-control input-sm">
345
							</div>
346
 
347
							<div class="col-lg-3 form-group">
348
								<select id="reason" name="reason" placeholder="Reason"
349
									class="form-control input-sm">
350
									<option value="" disabled selected>Reason</option>
351
									<option value="No budget">No budget</option>
352
									<option value="No authority to take decision">No
353
										authority to take decision</option>
354
									<option value="No need for new business">No need for
355
										new business</option>
356
									<option value="Not ready in near future">Not ready in
357
										near future</option>
358
									<option value="No store availability">No store
359
										availability</option>
360
								</select>
361
							</div>
362
 
363
							<div class="col-lg-3 form-group">
364
								<select id="editStatus" name="editStatus" placeholder="Status"
365
									class="form-control input-sm" onchange="editStatusAction()">
366
									<option value="" disabled selected>Status</option>
367
									<option value="followUp">Follow Up</option>
368
									<option value="notInterested">Not Interested</option>
369
									<option value="finalized">Finalized</option>
370
								</select>
371
							</div>
372
 
373
							<div class="col-lg-3 form-group">
374
								<input id="editScheduleTime" placeholder="scheduleTime"
375
									name="editScheduleTime" type="text" value=""
376
									class="form-control input-sm">
377
							</div>
378
						</div>
379
					</div>
380
				</div>
381
 
382
				<div class="modal-footer">
383
					<button type="button" data-dismiss="modal"
384
						class="btn btn-default cancel-lead-request">Cancel</button>
385
					<button type="button" class="btn btn-default lead-edit-request">Submit</button>
386
 
387
				</div>
388
 
389
			</div>
390
		</div>
391
	</div>
392
 
393
 
394
 
395
 
396
 
397
	<div id="newEntryLeadModal" class="modal">
398
		<div class="modal-dialog">
399
 
400
			<!-- Modal content-->
401
			<div class="modal-content">
402
				<div class="modal-header">
403
					<button type="button" class="close" data-dismiss="modal">&times;</button>
404
					<h4 class="modal-title">Create Lead</h4>
405
				</div>
406
				<div class="modal-body">
407
					<div id="lead-request">
408
						<div class="row">
409
							<div class="col-lg-3">
410
								<div class="input-group">
411
									<input placeholder="First Name" name="firstName" id="firstName"
412
										type="text" class="form-control input-sm">
413
								</div>
414
							</div>
415
 
416
							<div class="col-lg-3 form-group">
417
								<input placeholder="Last Name" id="lastName" name="lastName"
418
									type="text" value="" class="form-control input-sm">
419
							</div>
420
 
421
							<div class="col-lg-3 form-group">
422
								<input placeholder="mobile" id="mobile" name="mobile"
423
									type="number" value="" class="form-control input-sm">
424
							</div>
425
						</div>
426
 
427
						<div class="row">
428
							<div class="col-lg-3 form-group">
429
								<input id="address" name="address" placeholder="address"
430
									id="address" type="text" value="" class="form-control input-sm">
431
							</div>
432
							<div class="col-lg-3 form-group">
433
								<input id="city" name="city" placeholder="city" type="text"
434
									value="" class="form-control input-sm">
435
							</div>
436
							<div class="col-lg-3 form-group">
437
								<select class="form-control input-sm" id="state" name="state"
438
									placeholder="State">
439
									<option value="" disabled selected>State</option>
440
									#foreach($stateName in $stateNames)
441
									<option value="$stateName">$stateName</option> #end
442
								</select>
443
							</div>
444
						</div>
445
 
446
						<div class="row">
447
 
448
							<div class="col-lg-3 form-group">
449
								<select id="status" name="status" placeholder="Status"
450
									class="form-control input-sm" onchange="statusAction()">
451
									<option value="" disabled selected>Status</option>
452
									<option value="followUp">Follow Up</option>
453
									<option value="notInterested">Not Interested</option>
454
									<option value="finalized">Finalized</option>
455
								</select>
456
							</div>
457
 
458
							<div class="col-lg-3 form-group">
459
								<input id="scheduleTime" placeholder="scheduleTime"
460
									name="scheduleTime" type="text" value=""
461
									class="form-control input-sm">
462
							</div>
463
 
464
							<div class="col-lg-3 form-group">
465
								<input id="createRemark" name="createRemark"
466
									placeholder="Remark" type="text" value=""
467
									class="form-control input-sm">
468
							</div>
469
						</div>
470
 
471
						<div class="row">
472
							<div class="col-lg-3 form-group">
473
								<select class="form-control input-sm" id="createAssignTo"
474
									name="createAssignTo" placeholder="Assign">
475
									<option value="" disabled selected>Assign To</option>
476
									#foreach($authUser in $authUsers)
29268 manish 477
									<option value="$authUser.getId()">$authUser.getFirstName() $authUser.getLastName()</option>
28200 tejbeer 478
									#end
479
								</select>
480
							</div>
481
 
482
							<div class="col-lg-3 form-group">
483
								<select class="form-control input-sm" id="leadSource"
484
									name="leadSource" placeholder="Source">
485
									<option value="" disabled selected>Source</option>
486
									<option value="SELF">SELF</option>
487
									<option value="NEWSPAPER">NEWSPAPER</option>
488
									<option value="INTERNET">INTERNET</option>
489
									<option value="PARTNER">PARTNER</option>
490
								</select>
491
							</div>
492
						</div>
493
 
494
 
495
 
496
 
497
 
498
 
499
					</div>
500
				</div>
501
 
502
				<div class="modal-footer">
503
					<button type="button" data-dismiss="modal"
504
						class="btn btn-default cancel-lead-request">Cancel</button>
505
					<button type="button" class="btn btn-default lead-request">Submit</button>
506
 
507
				</div>
508
			</div>
509
		</div>
510
	</div>
511
</section>
512
 
513
 
25979 tejbeer 514
<script type="text/javascript">
28200 tejbeer 515
	var editor;
516
	$(document)
517
			.ready(
518
					function() {
29268 manish 519
 
520
 
521
 
28200 tejbeer 522
						console.log($('#lead-table tbody tr').length)
29268 manish 523
 
28200 tejbeer 524
							$('#lead-table thead tr').clone(true).appendTo(
525
									'#lead-table thead');
526
							$('#lead-table thead tr:eq(1) th')
527
									.each(
528
											function(i) {
529
												var title = $(this).text();
530
												$(this).html(
29268 manish 531
														'<input type="text"  class="search-lead" style = "width:60%;" placeholder="Search '
28200 tejbeer 532
																+ title
533
																+ '" />');
534
 
535
												$('input', this)
536
														.on(
537
																'keyup change',
538
																function() {
539
																	if (table
540
																			.column(
541
																					i)
542
																			.search() !== this.value) {
543
																		table
544
																				.column(
545
																						i)
546
																				.search(
547
																						this.value)
548
																				.draw();
549
																	}
550
																});
551
											})
552
							var table = $('#lead-table').DataTable({
553
								orderCellsTop : true,
554
								fixedHeader : true,
555
								"bPaginate" : true,
556
								"bLengthChange" : true,
557
								"bFilter" : true,
558
								"bInfo" : false,
559
								"bAutoWidth" : false,
560
 
561
								"columnDefs" : [ {
562
									type : 'date-euro',
563
									targets : 12
564
								}, {
565
									type : 'date-euro',
566
									targets : 11
567
								}, {
568
									type : 'date-euro',
569
									targets : 10
570
								}, {
571
									type : 'date-euro',
572
									targets : 9
573
								}
574
 
575
								]
576
							});
29268 manish 577
 
578
 
579
					var  myPieChart = null;
580
						$(document).on("keyup", ".search-lead",
581
                function (e) {
582
		           	console.log('Currently applied global search:');
583
		         if(myPieChart!=null){
584
        myPieChart.destroy();
585
    }
586
		           	datatableChart();
587
 
588
	           	});
28200 tejbeer 589
 
29268 manish 590
 
591
function datatableChart() {
592
 
593
$('#chart-leadstatus').remove();
594
 
595
		let count = 0;
596
		let ni =0;
597
 
598
		let fwup = 0;
599
		let pend = 0;
600
		let final = 0;
601
 
602
		table.rows({
603
			"search" : "applied"
604
		}).every(function() {
605
 
606
			var data = this.data();
607
 
608
			console.log("data"+data);
609
			var status = data[8];
610
 
611
			console.log("status"+status);
612
 
613
			if(status=="notInterested"){
614
			ni++;
615
			}
616
			else if(status=="followUp"){
617
 
618
			fwup++;
619
			}
620
			else if(status=="pending"){
621
 
622
			pend++;
623
			}
624
			else if(status=="finalized"){
625
 
626
			final++;
627
			}
628
 
629
			console.log("All"+ni + fwup + pend+ final);
630
 
631
                 var count= table.rows( {search:'applied'} ).count();
632
 
633
                console.log("count"+count);
634
 
635
                });
636
 
637
 
638
 
639
	 var ctx = document.getElementById('chart-lead-search').getContext('2d');
640
 
641
        myPieChart = new Chart(ctx, {
642
            "type":"pie",
643
       "data":{
644
 
645
         "labels":[
646
            "notInterested",
647
            "followUp",
648
            "pending",
649
            "finalized"
650
                  ],
651
       "datasets":[
652
           {
653
            "data":[
654
                ni,fwup,pend,final
655
               ],
656
         "backgroundColor":["red","#9ACD32","pink","blue"],
657
         "label":"DataSet 1"
658
           }
659
                 ]
660
              },
661
        "options":{
662
          "responsive":true,
663
              "legend":{
664
        "labels":{
665
            "fontColor":"black",
666
           "fontSize":15
667
           },
668
          "position":"left"
669
                 }
670
         }});
671
 
672
         if(ni <= 0){
673
         myPieChart.getDatasetMeta(0).data[0].hidden = true;    
674
           }
675
         if(fwup <= 0){
676
         myPieChart.getDatasetMeta(0).data[1].hidden=true;
677
         }
678
         if(pend <= 0){
679
         myPieChart.getDatasetMeta(0).data[2].hidden=true;
680
         }
681
         if(final <= 0){
682
         myPieChart.getDatasetMeta(0).data[3].hidden=true;
683
         }
684
 
685
         myPieChart.update();
686
 
687
	}
688
 
689
 
28200 tejbeer 690
					});
25979 tejbeer 691
</script>
29221 manish 692
 
29268 manish 693
<script type="text/javascript">
694
 
695
 
696
        var config = $chartLead;
697
 
698
        var ctx = document.getElementById('chart-leadstatus').getContext('2d');
699
       var bar = new Chart(ctx, config);
700
</script>