Subversion Repositories SmartDukaan

Rev

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