ソースを参照

修改来电弹屏 页面的日期插件问题;修改密码弹窗拖动问题;

fanlongfei 7 年 前
コミット
0d9d2d1b9d

+ 1 - 2
CallCenterWeb.UI/OnDuty/SeatsMessage.html

@@ -9,8 +9,7 @@
9 9
 		<script src="../Script/Common/huayi.config.js"></script>
10 10
 		<link href="../css/Table/table1.css" rel="stylesheet" />
11 11
 		<link href="../css/init.css" rel="stylesheet" />
12
-		<script src="../css/laydate/laydate.js"></script>
13
-		<script src="../My97DatePicker/WdatePicker.js"></script>
12
+		<script src="../js/laydate/laydate.js"></script>
14 13
 		<style>
15 14
 			table td {
16 15
 				word-break: break-all;

File diff suppressed because it is too large
+ 841 - 835
CallCenterWeb.UI/callScreen/call.js


+ 264 - 257
CallCenterWeb.UI/callScreen/callScreen.html

@@ -1,5 +1,6 @@
1 1
 <!DOCTYPE html>
2 2
 <html>
3
+
3 4
 	<head>
4 5
 		<meta charset="UTF-8">
5 6
 		<title>来电弹屏</title>
@@ -7,10 +8,13 @@
7 8
 		<script src="../Script/Common/huayi.config.js"></script>
8 9
 		<link rel="stylesheet" href="./css/call.css" />
9 10
 		<style>
10
-			body,html,.wrapper {
11
+			body,
12
+			html,
13
+			.wrapper {
11 14
 				height: 100%;
12 15
 			}
13
-			.ldtp-con{
16
+			
17
+			.ldtp-con {
14 18
 				display: block;
15 19
 			}
16 20
 			
@@ -235,33 +239,35 @@
235 239
 			}
236 240
 			
237 241
 			.ldcr-bottom .detail-con ul li .active a {
238
-			    color: #f95a83 !important;
242
+				color: #f95a83 !important;
243
+			}
244
+			
245
+			.ldcr-bottom .detail-con ul li .active+.explancon {
246
+				display: block !important;
239 247
 			}
240
-			.ldcr-bottom .detail-con ul li .active + .explancon {
241
-			    display: block !important;
242
-			}	
243
-			.searchbtn {
244
-				    width: 2.5em;
245
-				    height: 24px;
246
-				    border-radius: 5px;
247
-				    position: absolute;
248
-				    background-color: #01a1cb;
249
-				    background-image: url(./../img/searIcon.png);
250
-				    background-repeat: no-repeat;
251
-				    background-position: center center;
252
-				    cursor: pointer;
253
-				}		
254 248
 			
249
+			.searchbtn {
250
+				width: 2.5em;
251
+				height: 24px;
252
+				border-radius: 5px;
253
+				position: absolute;
254
+				background-color: #01a1cb;
255
+				background-image: url(./../img/searIcon.png);
256
+				background-repeat: no-repeat;
257
+				background-position: center center;
258
+				cursor: pointer;
259
+			}
255 260
 		</style>
256 261
 	</head>
262
+
257 263
 	<body class="gray-bg">
258
-	    
259
-	    <div class="wrapper wrapper-content animated fadeInRight">
264
+
265
+		<div class="wrapper wrapper-content animated fadeInRight">
260 266
 			<!--来电弹屏开始-->
261
-		    <div class="ldtp-con clearfix animated fadeInDown ">
262
-		        <!--左侧内容-->
263
-		        <!--黑名单弹出内容-->
264
-		        <!--<div class="hei-list ">
267
+			<div class="ldtp-con clearfix animated fadeInDown ">
268
+				<!--左侧内容-->
269
+				<!--黑名单弹出内容-->
270
+				<!--<div class="hei-list ">
265 271
 		            <i class="bacha">X</i>
266 272
 		            <form class="form-inline">
267 273
 		
@@ -284,69 +290,69 @@
284 290
 		            </form>
285 291
 		
286 292
 		        </div>-->
287
-		        <div class="hei-list">
288
-		            <div class="heiTop clearFix">
289
-		                <p class="htl">黑名单</p>
290
-		                <p class="bacha" title="关闭">x</p>
291
-		            </div>
292
-		            <div class="heiCon">
293
-		                <div class="heit">
294
-		                    <span style="font-size: 14px;">输入拉黑时长:</span>
295
-		                    <input type="text" id="time-word" />
296
-		                </div>
297
-		                <div class="chooses">
298
-		
299
-		                    <label class="radio-inline">
293
+				<div class="hei-list">
294
+					<div class="heiTop clearFix">
295
+						<p class="htl">黑名单</p>
296
+						<p class="bacha" title="关闭">x</p>
297
+					</div>
298
+					<div class="heiCon">
299
+						<div class="heit">
300
+							<span style="font-size: 14px;">输入拉黑时长:</span>
301
+							<input type="text" id="time-word" />
302
+						</div>
303
+						<div class="chooses">
304
+
305
+							<label class="radio-inline">
300 306
 		                        <input type="radio" name="time" value="1" checked="checked" style="margin-top: 3px;"> 天
301 307
 		                    </label>
302
-		                    <label class="radio-inline">
308
+							<label class="radio-inline">
303 309
 		                        <input type="radio" name="time" value="2" style="margin-top: 3px;" />时
304 310
 		                    </label>
305
-		                    <label class="radio-inline">
311
+							<label class="radio-inline">
306 312
 		                        <input type="radio" name="time" value="3" style="margin-top: 3px;" />分
307 313
 		                    </label>
308
-		                    <label class="radio-inline">
314
+							<label class="radio-inline">
309 315
 		                        <input type="radio" name="time" value="4" style="margin-top: 3px;" />永久
310 316
 		                    </label>
311
-		
312
-		                </div>
313
-		                <p style="margin-top: 15px;"><button id="bc" class="btns">保存</button></p>
314
-		            </div>
315
-		
316
-		        </div>
317
-		
318
-		        <!--最小化按钮-->
319
-		        <!--<div class="minClosed">
317
+
318
+						</div>
319
+						<p style="margin-top: 15px;"><button id="bc" class="btns">保存</button></p>
320
+					</div>
321
+
322
+				</div>
323
+
324
+				<!--最小化按钮-->
325
+				<!--<div class="minClosed">
320 326
 		            <a href="javaScript:;" title="最小化"></a>
321 327
 		        </div>-->
322
-		        <!--左侧内容-->
323
-		        <div class="ldtp-cl col-sm-3">
324
-		            <div class="head-pic">
325
-		                <div class="hp-box">
326
-		                    <img src="./../img/txpic.png" alt="头像好像去了外星球!" style="width: 100%;height: 100%;" />
327
-		                    <input type="hidden" class="hidTel" value="" />
328
-		                    <input type="hidden" class="hidCallID" />
329
-		                </div>
330
-		                <ul>
331
-		                    <li><span style="font-size: 25px;" class="tel"></span></li>
332
-		                    <li><span style="font-size: 15px;" class="khgsd"></span></li>
333
-		                    <!--<li class="nikeName"><i></i><span class="ldname">未知</span><i></i></li>-->
334
-		                    <li style="color: #4cd964;">当前通话时长:<span class="thsc">00:00</span></li>
335
-		                    <li class="lahei">
336
-		                        <div class="la-before"><i class="push"></i> 移至黑名单</div>
337
-		                        <div class="la-after" style="display: none;">
338
-		                            <p class="la-time">拉黑时间:<span>2017/05/13</span></p>
339
-		                            <p class="la-shichang">拉黑截止时间:<span class="blackTime"></span></p>
340
-		                        </div>
341
-		                        <div class="retur" style="display: none;"><i class="qxlh"></i> 取消黑名单</div>
342
-		                    </li>
343
-		                    <li class="td-call clearfix" style="display:none;">
344
-		                        <a class="take" style="float:none;" href="javascript:;"><i></i></a>
345
-		                        <!--<a class="drop" href="javascript:;"><i></i></a>-->
346
-		                    </li>
347
-		                </ul>
348
-		            </div>
349
-		            <!--<ul class="come-detail">
328
+				<!--左侧内容-->
329
+				<div class="ldtp-cl col-sm-3">
330
+					<div class="head-pic">
331
+						<div class="hp-box">
332
+							<img src="./../img/txpic.png" alt="头像好像去了外星球!" style="width: 100%;height: 100%;" />
333
+							<input type="hidden" class="hidTel" value="" />
334
+							<input type="hidden" class="hidCallID" />
335
+						</div>
336
+						<ul>
337
+							<li><span style="font-size: 25px;" class="tel"></span></li>
338
+							<li><span style="font-size: 15px;" class="khgsd"></span></li>
339
+							<!--<li class="nikeName"><i></i><span class="ldname">未知</span><i></i></li>-->
340
+							<li style="color: #4cd964;">当前通话时长:<span class="thsc">00:00</span></li>
341
+							<li class="lahei">
342
+								<div class="la-before"><i class="push"></i> 移至黑名单</div>
343
+								<div class="la-after" style="display: none;">
344
+									<p class="la-time">拉黑时间:<span>2017/05/13</span></p>
345
+									<p class="la-shichang">拉黑截止时间:<span class="blackTime"></span></p>
346
+								</div>
347
+								<div class="retur" style="display: none;"><i class="qxlh"></i> 取消黑名单</div>
348
+							</li>
349
+							<li class="td-call clearfix" style="display:none;">
350
+								<a class="take" style="float:none;" href="javascript:;"><i></i></a>
351
+								<!--<a class="drop" href="javascript:;"><i></i></a>-->
352
+							</li>
353
+						</ul>
354
+					</div>
355
+					<!--<ul class="come-detail">
350 356
 		                <li>姓名:<span class="ldname">未知</span></li>
351 357
 		                <li>归属地:<span class="ldlocation">未知</span></li>
352 358
 		                <li>联系电话1:<span class="ldtel1"></span></li>
@@ -355,135 +361,135 @@
355 361
 		                <li>售后负责人:<span>孙嘉一</span></li>
356 362
 		                <li>来电时间:<span class="ldtime"></span></li>
357 363
 		            </ul>-->
358
-		            <table class="table khzl">
359
-		                <tr>
360
-		                    <th>姓名:</th>
361
-		                    <td><input type="text" value="未知" class="ldname khmc" /><input type="hidden" value="" id="khid" /></td>
362
-		                </tr>
363
-		                <tr>
364
-		                    <th>客户编号:</th>
365
-		                    <td><input type="text" value="" class="khbh" /></td>
366
-		                </tr>
367
-		                <tr>
368
-		                    <th>归属地:</th>
369
-		                    <td><span class="ldlocation" style="padding-left: 5px;">未知</span></td>
370
-		                </tr>
371
-		                <tr>
372
-		                    <th>联系电话1:</th>
373
-		                    <td><input type="text" value="" class="ldtel1" /></td>
374
-		                </tr>
375
-		                <tr>
376
-		                    <th>联系电话2:</th>
377
-		                    <td><input type="text" value="" class="ldtel2" /></td>
378
-		                </tr>
379
-		                <tr>
380
-		                    <th>联系电话2:</th>
381
-		                    <td><input type="text" value="" class="ldtel3" /></td>
382
-		                </tr>
383
-		                <tr>
384
-		                    <th>来电时间:</th>
385
-		                    <td><span class="ldtime" style="padding-left: 5px;"></span></td>
386
-		                </tr>
387
-		                <tr>
388
-		                    <td></td>
389
-		                    <td><span class="edit"><i class="bianji edi"></i><a class="khbtn">编辑</a></span><span class="save"> <i class="bianji sav"></i><a class="khbtn">保存</a></span><span class="cancel"><i class="bianji canc"></i><a class="khbtn">取消</a></span></td>
390
-		                </tr>
391
-		            </table>
392
-		        </div>
393
-		        <!--右侧内容-->
394
-		
395
-		        <div class="ldtp-cr col-sm-9">
396
-		            <ul class="ld-service clearfix">
397
-		                <li style="border-bottom:1px solid #243747;" itemtype="0" class="cr-click">历史记录</li>
398
-		                <li style="border-bottom:1px solid #69cbd0;" itemtype="1">咨询</li>
399
-		                <!--<--<li style="border-bottom:1px solid #f95a83;" itemtype="2">保修服务</li>-->
400
-		                <li style="border-bottom:1px solid #243747;" itemtype="3">投诉建议</li>
401
-		            </ul>
402
-		            <div class="ld-sercon">
403
-		                <div class="complain" style="display:block;">
404
-		                    <div class="ld-sercon-con clearfix">
405
-		                        <div class="Ps-chaxun">
406
-		                            <span>查询: <input type="text" id="old_startTime" class="laydate-icon" />&nbsp;——&nbsp;<input type="text" id="old_endTime" class="laydate-icon" /></span>
407
-		
408
-		                            <span class="searchbtn"></span>
409
-		                        </div>
410
-		                        <div class="table-responsive col-sm-12 tbold" style="padding-left: 0;">
411
-		                            <table id="oldlist" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">
412
-		                                <thead>
413
-		                                    <tr>
414
-		                                        <th data-field="CallNumber">电话号码</th>
415
-		                                        <th data-field="CallState" data-formatter="GetCallState">呼叫状态</th>
416
-		                                        <!--<th data-field="IsDeal" data-formatter="GetDealState">是否处理</th>-->
417
-		                                        <th data-field="UserCode">坐席工号</th>
418
-		                                        <th data-field="UserName">坐席姓名</th>
419
-		                                        <th data-field="BeginTime">开始时间</th>
420
-		                                        <th data-field="TalkStartTime">通话开始时间</th>
421
-		                                        <th data-field="TalkEndTime">通话结束时间</th>
422
-		                                        <th data-field="TalkLongTime">通话时长(s)</th>
423
-		                                        <th data-field="FilePath" data-formatter="setCode">录音</th>
424
-		                                    </tr>
425
-		                                </thead>
426
-		                                <tbody class="list"></tbody>
427
-		                            </table>
428
-		                        </div>
429
-		                    </div>
430
-		
431
-		                </div>
432
-		                <div class="complain" style="display:none;">
433
-		                    <div class="ld-sercon-con clearfix">
434
-		                        <div class="Ps-chaxun">
435
-		                            <span>查询: <input type="text" id="con_startTime" class="laydate-icon" />&nbsp;——&nbsp;<input type="text" id="con_endTime" class="laydate-icon" /></span>
436
-		
437
-		                            <span class="searchbtn"></span>
438
-		                            <span class="addjl g" style="margin-left:5em;">新增工单</span>
439
-		                        </div>
440
-		                        <div id="zxlbs" class="table-responsive col-sm-12 tbold" style="padding-left: 0;">
441
-		
442
-		                            <table id="orderlist" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">
443
-		                                <thead>
444
-		                                    <tr>
445
-		                                        <th data-field="WorkOrderID">工单编号</th>
446
-		                                        <th data-field="State" data-formatter="GetStateName">工单状态</th>
447
-		                                        <th data-field="Customer">客户姓名</th>
448
-		                                        <th data-field="CustomerTel">客户电话</th>
449
-		                                        <th data-field="Detail" data-formatter="GetCont">工单内容</th>
450
-		                                        <th data-field="CreateUser">坐席工号</th>
451
-		                                        <th data-field="CreateTime">创建时间</th>
452
-		                                    </tr>
453
-		                                </thead>
454
-		                                <tbody class="list"></tbody>
455
-		                            </table>
456
-		                        </div>
457
-		                    </div>
458
-		                    <div class="Pre-second second-con addgd" style="display:none;">
459
-		                        <form>
460
-		                            <div class="form-group clearfix">
461
-		                                <span class="col-sm-1">
364
+					<table class="table khzl">
365
+						<tr>
366
+							<th>姓名:</th>
367
+							<td><input type="text" value="未知" class="ldname khmc" /><input type="hidden" value="" id="khid" /></td>
368
+						</tr>
369
+						<tr>
370
+							<th>客户编号:</th>
371
+							<td><input type="text" value="" class="khbh" /></td>
372
+						</tr>
373
+						<tr>
374
+							<th>归属地:</th>
375
+							<td><span class="ldlocation" style="padding-left: 5px;">未知</span></td>
376
+						</tr>
377
+						<tr>
378
+							<th>联系电话1:</th>
379
+							<td><input type="text" value="" class="ldtel1" /></td>
380
+						</tr>
381
+						<tr>
382
+							<th>联系电话2:</th>
383
+							<td><input type="text" value="" class="ldtel2" /></td>
384
+						</tr>
385
+						<tr>
386
+							<th>联系电话2:</th>
387
+							<td><input type="text" value="" class="ldtel3" /></td>
388
+						</tr>
389
+						<tr>
390
+							<th>来电时间:</th>
391
+							<td><span class="ldtime" style="padding-left: 5px;"></span></td>
392
+						</tr>
393
+						<tr>
394
+							<td></td>
395
+							<td><span class="edit"><i class="bianji edi"></i><a class="khbtn">编辑</a></span><span class="save"> <i class="bianji sav"></i><a class="khbtn">保存</a></span><span class="cancel"><i class="bianji canc"></i><a class="khbtn">取消</a></span></td>
396
+						</tr>
397
+					</table>
398
+				</div>
399
+				<!--右侧内容-->
400
+
401
+				<div class="ldtp-cr col-sm-9">
402
+					<ul class="ld-service clearfix">
403
+						<li style="border-bottom:1px solid #243747;" itemtype="0" class="cr-click">历史记录</li>
404
+						<li style="border-bottom:1px solid #69cbd0;" itemtype="1">咨询</li>
405
+						<!--<--<li style="border-bottom:1px solid #f95a83;" itemtype="2">保修服务</li>-->
406
+						<li style="border-bottom:1px solid #243747;" itemtype="3">投诉建议</li>
407
+					</ul>
408
+					<div class="ld-sercon">
409
+						<div class="complain" style="display:block;">
410
+							<div class="ld-sercon-con clearfix">
411
+								<div class="Ps-chaxun">
412
+									<span>查询: <input type="text" id="old_startTime" class="laydate-icon" />&nbsp;——&nbsp;<input type="text" id="old_endTime" class="laydate-icon" /></span>
413
+
414
+									<span class="searchbtn"></span>
415
+								</div>
416
+								<div class="table-responsive col-sm-12 tbold" style="padding-left: 0;">
417
+									<table id="oldlist" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">
418
+										<thead>
419
+											<tr>
420
+												<th data-field="CallNumber">电话号码</th>
421
+												<th data-field="CallState" data-formatter="GetCallState">呼叫状态</th>
422
+												<!--<th data-field="IsDeal" data-formatter="GetDealState">是否处理</th>-->
423
+												<th data-field="UserCode">坐席工号</th>
424
+												<th data-field="UserName">坐席姓名</th>
425
+												<th data-field="BeginTime">开始时间</th>
426
+												<th data-field="TalkStartTime">通话开始时间</th>
427
+												<th data-field="TalkEndTime">通话结束时间</th>
428
+												<th data-field="TalkLongTime">通话时长(s)</th>
429
+												<th data-field="FilePath" data-formatter="setCode">录音</th>
430
+											</tr>
431
+										</thead>
432
+										<tbody class="list"></tbody>
433
+									</table>
434
+								</div>
435
+							</div>
436
+
437
+						</div>
438
+						<div class="complain" style="display:none;">
439
+							<div class="ld-sercon-con clearfix">
440
+								<div class="Ps-chaxun">
441
+									<span>查询: <input type="text" id="con_startTime" class="laydate-icon" />&nbsp;——&nbsp;<input type="text" id="con_endTime" class="laydate-icon" /></span>
442
+
443
+									<span class="searchbtn"></span>
444
+									<span class="addjl g" style="margin-left:5em;">新增工单</span>
445
+								</div>
446
+								<div id="zxlbs" class="table-responsive col-sm-12 tbold" style="padding-left: 0;">
447
+
448
+									<table id="orderlist" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">
449
+										<thead>
450
+											<tr>
451
+												<th data-field="WorkOrderID">工单编号</th>
452
+												<th data-field="State" data-formatter="GetStateName">工单状态</th>
453
+												<th data-field="Customer">客户姓名</th>
454
+												<th data-field="CustomerTel">客户电话</th>
455
+												<th data-field="Detail" data-formatter="GetCont">工单内容</th>
456
+												<th data-field="CreateUser">坐席工号</th>
457
+												<th data-field="CreateTime">创建时间</th>
458
+											</tr>
459
+										</thead>
460
+										<tbody class="list"></tbody>
461
+									</table>
462
+								</div>
463
+							</div>
464
+							<div class="Pre-second second-con addgd" style="display:none;">
465
+								<form>
466
+									<div class="form-group clearfix">
467
+										<span class="col-sm-1">
462 468
 		                                    投诉类型:
463 469
 		                                </span>
464
-		                                <span class="col-sm-3">
470
+										<span class="col-sm-3">
465 471
 		                                    <select id="tslx">
466 472
 		                                        <option selected="selected" value=""></option>
467 473
 		                                    </select>
468 474
 		                                </span>
469
-		                                <span class="col-sm-1">
475
+										<span class="col-sm-1">
470 476
 		                                    投诉客户:
471 477
 		                                </span>
472
-		                                <span class="col-sm-3">
478
+										<span class="col-sm-3">
473 479
 		                                    <input type="text" id="tskh" />
474 480
 		                                </span>
475
-		                                <span class="col-sm-1">
481
+										<span class="col-sm-1">
476 482
 		                                    联系电话:
477 483
 		                                </span>
478
-		                                <span class="col-sm-3">
484
+										<span class="col-sm-3">
479 485
 		                                    <input type="text" id="tsdh" />
480 486
 		                                </span>
481
-		                            </div>
482
-		                            <div class="form-group clearfix">
483
-		                                <span class="col-sm-1">
487
+									</div>
488
+									<div class="form-group clearfix">
489
+										<span class="col-sm-1">
484 490
 		                                    投诉部门:
485 491
 		                                </span>
486
-		                                <span class="col-sm-3">
492
+										<span class="col-sm-3">
487 493
 		                                    <!--<select name="" id="zrbm"></select>-->
488 494
 		                                    <input type="text" id="zrbmname" readonly="readonly" />
489 495
 		                                    <input type="hidden" id="zrbm" />
@@ -491,20 +497,20 @@
491 497
 		                                        <ul id="zrbmtree" class="ztree"></ul>
492 498
 		                                    </div>
493 499
 		                                </span>
494
-		                                <span class="col-sm-1">
500
+										<span class="col-sm-1">
495 501
 		                                    被投诉人:
496 502
 		                                </span>
497
-		                                <span class="col-sm-3">
503
+										<span class="col-sm-3">
498 504
 		                                    <select name="" id="zrid">
499 505
 		                                        <option selected="selected" value=""></option>
500 506
 		                                    </select>
501 507
 		                                </span>
502
-		                            </div>
503
-		                            <div class="form-group clearfix">
504
-		                                <span class="col-sm-1">
508
+									</div>
509
+									<div class="form-group clearfix">
510
+										<span class="col-sm-1">
505 511
 		                                    接收部门:
506 512
 		                                </span>
507
-		                                <span class="col-sm-3">
513
+										<span class="col-sm-3">
508 514
 		                                    <!--<select name="" id="clbm"></select>-->
509 515
 		                                    <input type="text" id="clbmname" readonly="readonly" />
510 516
 		                                    <input type="hidden" id="clbm" />
@@ -512,93 +518,94 @@
512 518
 		                                        <ul id="clbmtree" class="ztree"></ul>
513 519
 		                                    </div>
514 520
 		                                </span>
515
-		                                <span class="col-sm-1">
521
+										<span class="col-sm-1">
516 522
 		                                    接收人:
517 523
 		                                </span>
518
-		                                <span class="col-sm-3">
524
+										<span class="col-sm-3">
519 525
 		                                    <select name="" id="clid">
520 526
 		                                        <option selected="selected" value=""></option>
521 527
 		                                    </select>
522 528
 		                                </span>
523
-		                            </div>
524
-		                            <div class="form-group clearfix">
525
-		                                <span class="col-sm-1">咨询内容:</span>
526
-		                                <span class="col-sm-11">
529
+									</div>
530
+									<div class="form-group clearfix">
531
+										<span class="col-sm-1">咨询内容:</span>
532
+										<span class="col-sm-11">
527 533
 		                                    <textarea rows="5" id="cont"></textarea>
528 534
 		                                </span>
529
-		                            </div>
530
-		                            <!--<div class="form-group" style="padding-left: 15px;">
535
+									</div>
536
+									<!--<div class="form-group" style="padding-left: 15px;">
531 537
 		                                <span>解答内容:</span>
532 538
 		                                <textarea rows="5"></textarea>
533 539
 		                            </div>-->
534
-		                            <div class="bton addts">创建</div>
535
-		                        </form>
536
-		                    </div>
537
-		                    <div class="Pre-second second-con zxbg " style="display: none;">
538
-		                        <form>
539
-		
540
-		                            <div class="form-group clearfix">
541
-		                                <span class="col-sm-1">
540
+									<div class="bton addts">创建</div>
541
+								</form>
542
+							</div>
543
+							<div class="Pre-second second-con zxbg " style="display: none;">
544
+								<form>
545
+
546
+									<div class="form-group clearfix">
547
+										<span class="col-sm-1">
542 548
 		                                    咨询人:
543 549
 		                                </span>
544
-		                                <span class="col-sm-3">
550
+										<span class="col-sm-3">
545 551
 		                                    <input type="text" id="zxr_" />
546 552
 		                                </span>
547
-		                                <span class="col-sm-1">
553
+										<span class="col-sm-1">
548 554
 		                                    咨询电话:
549 555
 		                                </span>
550
-		                                <span class="col-sm-3">
556
+										<span class="col-sm-3">
551 557
 		                                    <input type="text" id="zxdh_" />
552 558
 		                                </span>
553
-		                            </div>
554
-		
555
-		                            <div class="form-group clearfix">
556
-		                                <span class="col-sm-1">咨询内容:</span>
557
-		                                <span class="col-sm-11">
559
+									</div>
560
+
561
+									<div class="form-group clearfix">
562
+										<span class="col-sm-1">咨询内容:</span>
563
+										<span class="col-sm-11">
558 564
 		                                    <textarea rows="5" id="zxnr_" style="resize: none;"></textarea>
559 565
 		                                </span>
560
-		                            </div>
561
-		                            <div class="form-group clearfix">
562
-		                                <span class="col-sm-1">处理内容:</span>
563
-		                                <span class="col-sm-11">
566
+									</div>
567
+									<div class="form-group clearfix">
568
+										<span class="col-sm-1">处理内容:</span>
569
+										<span class="col-sm-11">
564 570
 		                                    <textarea rows="5" style="resize: none;" id="clnr_"></textarea>
565 571
 		                                </span>
566
-		
567
-		                            </div>
568
-		                            <div class="bton add_">创建</div>
569
-		                        </form>
570
-		                    </div>
571
-		                </div>
572
-		            </div>
573
-		            <!--右侧下方内容区-->
574
-		            <div class="ldcr-bottom" style="margin-top:10px;">
575
-		                <div class="ldcrb-top clearfix">
576
-		                    <ul class="clearfix">
577
-		                        <li style="border-bottom:1px solid #69cbd0; background: #000;color: #fff;">知识库</li>
578
-		                        <!--<li style="border-bottom:1px solid #f95a83;border-top:1px solid #000;border-right:1px solid #000;">更多内容</li>-->
579
-		                    </ul>
580
-		                    <div class="ld-search">
581
-		                        <div class="sear-inp">
582
-		                            <input type="text" class="search" placeholder="搜索问题、内容或者标题" />
583
-		                        </div>
584
-		                        <div class="searIcon">
585
-		                        </div>
586
-		                    </div>
587
-		                </div>
588
-		                <div class="detail-con">
589
-		                    <ul></ul>
590
-		                </div>
591
-		            </div>
592
-		        </div>
593
-		    </div>
594
-		   
595
-		   <!--来电弹屏结束-->
596
-	    
597
-	    </div>	
572
+
573
+									</div>
574
+									<div class="bton add_">创建</div>
575
+								</form>
576
+							</div>
577
+						</div>
578
+					</div>
579
+					<!--右侧下方内容区-->
580
+					<div class="ldcr-bottom" style="margin-top:10px;">
581
+						<div class="ldcrb-top clearfix">
582
+							<ul class="clearfix">
583
+								<li style="border-bottom:1px solid #69cbd0; background: #000;color: #fff;">知识库</li>
584
+								<!--<li style="border-bottom:1px solid #f95a83;border-top:1px solid #000;border-right:1px solid #000;">更多内容</li>-->
585
+							</ul>
586
+							<div class="ld-search">
587
+								<div class="sear-inp">
588
+									<input type="text" class="search" placeholder="搜索问题、内容或者标题" />
589
+								</div>
590
+								<div class="searIcon">
591
+								</div>
592
+							</div>
593
+						</div>
594
+						<div class="detail-con">
595
+							<ul></ul>
596
+						</div>
597
+					</div>
598
+				</div>
599
+			</div>
600
+
601
+			<!--来电弹屏结束-->
602
+
603
+		</div>
598 604
 		<script src="../js/bootstrap-table.js"></script>
599 605
 		<script src="../js/bootstrap-table-zh-CN.js"></script>
600
-		<script src="../css/laydate/laydate.js"></script>
606
+		<script src="../js/laydate/laydate.js"></script>
601 607
 		<script src="../js/main.js?v=1.5"></script>
602 608
 		<script src="call.js"></script>
603 609
 	</body>
604
-</html>
610
+
611
+</html>

+ 177 - 173
CallCenterWeb.UI/css/personal.css

@@ -1,173 +1,177 @@
1
-         .clearFix:after {
2
-            content: "";
3
-            display: block;
4
-            clear: both;
5
-        }
6
-
7
-        .personal {
8
-              width: 500px;
9
-		    margin: 0 auto;
10
-		    font-size: 14px;
11
-		    position: absolute;
12
-		    top: 119px;
13
-		    left: 500px;
14
-		    background: #fff;
15
-		    display: none;
16
-        }
17
-
18
-        .perBox {
19
-            border: 1px solid #eeeeee;
20
-            height: 400px;
21
-                         box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 50px
22
-
23
-        }
24
-
25
-        .ptop {
26
-            height: 35px;
27
-            background: #2f4050;
28
-            color: #fff;
29
-            line-height: 35px;
30
-            padding: 0 15px;
31
-            border-top-left-radius: 3px;
32
-            border-top-right-radius: 3px;
33
-        }
34
-
35
-            .ptop .ptl {
36
-                float: left;
37
-                margin: 0;
38
-            }
39
-
40
-            .ptop .ptr {
41
-                float: right;
42
-                font-size: 18px;
43
-                cursor: pointer;
44
-                margin: 0;
45
-            }
46
-
47
-        .perTab {
48
-            width: 100%;
49
-            border-bottom: 1px solid #b3b3b3;
50
-            list-style: none;
51
-            padding: 0 12px;
52
-            margin-top: 15px;
53
-        }
54
-
55
-            .perTab li {
56
-                float: left;
57
-                padding: 7px;
58
-                cursor: pointer;
59
-            }
60
-
61
-        .sel {
62
-            border-top: 1px solid #b3b3b3;
63
-            border-left: 1px solid #b3b3b3;
64
-            border-right: 1px solid #b3b3b3;
65
-            border-top-left-radius: 3px;
66
-            border-top-right-radius: 3px;
67
-        }
68
-
69
-        .grt {
70
-            width: 90%;
71
-            margin: 0 auto;
72
-            border-bottom: 1px solid #999999;
73
-                margin-top: 10px;
74
-        }
75
-
76
-        .grtl {
77
-            float: left;
78
-        }
79
-
80
-        .grtr {
81
-            float: right;
82
-        }
83
-        .grtr i{
84
-        	display: inline-block;
85
-        	vertical-align: middle;
86
-        	width: 18px;
87
-            height: 18px;
88
-        	cursor: pointer;
89
-        }
90
-        .grqx{
91
-            background: url(../img/grcx.png) no-repeat;
92
-            margin-right: 5px;
93
-        }
94
-        .grbj{
95
-        	      background: url(../img/bjic.png) no-repeat;
96
-        }
97
-
98
-        .grzl {
99
-            font-size: 14px;
100
-            border: 0;
101
-            width: 80%;
102
-            margin: 35px auto;
103
-        }
104
-
105
-            .grzl tr {
106
-                border: 0;
107
-            }
108
-
109
-            .grzl th {
110
-                padding: 5px 8px 5px 0;
111
-                text-align: right;
112
-                width: 45%;
113
-                font-weight: normal;
114
-                border: 0;
115
-            }
116
-
117
-            .grzl tbody > tr > td,
118
-            .grzl tbody > tr > th {
119
-                border: 0;
120
-            }
121
-
122
-                .grzl tbody > tr > td input {
123
-                    border: 0;
124
-                    outline: none;
125
-                    padding-left: 5px;
126
-                    width: 50%;
127
-                }
128
-
129
-        .crop_left {
130
-            width: 40%;
131
-            float: left;
132
-        }
133
-
134
-        .image-crop {
135
-            width: 100%;
136
-        }
137
-
138
-        .crop_left img {
139
-            width: 100%;
140
-        }
141
-
142
-        .crop_right {
143
-            width: 30%;
144
-            float: right;
145
-            margin-right: 25px;
146
-        }
147
-
148
-        .img-preview-sm {
149
-            width: 100%;
150
-        }
151
-
152
-            .img-preview-sm img {
153
-                width: 100%;
154
-                height: 100%;
155
-            }
156
-
157
-        .perTab_con > div {
158
-            display: none;
159
-        }
160
-
161
-        .btnn {
162
-            background: #2f4050;
163
-            color: #fff;
164
-            padding: 3px 10px;
165
-            border: 0;
166
-            border-radius: 3px;
167
-            cursor: pointer;
168
-        }
169
-
170
-        .wrong {
171
-            color: red;
172
-            display: none;
173
-        }
1
+ .clearFix:after {
2
+ 	content: "";
3
+ 	display: block;
4
+ 	clear: both;
5
+ }
6
+ 
7
+ .personal {
8
+ 	width: 500px;
9
+ 	margin: 0 auto;
10
+ 	font-size: 14px;
11
+ 	position: absolute;
12
+ 	top: 119px;
13
+ 	left: 500px;
14
+ 	background: #fff;
15
+ 	display: none;
16
+ 	z-index: 9999;
17
+ }
18
+ 
19
+ .perBox {
20
+ 	border: 1px solid #eeeeee;
21
+ 	height: 400px;
22
+ 	box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 50px
23
+ }
24
+ 
25
+ .ptop {
26
+ 	height: 35px;
27
+ 	background: #2f4050;
28
+ 	color: #fff;
29
+ 	line-height: 35px;
30
+ 	padding: 0 15px;
31
+ 	border-top-left-radius: 3px;
32
+ 	border-top-right-radius: 3px;
33
+ 	cursor: all-scroll;
34
+ }
35
+ 
36
+ .ptop .ptl {
37
+ 	float: left;
38
+ 	margin: 0;
39
+ }
40
+ 
41
+ .ptop .ptr {
42
+ 	float: right;
43
+ 	font-size: 18px;
44
+ 	cursor: pointer;
45
+ 	margin: 0;
46
+ }
47
+ 
48
+ .perTab {
49
+ 	width: 100%;
50
+ 	border-bottom: 1px solid #b3b3b3;
51
+ 	list-style: none;
52
+ 	padding: 0 12px;
53
+ 	margin-top: 15px;
54
+ }
55
+ 
56
+ .perTab li {
57
+ 	float: left;
58
+ 	padding: 7px;
59
+ 	cursor: pointer;
60
+ }
61
+ 
62
+ .sel {
63
+ 	border-top: 1px solid #b3b3b3;
64
+ 	border-left: 1px solid #b3b3b3;
65
+ 	border-right: 1px solid #b3b3b3;
66
+ 	border-top-left-radius: 3px;
67
+ 	border-top-right-radius: 3px;
68
+ }
69
+ 
70
+ .grt {
71
+ 	width: 90%;
72
+ 	margin: 0 auto;
73
+ 	border-bottom: 1px solid #999999;
74
+ 	margin-top: 10px;
75
+ }
76
+ 
77
+ .grtl {
78
+ 	float: left;
79
+ }
80
+ 
81
+ .grtr {
82
+ 	float: right;
83
+ }
84
+ 
85
+ .grtr i {
86
+ 	display: inline-block;
87
+ 	vertical-align: middle;
88
+ 	width: 18px;
89
+ 	height: 18px;
90
+ 	cursor: pointer;
91
+ }
92
+ 
93
+ .grqx {
94
+ 	background: url(../img/grcx.png) no-repeat;
95
+ 	margin-right: 5px;
96
+ }
97
+ 
98
+ .grbj {
99
+ 	background: url(../img/bjic.png) no-repeat;
100
+ }
101
+ 
102
+ .grzl {
103
+ 	font-size: 14px;
104
+ 	border: 0;
105
+ 	width: 80%;
106
+ 	margin: 35px auto;
107
+ }
108
+ 
109
+ .grzl tr {
110
+ 	border: 0;
111
+ }
112
+ 
113
+ .grzl th {
114
+ 	padding: 5px 8px 5px 0;
115
+ 	text-align: right;
116
+ 	width: 45%;
117
+ 	font-weight: normal;
118
+ 	border: 0;
119
+ }
120
+ 
121
+ .grzl tbody>tr>td,
122
+ .grzl tbody>tr>th {
123
+ 	border: 0;
124
+ }
125
+ 
126
+ .grzl tbody>tr>td input {
127
+ 	border: 0;
128
+ 	outline: none;
129
+ 	padding-left: 5px;
130
+ 	width: 50%;
131
+ }
132
+ 
133
+ .crop_left {
134
+ 	width: 40%;
135
+ 	float: left;
136
+ }
137
+ 
138
+ .image-crop {
139
+ 	width: 100%;
140
+ }
141
+ 
142
+ .crop_left img {
143
+ 	width: 100%;
144
+ }
145
+ 
146
+ .crop_right {
147
+ 	width: 30%;
148
+ 	float: right;
149
+ 	margin-right: 25px;
150
+ }
151
+ 
152
+ .img-preview-sm {
153
+ 	width: 100%;
154
+ }
155
+ 
156
+ .img-preview-sm img {
157
+ 	width: 100%;
158
+ 	height: 100%;
159
+ }
160
+ 
161
+ .perTab_con>div {
162
+ 	display: none;
163
+ }
164
+ 
165
+ .btnn {
166
+ 	background: #2f4050;
167
+ 	color: #fff;
168
+ 	padding: 3px 10px;
169
+ 	border: 0;
170
+ 	border-radius: 3px;
171
+ 	cursor: pointer;
172
+ }
173
+ 
174
+ .wrong {
175
+ 	color: red;
176
+ 	display: none;
177
+ }

File diff suppressed because it is too large
+ 1197 - 1188
CallCenterWeb.UI/index.html


+ 135 - 0
CallCenterWeb.UI/js/dialogDrag.js

@@ -0,0 +1,135 @@
1
+
2
+var dialogInstace, onMoveStartId, mousePos = {
3
+	x: 0,
4
+	y: 0
5
+}; //	用于记录当前可拖拽的对象
6
+
7
+
8
+//	获取元素对象	
9
+function g(id) {
10
+	return document.getElementById(id);
11
+}
12
+
13
+//	自动居中元素(el = Element)
14
+function autoCenter(el) {
15
+	var bodyW = document.documentElement.clientWidth;
16
+	var bodyH = document.documentElement.clientHeight;
17
+
18
+	var elW = el.offsetWidth;
19
+	var elH = el.offsetHeight;
20
+
21
+	el.style.left = (bodyW - elW) / 2 + 'px';
22
+	el.style.top = (bodyH - elH) / 2 + 'px';
23
+
24
+}
25
+
26
+//	自动扩展元素到全部显示区域
27
+function fillToBody(el) {
28
+	el.style.width = document.documentElement.clientWidth + 'px';
29
+	el.style.height = document.documentElement.clientHeight + 'px';
30
+}
31
+
32
+//	Dialog实例化的方法
33
+function Dialog(dragId, moveId) {
34
+
35
+	var instace = {};
36
+
37
+	instace.dragElement = g(dragId); //	允许执行 拖拽操作 的元素
38
+	instace.moveElement = g(moveId); //	拖拽操作时,移动的元素
39
+
40
+	instace.mouseOffsetLeft = 0; //	拖拽操作时,移动元素的起始 X 点
41
+	instace.mouseOffsetTop = 0; //	拖拽操作时,移动元素的起始 Y 点
42
+	
43
+	
44
+    if(instace.dragElement.addEventListener){
45
+     	instace.dragElement.addEventListener('mousedown', function(e) {
46
+
47
+			var e = e || window.event;
48
+	
49
+			dialogInstace = instace;
50
+			instace.mouseOffsetLeft = e.pageX - instace.moveElement.offsetLeft;
51
+			instace.mouseOffsetTop = e.pageY - instace.moveElement.offsetTop;
52
+	
53
+			onMoveStartId = setInterval(onMoveStart, 10);
54
+			return false;
55
+			// instace.moveElement.style.zIndex = zIndex ++;
56
+		},false);
57
+   	}else if(instace.dragElement.attachEvent){
58
+     	instace.dragElement.attachEvent('onmousedown',function(e) {
59
+
60
+			var e = e || window.event;
61
+	
62
+			dialogInstace = instace;
63
+			instace.mouseOffsetLeft = e.pageX - instace.moveElement.offsetLeft;
64
+			instace.mouseOffsetTop = e.pageY - instace.moveElement.offsetTop;
65
+	
66
+			onMoveStartId = setInterval(onMoveStart, 10);
67
+			return false;
68
+			// instace.moveElement.style.zIndex = zIndex ++;
69
+		});
70
+   	}else{
71
+     	instace.dragElement.onmousedown = function(e) {
72
+
73
+			var e = e || window.event;
74
+	
75
+			dialogInstace = instace;
76
+			instace.mouseOffsetLeft = e.pageX - instace.moveElement.offsetLeft;
77
+			instace.mouseOffsetTop = e.pageY - instace.moveElement.offsetTop;
78
+	
79
+			onMoveStartId = setInterval(onMoveStart, 10);
80
+			return false;
81
+			// instace.moveElement.style.zIndex = zIndex ++;
82
+		}
83
+   	}
84
+	return instace;
85
+}
86
+
87
+//	在页面中侦听 鼠标弹起事件
88
+document.onmouseup = function(e) {
89
+	dialogInstace = false;
90
+	clearInterval(onMoveStartId);
91
+}
92
+document.onmousemove = function(e) {
93
+	var e = window.event || e;
94
+	mousePos.x = e.clientX;
95
+	mousePos.y = e.clientY;
96
+
97
+	e.stopPropagation && e.stopPropagation();
98
+	e.cancelBubble = true;
99
+	e = this.originalEvent;
100
+	e && (e.preventDefault ? e.preventDefault() : e.returnValue = false);
101
+
102
+	document.body.style.MozUserSelect = 'none';
103
+}
104
+
105
+function onMoveStart() {
106
+
107
+	var instace = dialogInstace;
108
+	if(instace) {
109
+
110
+		var maxX = document.documentElement.clientWidth - instace.moveElement.offsetWidth;
111
+		var maxY = document.documentElement.clientHeight - instace.moveElement.offsetHeight;
112
+
113
+		instace.moveElement.style.left = Math.min(Math.max((mousePos.x - instace.mouseOffsetLeft), 0), maxX) + "px";
114
+		instace.moveElement.style.top = Math.min(Math.max((mousePos.y - instace.mouseOffsetTop), 0), maxY) + "px";
115
+
116
+	}
117
+
118
+}
119
+
120
+//	重新调整对话框的位置和遮罩,并且展现
121
+function showDialog() {
122
+	g('dialogMove').style.display = 'block';
123
+	//g('mask').style.display = 'block';
124
+	autoCenter(g('dialogMove'));
125
+	//fillToBody(g('mask'));
126
+}
127
+
128
+//	关闭对话框
129
+function hideDialog() {
130
+	g('dialogMove').style.display = 'none';
131
+	//g('mask').style.display = 'none';
132
+}
133
+
134
+////	侦听浏览器窗口大小变化
135
+//window.onresize = showDialog;

+ 10 - 49
CallCenterWeb.UI/js/index.js

@@ -346,7 +346,12 @@ $(document).ready(function() {
346 346
 
347 347
 	//修改密码开始
348 348
 	$('.shezhi').click(function() {
349
-		$('.personal').show();
349
+		Dialog('dialogDrag', 'dialogMove');
350
+		showDialog();
351
+		//侦听浏览器窗口大小变化
352
+		window.onresize = showDialog;
353
+
354
+//		$('.personal').show();
350 355
 		$.ajax({
351 356
 			type: "get",
352 357
 			url: huayi.config.callcenter_url + "UserAccount/GetNowUser",
@@ -390,8 +395,8 @@ $(document).ready(function() {
390 395
 	})
391 396
 	//关闭按钮
392 397
 	$('.ptr').click(function() {
393
-		$('.personal').hide();
394
-
398
+		hideDialog();
399
+		//$('.personal').hide();
395 400
 	})
396 401
 	$('.grbtn').click(function() {
397 402
 		var gh = $('.mgh').val();
@@ -467,7 +472,8 @@ $(document).ready(function() {
467 472
 				if(result.state.toLowerCase() == "success") {
468 473
 					$(".yhtx").attr("src", huayi.config.callcenter_url.substr(0, huayi.config.callcenter_url.length - 1) + result.data);
469 474
 					layer.msg("上传成功");
470
-					$('.personal').hide();
475
+					hideDialog();
476
+					//$('.personal').hide();
471 477
 				}
472 478
 			})
473 479
 		});
@@ -612,51 +618,6 @@ $(document).ready(function() {
612 618
 			}
613 619
 		})
614 620
 	})
615
-
616
-	//拖拽事件
617
-	//拖动事件
618
-	var box = document.getElementById("box");
619
-	//鼠标按下的函数
620
-	box.onmousedown = function(ev) {
621
-		var oEvent = ev || event;
622
-		//求出鼠标和box的位置差值
623
-		var x = oEvent.clientX - box.offsetLeft;
624
-		var y = oEvent.clientY - box.offsetTop;
625
-		console.log(x);
626
-		//鼠标移动的函数
627
-		//把事件加在document上,解决因为鼠标移动太快时,
628
-		//鼠标超过box后就没有了拖拽的效果的问题
629
-		document.onmousemove = function(ev) {
630
-			var oEvent = ev || event;
631
-
632
-			//保证拖拽框一直保持在浏览器窗口内部,不能被拖出的浏览器窗口的范围
633
-			var l = oEvent.clientX - x;
634
-			var t = oEvent.clientY - y;
635
-			if(l < 0) {
636
-				l = 0;
637
-
638
-			} else if(l > document.documentElement.clientWidth - box.offsetWidth) {
639
-				l = document.documentElement.clientWidth - box.offsetWidth;
640
-			}
641
-			if(t < 0) {
642
-				t = 0;
643
-			} else if(t > document.documentElement.clientHeight - box.offsetHeight) {
644
-				t = document.documentElement.clientHeight - box.offsetHeight;
645
-			}
646
-			box.style.left = l + "px";
647
-			box.style.top = t + "px";
648
-		}
649
-		//鼠标抬起的函数
650
-		document.onmouseup = function() {
651
-			document.onmousemove = null;
652
-			document.onmouseup = null;
653
-		}
654
-		//火狐浏览器在拖拽空div时会出现bug
655
-		//return false阻止默认事件,解决火狐的bug
656
-		return false;
657
-
658
-	}
659
-
660 621
 	$('.pre-add').click(function() {
661 622
 		var par = $(this).parent().parent();
662 623
 		par.hide().siblings().show();