Initial commit,修正

This commit is contained in:
2025-07-13 19:37:38 +08:00
parent 38ce288e27
commit 65bbd06981
12384 changed files with 3985464 additions and 8 deletions
File diff suppressed because one or more lines are too long
+73
View File
@@ -0,0 +1,73 @@
/**
@Name: laydate 核心样式
@Author:贤心
@Site:http://sentsin.com/layui/laydate
**/
html{_background-image:url(about:blank); _background-attachment:fixed;}
.laydate_body .laydate_box, .laydate_body .laydate_box *{margin:0; padding:0;}
.laydate-icon,
.laydate-icon-default,
.laydate-icon-danlan,
.laydate-icon-dahong,
.laydate-icon-molv{height:22px; line-height:22px; padding-right:20px; border:1px solid #C6C6C6; background-repeat:no-repeat; background-position:right center; background-color:#fff; outline:0;}
.laydate-icon-default{ background-image:url(../skins/default/icon.png)}
.laydate-icon-danlan{border:1px solid #B1D2EC; background-image:url(../skins/danlan/icon.png)}
.laydate-icon-dahong{background-image:url(../skins/dahong/icon.png)}
.laydate-icon-molv{background-image:url(../skins/molv/icon.png)}
.laydate_body .laydate_box{width:240px; font:12px '\5B8B\4F53'; z-index:99999999; *margin:-2px 0 0 -2px; *overflow:hidden; _margin:0; _position:absolute!important; background-color:#fff;}
.laydate_body .laydate_box li{list-style:none;}
.laydate_body .laydate_box .laydate_void{cursor:text!important;}
.laydate_body .laydate_box a, .laydate_body .laydate_box a:hover{text-decoration:none; blr:expression(this.onFocus=this.blur()); cursor:pointer;}
.laydate_body .laydate_box a:hover{text-decoration:none;}
.laydate_body .laydate_box cite, .laydate_body .laydate_box label{position:absolute; width:0; height:0; border-width:5px; border-style:dashed; border-color:transparent; overflow:hidden; cursor:pointer;}
.laydate_body .laydate_box .laydate_yms, .laydate_body .laydate_box .laydate_time{display:none;}
.laydate_body .laydate_box .laydate_show{display:block;}
.laydate_body .laydate_box input{outline:0; font-size:14px; background-color:#fff;}
.laydate_body .laydate_top{position:relative; height:26px; padding:5px; *width:100%; z-index:99;}
.laydate_body .laydate_ym{position:relative; float:left; height:24px; cursor:pointer;}
.laydate_body .laydate_ym input{float:left; height:24px; line-height:24px; text-align:center; border:none; cursor:pointer;}
.laydate_body .laydate_ym .laydate_yms{position:absolute; left: -1px; top: 24px; height:181px;}
.laydate_body .laydate_y{width:121px; margin-right:6px;}
.laydate_body .laydate_y input{width:64px; margin-right:15px;}
.laydate_body .laydate_y .laydate_yms{width:121px; text-align:center;}
.laydate_body .laydate_y .laydate_yms a{position:relative; display:block; height:20px;}
.laydate_body .laydate_y .laydate_yms ul{height:139px; padding:0; *overflow:hidden;}
.laydate_body .laydate_y .laydate_yms ul li{float:left; width:60px; height:20px; line-height: 20px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.laydate_body .laydate_m{width:99px;}
.laydate_body .laydate_m .laydate_yms{width:99px; padding:0;}
.laydate_body .laydate_m input{width:42px; margin-right:15px;}
.laydate_body .laydate_m .laydate_yms span{display:block; float:left; width:42px; margin: 5px 0 0 5px; line-height:24px; text-align:center; _display:inline;}
.laydate_body .laydate_choose{display:block; float:left; position:relative; width:20px; height:24px;}
.laydate_body .laydate_choose cite, .laydate_body .laydate_tab cite{left:50%; top:50%;}
.laydate_body .laydate_chtop cite{margin:-7px 0 0 -5px; border-bottom-style:solid;}
.laydate_body .laydate_chdown cite, .laydate_body .laydate_ym label{top:50%; margin:-2px 0 0 -5px; border-top-style:solid;}
.laydate_body .laydate_chprev cite{margin:-5px 0 0 -7px;}
.laydate_body .laydate_chnext cite{margin:-5px 0 0 -2px;}
.laydate_body .laydate_ym label{right:28px;}
.laydate_body .laydate_table{ width:230px; margin:0 5px; border-collapse:collapse; border-spacing:0px; }
.laydate_body .laydate_table td{width:31px; height:19px; line-height:19px; text-align: center; cursor:pointer; font-size: 12px;}
.laydate_body .laydate_table thead{height:22px; line-height:22px;}
.laydate_body .laydate_table thead th{font-weight:400; font-size:12px; text-align:center;}
.laydate_body .laydate_bottom{position:relative; height:22px; line-height:20px; padding:5px; font-size:12px;}
.laydate_body .laydate_bottom #laydate_hms{position: relative; z-index: 1; float:left; }
.laydate_body .laydate_time{ position:absolute; left:5px; bottom: 26px; width:129px; height:125px; *overflow:hidden;}
.laydate_body .laydate_time .laydate_hmsno{ padding:5px 0 0 5px;}
.laydate_body .laydate_time .laydate_hmsno span{display:block; float:left; width:24px; height:19px; line-height:19px; text-align:center; cursor:pointer; *margin-bottom:-5px;}
.laydate_body .laydate_time1{width:228px; height:154px;}
.laydate_body .laydate_time1 .laydate_hmsno{padding: 6px 0 0 8px;}
.laydate_body .laydate_time1 .laydate_hmsno span{width:21px; height:20px; line-height:20px;}
.laydate_body .laydate_msg{left:49px; bottom:67px; width:141px; height:auto; overflow: hidden;}
.laydate_body .laydate_msg p{padding:5px 10px;}
.laydate_body .laydate_bottom li{float:left; height:20px; line-height:20px; border-right:none; font-weight:900;}
.laydate_body .laydate_bottom .laydate_sj{width:33px; text-align:center; font-weight:400;}
.laydate_body .laydate_bottom input{float:left; width:21px; height:20px; line-height:20px; border:none; text-align:center; cursor:pointer; font-size:12px; font-weight:400;}
.laydate_body .laydate_bottom .laydte_hsmtex{height:20px; line-height:20px; text-align:center;}
.laydate_body .laydate_bottom .laydte_hsmtex span{position:absolute; width:20px; top:0; right:0px; cursor:pointer;}
.laydate_body .laydate_bottom .laydte_hsmtex span:hover{font-size:14px;}
.laydate_body .laydate_bottom .laydate_btn{position:absolute; right:5px; top:5px;}
.laydate_body .laydate_bottom .laydate_btn a{float:left; height:20px; padding:0 6px; _padding:0 5px;}
.laydate_body .laydate_bottom .laydate_v{position:absolute; left:10px; top:6px; font-family:Courier; z-index:0;}
Binary file not shown.

After

Width:  |  Height:  |  Size: 307 B

@@ -0,0 +1,58 @@
/**
@Name: laydate皮肤:大红
@Author:贤心
@Site:http://sentsin.com/layui/laydate
**/
.laydate-icon{border:1px solid #ccc; background-image:url(icon.png)}
.laydate_body .laydate_bottom #laydate_hms,
.laydate_body .laydate_time{border:1px solid #ccc;}
.laydate_body .laydate_box,
.laydate_body .laydate_time{box-shadow: 2px 2px 5px rgba(0,0,0,.1);}
.laydate_body .laydate_box{border-top:none; border-bottom:none; background-color:#fff; color:#333;}
.laydate_body .laydate_box input{background:none!important; color:#fff;}
.laydate_body .laydate_box .laydate_void{color:#ccc!important;}
.laydate_body .laydate_box a, .laydate_body .laydate_box a:hover{color:#333;}
.laydate_body .laydate_box a:hover{color:#666;}
.laydate_body .laydate_click{background-color:#F32043!important; color:#fff!important;}
.laydate_body .laydate_top{border-top:1px solid #D91600; background-color:#D91600}
.laydate_body .laydate_ym{border:1px solid #D91600; background-color:#D91600;}
.laydate_body .laydate_ym .laydate_yms{border:1px solid #D91600; background-color:#D91600; color:#fff;}
.laydate_body .laydate_y .laydate_yms a{border-bottom:1px solid #D91600;}
.laydate_body .laydate_y .laydate_yms .laydate_chdown{border-top:1px solid #D91600; border-bottom:none;}
.laydate_body .laydate_choose{border-left:1px solid #D91600;}
.laydate_body .laydate_chprev{border-left:none; border-right:1px solid #D91600;}
.laydate_body .laydate_choose:hover,
.laydate_body .laydate_y .laydate_yms a:hover{background-color:#F54766;}
.laydate_body .laydate_chtop cite{border-bottom-color:#fff;}
.laydate_body .laydate_chdown cite, .laydate_body .laydate_ym label{border-top-color:#fff;}
.laydate_body .laydate_chprev cite{border-right-style:solid; border-right-color:#fff;}
.laydate_body .laydate_chnext cite{border-left-style:solid; border-left-color:#fff;}
.laydate_body .laydate_table{width: 240px!important; margin: 0!important; border:1px solid #ccc; border-top:none; border-bottom:none;}
.laydate_body .laydate_table td{border:none; height:21px!important; line-height:21px!important; background-color:#fff; color:#333;}
.laydate_body .laydate_table .laydate_nothis{color:#999;}
.laydate_body .laydate_table thead{border-bottom:1px solid #ccc; height:21px!important; line-height:21px!important;}
.laydate_body .laydate_table thead th{}
.laydate_body .laydate_bottom{border:1px solid #ccc; border-top:none;}
.laydate_body .laydate_bottom #laydate_hms{background-color:#fff;}
.laydate_body .laydate_time{background-color:#fff;}
.laydate_body .laydate_time1{width: 226px!important; height: 152px!important;}
.laydate_body .laydate_bottom .laydate_sj{width:31px!important; border-right:1px solid #ccc; background-color:#fff;}
.laydate_body .laydate_bottom input{background-color:#fff; color:#333;}
.laydate_body .laydate_bottom .laydte_hsmtex{border-bottom:1px solid #ccc;}
.laydate_body .laydate_bottom .laydate_btn{border-right:1px solid #ccc;}
.laydate_body .laydate_bottom .laydate_v{color:#999}
.laydate_body .laydate_bottom .laydate_btn a{border: 1px solid #ccc; border-right:none; background-color:#fff;}
.laydate_body .laydate_bottom .laydate_btn a:hover{background-color:#F6F6F6; color:#333;}
.laydate_body .laydate_m .laydate_yms span:hover,
.laydate_body .laydate_time .laydate_hmsno span:hover,
.laydate_body .laydate_y .laydate_yms ul li:hover,
.laydate_body .laydate_table td:hover{background-color:#F54766; color:#fff;}
Binary file not shown.

After

Width:  |  Height:  |  Size: 314 B

@@ -0,0 +1,68 @@
/**
@Name: laydate皮肤:默认
@Author:贤心
@Site:http://sentsin.com/layui/laydate
**/
.laydate-icon{border:1px solid #C6C6C6; background-image:url(icon.png)}
.laydate_body .laydate_box,
.laydate_body .laydate_ym,
.laydate_body .laydate_ym .laydate_yms,
.laydate_body .laydate_table,
.laydate_body .laydate_table td,
.laydate_body .laydate_bottom #laydate_hms,
.laydate_body .laydate_time,
.laydate_body .laydate_bottom .laydate_btn a{border:1px solid #ccc;}
.laydate_body .laydate_y .laydate_yms a,
.laydate_body .laydate_choose,
.laydate_body .laydate_table thead,
.laydate_body .laydate_bottom .laydte_hsmtex{background-color:#F6F6F6;}
.laydate_body .laydate_box,
.laydate_body .laydate_ym .laydate_yms,
.laydate_body .laydate_time{box-shadow: 2px 2px 5px rgba(0,0,0,.1);}
.laydate_body .laydate_box{border-top:none; border-bottom:none; background-color:#fff; color:#333;}
.laydate_body .laydate_box input{color:#333;}
.laydate_body .laydate_box .laydate_void{color:#ccc!important; /*text-decoration:line-through;*/}
.laydate_body .laydate_box .laydate_void:hover{background-color:#fff!important}
.laydate_body .laydate_box a, .laydate_body .laydate_box a:hover{color:#333;}
.laydate_body .laydate_box a:hover{color:#666;}
.laydate_body .laydate_click{background-color:#eee!important;}
.laydate_body .laydate_top{border-top:1px solid #C6C6C6;}
.laydate_body .laydate_ym .laydate_yms{border:1px solid #C6C6C6; background-color:#fff;}
.laydate_body .laydate_y .laydate_yms a{border-bottom:1px solid #C6C6C6;}
.laydate_body .laydate_y .laydate_yms .laydate_chdown{border-top:1px solid #C6C6C6; border-bottom:none;}
.laydate_body .laydate_choose{border-left:1px solid #C6C6C6;}
.laydate_body .laydate_chprev{border-left:none; border-right:1px solid #C6C6C6;}
.laydate_body .laydate_choose:hover,
.laydate_body .laydate_y .laydate_yms a:hover{background-color:#fff;}
.laydate_body .laydate_chtop cite{border-bottom-color:#666;}
.laydate_body .laydate_chdown cite, .laydate_body .laydate_ym label{border-top-color:#666;}
.laydate_body .laydate_chprev cite{border-right-style:solid; border-right-color:#666;}
.laydate_body .laydate_chnext cite{border-left-style:solid; border-left-color:#666;}
.laydate_body .laydate_table td{border:none; height:21px!important; line-height:21px!important; background-color:#fff;}
.laydate_body .laydate_table .laydate_nothis{color:#999;}
.laydate_body .laydate_table thead{height:21px!important; line-height:21px!important;}
.laydate_body .laydate_table thead th{border-bottom:1px solid #ccc;}
.laydate_body .laydate_bottom{border-bottom:1px solid #C6C6C6;}
.laydate_body .laydate_bottom #laydate_hms{background-color:#fff;}
.laydate_body .laydate_time{background-color:#fff;}
.laydate_body .laydate_bottom .laydate_sj{border-right:1px solid #C6C6C6; background-color:#F6F6F6;}
.laydate_body .laydate_bottom input{background-color:#fff;}
.laydate_body .laydate_bottom .laydte_hsmtex{border-bottom:1px solid #C6C6C6;}
.laydate_body .laydate_bottom .laydate_btn{border-right:1px solid #C6C6C6;}
.laydate_body .laydate_bottom .laydate_v{color:#999}
.laydate_body .laydate_bottom .laydate_btn a{border-right:none; background-color:#F6F6F6;}
.laydate_body .laydate_bottom .laydate_btn a:hover{color:#000; background-color:#fff;}
.laydate_body .laydate_m .laydate_yms span:hover,
.laydate_body .laydate_y .laydate_yms ul li:hover,
.laydate_body .laydate_table td:hover,
.laydate_body .laydate_time .laydate_hmsno span:hover{background-color:#F3F3F3}
Binary file not shown.

After

Width:  |  Height:  |  Size: 309 B

@@ -0,0 +1,59 @@
/**
@Name: laydate皮肤:墨绿
@Author:贤心
@Site:http://sentsin.com/layui/laydate
**/
.laydate-icon{border:1px solid #ccc; background-image:url(icon.png)}
.laydate_body .laydate_bottom #laydate_hms,
.laydate_body .laydate_time{border:1px solid #ccc;}
.laydate_body .laydate_box,
.laydate_body .laydate_ym .laydate_yms,
.laydate_body .laydate_time{box-shadow: 2px 2px 5px rgba(0,0,0,.1);}
.laydate_body .laydate_box{border-top:none; border-bottom:none; background-color:#fff; color:#00625A;}
.laydate_body .laydate_box input{background:none!important; color:#fff;}
.laydate_body .laydate_box .laydate_void{color:#00E8D7!important;}
.laydate_body .laydate_box a, .laydate_body .laydate_box a:hover{color:#00625A;}
.laydate_body .laydate_box a:hover{color:#666;}
.laydate_body .laydate_click{background-color:#009F95!important; color:#fff!important;}
.laydate_body .laydate_top{border-top:1px solid #009F95; background-color:#009F95}
.laydate_body .laydate_ym{border:1px solid #009F95; background-color:#009F95;}
.laydate_body .laydate_ym .laydate_yms{border:1px solid #009F95; background-color:#009F95; color:#fff;}
.laydate_body .laydate_y .laydate_yms a{border-bottom:1px solid #009F95;}
.laydate_body .laydate_y .laydate_yms .laydate_chdown{border-top:1px solid #009F95; border-bottom:none;}
.laydate_body .laydate_choose{border-left:1px solid #009F95;}
.laydate_body .laydate_chprev{border-left:none; border-right:1px solid #009F95;}
.laydate_body .laydate_choose:hover,
.laydate_body .laydate_y .laydate_yms a:hover{background-color:#00C1B3;}
.laydate_body .laydate_chtop cite{border-bottom-color:#fff;}
.laydate_body .laydate_chdown cite, .laydate_body .laydate_ym label{border-top-color:#fff;}
.laydate_body .laydate_chprev cite{border-right-style:solid; border-right-color:#fff;}
.laydate_body .laydate_chnext cite{border-left-style:solid; border-left-color:#fff;}
.laydate_body .laydate_table{width: 240px!important; margin: 0!important; border:1px solid #ccc; border-top:none; border-bottom:none;}
.laydate_body .laydate_table td{border:none; height:21px!important; line-height:21px!important; background-color:#fff; color:#00625A;}
.laydate_body .laydate_table .laydate_nothis{color:#999;}
.laydate_body .laydate_table thead{border-bottom:1px solid #ccc; height:21px!important; line-height:21px!important;}
.laydate_body .laydate_table thead th{}
.laydate_body .laydate_bottom{border:1px solid #ccc; border-top:none;}
.laydate_body .laydate_bottom #laydate_hms{background-color:#fff;}
.laydate_body .laydate_time{background-color:#fff;}
.laydate_body .laydate_time1{width: 226px!important; height: 152px!important;}
.laydate_body .laydate_bottom .laydate_sj{width:31px!important; border-right:1px solid #ccc; background-color:#fff;}
.laydate_body .laydate_bottom input{background-color:#fff; color:#00625A;}
.laydate_body .laydate_bottom .laydte_hsmtex{border-bottom:1px solid #ccc;}
.laydate_body .laydate_bottom .laydate_btn{border-right:1px solid #ccc;}
.laydate_body .laydate_bottom .laydate_v{color:#999}
.laydate_body .laydate_bottom .laydate_btn a{border: 1px solid #ccc; border-right:none; background-color:#fff;}
.laydate_body .laydate_bottom .laydate_btn a:hover{background-color:#F6F6F6; color:#00625A;}
.laydate_body .laydate_m .laydate_yms span:hover,
.laydate_body .laydate_time .laydate_hmsno span:hover,
.laydate_body .laydate_y .laydate_yms ul li:hover,
.laydate_body .laydate_table td:hover{background-color:#00C1B3; color:#fff;}
File diff suppressed because one or more lines are too long
+2
View File
File diff suppressed because one or more lines are too long
+158
View File
@@ -0,0 +1,158 @@
/*
@Name: layim WebIM 1.0.0
@Author:贤心(子涵修改)
@Date: 2014-04-25
@Blog: http://sentsin.com
*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,input,button,textarea,p,blockquote,th,td,form{margin:0; padding:0;}
input,button,textarea,select,optgroup,option{font-family:inherit; font-size:inherit; font-style:inherit; font-weight:inherit; outline: 0;}
li{list-style:none;}
.xxim_icon, .xxim_main i, .layim_chatbox i{position:absolute;}
.loading{background:url(loading.gif) no-repeat center center;}
.layim_chatbox a, .layim_chatbox a:hover{color:#343434; text-decoration:none; }
.layim_zero{position:absolute; width:0; height:0; border-style:dashed; border-color:transparent; overflow:hidden;}
.xxim_main{position:fixed; right:1px; bottom:1px; width:230px; border:1px solid #BEBEBE; background-color:#fff; font-size:12px; box-shadow: 0 0 10px rgba(0,0,0,.2); z-index:99999999}
.layim_chatbox textarea{resize:none;}
.xxim_main em, .xxim_main i, .layim_chatbox em, .layim_chatbox i{font-style:normal; font-weight:400;}
.xxim_main h5{font-size:100%; font-weight:400;}
/* 搜索栏 */
.xxim_search{position:relative; padding-left:40px; height:40px; border-bottom:1px solid #DCDCDC; background-color:#fff;}
.xxim_search i{left:10px; top:12px; width:16px; height:16px;font-size: 16px;color:#999;}
.xxim_search input{border:none; background:none; width: 180px; margin-top:10px; line-height:20px;}
.xxim_search span{display:none; position:absolute; right:10px; top:10px; height:18px; line-height:18px;width:18px;text-align: center;background-color:#AFAFAF; color:#fff; cursor:pointer; border-radius:2px; font-size:12px; font-weight:900;}
.xxim_search span:hover{background-color:#FCBE00;}
/* 主面板tab */
.xxim_tabs{height:45px; border-bottom:1px solid #DBDBDB; background-color:#F4F4F4; font-size:0;}
.xxim_tabs span{position:relative; display:inline-block; *display:inline; *zoom:1; vertical-align:top; width:76px; height:45px; border-right:1px solid #DBDBDB; cursor:pointer; font-size:12px;}
.xxim_tabs span i{top:12px; left:50%; width:20px; margin-left:-10px; height:20px;font-size:20px;color:#ccc;}
.xxim_tabs .xxim_tabnow{height:46px; background-color:#fff;}
.xxim_tabs .xxim_tabnow i{color:#1ab394;}
.xxim_tabs .xxim_latechat{border-right:none;}
.xxim_tabs .xxim_tabfriend i{width:14px; margin-left:-7px;}
/* 主面板列表 */
.xxim_list{display:none; height:350px; padding:5px 0; overflow:hidden;}
.xxim_list:hover{ overflow-y:auto;}
.xxim_list h5{position:relative; padding-left:32px; height:26px; line-height:26px; cursor:pointer; color:#000; font-size:0;}
.xxim_list h5 span{display:inline-block; *display:inline; *zoom:1; vertical-align:top; max-width:140px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap; font-size:12px;}
.xxim_list h5 i{left:15px; top:8px; width:10px; height:10px;font-size:10px;color:#666;}
.xxim_list h5 *{font-size:12px;}
.xxim_list .xxim_chatlist{display:none;}
.xxim_list .xxim_liston h5 i{width:8px; height:7px;}
.xxim_list .xxim_liston .xxim_chatlist{display:block;}
.xxim_chatlist {}
.xxim_chatlist li{position:relative; height:40px; line-height:30px; padding:5px 10px; font-size:0; cursor:pointer;}
.xxim_chatlist li:hover{background-color:#F2F4F8}
.xxim_chatlist li *{display:inline-block; *display:inline; *zoom:1; vertical-align:top; font-size:12px;}
.xxim_chatlist li span{padding-left:10px; max-width:120px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
.xxim_chatlist li img{width:30px; height:30px;}
.xxim_chatlist li .xxim_time{position:absolute; right:10px; color:#999;}
.xxim_list .xxim_errormsg{text-align:center; margin:50px 0; color:#999;}
.xxim_searchmain{position:absolute; width:230px; height:491px; left:0; top:41px; z-index:10; background-color:#fff;}
/* 主面板底部 */
.xxim_bottom{height:34px; border-top:1px solid #D0DCF3; background-color:#F2F4F8;}
.xxim_expend{border-left:1px solid #D0DCF3; border-bottom:1px solid #D0DCF3;}
.xxim_bottom li{position:relative; width:50px; height:32px; line-height:32px; float:left; border-right:1px solid #D0DCF3; cursor:pointer;}
.xxim_bottom li i{ top:9px;}
.xxim_bottom .xxim_hide{border-right:none;}
.xxim_bottom .xxim_online{width:72px; padding-left:35px;}
.xxim_online i{left:13px; width:14px; height:14px;font-size:14px;color:#FFA00A;}
.xxim_setonline{display:none; position:absolute; left:-79px; bottom:-1px; border:1px solid #DCDCDC; background-color:#fff;}
.xxim_setonline span{position:relative; display:block; width:32px;width: 77px; padding:0 10px 0 35px;}
.xxim_setonline span:hover{background-color:#F2F4F8;}
.xxim_offline .xxim_nowstate, .xxim_setoffline i{color:#999;}
.xxim_mymsg i{left:18px; width:14px; height:14px;font-size: 14px;}
.xxim_mymsg a{position:absolute; left:0; top:0; width:50px; height:32px;}
.xxim_seter i{left:18px; width:14px; height:14px;font-size: 14px;}
.xxim_hide i{left:18px; width:14px; height:14px;font-size: 14px;}
.xxim_show i{}
.xxim_bottom .xxim_on{position:absolute; left:-17px; top:50%; width:16px;text-align: center;color:#999;line-height: 97px; height:97px; margin-top:-49px;border:solid 1px #BEBEBE;border-right: none; background:#F2F4F8;}
.xxim_bottom .xxim_off{}
/* 聊天窗口 */
.layim_chatbox{width:620px; border:1px solid #BEBEBE; background-color:#fff; font-size:12px; box-shadow: 0 0 10px rgba(0,0,0,.2);}
.layim_chatbox h6{position:relative; height:40px; border-bottom:1px solid #D9D9D9; background-color:#FCFDFA}
.layim_move{position:absolute; height:40px; width: 620px; z-index:0;}
.layim_face{position:absolute; bottom:-1px; left:10px; width:64px; height:64px;padding:1px;background: #fff; border:1px solid #ccc;}
.layim_face img{width:60px; height:60px;}
.layim_names{position:absolute; left:90px; max-width:300px; line-height:40px; color:#000; overflow:hidden; text-overflow: ellipsis; white-space:nowrap; font-size:14px;}
.layim_rightbtn{position:absolute; right:15px; top:12px; font-size:20px;}
.layim_rightbtn i{position:relative; width:16px; height:16px; display:inline-block; *display:inline; *zoom:1; vertical-align:top; cursor:pointer; transition: all .3s;text-align: center;line-height: 16px;}
.layim_rightbtn .layim_close{background: #FFA00A;color:#fff;}
.layim_rightbtn .layim_close:hover{-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg);}
.layim_rightbtn .layer_setmin{margin-right:5px;color:#999;font-size:14px;font-weight: 700;}
.layim_chat, .layim_chatmore,.layim_groups{height:450px; overflow:hidden;}
.layim_chatmore{display:none; float:left; width:135px; border-right:1px solid #BEBEBE; background-color:#F2F2F2}
.layim_chatlist li, .layim_groups li{position:relative; height:30px; line-height:30px; padding:0 10px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap; cursor:pointer;}
.layim_chatlist li{padding:0 20px 0 10px;}
.layim_chatlist li:hover{background-color:#E3E3E3;}
.layim_chatlist li span{display:inline-block; *display:inline; *zoom:1; vertical-align:top; width:90px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
.layim_chatlist li em{display:none; position:absolute; top:6px; right:10px; height:18px; line-height:18px;width:18px;text-align: center;font-size:14px;font-weight:900; border-radius:3px;}
.layim_chatlist li em:hover{background-color: #FCBE00; color:#fff;}
.layim_chatlist .layim_chatnow,.layim_chatlist .layim_chatnow:hover{/*border-top:1px solid #D9D9D9; border-bottom:1px solid #D9D9D9;*/ background-color:#fff;}
.layim_chat{}
.layim_chatarea{height:280px;}
.layim_chatview{display:none; height:280px; overflow:hidden;}
.layim_chatmore:hover, .layim_groups:hover, .layim_chatview:hover{overflow-y:auto;}
.layim_chatview li{margin-bottom:10px; clear:both; *zoom:1;}
.layim_chatview li:after{content:'\20'; clear:both; *zoom:1; display:block; height:0;}
.layim_chatthis{display:block;}
.layim_chatuser{float:left; padding:15px; font-size:0;}
.layim_chatuser *{display:inline-block; *display:inline; *zoom:1; vertical-align:top; line-height:30px; font-size:12px; padding-right:10px;}
.layim_chatuser img{width:30px; height:30px;padding-right: 0;margin-right: 15px;}
.layim_chatuser .layim_chatname{max-width:230px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
.layim_chatuser .layim_chattime{color:#999; padding-left:10px;}
.layim_chatsay{position:relative; float:left; margin:0 15px; padding:10px; line-height:20px; background-color:#F3F3F3; border-radius:3px; clear:both;}
.layim_chatsay .layim_zero{left:5px; top:-8px; border-width:8px; border-right-style:solid; border-right-color:#F3F3F3;}
.layim_chateme .layim_chatuser{float:right;}
.layim_chateme .layim_chatuser *{padding-right:0; padding-left:10px;}
.layim_chateme .layim_chatuser img{margin-left:15px;padding-left: 0;}
.layim_chateme .layim_chatsay .layim_zero{left:auto; right:10px;}
.layim_chateme .layim_chatuser .layim_chattime{padding-left:0; padding-right:10px;}
.layim_chateme .layim_chatsay{float:right; background-color:#EBFBE3}
.layim_chateme .layim_zero{border-right-color:#EBFBE3;}
.layim_groups{display:none; float:right; width:130px; border-left:1px solid #D9D9D9; background-color:#fff;}
.layim_groups ul{display:none;}
.layim_groups ul.layim_groupthis{display:block;}
.layim_groups li *{display:inline-block; *display:inline; *zoom:1; vertical-align:top; margin-right:10px;}
.layim_groups li img{width:20px; height:20px; margin-top:5px;}
.layim_groups li span{max-width:80px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
.layim_groups li:hover{background-color:#F3F3F3;}
.layim_groups .layim_errors{text-align:center; color:#999;}
.layim_tool{position:relative; height:35px; line-height:35px; padding-left:10px; background-color:#F3F3F3;}
.layim_tool i{position:relative; top:10px; display:inline-block; *display:inline; *zoom:1; vertical-align:top; width:16px; height:16px; margin-right:10px; cursor:pointer;font-size:16px;color:#999;font-weight: 700;}
.layim_tool i:hover{color:#FFA00A;}
.layim_tool .layim_seechatlog{position:absolute; right:15px;}
.layim_tool .layim_seechatlog i{}
.layim_write{display:block; border:none; width:98%; height:90px; line-height:20px; margin:5px auto 0;}
.layim_send{position:relative; height:40px; background-color:#F3F3F3;}
.layim_sendbtn{position:absolute; height:26px; line-height:26px; right:10px; top:8px; padding:0 40px 0 20px; background-color:#FFA00A; color:#fff; border-radius:3px; cursor:pointer;}
.layim_enter{position:absolute; right:0; border-left:1px solid #FFB94F; width:24px; height:26px;}
.layim_enter:hover{background-color:#E68A00; border-radius:0 3px 3px 0;}
.layim_enter .layim_zero{left:7px; top:11px; border-width:5px; border-top-style:solid; border-top-color:#FFE0B3;}
.layim_sendtype{display:none; position:absolute; right:10px; bottom:37px; border:1px solid #D9D9D9; background-color:#fff; text-align:left;}
.layim_sendtype span{display:block; line-height:24px; padding:0 10px 0 25px; cursor:pointer;}
.layim_sendtype span:hover{background-color:#F3F3F3;}
.layim_sendtype span i{left:5px;}
.layim_min{display:none; position:absolute; left:-190px; bottom:-1px; width:160px; height:32px; line-height:32px; padding:0 10px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap; border:1px solid #ccc; box-shadow: 0 0 5px rgba(0,0,75,.2); background-color:#FCFDFA; cursor:pointer;}
+630
View File
@@ -0,0 +1,630 @@
/*
@Name: layui WebIM 1.0.0
@Author:贤心
@Date: 2014-04-25
@Blog: http://sentsin.com
*/
;!function(win, undefined){
var config = {
msgurl: 'mailbox.html?msg=',
chatlogurl: 'mailbox.html?user=',
aniTime: 200,
right: -232,
api: {
friend: 'js/plugins/layer/layim/data/friend.json', //好友列表接口
group: 'js/plugins/layer/layim/data/group.json', //群组列表接口
chatlog: 'js/plugins/layer/layim/data/chatlog.json', //聊天记录接口
groups: 'js/plugins/layer/layim/data/groups.json', //群组成员接口
sendurl: '' //发送消息接口
},
user: { //当前用户信息
name: '游客',
face: 'img/a1.jpg'
},
//自动回复内置文案,也可动态读取数据库配置
autoReplay: [
'您好,我现在有事不在,一会再和您联系。',
'你没发错吧?',
'洗澡中,请勿打扰,偷窥请购票,个体四十,团体八折,订票电话:一般人我不告诉他!',
'你好,我是主人的美女秘书,有什么事就跟我说吧,等他回来我会转告他的。',
'我正在拉磨,没法招呼您,因为我们家毛驴去动物保护协会把我告了,说我剥夺它休产假的权利。',
'<(@ ̄︶ ̄@)>',
'你要和我说话?你真的要和我说话?你确定自己想说吗?你一定非说不可吗?那你说吧,这是自动回复。',
'主人正在开机自检,键盘鼠标看好机会出去凉快去了,我是他的电冰箱,我打字比较慢,你慢慢说,别急……',
'(*^__^*) 嘻嘻,是贤心吗?'
],
chating: {},
hosts: (function(){
var dk = location.href.match(/\:\d+/);
dk = dk ? dk[0] : '';
return 'http://' + document.domain + dk + '/';
})(),
json: function(url, data, callback, error){
return $.ajax({
type: 'POST',
url: url,
data: data,
dataType: 'json',
success: callback,
error: error
});
},
stopMP: function(e){
e ? e.stopPropagation() : e.cancelBubble = true;
}
}, dom = [$(window), $(document), $('html'), $('body')], xxim = {};
//主界面tab
xxim.tabs = function(index){
var node = xxim.node;
node.tabs.eq(index).addClass('xxim_tabnow').siblings().removeClass('xxim_tabnow');
node.list.eq(index).show().siblings('.xxim_list').hide();
if(node.list.eq(index).find('li').length === 0){
xxim.getDates(index);
}
};
//节点
xxim.renode = function(){
var node = xxim.node = {
tabs: $('#xxim_tabs>span'),
list: $('.xxim_list'),
online: $('.xxim_online'),
setonline: $('.xxim_setonline'),
onlinetex: $('#xxim_onlinetex'),
xximon: $('#xxim_on'),
layimFooter: $('#xxim_bottom'),
xximHide: $('#xxim_hide'),
xximSearch: $('#xxim_searchkey'),
searchMian: $('#xxim_searchmain'),
closeSearch: $('#xxim_closesearch'),
layimMin: $('#layim_min')
};
};
//主界面缩放
xxim.expend = function(){
var node = xxim.node;
if(xxim.layimNode.attr('state') !== '1'){
xxim.layimNode.stop().animate({right: config.right}, config.aniTime, function(){
node.xximon.addClass('xxim_off');
try{
localStorage.layimState = 1;
}catch(e){}
xxim.layimNode.attr({state: 1});
node.layimFooter.addClass('xxim_expend').stop().animate({marginLeft: config.right}, config.aniTime/2);
node.xximHide.addClass('xxim_show');
});
} else {
xxim.layimNode.stop().animate({right: 1}, config.aniTime, function(){
node.xximon.removeClass('xxim_off');
try{
localStorage.layimState = 2;
}catch(e){}
xxim.layimNode.removeAttr('state');
node.layimFooter.removeClass('xxim_expend');
node.xximHide.removeClass('xxim_show');
});
node.layimFooter.stop().animate({marginLeft: 0}, config.aniTime);
}
};
//初始化窗口格局
xxim.layinit = function(){
var node = xxim.node;
//主界面
try{
/*
if(!localStorage.layimState){
config.aniTime = 0;
localStorage.layimState = 1;
}
*/
if(localStorage.layimState === '1'){
xxim.layimNode.attr({state: 1}).css({right: config.right});
node.xximon.addClass('xxim_off');
node.layimFooter.addClass('xxim_expend').css({marginLeft: config.right});
node.xximHide.addClass('xxim_show');
}
}catch(e){
//layer.msg(e.message, 5, -1);
}
};
//聊天窗口
xxim.popchat = function(param){
var node = xxim.node, log = {};
log.success = function(layero){
layer.setMove();
xxim.chatbox = layero.find('#layim_chatbox');
log.chatlist = xxim.chatbox.find('.layim_chatmore>ul');
log.chatlist.html('<li data-id="'+ param.id +'" type="'+ param.type +'" id="layim_user'+ param.type + param.id +'"><span>'+ param.name +'</span><em>×</em></li>')
xxim.tabchat(param, xxim.chatbox);
//最小化聊天窗
xxim.chatbox.find('.layer_setmin').on('click', function(){
var indexs = layero.attr('times');
layero.hide();
node.layimMin.text(xxim.nowchat.name).show();
});
//关闭窗口
xxim.chatbox.find('.layim_close').on('click', function(){
var indexs = layero.attr('times');
layer.close(indexs);
xxim.chatbox = null;
config.chating = {};
config.chatings = 0;
});
//关闭某个聊天
log.chatlist.on('mouseenter', 'li', function(){
$(this).find('em').show();
}).on('mouseleave', 'li', function(){
$(this).find('em').hide();
});
log.chatlist.on('click', 'li em', function(e){
var parents = $(this).parent(), dataType = parents.attr('type');
var dataId = parents.attr('data-id'), index = parents.index();
var chatlist = log.chatlist.find('li'), indexs;
config.stopMP(e);
delete config.chating[dataType + dataId];
config.chatings--;
parents.remove();
$('#layim_area'+ dataType + dataId).remove();
if(dataType === 'group'){
$('#layim_group'+ dataType + dataId).remove();
}
if(parents.hasClass('layim_chatnow')){
if(index === config.chatings){
indexs = index - 1;
} else {
indexs = index + 1;
}
xxim.tabchat(config.chating[chatlist.eq(indexs).attr('type') + chatlist.eq(indexs).attr('data-id')]);
}
if(log.chatlist.find('li').length === 1){
log.chatlist.parent().hide();
}
});
//聊天选项卡
log.chatlist.on('click', 'li', function(){
var othis = $(this), dataType = othis.attr('type'), dataId = othis.attr('data-id');
xxim.tabchat(config.chating[dataType + dataId]);
});
//发送热键切换
log.sendType = $('#layim_sendtype'), log.sendTypes = log.sendType.find('span');
$('#layim_enter').on('click', function(e){
config.stopMP(e);
log.sendType.show();
});
log.sendTypes.on('click', function(){
log.sendTypes.find('i').text('')
$(this).find('i').text('√');
});
xxim.transmit();
};
log.html = '<div class="layim_chatbox" id="layim_chatbox">'
+'<h6>'
+'<span class="layim_move"></span>'
+' <a href="'+ param.url +'" class="layim_face" target="_blank"><img src="'+ param.face +'" ></a>'
+' <a href="'+ param.url +'" class="layim_names" target="_blank">'+ param.name +'</a>'
+' <span class="layim_rightbtn">'
+' <i class="layer_setmin">—</i>'
+' <i class="layim_close">&times;</i>'
+' </span>'
+'</h6>'
+'<div class="layim_chatmore" id="layim_chatmore">'
+' <ul class="layim_chatlist"></ul>'
+'</div>'
+'<div class="layim_groups" id="layim_groups"></div>'
+'<div class="layim_chat">'
+' <div class="layim_chatarea" id="layim_chatarea">'
+' <ul class="layim_chatview layim_chatthis" id="layim_area'+ param.type + param.id +'"></ul>'
+' </div>'
+' <div class="layim_tool">'
+' <i class="layim_addface fa fa-meh-o" title="发送表情"></i>'
+' <a href="javascript:;"><i class="layim_addimage fa fa-picture-o" title="上传图片"></i></a>'
+' <a href="javascript:;"><i class="layim_addfile fa fa-paperclip" title="上传附件"></i></a>'
+' <a href="" target="_blank" class="layim_seechatlog"><i class="fa fa-comment-o"></i>聊天记录</a>'
+' </div>'
+' <textarea class="layim_write" id="layim_write"></textarea>'
+' <div class="layim_send">'
+' <div class="layim_sendbtn" id="layim_sendbtn">发送<span class="layim_enter" id="layim_enter"><em class="layim_zero"></em></span></div>'
+' <div class="layim_sendtype" id="layim_sendtype">'
+' <span><i>√</i>按Enter键发送</span>'
+' <span><i></i>按Ctrl+Enter键发送</span>'
+' </div>'
+' </div>'
+'</div>'
+'</div>';
if(config.chatings < 1){
$.layer({
type: 1,
border: [0],
title: false,
shade: [0],
area: ['620px', '493px'],
move: '.layim_chatbox .layim_move',
moveType: 1,
closeBtn: false,
offset: [(($(window).height() - 493)/2)+'px', ''],
page: {
html: log.html
}, success: function(layero){
log.success(layero);
}
})
} else {
log.chatmore = xxim.chatbox.find('#layim_chatmore');
log.chatarea = xxim.chatbox.find('#layim_chatarea');
log.chatmore.show();
log.chatmore.find('ul>li').removeClass('layim_chatnow');
log.chatmore.find('ul').append('<li data-id="'+ param.id +'" type="'+ param.type +'" id="layim_user'+ param.type + param.id +'" class="layim_chatnow"><span>'+ param.name +'</span><em>×</em></li>');
log.chatarea.find('.layim_chatview').removeClass('layim_chatthis');
log.chatarea.append('<ul class="layim_chatview layim_chatthis" id="layim_area'+ param.type + param.id +'"></ul>');
xxim.tabchat(param);
}
//群组
log.chatgroup = xxim.chatbox.find('#layim_groups');
if(param.type === 'group'){
log.chatgroup.find('ul').removeClass('layim_groupthis');
log.chatgroup.append('<ul class="layim_groupthis" id="layim_group'+ param.type + param.id +'"></ul>');
xxim.getGroups(param);
}
//点击群员切换聊天窗
log.chatgroup.on('click', 'ul>li', function(){
xxim.popchatbox($(this));
});
};
//定位到某个聊天队列
xxim.tabchat = function(param){
var node = xxim.node, log = {}, keys = param.type + param.id;
xxim.nowchat = param;
xxim.chatbox.find('#layim_user'+ keys).addClass('layim_chatnow').siblings().removeClass('layim_chatnow');
xxim.chatbox.find('#layim_area'+ keys).addClass('layim_chatthis').siblings().removeClass('layim_chatthis');
xxim.chatbox.find('#layim_group'+ keys).addClass('layim_groupthis').siblings().removeClass('layim_groupthis');
xxim.chatbox.find('.layim_face>img').attr('src', param.face);
xxim.chatbox.find('.layim_face, .layim_names').attr('href', param.href);
xxim.chatbox.find('.layim_names').text(param.name);
xxim.chatbox.find('.layim_seechatlog').attr('href', config.chatlogurl + param.id);
log.groups = xxim.chatbox.find('.layim_groups');
if(param.type === 'group'){
log.groups.show();
} else {
log.groups.hide();
}
$('#layim_write').focus();
};
//弹出聊天窗
xxim.popchatbox = function(othis){
var node = xxim.node, dataId = othis.attr('data-id'), param = {
id: dataId, //用户ID
type: othis.attr('type'),
name: othis.find('.xxim_onename').text(), //用户名
face: othis.find('.xxim_oneface').attr('src'), //用户头像
href: 'profile.html?user=' + dataId //用户主页
}, key = param.type + dataId;
if(!config.chating[key]){
xxim.popchat(param);
config.chatings++;
} else {
xxim.tabchat(param);
}
config.chating[key] = param;
var chatbox = $('#layim_chatbox');
if(chatbox[0]){
node.layimMin.hide();
chatbox.parents('.xubox_layer').show();
}
};
//请求群员
xxim.getGroups = function(param){
var keys = param.type + param.id, str = '',
groupss = xxim.chatbox.find('#layim_group'+ keys);
groupss.addClass('loading');
config.json(config.api.groups, {}, function(datas){
if(datas.status === 1){
var ii = 0, lens = datas.data.length;
if(lens > 0){
for(; ii < lens; ii++){
str += '<li data-id="'+ datas.data[ii].id +'" type="one"><img src="'+ datas.data[ii].face +'" class="xxim_oneface"><span class="xxim_onename">'+ datas.data[ii].name +'</span></li>';
}
} else {
str = '<li class="layim_errors">没有群员</li>';
}
} else {
str = '<li class="layim_errors">'+ datas.msg +'</li>';
}
groupss.removeClass('loading');
groupss.html(str);
}, function(){
groupss.removeClass('loading');
groupss.html('<li class="layim_errors">请求异常</li>');
});
};
//消息传输
xxim.transmit = function(){
var node = xxim.node, log = {};
node.sendbtn = $('#layim_sendbtn');
node.imwrite = $('#layim_write');
//发送
log.send = function(){
var data = {
content: node.imwrite.val(),
id: xxim.nowchat.id,
sign_key: '', //密匙
_: +new Date
};
if(data.content.replace(/\s/g, '') === ''){
layer.tips('说点啥呗!', '#layim_write', 2);
node.imwrite.focus();
} else {
//此处皆为模拟
var keys = xxim.nowchat.type + xxim.nowchat.id;
//聊天模版
log.html = function(param, type){
return '<li class="'+ (type === 'me' ? 'layim_chateme' : '') +'">'
+'<div class="layim_chatuser">'
+ function(){
if(type === 'me'){
return '<span class="layim_chattime">'+ param.time +'</span>'
+'<span class="layim_chatname">'+ param.name +'</span>'
+'<img src="'+ param.face +'" >';
} else {
return '<img src="'+ param.face +'" >'
+'<span class="layim_chatname">'+ param.name +'</span>'
+'<span class="layim_chattime">'+ param.time +'</span>';
}
}()
+'</div>'
+'<div class="layim_chatsay">'+ param.content +'<em class="layim_zero"></em></div>'
+'</li>';
};
log.imarea = xxim.chatbox.find('#layim_area'+ keys);
log.imarea.append(log.html({
time: '2014-04-26 0:37',
name: config.user.name,
face: config.user.face,
content: data.content
}, 'me'));
node.imwrite.val('').focus();
log.imarea.scrollTop(log.imarea[0].scrollHeight);
setTimeout(function(){
log.imarea.append(log.html({
time: '2014-04-26 0:38',
name: xxim.nowchat.name,
face: xxim.nowchat.face,
content: config.autoReplay[(Math.random()*config.autoReplay.length) | 0]
}));
log.imarea.scrollTop(log.imarea[0].scrollHeight);
}, 500);
/*
that.json(config.api.sendurl, data, function(datas){
});
*/
}
};
node.sendbtn.on('click', log.send);
node.imwrite.keyup(function(e){
if(e.keyCode === 13){
log.send();
}
});
};
//事件
xxim.event = function(){
var node = xxim.node;
//主界面tab
node.tabs.eq(0).addClass('xxim_tabnow');
node.tabs.on('click', function(){
var othis = $(this), index = othis.index();
xxim.tabs(index);
});
//列表展收
node.list.on('click', 'h5', function(){
var othis = $(this), chat = othis.siblings('.xxim_chatlist'), parentss = othis.find("i");
if(parentss.hasClass('fa-caret-down')){
chat.hide();
parentss.attr('class','fa fa-caret-right');
} else {
chat.show();
parentss.attr('class','fa fa-caret-down');
}
});
//设置在线隐身
node.online.on('click', function(e){
config.stopMP(e);
node.setonline.show();
});
node.setonline.find('span').on('click', function(e){
var index = $(this).index();
config.stopMP(e);
if(index === 0){
node.onlinetex.html('在线');
node.online.removeClass('xxim_offline');
} else if(index === 1) {
node.onlinetex.html('隐身');
node.online.addClass('xxim_offline');
}
node.setonline.hide();
});
node.xximon.on('click', xxim.expend);
node.xximHide.on('click', xxim.expend);
//搜索
node.xximSearch.keyup(function(){
var val = $(this).val().replace(/\s/g, '');
if(val !== ''){
node.searchMian.show();
node.closeSearch.show();
//此处的搜索ajax参考xxim.getDates
node.list.eq(3).html('<li class="xxim_errormsg">没有符合条件的结果</li>');
} else {
node.searchMian.hide();
node.closeSearch.hide();
}
});
node.closeSearch.on('click', function(){
$(this).hide();
node.searchMian.hide();
node.xximSearch.val('').focus();
});
//弹出聊天窗
config.chatings = 0;
node.list.on('click', '.xxim_childnode', function(){
var othis = $(this);
xxim.popchatbox(othis);
});
//点击最小化栏
node.layimMin.on('click', function(){
$(this).hide();
$('#layim_chatbox').parents('.xubox_layer').show();
});
//document事件
dom[1].on('click', function(){
node.setonline.hide();
$('#layim_sendtype').hide();
});
};
//请求列表数据
xxim.getDates = function(index){
var api = [config.api.friend, config.api.group, config.api.chatlog],
node = xxim.node, myf = node.list.eq(index);
myf.addClass('loading');
config.json(api[index], {}, function(datas){
if(datas.status === 1){
var i = 0, myflen = datas.data.length, str = '', item;
if(myflen > 1){
if(index !== 2){
for(; i < myflen; i++){
str += '<li data-id="'+ datas.data[i].id +'" class="xxim_parentnode">'
+'<h5><i class="fa fa-caret-right"></i><span class="xxim_parentname">'+ datas.data[i].name +'</span><em class="xxim_nums">('+ datas.data[i].nums +')</em></h5>'
+'<ul class="xxim_chatlist">';
item = datas.data[i].item;
for(var j = 0; j < item.length; j++){
str += '<li data-id="'+ item[j].id +'" class="xxim_childnode" type="'+ (index === 0 ? 'one' : 'group') +'"><img src="'+ item[j].face +'" class="xxim_oneface"><span class="xxim_onename">'+ item[j].name +'</span></li>';
}
str += '</ul></li>';
}
} else {
str += '<li class="xxim_liston">'
+'<ul class="xxim_chatlist">';
for(; i < myflen; i++){
str += '<li data-id="'+ datas.data[i].id +'" class="xxim_childnode" type="one"><img src="'+ datas.data[i].face +'" class="xxim_oneface"><span class="xxim_onename">'+ datas.data[i].name +'</span><em class="xxim_time">'+ datas.data[i].time +'</em></li>';
}
str += '</ul></li>';
}
myf.html(str);
} else {
myf.html('<li class="xxim_errormsg">没有任何数据</li>');
}
myf.removeClass('loading');
} else {
myf.html('<li class="xxim_errormsg">'+ datas.msg +'</li>');
}
}, function(){
myf.html('<li class="xxim_errormsg">请求失败</li>');
myf.removeClass('loading');
});
};
//渲染骨架
xxim.view = (function(){
var xximNode = xxim.layimNode = $('<div id="xximmm" class="xxim_main">'
+'<div class="xxim_top" id="xxim_top">'
+' <div class="xxim_search"><i class="fa fa-search"></i><input id="xxim_searchkey" /><span id="xxim_closesearch">×</span></div>'
+' <div class="xxim_tabs" id="xxim_tabs"><span class="xxim_tabfriend" title="好友"><i class="fa fa-user"></i></span><span class="xxim_tabgroup" title="群组"><i class="fa fa-users"></i></span><span class="xxim_latechat" title="最近聊天"><i class="fa fa-clock-o"></i></span></div>'
+' <ul class="xxim_list" style="display:block"></ul>'
+' <ul class="xxim_list"></ul>'
+' <ul class="xxim_list"></ul>'
+' <ul class="xxim_list xxim_searchmain" id="xxim_searchmain"></ul>'
+'</div>'
+'<ul class="xxim_bottom" id="xxim_bottom">'
+'<li class="xxim_online" id="xxim_online">'
+'<i class="xxim_nowstate fa fa-check-circle"></i><span id="xxim_onlinetex">在线</span>'
+'<div class="xxim_setonline">'
+'<span><i class="fa fa-check-circle"></i>在线</span>'
+'<span class="xxim_setoffline"><i class="fa fa-check-circle"></i>隐身</span>'
+'</div>'
+'</li>'
+'<li class="xxim_mymsg" id="xxim_mymsg" title="我的私信"><i class="fa fa-comment"></i><a href="'+ config.msgurl +'" target="_blank"></a></li>'
+'<li class="xxim_seter" id="xxim_seter" title="设置">'
+'<i class="fa fa-gear"></i>'
+'<div>'
+'</div>'
+'</li>'
+'<li class="xxim_hide" id="xxim_hide"><i class="fa fa-exchange"></i></li>'
+'<li id="xxim_on" class="xxim_icon xxim_on fa fa-ellipsis-v"></li>'
+'<div class="layim_min" id="layim_min"></div>'
+'</ul>'
+'</div>');
dom[3].append(xximNode);
xxim.renode();
xxim.getDates(0);
xxim.event();
xxim.layinit();
}());
}(window);
Binary file not shown.

After

Width:  |  Height:  |  Size: 166 B

+2
View File
@@ -0,0 +1,2 @@
/*! layer mobile-v2.0.0 Web弹层组件 MIT License http://layer.layui.com/mobile By 贤心 */
;!function(e){"use strict";var t=document,n="querySelectorAll",i="getElementsByClassName",a=function(e){return t[n](e)},s={type:0,shade:!0,shadeClose:!0,fixed:!0,anim:"scale"},l={extend:function(e){var t=JSON.parse(JSON.stringify(s));for(var n in e)t[n]=e[n];return t},timer:{},end:{}};l.touch=function(e,t){e.addEventListener("click",function(e){t.call(this,e)},!1)};var r=0,o=["layui-m-layer"],c=function(e){var t=this;t.config=l.extend(e),t.view()};c.prototype.view=function(){var e=this,n=e.config,s=t.createElement("div");e.id=s.id=o[0]+r,s.setAttribute("class",o[0]+" "+o[0]+(n.type||0)),s.setAttribute("index",r);var l=function(){var e="object"==typeof n.title;return n.title?'<h3 style="'+(e?n.title[1]:"")+'">'+(e?n.title[0]:n.title)+"</h3>":""}(),c=function(){"string"==typeof n.btn&&(n.btn=[n.btn]);var e,t=(n.btn||[]).length;return 0!==t&&n.btn?(e='<span yes type="1">'+n.btn[0]+"</span>",2===t&&(e='<span no type="0">'+n.btn[1]+"</span>"+e),'<div class="layui-m-layerbtn">'+e+"</div>"):""}();if(n.fixed||(n.top=n.hasOwnProperty("top")?n.top:100,n.style=n.style||"",n.style+=" top:"+(t.body.scrollTop+n.top)+"px"),2===n.type&&(n.content='<i></i><i class="layui-m-layerload"></i><i></i><p>'+(n.content||"")+"</p>"),n.skin&&(n.anim="up"),"msg"===n.skin&&(n.shade=!1),s.innerHTML=(n.shade?"<div "+("string"==typeof n.shade?'style="'+n.shade+'"':"")+' class="layui-m-layershade"></div>':"")+'<div class="layui-m-layermain" '+(n.fixed?"":'style="position:static;"')+'><div class="layui-m-layersection"><div class="layui-m-layerchild '+(n.skin?"layui-m-layer-"+n.skin+" ":"")+(n.className?n.className:"")+" "+(n.anim?"layui-m-anim-"+n.anim:"")+'" '+(n.style?'style="'+n.style+'"':"")+">"+l+'<div class="layui-m-layercont">'+n.content+"</div>"+c+"</div></div></div>",!n.type||2===n.type){var d=t[i](o[0]+n.type),y=d.length;y>=1&&layer.close(d[0].getAttribute("index"))}document.body.appendChild(s);var u=e.elem=a("#"+e.id)[0];n.success&&n.success(u),e.index=r++,e.action(n,u)},c.prototype.action=function(e,t){var n=this;e.time&&(l.timer[n.index]=setTimeout(function(){layer.close(n.index)},1e3*e.time));var a=function(){var t=this.getAttribute("type");0==t?(e.no&&e.no(),layer.close(n.index)):e.yes?e.yes(n.index):layer.close(n.index)};if(e.btn)for(var s=t[i]("layui-m-layerbtn")[0].children,r=s.length,o=0;o<r;o++)l.touch(s[o],a);if(e.shade&&e.shadeClose){var c=t[i]("layui-m-layershade")[0];l.touch(c,function(){layer.close(n.index,e.end)})}e.end&&(l.end[n.index]=e.end)},e.layer={v:"2.0",index:r,open:function(e){var t=new c(e||{});return t.index},close:function(e){var n=a("#"+o[0]+e)[0];n&&(n.innerHTML="",t.body.removeChild(n),clearTimeout(l.timer[e]),delete l.timer[e],"function"==typeof l.end[e]&&l.end[e](),delete l.end[e])},closeAll:function(){for(var e=t[i](o[0]),n=0,a=e.length;n<a;n++)layer.close(0|e[0].getAttribute("index"))}},"function"==typeof define?define(function(){return layer}):function(){var e=document.scripts,n=e[e.length-1],i=n.src,a=i.substring(0,i.lastIndexOf("/")+1);n.getAttribute("merge")||document.head.appendChild(function(){var e=t.createElement("link");return e.href=a+"need/layer.css?2.0",e.type="text/css",e.rel="styleSheet",e.id="layermcss",e}())}()}(window);
File diff suppressed because one or more lines are too long
+76
View File
@@ -0,0 +1,76 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layer-更懂你的web弹窗解决方案</title>
<style>
html{background-color:#E3E3E3; font-size:14px; color:#000; font-family:'微软雅黑'}
a,a:hover{ text-decoration:none;}
pre{font-family:'微软雅黑'}
.box{padding:20px; background-color:#fff; margin:50px 100px; border-radius:5px;}
.box a{padding-right:15px;}
#about_hide{display:none}
.layer_text{background-color:#fff; padding:20px;}
.layer_text p{margin-bottom: 10px; text-indent: 2em; line-height: 23px;}
.button{display:inline-block; *display:inline; *zoom:1; line-height:30px; padding:0 20px; background-color:#56B4DC; color:#fff; font-size:14px; border-radius:3px; cursor:pointer; font-weight:normal;}
.photos-demo img{width:200px;}
</style>
<script src="http://cdn.bootcss.com/jquery/1.12.3/jquery.min.js"></script>
<script src="layer/layer.js"></script>
</head>
<body>
<div class="box">
<pre>
@Name:layer-v<script>document.write(layer.v)</script> 弹层组件说明
@Author:贤心
@Site:<a href="http://layer.layui.com/" target="_blank">http://layer.layui.com/</a>
<strong>【注意事项】</strong>
一、使用时,请把文件夹layer整个放置在您站点的任何一个目录,只需引入layer.js即可,除jQuery外,其它文件无需再引入。
二、如果您的js引入是通过合并处理或者您不想采用layer自动获取的绝对路径,您可以通过layer.config()来配置(详见官网API页)
三、jquery需1.8+
四、更多使用说明与演示,请参见layer官网。
五、使用时请务必保留来源,请勿用于违反我国法律法规的web平台。
六、layer遵循MIT开源协议,将永久性提供无偿服务。
</pre>
</div>
<div class="box" style="text-align:center">
<a href="http://layer.layui.com/" target="_blank">更多示例</a>
<a href="http://www.layui.com/doc/modules/layer.html" target="_blank">使用文档</a>
<a href="http://fly.layui.com/" id="suggest">交流反馈</a>
<a href="javascript:;" id="about">关于</a>
</div>
<script>
;!function(){
//页面一打开就执行,放入ready是为了layer所需配件(css、扩展模块)加载完毕
layer.ready(function(){
layer.open({
type: 2,
title: '欢迎页',
maxmin: true,
area: ['800px', '500px'],
content: 'http://layer.layui.com/test/welcome.html',
end: function(){
layer.tips('Hi', '#about', {tips: 1})
}
});
});
//关于
$('#about').on('click', function(){
layer.alert(layer.v + ' - 贤心出品 sentsin.com');
});
}();
</script>
</body>
</html>
Binary file not shown.

After

Width:  |  Height:  |  Size: 5.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

File diff suppressed because one or more lines are too long
Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 701 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB