Bladeren bron

软电话修改

miaofuhao 6 jaren geleden
bovenliggende
commit
55123e8bcb

+ 993 - 0
CallCenterWeb.UI/callScreen/OutCallScreen.html

@@ -0,0 +1,993 @@
1
+<!DOCTYPE html>
2
+<html>
3
+
4
+	<head>
5
+		<meta charset="UTF-8">
6
+		<title>来电弹屏</title>
7
+		<script src="../Script/Common/huayi.load.js"></script>
8
+		<script src="../Script/Common/huayi.config.js"></script>
9
+		<link href="./../css/plugins/jasny/jasny-bootstrap.min.css" rel="stylesheet">
10
+		<link href="./../js/bootstrap-select/css/bootstrap-select.css" rel="stylesheet" />
11
+		<link rel="stylesheet" href="./../js/zTree/zTreeStyle.css" />
12
+		<link rel="stylesheet" href="./css/call.css" />
13
+		<link rel="stylesheet" href="../js/comboSelect/combo.select.css" />
14
+		<style>
15
+			body,
16
+			html,
17
+			.wrapper {
18
+				height: 100%;
19
+			}
20
+			
21
+			.ldtp-con {
22
+				display: block;
23
+			}
24
+			
25
+			.minBacha {
26
+				position: absolute;
27
+				top: 0;
28
+				right: 80px;
29
+				z-index: 10;
30
+				overflow: hidden;
31
+			}
32
+			
33
+			.minBacha>div {
34
+				float: left;
35
+				height: 35px;
36
+				width: 35px;
37
+				margin-left: 2px;
38
+			}
39
+			
40
+			.minBacha>div a {
41
+				display: block;
42
+				height: 100%;
43
+				width: 100%;
44
+				text-align: center;
45
+				background-position: center center;
46
+				background-color: #2f4050;
47
+				opacity: .5;
48
+			}
49
+			
50
+			.minBacha>div a:hover {
51
+				opacity: 1;
52
+			}
53
+			
54
+			.minClosed>a {
55
+				background: url("./../img/min.png") no-repeat;
56
+			}
57
+			
58
+			.Bacha>a {
59
+				background: url("./../img/gb.png") no-repeat;
60
+			}
61
+			
62
+			.lblcount {
63
+				position: absolute;
64
+				right: 5px;
65
+				top: 7px;
66
+			}
67
+			
68
+			.first {
69
+				z-index: 1000;
70
+			}
71
+			
72
+			.khzl {
73
+				font-size: 12px;
74
+				border: 0;
75
+				margin: 35px auto;
76
+				color: #fff;
77
+			}
78
+			
79
+			.khzl ul li {
80
+				color: initial;
81
+			}
82
+			
83
+			.khzl tr {
84
+				border: 0;
85
+			}
86
+			
87
+			.khzl th {
88
+				padding: 5px 8px 5px 0;
89
+				text-align: right;
90
+				width: 40%;
91
+				font-weight: normal;
92
+				border: 0;
93
+			}
94
+			
95
+			.khzl tbody>tr>td,
96
+			.khzl tbody>tr>th {
97
+				border: 0;
98
+			}
99
+			
100
+			.khzl tbody>tr>td input {
101
+				border: 0;
102
+				outline: none;
103
+				background: #243747;
104
+				padding-left: 5px;
105
+				width: 100%;
106
+			}
107
+			
108
+			.khzl tbody>tr>td .combo-select {
109
+				border: 0;
110
+				outline: none;
111
+			}
112
+			
113
+			.khzl tbody>tr>td .combo-arrow {
114
+				display: none;
115
+			}
116
+			
117
+			.khbtn {
118
+				/*background: #97a0a8;*/
119
+				color: #1ab394;
120
+				font-size: 14px;
121
+				vertical-align: middle;
122
+			}
123
+			
124
+			.hei-list {
125
+				width: 400px;
126
+				margin: 0 auto;
127
+			}
128
+			
129
+			.heiTop {
130
+				height: 35px;
131
+				background: #1ab394;
132
+				color: #fff;
133
+				line-height: 35px;
134
+				padding: 0 15px;
135
+				border-top-left-radius: 3px;
136
+				border-top-right-radius: 3px;
137
+			}
138
+			
139
+			.heiTop .htl {
140
+				float: left;
141
+				margin: 0;
142
+			}
143
+			
144
+			.heiTop .bacha {
145
+				float: right;
146
+				font-size: 18px;
147
+				cursor: pointer;
148
+				margin: 0;
149
+			}
150
+			
151
+			.heiCon {
152
+				width: 100%;
153
+				background: #fff;
154
+				text-align: center;
155
+				padding: 25px 15px;
156
+				height: auto;
157
+				overflow-y: auto;
158
+				border: 1px solid #eee;
159
+			}
160
+			
161
+			#time-word {
162
+				border: 1px solid #1ab394;
163
+				padding: 5px 0 5px 10px;
164
+				width: 120px;
165
+				outline: none;
166
+				color: #000;
167
+			}
168
+			
169
+			.chooses {
170
+				margin-top: 10px;
171
+			}
172
+			
173
+			.btns {
174
+				background: #1ab394;
175
+				color: #fff;
176
+				padding: 3px 10px;
177
+				outline: none;
178
+				font-size: 12px;
179
+				margin-left: 15px;
180
+				border: 0;
181
+				border-radius: 3px;
182
+				box-sizing: border-box;
183
+			}
184
+			
185
+			.bianji {
186
+				display: inline-block;
187
+				height: 16px;
188
+				vertical-align: middle;
189
+				margin-right: 5px;
190
+			}
191
+			
192
+			#citySel {
193
+				width: 100%;
194
+			}
195
+			
196
+			.bianji.edi {
197
+				background: url(./../img/xgai.png) no-repeat;
198
+			}
199
+			
200
+			.bianji.sav {
201
+				background: url(./../img/bbc.png) no-repeat;
202
+			}
203
+			
204
+			.bianji.canc {
205
+				background: url(./../img/quxi.png) no-repeat;
206
+			}
207
+			
208
+			.t-shade {
209
+				position: fixed;
210
+				top: 0;
211
+				left: 0;
212
+				width: 100%;
213
+				height: 100%;
214
+				background: rgba(0, 0, 0, 0.48);
215
+				z-index: 10004;
216
+				display: none;
217
+			}
218
+			
219
+			.shade_k {
220
+				z-index: 10005;
221
+				width: 40%;
222
+				height: 130px;
223
+				margin: 10% auto;
224
+				background-color: #fff;
225
+				box-shadow: 1px 1px 50px rgba(0, 0, 0, .3);
226
+				border-radius: 5px;
227
+			}
228
+			
229
+			.shade_title {
230
+				padding: 0 80px 0 20px;
231
+				height: 42px;
232
+				line-height: 42px;
233
+				border-bottom: 1px solid #eee;
234
+				font-size: 16px;
235
+				color: #FFFFFF;
236
+				overflow: hidden;
237
+				background-color: rgb(26, 179, 148);
238
+				border-radius: 2px 2px 0 0;
239
+				position: relative;
240
+			}
241
+			
242
+			.setwin {
243
+				position: absolute;
244
+				right: 15px;
245
+				top: 5px;
246
+				font-size: 20px;
247
+				line-height: initial;
248
+			}
249
+			
250
+			.setwin a {
251
+				font-size: 20px;
252
+				color: #fff;
253
+			}
254
+			
255
+			.shade_content {
256
+				overflow-y: auto;
257
+				position: relative;
258
+				padding-bottom: 50px;
259
+				padding: 10px;
260
+			}
261
+			
262
+			.ldcr-bottom .detail-con ul li .active a {
263
+				color: #f95a83 !important;
264
+			}
265
+			
266
+			.ldcr-bottom .detail-con ul li .active+.explancon {
267
+				display: block !important;
268
+			}
269
+			
270
+			.searchbtn {
271
+				width: 2.5em;
272
+				height: 24px;
273
+				border-radius: 5px;
274
+				position: absolute;
275
+				background-color: #e43926;
276
+				background-image: url(./../img/searIcon.png);
277
+				background-repeat: no-repeat;
278
+				background-position: center center;
279
+				cursor: pointer;
280
+			}
281
+			
282
+			#menuContent,
283
+			#menuContent_market {
284
+				background: #fff;
285
+				position: absolute;
286
+				width: 100%;
287
+				border: 1px solid #ccc;
288
+				right: 0;
289
+				top: 34px;
290
+				z-index: 10;
291
+				/*				display: none;*/
292
+				overflow-y: auto;
293
+			}
294
+			
295
+			#organizer,
296
+			#organizer_market {
297
+				height: 25px;
298
+				width: 100%;
299
+				display: inline-block;
300
+				position: relative;
301
+			}
302
+			
303
+			#treeDemo li {
304
+				width: 100%;
305
+			}
306
+			
307
+			.bootstrap-select>.dropdown-toggle.bs-placeholder {
308
+				background-color: #ffffff!important;
309
+				border-color: #e5e6e7!important;
310
+			}
311
+			
312
+			.filter-option {
313
+				color: #676b6d;
314
+			}
315
+			
316
+			.bootstrap-select>.dropdown-toggle.btn-default {
317
+				background-color: #ffffff!important;
318
+				border-color: #e5e6e7!important;
319
+				color: #555;
320
+			}
321
+			
322
+			#fkdep_market {
323
+				display: nones;
324
+			}
325
+			
326
+			.testInput-list {
327
+				position: absolute;
328
+				z-index: 999;
329
+				border: 1px solid rgb(204, 204, 204);
330
+				background-color: rgb(255, 255, 255);
331
+				z-index: 99999;
332
+				padding-left: 0;
333
+				width: 100%;
334
+				display: none;
335
+				height: 200px;
336
+				overflow-y: auto;
337
+			}
338
+			
339
+			.testInput-list li {
340
+				padding: 5px;
341
+				color: #000;
342
+			}
343
+			
344
+			.testInput-list li:hover {
345
+				background-color: #E43926;
346
+				color: #fff;
347
+			}
348
+			
349
+			#testInput_ {
350
+				outline: none;
351
+				border: 1px solid #ccc;
352
+				padding-left: 10px;
353
+				outline-color: #fff;
354
+			}
355
+			
356
+			.e43 {
357
+				color: #e43926;
358
+			}
359
+			
360
+			.ld-sercon button.bton[disabled] {
361
+				background-color: #999;
362
+			}
363
+			
364
+			.combo-input.text-input {
365
+				font-family: "宋体"!important;
366
+			}
367
+			
368
+			#con_startTime,
369
+			#con_endTime,
370
+			#old_startTime,
371
+			#old_endTime {
372
+				width: 128px!important;
373
+			}
374
+			
375
+			.treeList {
376
+				border: 1px solid #e5e6e7!important;
377
+				border-top: 0;
378
+				height: 400px!important;
379
+			}
380
+			
381
+			#TreeDemo li {
382
+				float: initial;
383
+			}
384
+			
385
+			#typeclass {
386
+				background: #fff;
387
+			}
388
+
389
+            .treeList1 {
390
+                border: 1px solid #e5e6e7 !important;
391
+                border-top: 0;
392
+                /*height: 400px !important;*/
393
+            }
394
+			
395
+			#TreeDemo1 li {
396
+				float: initial;
397
+			}
398
+			
399
+			.addTree1 {
400
+				background: #fff;
401
+				position: absolute;
402
+				width: 180px;
403
+				border: 1px solid darkgrey;
404
+				z-index: 10;
405
+				display: none;
406
+				height: 100px;
407
+				overflow-y: auto;
408
+			}
409
+			
410
+			.inps2,
411
+			.inps3,
412
+			.inps4 {
413
+				display: none;
414
+			}
415
+			
416
+			.time-box {}
417
+			
418
+			.time-box_flbox {
419
+				display: none;
420
+			}
421
+			
422
+			.customerService tbody tr th {
423
+				padding-left: 20px;
424
+			}
425
+			
426
+			.customerService tbody tr th {
427
+				padding-left: 20px;
428
+			}
429
+			
430
+			.tub {
431
+				position: absolute;
432
+				right: 10px;
433
+				top: 15px;
434
+			}
435
+			
436
+			.add_bj {
437
+				display: inline-block;
438
+				-webkit-border-radius: 5px;
439
+				-moz-border-radius: 5px;
440
+				border-radius: 5px;
441
+				text-align: center;
442
+				padding: 5px 10px;
443
+				font-size: 12px;
444
+				cursor: pointer;
445
+				background: #1ab394;
446
+				color: #fff;
447
+				margin-top: 15px;
448
+			}
449
+			
450
+			#typeclass_market1m {
451
+				background: #FFFFFF;
452
+			}
453
+			.market tr th{
454
+				padding-left: 30px;
455
+			}
456
+			.ld-sercon input {
457
+			    /* width: 128px; */
458
+			    height: 36px;
459
+			}
460
+            .form-group {
461
+                margin:0;
462
+            }
463
+            .customerService tr {
464
+                height:40px;
465
+            }
466
+            .customerService th {
467
+                width: 100px;
468
+            }
469
+            .complainDiv2{
470
+            	display: none;
471
+            }
472
+            .workOrderIdColorRed{
473
+				color: #FF0000;
474
+			}
475
+			.workOrderIdColorGreen{
476
+				color: #008000;
477
+			}
478
+			.imgs {
479
+    			color: rgb(0, 128, 0);
480
+    			cursor: pointer;
481
+			}
482
+    		.imgs a:hover {
483
+        		color: #e43926;
484
+			}
485
+            /*.W100 .th-inner {
486
+			    width:100px !important;
487
+			}*/
488
+			.W160 .th-inner {
489
+			    width:160px !important;
490
+			}
491
+			.W220 .th-inner {
492
+			   width:220px !important;
493
+			}
494
+			.W220{
495
+			   width:220px !important;
496
+			}
497
+			i.tub {
498
+				position: absolute;
499
+				right: 11px;
500
+				top: 8px;
501
+				font-size: 18px;
502
+				color: #1ab494;
503
+			}
504
+			textarea{
505
+				height: 55px;
506
+				width: 600px;
507
+			}
508
+			#zxlbs,
509
+			#ces{
510
+				display: none;
511
+			}
512
+			.warning{
513
+				color: #eea236;
514
+			}
515
+			.defauli{
516
+				color:#bababa;
517
+			}
518
+		</style>
519
+		<script>
520
+			function clearInter() {
521
+				clearInterval(timer);
522
+			}
523
+			//通话中执行变化
524
+			var timer, n = 0;
525
+
526
+			function calling() {
527
+				$(".td-call").show();
528
+				n = 0;
529
+				clearInterval(timer);
530
+				timer = setInterval(function() {
531
+					n++;
532
+					var m = parseInt(n / 60 % 60);
533
+					var s = parseInt(n % 60);
534
+					$(".thsc").text(toDub(m) + ":" + toDub(s));
535
+				}, 1000);
536
+			}
537
+
538
+			function toDub(i) {
539
+				return i < 10 ? "0" + i : "" + i;
540
+			}
541
+		</script>
542
+	</head>
543
+
544
+	<body class="gray-bg">
545
+		<div class="wrapper wrapper-content animated fadeInRight">
546
+			<!--来电弹屏开始-->
547
+			<div class="ldtp-con clearfix animated fadeInDown ">
548
+				<div style="display: none;" class="mfhtel"></div>
549
+				<div class="hei-list">
550
+					<div class="heiTop clearFix">
551
+						<p class="htl">黑名单</p>
552
+						<p class="bacha" title="关闭">x</p>
553
+					</div>
554
+					<div class="heiCon">
555
+						<div class="heit">
556
+							<span style="font-size: 14px;">输入拉黑时长:</span>
557
+							<input type="text" id="time-word" />
558
+						</div>
559
+						<div class="chooses">
560
+
561
+							<label class="radio-inline">
562
+                        <input type="radio" name="time" value="1" checked="checked" style="margin-top: 3px;"> 天
563
+                    </label>
564
+							<label class="radio-inline">
565
+                        <input type="radio" name="time" value="2" style="margin-top: 3px;" />时
566
+                    </label>
567
+							<label class="radio-inline">
568
+                        <input type="radio" name="time" value="3" style="margin-top: 3px;" />分
569
+                    </label>
570
+							<label class="radio-inline">
571
+                        <input type="radio" name="time" value="4" style="margin-top: 3px;" />永久
572
+                    </label>
573
+
574
+						</div>
575
+						<p style="margin-top: 15px;"><button type="button" id="bc" class="btns">保存</button></p>
576
+					</div>
577
+
578
+				</div>
579
+				<!--左侧内容-->
580
+				<div class="ldtp-cl col-sm-3">
581
+					<div class="head-pic">
582
+						<div class="hp-box">
583
+							<img src="./../img/txpic.png" alt="头像好像去了外星球!" style="width: 100%;height: 100%;" />
584
+							<input type="hidden" class="hidTel" value="" />
585
+							<input type="hidden" class="hidCallID" />
586
+							<input type="hidden" class="hidActionID" />
587
+						</div>
588
+						<ul>
589
+							<li><span style="font-size: 25px;" class="tel"></span></li>
590
+							<li><span style="font-size: 15px;" class="khgsd"></span></li>
591
+							<!--<li class="nikeName"><i></i><span class="ldname">未知</span><i></i></li>-->
592
+							<!--<li style="color: #4cd964;">当前通话时长:<span class="thsc">00:00</span></li>-->
593
+							<li class="lahei">
594
+								<div class="la-before"><i class="push"></i> 移至黑名单</div>
595
+								<div class="la-after" style="display: none;">
596
+									<p class="la-shichang">拉黑截止时间:<span class="blackTime"></span></p>
597
+								</div>
598
+								<div class="retur" style="display: none;"><i class="qxlh"></i> 取消黑名单</div>
599
+							</li>
600
+							<li class="td-call clearfix" style="display:none;">
601
+								<a class="take" style="float:none;" href="javascript:;" title="转满意度"><i></i></a>
602
+								<!--<a class="drop" href="javascript:;"><i></i></a>-->
603
+							</li>
604
+						</ul>
605
+					</div>
606
+					<table class="table khzl">
607
+						<tr>
608
+							<th>姓名:</th>
609
+							<td>
610
+								<input type="text" value="" class="ldname khmc" />
611
+								<input type="hidden" value="" id="khid" />
612
+							</td>
613
+						</tr>
614
+						<!--<tr>
615
+							<th>区域:</th>
616
+							<td>
617
+								<input type="text" value="" id="kharea"/>
618
+							</td>
619
+						</tr>-->
620
+						<tr>
621
+							<th>省份:</th>
622
+                            <td>
623
+                                <input type="text" id="shengshi" readonly="readonly" autocomplete="off">
624
+                                <div class="time-box time-box_flbox" style="position: relative;">
625
+                                    <input type="hidden" class="khprovince">
626
+                                    <input type="hidden" class="khcity">
627
+                                    <div class="addTree1 treeList">
628
+                                        <ul id="TreeDemo" class="ztree"></ul>
629
+                                    </div>
630
+                                </div>
631
+                            </td>
632
+						</tr>
633
+						<tr>
634
+							<th>联系电话:</th>
635
+							<td><input type="text" value="" class="ldtel1" /></td>
636
+						</tr>
637
+						<tr>
638
+							<th>来电时间:</th>
639
+							<td><span class="ldtime" style="padding-left: 5px;"></span></td>
640
+						</tr>
641
+						<tr>
642
+							<td></td>
643
+							<td>
644
+								<span class="edit"><i class="bianji edi"></i><a class="khbtn">编辑</a></span>
645
+								<span class="save"> <i class="bianji sav"></i><a class="khbtn">保存</a></span>
646
+								<span class="cancel"><i class="bianji canc"></i><a class="khbtn">取消</a></span></td>
647
+						</tr>
648
+					</table>
649
+				</div>
650
+				<!--右侧内容-->
651
+				<div class="ldtp-cr col-sm-9">
652
+					<ul class="ld-service clearfix">
653
+						<li style="border-bottom:1px solid #f95a83;" itemtype="0" class="cr-click">新增工单</li>
654
+						<li style="border-bottom:1px solid #243747;" itemtype="1">历史记录</li>
655
+						<li style="border-bottom:1px solid #69cbd0;" itemtype="2" >历史工单</li>
656
+					</ul>
657
+                    <div class="ld-sercon">
658
+                        <div class="complain" style="display: block;">
659
+                            <div class="Pre-second second-con addgd">
660
+                                <div class="common">
661
+                                    <table class="customerService">
662
+                                        <tbody>
663
+                                            <tr>
664
+                                                <th><i style="color: #FF0000">*&nbsp;</i>客户姓名:</th>
665
+                                                <td>
666
+                                                    <div class="form-group">
667
+                                                        <input type="text" class="form-control" id="name" maxlength="8" />
668
+                                                    </div>
669
+                                                </td>
670
+                                                <th><i style="color: #FF0000">*&nbsp;</i>客户电话:</th>
671
+                                                <td>
672
+                                                    <div class="form-group">
673
+                                                        <input type="text" class="form-control" id="tel" />
674
+                                                    </div>
675
+                                                </td>
676
+                                                 <th class="up_floor">营业厅名称:</th>
677
+					                            <td class="up_floor">
678
+					                                <div class="time-box" style="position: relative;">
679
+					                                    <i class="tub fa fa-caret-down areaDown" style="color: #676b6d;"></i>
680
+					                                    <input class="form-control" type="text" id="typeclass" readonly="readonly">
681
+					                                    <input type="text" class="inps2">
682
+					                                    <input type="text" class="inps3">
683
+					                                    <input type="hidden" id="typeclassId" />
684
+					                                    <div class="addTree1 treeList1">
685
+					                                        <ul id="TreeDemo1" class="ztree"></ul>
686
+					                                    </div>
687
+					                                </div>
688
+					                            </td>
689
+                                            </tr>
690
+                                            <!--<tr>
691
+                                            	 <th>营业厅名称:</th>
692
+					                            <td>
693
+					                                <div class="time-box" style="position: relative;">
694
+					                                    <i class="tub fa fa-caret-down areaDown" style="color: #676b6d;"></i>
695
+					                                    <input class="form-control" type="text" id="typeclass" readonly="readonly">
696
+					                                    <input type="text" class="inps2">
697
+					                                    <input type="text" class="inps3">
698
+					                                    <input type="hidden" id="typeclassId" />
699
+					                                    <div class="addTree1 treeList1">
700
+					                                        <ul id="TreeDemo1" class="ztree"></ul>
701
+					                                    </div>
702
+					                                </div>
703
+					                            </td>
704
+                                            </tr>-->
705
+											<tr>
706
+												<th>客户类型:</th>
707
+                                                <td>
708
+                                                    <div class="form-group">
709
+														<select class="form-control" id="productType">
710
+							       							<!--<option value ="">请选择</option>-->
711
+														</select>
712
+													</div>
713
+                                                </td>
714
+                                                 <th>工单类型:</th>
715
+						                            <td>
716
+						                                <div class="form-group">
717
+						                                    <select name="" class="form-control orderType"></select>
718
+						                                </div>
719
+						                            </td>
720
+						                            <th class="complainDiv">定责:</th>
721
+						                            <td class="complainDiv">
722
+						                                <div class="form-group">
723
+						                                    <select name="" class="form-control complaintType1"></select>
724
+						                                </div>
725
+						                            </td>
726
+											</tr>
727
+											 <tr class="up_floor">
728
+					                        	<th>派单类型:</th>
729
+					                            <td>
730
+					                                <div class="form-group">
731
+					                                    <select name="" class="form-control" id="complaintType2"></select>
732
+					                                </div>
733
+					                            </td>
734
+					                             <th>处理人姓名:</th>
735
+					                            <td>
736
+					                                <div class="form-group">
737
+					                                    <input type="text" class="form-control" id="dealing" />
738
+					                                </div>
739
+					                            </td>
740
+					                             <th>处理人电话:</th>
741
+					                            <td>
742
+					                                <div class="form-group">
743
+					                                    <input type="text" class="form-control" id="dealingtel" />
744
+					                                </div>
745
+					                            </td>
746
+					                       </tr>
747
+<!--											<tr>
748
+												<th>提交内容:</th>
749
+                                                <td>
750
+                                                    <div class="form-group">
751
+                                                        <input type="text" class="form-control" id="cont" />
752
+                                                    </div>
753
+                                                </td>
754
+										</tr>-->											
755
+                                             <!--<tr>
756
+                                                <th>工单来源:</th>
757
+                                                <td>
758
+                                                    <div class="form-group">
759
+                                                        <select name="" class="form-control" id="DicValueList"></select>
760
+                                                    </div>
761
+                                                </td>
762
+                                                <th>工单类型:</th>
763
+                                                <td>
764
+                                                    <div class="form-group">
765
+                                                        <select name="" class="form-control orderType"></select>
766
+                                                    </div>
767
+                                                </td>
768
+                                                <th class="complainDiv2 snRmove">咨询类型:</th>
769
+					                            <td class="complainDiv2 snRmove">
770
+					                                <div class="form-group">
771
+					                                    <select name="" class="form-control complaintType2"></select>
772
+					                                </div>
773
+					                            </td>
774
+					                            <th class="complainDiv">投诉类型:</th>
775
+					                            <td class="complainDiv">
776
+					                                <div class="form-group">
777
+					                                    <select name="" class="form-control complaintType1"></select>
778
+					                                </div>
779
+					                            </td>
780
+                                            </tr>
781
+                                           <tr>
782
+
783
+                                                <th>产品名称:</th>
784
+                                                <td>
785
+                                                    <div class="form-group">
786
+                                                        <input type="text" class="form-control" id="productname" />
787
+                                                    </div>
788
+                                                </td>
789
+                                                <th>产品类别:</th>
790
+                                                <td style="position: relative;">
791
+                                                    <div class="form-group">
792
+                                                        <select name="" class="form-control productType" id="productType"></select>
793
+                                                    </div>
794
+                                                </td>
795
+                                                <th>生产批号:</th>
796
+                                                <td>
797
+                                                    <div class="form-group">
798
+                                                        <input type="text" class="form-control" id="batchNumber" />
799
+                                                    </div>
800
+                                                </td>
801
+
802
+                                                <th>购买地址:</th>
803
+                                                <td>
804
+                                                    <div class="form-group">
805
+                                                        <input type="text" class="form-control" id="buyAddress" />
806
+                                                    </div>
807
+                                                </td>
808
+                                            </tr>
809
+                                            <tr>
810
+                                                <th class="snRmove">样品寄回:</th>
811
+                                                <td style="position: relative;" class="snRmove">
812
+                                                    <label style="vertical-align: middle;font-weight: normal; margin-right:20px;"><input style="vertical-align: middle" type="radio" name="sendBack" id="sendBack" value="0" checked="checked" />否</label>
813
+                                                    <label style="vertical-align: middle;font-weight: normal;"><input style="vertical-align: middle" type="radio" name="sendBack" id="sendBack" value="1" />是</label>
814
+                                                </td>
815
+                                            </tr>
816
+                                            <tr>
817
+                                            </tr>-->
818
+                                            <tr>
819
+                                                <th>描述内容:</th>
820
+                                                <td colspan="7">
821
+                                                    <textarea name="" rows="5" cols="" placeholder="" id="content" style="margin-top:10px;"></textarea>
822
+                                                </td>
823
+                                            </tr>
824
+                                            <tr>
825
+                                                <th>回复内容:</th>
826
+                                                <td colspan="7">
827
+                                                    <textarea name="" rows="5" cols="" placeholder="" id="replycontent" style="margin-top:10px;"></textarea>
828
+                                                </td>
829
+                                            </tr>
830
+                                            <tr>
831
+                                                <th>备注:</th>
832
+                                                <td colspan="7">
833
+                                                    <textarea name="" rows="5" cols="" placeholder="" id="remark" style="margin-top:10px;"></textarea>
834
+                                                </td>
835
+                                            </tr>
836
+                                            <tr>
837
+                                                <td colspan="8" style="text-align: center;">
838
+                                                    <button class="btns customerSubmit">保&nbsp;存</button>
839
+                                                </td>
840
+                                            </tr>
841
+                                        </tbody>
842
+                                    </table>
843
+                                </div>
844
+                            </div>
845
+                        </div>
846
+
847
+                        <div class="complain" style="display:none;">
848
+                            <div class="ld-sercon-con clearfix">
849
+                                <div class="Ps-chaxun">
850
+                                    <span>查询: <input type="text" id="old_startTime" class="laydate-icon" />&nbsp;——&nbsp;<input type="text" id="old_endTime" class="laydate-icon" /></span>
851
+                                    <span class="searchbtn"></span>
852
+                                </div>
853
+                                <div class="table-responsive col-sm-12 tbold" style="padding-left: 0;">
854
+                                    <table id="oldlist" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">
855
+                                        <thead>
856
+                                            <tr>
857
+                                                <th data-field="CallNumber">电话号码</th>
858
+                                                <th data-field="CallState" data-formatter="GetCallState">呼叫状态</th>
859
+                                                <th data-field="DealType" data-formatter="formatterDealType" data-align="center">处理方式</th>
860
+                                                <th data-field="UserCode">坐席工号</th>
861
+                                                <th data-field="UserName">坐席姓名</th>
862
+                                                <th data-field="BeginTime">开始时间</th>
863
+                                                <th data-field="TalkStartTime">通话开始时间</th>
864
+                                                <th data-field="TalkEndTime">通话结束时间</th>
865
+                                                <th data-field="TalkLongTime">通话时长(s)</th>
866
+                                                <th data-field="FilePath" data-formatter="setCode">录音</th>
867
+                                            </tr>
868
+                                        </thead>
869
+                                        <tbody class="list"></tbody>
870
+                                    </table>
871
+                                </div>
872
+                            </div>
873
+
874
+                        </div>
875
+
876
+                        <div class="complain" style="display:none;">
877
+                            <div class="ld-sercon-con clearfix">
878
+                                <div class="Ps-chaxun">
879
+                                    <span>
880
+                                        	查询: <input type="text" id="con_startTime" class="laydate-icon" />
881
+                                        &nbsp;——&nbsp;
882
+                                        <input type="text" id="con_endTime" class="laydate-icon" />
883
+                                    </span>
884
+                                    <span class="searchbtn"></span>
885
+                                </div>
886
+                                <div id="zxlbs" class="table-responsive col-sm-12 tbold" style="padding-left: 0;">
887
+
888
+                                    <table id="orderlist" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">
889
+                                        <thead>
890
+                                            <tr>
891
+                    							<th data-field="F_WorkOrderId" data-class="W160" data-formatter="View" data-align="center">工单编号</th>
892
+												<th data-field="F_CreateTime" data-class="W100" data-align="center">创建时间</th>
893
+												<th data-field="F_CreateUser" data-class="W100" data-align="center">创建人</th>
894
+												<th data-field="F_State" data-formatter="GetStateName" data-class="W100" data-align="center">工单状态</th>
895
+												<th data-field="F_Content" data-class="W100" data-align="center">描述内容</th>
896
+												<th data-field="F_CusName" data-formatter="characterFive" data-class="W100" data-align="center">客户姓名</th>
897
+												<th data-field="F_CusPhone" data-class="W100" data-align="center">客户电话</th>
898
+												<th data-field="F_Typeof" data-class="W100" data-align="center">工单类型</th>
899
+												<th data-field="F_Definition" data-class="W100" data-align="center">营业厅名称</th>
900
+												<th data-field="F_Dealing" data-class="W100" data-align="center">处理人</th>
901
+												<th data-field="" data-class="W100" data-align="center">录音</th>
902
+												<!--<th data-field="F_ProductDate" data-class="W100" data-align="center">生产日期</th>
903
+												<th data-field="F_BatchNumber" data-class="W100" data-align="center">产品编码</th>
904
+												<th data-field="F_Manufacturer" data-class="W100" data-align="center">生产厂家</th>
905
+												<th data-field="F_ProblemCode" data-class="W100" data-align="center">问题代码</th>
906
+												<th data-field="F_QualityProblem" data-class="W100" data-align="center">质量问题</th>
907
+												<th data-field="F_Notifications" data-class="W100" data-align="center">通知人</th>
908
+												<th data-field="F_ReceivingPerson" data-class="W100" data-align="center">接听人</th>
909
+												<th data-field="F_DealResult" data-class="W100" data-align="center">落实情况</th>
910
+												<th data-field="F_State" data-class="W100" data-formatter="workOrderStateJudge" data-align="center">处理进度</th>
911
+												<th data-field="F_Type" data-class="W100" data-formatter="workOrderTypeJudge" data-align="center">工单类别</th>-->
912
+                                            </tr>
913
+                                        </thead>
914
+                                        <!--<tbody class="list"></tbody>-->
915
+                                    </table>
916
+                                </div>
917
+                                <div id="ces" class="table-responsive col-sm-12 tbold" style="padding-left: 0;">
918
+                                	<table id="order_ces" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">
919
+                                        <thead>
920
+                                            <tr>
921
+                    							<th data-field="F_WorkOrderId" data-class="W160" data-formatter="View" data-align="center">工单编号</th>
922
+												<th data-field="F_CreateTime" data-class="W100" data-align="center">创建时间</th>
923
+												<th data-field="F_CreateUser" data-class="W100" data-align="center">创建人</th>
924
+												<th data-field="F_State" data-formatter="GetStateName" data-class="W100" data-align="center">工单状态</th>
925
+												<th data-field="F_Content" data-class="W100" data-align="center">投诉事件描述</th>
926
+												<th data-field="F_CusName" data-class="W100" data-align="center">客户姓名</th>
927
+												<th data-field="F_CusPhone" data-class="W100" data-align="center">客户电话</th>
928
+												<th data-field="F_Typeof" data-class="W100" data-align="center">工单类型</th>
929
+												<!--<th data-field="F_Definition" data-class="W100" data-align="center">营业厅名称</th>
930
+												<th data-field="F_Dealing" data-class="W100" data-align="center">处理人</th>-->
931
+												<th data-field="" data-class="W100" data-align="center">录音</th>
932
+                                            </tr>
933
+                                        </thead>
934
+                                        <!--<tbody class="list"></tbody>-->
935
+                                    </table>
936
+                                </div>
937
+                            </div>
938
+                        </div>
939
+                    </div>
940
+					<!--右侧下方内容区-->
941
+					<div class="ldcr-bottom" style="margin-top:10px;">
942
+						<div class="ldcrb-top clearfix">
943
+							<ul class="clearfix">
944
+								<li style="border-bottom:1px solid #69cbd0; background: #000;color: #fff;">知识库</li>
945
+								<!--<li style="border-bottom:1px solid #f95a83;border-top:1px solid #000;border-right:1px solid #000;">更多内容</li>-->
946
+							</ul>
947
+							<div class="ld-search">
948
+								<div class="sear-inp">
949
+									<input type="text" class="search" placeholder="搜索问题、内容或者标题" />
950
+								</div>
951
+								<div class="searIcon">
952
+								</div>
953
+							</div>
954
+						</div>
955
+						<div class="detail-con">
956
+							<ul></ul>
957
+						</div>
958
+					</div>
959
+				</div>
960
+			</div>
961
+			<!--录音-->
962
+			<div class="t-shade">
963
+		        <div class="shade_k">
964
+		            <div class="shade_title">
965
+		                <span>录音播放与下载<srong class="cknum"></srong></span>
966
+		                <span class="setwin"><a>x</a></span>
967
+		            </div>
968
+		            <div class="shade_content">
969
+		                <div class="Ly_box audiojs">
970
+		                </div>
971
+		                <div class="boxCon LY_box">
972
+		
973
+		                </div>
974
+		            </div>
975
+		        </div>
976
+		    </div>
977
+			<!--来电弹屏结束-->
978
+		</div>
979
+		<script src="./../js/bootstrap-table.js"></script>
980
+		<script src="./../js/bootstrap-table-zh-CN.js"></script>
981
+		<script src="./../js/zTree/jquery.ztree.core.js"></script>
982
+		<script src="./../js/plugins/datapicker/bootstrap-datepicker.js"></script>
983
+		<script src="../css/laydate/laydate.js"></script>
984
+		<script src="../js/kindeditor/kindeditor.js"></script>
985
+		<script src="../js/kindeditor/lang/zh_CN.js"></script>
986
+		<script src="./../js/jquery.select.js"></script>
987
+		<script src="select.js"></script>
988
+		<script src="../js/comboSelect/jquery.combo.select.js"></script>
989
+		<script src="./../js/main.js?v=1.5"></script>
990
+		<script src="call.js"></script>
991
+	</body>
992
+
993
+</html>

+ 4 - 1
CallCenterWeb.UI/css/index.css

@@ -855,11 +855,14 @@ ul.ztree {
855 855
 	width: 100%;
856 856
 	border: none;
857 857
 	outline: none;
858
-	height: 65%;
858
+	height: 44%;
859 859
 	background: #CCCCCC;
860 860
 	line-height: 30px;
861 861
 	padding-left: 15px;
862 862
 }
863
+.td-call{
864
+	display: none;
865
+}
863 866
 
864 867
 
865 868
 

+ 1 - 0
CallCenterWeb.UI/index.html

@@ -562,6 +562,7 @@
562 562
     <div class="softphone-box">
563 563
     	<div class="phone_tooltip">
564 564
     		<p class="tooltip_text">呼叫……</p>
565
+    		<p class="td-call">通话时间:<span class="call_time"></span></p>
565 566
     		<input class="phTooltipResult" type="text" id="sip_phone_number"/>
566 567
     	</div>
567 568
     	<div class="phone_btn_div">

+ 27 - 1
CallCenterWeb.UI/js/index.js

@@ -912,7 +912,6 @@ function loadMenu() {
912 912
 		$.ajaxSettings.async = true;
913 913
 		if(result.state.toLowerCase() == "success") {
914 914
 			var data = result.data;
915
-
916 915
 			var _html = "";
917 916
 			$.each(data, function(i) {
918 917
 				var row = data[i];
@@ -979,6 +978,10 @@ $('.open-softphone').click(function () {
979 978
     	$(".softphone-box").removeClass("active fadeInRight animated");
980 979
     }else{
981 980
     	testStart();
981
+		setTimeout(function () {
982
+			reg();
983
+		}, 2000)
984
+    	$(".td-call").hide();
982 985
     	$(".tooltip_text").text("分机号:"+$.cookie("extno"))
983 986
 		$(".softphone-box").css("display","block");
984 987
 		$(".softphone-box").addClass("active fadeInRight animated");
@@ -1013,3 +1016,26 @@ $(".phTooltipResult").focus(function () {
1013 1016
 	}
1014 1017
 });
1015 1018
 
1019
+function clearInter() {
1020
+	clearInterval(timer);
1021
+}
1022
+//通话中执行变化
1023
+var timer, n = 0;
1024
+
1025
+function calling() {
1026
+	
1027
+	$(".td-call").show();
1028
+	n = 0;
1029
+	clearInterval(timer);
1030
+	timer = setInterval(function() {
1031
+		n++;
1032
+		var m = parseInt(n / 60 % 60);
1033
+		var s = parseInt(n % 60);
1034
+		$(".call_time").text(toDub(m) + ":" + toDub(s));
1035
+	}, 1000);
1036
+}
1037
+
1038
+function toDub(i) {
1039
+	return i < 10 ? "0" + i : "" + i;
1040
+}
1041
+

+ 13 - 8
CallCenterWeb.UI/js/main.js

@@ -255,14 +255,14 @@ function IncomingBack(data) {
255 255
 		hidCallID=data.CallID;
256 256
 		hidActionID=data.ActionID;
257 257
 	}else{
258
-	var timestamp = Date.parse(new Date());
259
-	var p = '<a href="javascript:;" class="active J_menuTab" data-id="./callScreen/callScreen.html?tel=' + data.Number + '&CallID='+timestamp+'">来电弹屏' + data.Number + ' <i class="fa fa-times-circle"></i></a>';
260
-	$(".J_menuTab").removeClass("active");
261
-	var nif = '<iframe class="J_iframe J_iframeNew" name="iframe'+timestamp+'"  width="100%" height="100%" src="./callScreen/callScreen.html?Number=' + data.Number + '&CallID='+timestamp+'" frameborder="0" data-id="./callScreen/callScreen.html?tel=' + data.Number + '&CallID='+timestamp+'" seamless></iframe>';
262
-	$(".J_mainContent").find("iframe.J_iframe").hide().parents(".J_mainContent").append(nif);
263
-	$(".J_menuTabs .page-tabs-content").append(p);
264
-	hidTel=data.Number;
265
-	hidCallID=timestamp;
258
+		var timestamp = Date.parse(new Date());
259
+		var p = '<a href="javascript:;" class="active J_menuTab" data-id="./callScreen/callScreen.html?tel=' + data.Number + '&CallID='+timestamp+'">来电弹屏' + data.Number + ' <i class="fa fa-times-circle"></i></a>';
260
+		$(".J_menuTab").removeClass("active");
261
+		var nif = '<iframe class="J_iframe J_iframeNew" name="iframe'+timestamp+'"  width="100%" height="100%" src="./callScreen/callScreen.html?Number=' + data.Number + '&CallID='+timestamp+'" frameborder="0" data-id="./callScreen/callScreen.html?tel=' + data.Number + '&CallID='+timestamp+'" seamless></iframe>';
262
+		$(".J_mainContent").find("iframe.J_iframe").hide().parents(".J_mainContent").append(nif);
263
+		$(".J_menuTabs .page-tabs-content").append(p);
264
+		hidTel=data.Number;
265
+		hidCallID=timestamp;
266 266
 	}
267 267
 	
268 268
 }
@@ -303,6 +303,11 @@ function LineStateAgentBack(data) {
303 303
 			$(".zxzt").removeClass("bl").addClass("br");
304 304
 		}
305 305
 		else{
306
+			if (thjsTel) {
307
+				$(".tooltip_text").text("通话结束...");	
308
+				clearInter();
309
+				thjsTel=false;
310
+			}
306 311
 			$(".hwzt").text('空闲'); //左下角状态显示
307 312
 			$(".zxzt").removeClass("br").addClass("bl");
308 313
 		}

+ 43 - 10
CallCenterWeb.UI/js/softphone.js

@@ -1,6 +1,9 @@
1 1
  var outgoingSession = null;
2 2
  var incomingSession = null;
3 3
  var currentSession = null;
4
+ var timeStrart=false;
5
+ var timeReg=false;
6
+ var thjsTel=false;
4 7
  var videoView = document.getElementById('videoView');
5 8
 
6 9
  var constraints = {
@@ -39,27 +42,36 @@
39 42
 
40 43
  	//注册成功
41 44
  	userAgent.on('registered', function(data) {
42
- 		$(".tooltip_text").text("初始化成功...");
45
+ 		if (!timeStrart) {
46
+ 			$(".tooltip_text").text("初始化成功...");
47
+ 			$(".td-call").hide();
48
+ 		}
49
+ 		timeStrart=false;
43 50
  		//setTimeout(function(){$(".tooltip_text").text("分机号:"+$.cookie("extno")"); }, 3000);
44 51
  		console.info("registered: ", data.response.status_code, ",", data.response.reason_phrase);
45 52
  	});
46 53
 
47 54
  	//注册失败
48 55
  	userAgent.on('registrationFailed', function(data) {
49
- 		$(".tooltip_text").text("注册失败...")
56
+ 		if (!timeStrart) {
57
+ 			$(".tooltip_text").text("注册失败...")
58
+ 		}
59
+ 		timeStrart=false;
50 60
  		console.log("registrationFailed, ", data);
51 61
  		//console.warn("registrationFailed, ", data.response.status_code, ",", data.response.reason_phrase, " cause - ", data.cause);
52 62
  	});
53 63
 
54 64
  	//注册超时
55 65
  	userAgent.on('registrationExpiring', function() {
56
- 		$(".tooltip_text").text("注册超时...")
66
+ 		if (!timeStrart) {
67
+ 			$(".tooltip_text").text("注册超时...")
68
+ 		}
69
+ 		timeStrart=false;
57 70
  		console.warn("registrationExpiring");
58 71
  	});
59 72
 
60 73
  	userAgent.on('newRTCSession', function(data) {
61 74
  		console.info('onNewRTCSession: ', data);
62
- 		
63 75
  		//通话呼入
64 76
  		if(data.originator == 'remote') {
65 77
 // 			if(data.request.data.split("Extension ")[1]){
@@ -67,7 +79,6 @@
67 79
 //			}
68 80
  			console.info("incomingSession, answer the call----------------------");
69 81
  			incomingSession = data.session;
70
- 			
71 82
  		} else {
72 83
  			console.info("outgoingSession");
73 84
  			outgoingSession = data.session;
@@ -87,6 +98,8 @@
87 98
  		});
88 99
  		data.session.on('confirmed', function(data) {
89 100
  			$(".tooltip_text").text("通话中...") //呼入建立
101
+ 			thjsTel=true;
102
+ 			calling();
90 103
 // 			if(stringHr_1){
91 104
 // 				var p = '<a href="javascript:;" class="active J_menuTab" data-id="./callScreen/callScreen.html?Number=' + stringHr_1+'">来电弹屏<i class="fa fa-times-circle"></i></a>';
92 105
 //				$(".J_menuTab").removeClass("active");
@@ -107,6 +120,7 @@
107 120
 
108 121
  		data.session.on('progress', function(data) {
109 122
  			$(".tooltip_text").text("振铃中...")
123
+ 			thjsTel=true;
110 124
  			//layer.msg('onProgress - ', data.originator);
111 125
  			if(data.originator == 'remote') {
112 126
  				//layer.msg('onProgress, response - ', data.response);
@@ -131,8 +145,6 @@
131 145
  		}
132 146
  	});
133 147
 
134
- 	//console.info("call register");
135
-
136 148
  	userAgent.start();
137 149
  }
138 150
  var eventHandlers = {
@@ -144,7 +156,9 @@
144 156
  		//layer.msg('呼叫失败', e);
145 157
  	},
146 158
  	'ended': function(e) {
159
+ 		debugger
147 160
  		$(".tooltip_text").text("通话结束...");
161
+ 		clearInter();
148 162
  		//layer.msg('呼叫结束', e); //对方挂机,通话结束
149 163
  	},
150 164
  	'confirmed': function(e) {
@@ -167,6 +181,7 @@
167 181
 			},
168 182
 			'mediaStream': localStream
169 183
 		});
184
+		incomingSession = null;
170 185
 	}else{
171 186
 //		外呼拨打
172 187
 		var sip_phone_number_ = document.getElementById("sip_phone_number").value.toString();
@@ -184,9 +199,9 @@
184 199
 	 	};
185 200
 	 	outgoingSession = userAgent.call(sip_phone_number_, options);
186 201
 	 	
187
-	 	var p = '<a  style="background: #24c792; color: #FFFFFF;" href="javascript:;" class="active J_menuTab" data-id="./callScreen/callScreen.html?Number=' + sip_phone_number_+'">外呼弹屏<i class="fa fa-times-circle"></i></a>';
202
+	 	var p = '<a  style="background: #24c792; color: #FFFFFF;" href="javascript:;" class="active J_menuTab" data-id="./callScreen/OutCallScreen.html?Number=' + sip_phone_number_+'">外呼弹屏<i class="fa fa-times-circle"></i></a>';
188 203
 		$(".J_menuTab").removeClass("active");
189
-		var nif = '<iframe class="J_iframe J_iframeNew" name="iframe"  width="100%" height="100%" src="./callScreen/callScreen.html?Number=' + sip_phone_number_+'"></iframe>';
204
+		var nif = '<iframe class="J_iframe J_iframeNew" name="iframe"  width="100%" height="100%" src="./callScreen/OutCallScreen.html?Number=' + sip_phone_number_+'"></iframe>';
190 205
 		$(".J_mainContent").find("iframe.J_iframe").hide().parents(".J_mainContent").append(nif);
191 206
 		$(".J_menuTabs .page-tabs-content").append(p);
192 207
 	}
@@ -194,12 +209,29 @@
194 209
  }
195 210
 
196 211
  function reg() {
197
- 	$(".tooltip_text").text("注册...");
212
+ 	if (!timeReg) {
213
+ 		$(".td-call").hide();
214
+ 		$(".tooltip_text").text("注册成功...");
215
+ 	}
216
+ 	timeReg=false;
198 217
  	console.log('register----------->');
199 218
  	userAgent.register();
200 219
  }
220
+ regTime();
221
+ function regTime(){
222
+ 	setInterval(function() {
223
+ 		timeStrart=true;
224
+ 		timeReg=true;
225
+ 		testStart();
226
+		setTimeout(function () {
227
+			reg();
228
+		}, 2000)
229
+	}, 1000*30);
230
+ }
231
+	
201 232
 
202 233
  function unReg() {
234
+ 	$(".td-call").hide();
203 235
  	$(".tooltip_text").text("注销...");
204 236
  	//console.log('unregister----------->');
205 237
  	userAgent.unregister(true);
@@ -207,6 +239,7 @@
207 239
 
208 240
  function hangup() {
209 241
  	debugger
242
+ 	clearInter();
210 243
  	//window.frames[1].clearInter();
211 244
  	$(".tooltip_text").text("挂断...");
212 245
  	//console.log('hangup----------->');