修改：工程简单重构
This commit is contained in:
472
root/_tpl/layout.html
Normal file
472
root/_tpl/layout.html
Normal file
@@ -0,0 +1,472 @@
|
||||
<!-- Created by Lxy at 2017/11/25 17:36. -->
|
||||
#define columned(e)
|
||||
#if(e == column??"") layui-this #end
|
||||
#end
|
||||
|
||||
#define keywords(str)
|
||||
#if(str)
|
||||
#(str)、redkale社区
|
||||
#else
|
||||
架构设计、问题解答、经验分享、redkale社区、#(str)
|
||||
#end
|
||||
#end
|
||||
|
||||
|
||||
#define description(str)
|
||||
#if(str)
|
||||
#(str)、redkale社区
|
||||
#else
|
||||
架构设计、问题解答、经验分享、redkale社区、#(str)
|
||||
#end
|
||||
#end
|
||||
|
||||
#define layout()
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>#if(title)#(title) - #end Redbbs社区</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<meta http-equiv="Cache-Control" content="max-age=7200" />
|
||||
<meta name="keywords" content="#@keywords(bean.title??'')">
|
||||
<meta name="description" content="#@description(bean.title??'')">
|
||||
<link rel="stylesheet" href="/res/layui/css/layui.css">
|
||||
<link rel="stylesheet" href="/res/css/global.css">
|
||||
<!--background-color: #4a184c;-->
|
||||
<style>
|
||||
.layui-bg-black,.layui-btn,.layui-laypage .layui-laypage-curr .layui-laypage-em{background-image: linear-gradient(350deg, #330335, #AB5D7C);}
|
||||
.laypage-main{border:1px solid #a25677!important;}
|
||||
.laypage-main *{border-right:#a25677;border-bottom:#a25677;}
|
||||
.layui-nav *{font-size:16px}
|
||||
.layui-nav-tree .layui-nav-child dd.layui-this, .layui-nav-tree .layui-nav-child dd.layui-this a, .layui-nav-tree .layui-this, .layui-nav-tree .layui-this>a, .layui-nav-tree .layui-this>a:hover
|
||||
{background-color:#4a184c;}
|
||||
</style>
|
||||
#@css?()
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="fly-header layui-bg-black">
|
||||
<div class="layui-container">
|
||||
<a class="fly-logo" href="/" style="font-size: 30px;color: #fff;">
|
||||
Redbbs
|
||||
<!--<img src="/res/images/logo.png" alt="优乐园社区">-->
|
||||
</a>
|
||||
<ul class="layui-nav fly-nav layui-hide-xs">
|
||||
<li class="layui-nav-item layui-this">
|
||||
<a href="/">社区</a>
|
||||
</li>
|
||||
<li class="layui-nav-item">
|
||||
<a href="/project">项目</a>
|
||||
</li>
|
||||
<li class="layui-nav-item">
|
||||
<a href="http://redkale.org/" target="_blank">Redkale框架</a>
|
||||
</li>
|
||||
<!--<li class="layui-nav-item">
|
||||
<a href="http://redkale.org/articles.html" target="_blank">技术文章</a>
|
||||
</li>-->
|
||||
</ul>
|
||||
|
||||
<ul class="layui-nav fly-nav-user">
|
||||
#if(mine)<!-- 登入后的状态 -->
|
||||
<li class="layui-nav-item">
|
||||
<a class="fly-nav-avatar" href="javascript:;">
|
||||
<cite class="layui-hide-xs">#(mine.nickname)</cite>
|
||||
<!--
|
||||
<i class="iconfont icon-renzheng layui-hide-xs" title="认证信息：layui 作者"></i>
|
||||
<i class="layui-badge fly-badge-vip layui-hide-xs">VIP3</i>
|
||||
-->
|
||||
<img src="#(mine.avatar)">
|
||||
</a>
|
||||
<dl class="layui-nav-child">
|
||||
<dd><a href="/user/set"><i class="layui-icon"></i>基本设置</a></dd>
|
||||
<!--
|
||||
<dd><a href="/user/message"><i class="iconfont icon-tongzhi" style="top: 4px;"></i>我的消息</a></dd>
|
||||
-->
|
||||
<dd><a href="/user"><i class="layui-icon" style="margin-left: 2px; font-size: 22px;"></i>我的主页</a></dd>
|
||||
<hr style="margin: 5px 0;">
|
||||
<dd><a href="javascript:;" class="logout" style="text-align: center;">退出</a></dd>
|
||||
</dl>
|
||||
</li>
|
||||
#else<!-- 未登入的状态 -->
|
||||
<li class="layui-nav-item">
|
||||
<a class="iconfont icon-touxiang layui-hide-xs" href="/user/login"></a>
|
||||
</li>
|
||||
<li class="layui-nav-item">
|
||||
<a href="/user/login.html">登入</a>
|
||||
</li>
|
||||
<li class="layui-nav-item">
|
||||
<a href="/user/reg.html">注册</a>
|
||||
</li>
|
||||
<!--<li class="layui-nav-item layui-hide-xs">
|
||||
<a href="/app/qq/" onclick="layer.msg('正在通过QQ登入', {icon:16, shade: 0.1, time:0})" title="QQ登入" class="iconfont icon-qq"></a>
|
||||
</li>
|
||||
<li class="layui-nav-item layui-hide-xs">
|
||||
<a href="/app/weibo/" onclick="layer.msg('正在通过微博登入', {icon:16, shade: 0.1, time:0})" title="微博登入" class="iconfont icon-weibo"></a>
|
||||
</li>-->
|
||||
#end
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--main-->
|
||||
#@main?()
|
||||
|
||||
<div class="fly-footer">
|
||||
<p>
|
||||
<a href="http://1216.top" target="_blank">Redbbs 2017 © http://1216.top</a>
|
||||
<a href='https://gitee.com/tc608/redbbs' target="_blank"><img src='https://gitee.com/tc608/redbbs/badge/star.svg?theme=white' alt='star'/></a>
|
||||
</p>
|
||||
#define x()
|
||||
<p>
|
||||
<a href="http://fly.layui.com/jie/3147/" target="_blank">付费计划</a>
|
||||
<a href="http://fly.layui.com/jie/8157/" target="_blank">获取Fly社区模版</a>
|
||||
<a href="http://fly.layui.com/jie/2461/" target="_blank">微信公众号</a>
|
||||
</p>
|
||||
#end
|
||||
</div>
|
||||
<script src="/res/layui/layui.js"></script>
|
||||
#@js?()
|
||||
|
||||
<!--layim-->
|
||||
<script>
|
||||
|
||||
if(!/^http(s*):\/\//.test(location.href)){
|
||||
alert('请部署到localhost上查看该演示');
|
||||
}
|
||||
|
||||
layui.use('layim', function(layim){
|
||||
var $ = layui.jquery;//
|
||||
var target = 'ws://127.0.0.1/os/ws/chat?token=#(token)';
|
||||
|
||||
var ws;
|
||||
if ('WebSocket' in window) {
|
||||
ws = new WebSocket(target);
|
||||
} else if ('MozWebSocket' in window) {
|
||||
ws = new MozWebSocket(target);
|
||||
} else {
|
||||
alert('WebSocket is not supported by this browser.');
|
||||
return;
|
||||
}
|
||||
|
||||
ws.onopen = function () {
|
||||
console.log('Info: WebSocket connection opened.');
|
||||
};
|
||||
|
||||
//接收信息
|
||||
ws.onmessage = function (event) {
|
||||
console.log(event);
|
||||
var data = eval("("+event.data+")");
|
||||
layim.getMessage(data);
|
||||
//flashTitle();
|
||||
};
|
||||
ws.onclose = function (event) {
|
||||
console.log('Info: WebSocket connection closed, Code: ' + event.code + (event.reason == "" ? "" : ", Reason: " + event.reason));
|
||||
};
|
||||
|
||||
//监听发送消息
|
||||
layim.on('sendMessage', function(data){
|
||||
//发送消息倒Socket服务
|
||||
var msg = {
|
||||
text:{
|
||||
msg:{
|
||||
touserid:data.to.id
|
||||
,content:data.mine.content
|
||||
}
|
||||
}
|
||||
};
|
||||
ws.send(JSON.stringify(msg));
|
||||
});
|
||||
|
||||
//---------------------完美分割线--------------------
|
||||
|
||||
//基础配置
|
||||
layim.config({
|
||||
|
||||
//初始化接口
|
||||
init: {
|
||||
url: '/imx/friends?token=#(token)'
|
||||
,data: {}
|
||||
}
|
||||
/*init: {
|
||||
url: '/tmp/json/getList.json'
|
||||
,data: {}
|
||||
}*/
|
||||
|
||||
//或采用以下方式初始化接口
|
||||
/*
|
||||
,init: {
|
||||
mine: {
|
||||
"username": "LayIM体验者" //我的昵称
|
||||
,"id": "100000123" //我的ID
|
||||
,"status": "online" //在线状态 online：在线、hide：隐身
|
||||
,"remark": "在深邃的编码世界，做一枚轻盈的纸飞机" //我的签名
|
||||
,"avatar": "a.jpg" //我的头像
|
||||
}
|
||||
,friend: []
|
||||
,group: []
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
//查看群员接口
|
||||
,members: {
|
||||
url: '/tmp/json/getMembers.json'
|
||||
,data: {}
|
||||
}
|
||||
|
||||
//上传图片接口
|
||||
/*,uploadImage: {
|
||||
url: 'http://localhost/os/chat/upload/'//'/upload/image' //（返回的数据格式见下文）
|
||||
,type: '' //默认post
|
||||
}*/
|
||||
|
||||
//上传文件接口
|
||||
/*,uploadFile: {
|
||||
url: '/os/chat/upload' //（返回的数据格式见下文）
|
||||
,type: '' //默认post
|
||||
}*/
|
||||
|
||||
,isAudio: true //开启聊天工具栏音频
|
||||
,isVideo: true //开启聊天工具栏视频
|
||||
|
||||
//扩展工具栏
|
||||
,tool: [{
|
||||
alias: 'code'
|
||||
,title: '代码'
|
||||
,icon: ''
|
||||
}]
|
||||
|
||||
//,brief: true //是否简约模式（若开启则不显示主面板）
|
||||
|
||||
//,title: 'WebIM' //自定义主面板最小化时的标题
|
||||
//,right: '100px' //主面板相对浏览器右侧距离
|
||||
//,minRight: '90px' //聊天面板最小化时相对浏览器右侧距离
|
||||
,initSkin: '5.jpg' //1-5 设置初始背景
|
||||
//,skin: ['aaa.jpg'] //新增皮肤
|
||||
//,isfriend: false //是否开启好友
|
||||
,isgroup: false //是否开启群组
|
||||
,min: true //是否始终最小化主面板，默认false
|
||||
,notice: true //是否开启桌面消息提醒，默认false
|
||||
//,voice: false //声音提醒，默认开启，声音文件为：default.mp3
|
||||
|
||||
//,msgbox: layui.cache.dir + 'css/modules/layim/html/msgbox.html' //消息盒子页面地址，若不开启，剔除该项即可
|
||||
//,find: layui.cache.dir + 'css/modules/layim/html/find.html' //发现页面地址，若不开启，剔除该项即可
|
||||
//,chatLog: layui.cache.dir + 'css/modules/layim/html/chatlog.html' //聊天记录页面地址，若不开启，剔除该项即可
|
||||
,copyright:true
|
||||
});
|
||||
|
||||
/*
|
||||
layim.chat({
|
||||
name: '在线客服-小苍'
|
||||
,type: 'kefu'
|
||||
,avatar: 'http://tva3.sinaimg.cn/crop.0.0.180.180.180/7f5f6861jw1e8qgp5bmzyj2050050aa8.jpg'
|
||||
,id: -1
|
||||
});
|
||||
layim.chat({
|
||||
name: '在线客服-心心'
|
||||
,type: 'kefu'
|
||||
,avatar: 'http://tva1.sinaimg.cn/crop.219.144.555.555.180/0068iARejw8esk724mra6j30rs0rstap.jpg'
|
||||
,id: -2
|
||||
});
|
||||
layim.setChatMin();*/
|
||||
|
||||
//监听在线状态的切换事件
|
||||
layim.on('online', function(data){
|
||||
//console.log(data);
|
||||
});
|
||||
|
||||
//监听签名修改
|
||||
layim.on('sign', function(value){
|
||||
$.post("/os/user/update",{
|
||||
bean:JSON.stringify({sign:value})
|
||||
,columns:JSON.stringify(['sign'])
|
||||
},function (res) {
|
||||
if(res.retcode == 0){
|
||||
layer.msg("操作成功");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
//监听自定义工具栏点击，以添加代码为例
|
||||
layim.on('tool(code)', function(insert){
|
||||
layer.prompt({
|
||||
title: '插入代码'
|
||||
,formType: 2
|
||||
,shade: 0
|
||||
}, function(text, index){
|
||||
layer.close(index);
|
||||
insert('[pre class=layui-code]' + text + '[/pre]'); //将内容插入到编辑器
|
||||
});
|
||||
});
|
||||
|
||||
//监听layim建立就绪
|
||||
layim.on('ready', function(res){
|
||||
|
||||
//console.log(res.mine);
|
||||
|
||||
//layim.msgbox(5); //模拟消息盒子有新消息，实际使用时，一般是动态获得
|
||||
|
||||
//添加好友（如果检测到该socket）
|
||||
layim.addList({
|
||||
type: 'group'
|
||||
,avatar: "http://tva3.sinaimg.cn/crop.64.106.361.361.50/7181dbb3jw8evfbtem8edj20ci0dpq3a.jpg"
|
||||
,groupname: 'Angular开发'
|
||||
,id: "12333333"
|
||||
,members: 0
|
||||
});
|
||||
/*layim.addList({
|
||||
type: 'friend'
|
||||
,avatar: "http://tp2.sinaimg.cn/2386568184/180/40050524279/0"
|
||||
,username: '冲田杏梨'
|
||||
,groupid: 2
|
||||
,id: "1233333312121212"
|
||||
,remark: "本人冲田杏梨将结束AV女优的工作"
|
||||
});*/
|
||||
|
||||
if (false)
|
||||
setTimeout(function(){
|
||||
//接受消息（如果检测到该socket）
|
||||
layim.getMessage({
|
||||
username: "Hi"
|
||||
,avatar: "http://qzapp.qlogo.cn/qzapp/100280987/56ADC83E78CEC046F8DF2C5D0DD63CDE/100"
|
||||
,id: "10000111"
|
||||
,type: "friend"
|
||||
,content: "临时："+ new Date().getTime()
|
||||
});
|
||||
|
||||
/*layim.getMessage({
|
||||
username: "贤心"
|
||||
,avatar: "http://tp1.sinaimg.cn/1571889140/180/40030060651/1"
|
||||
,id: "100001"
|
||||
,type: "friend"
|
||||
,content: "嗨，你好！欢迎体验LayIM。演示标记："+ new Date().getTime()
|
||||
});*/
|
||||
|
||||
}, 3000);
|
||||
});
|
||||
|
||||
//监听发送消息
|
||||
layim.on('sendMessage', function(data){
|
||||
//var To = data.to;
|
||||
|
||||
/*if(To.type === 'friend'){
|
||||
layim.setChatStatus('<span style="color:#FF5722;">对方正在输入。。。</span>');
|
||||
}*/
|
||||
|
||||
//演示自动回复
|
||||
if (false)
|
||||
setTimeout(function(){
|
||||
var obj = {};
|
||||
if(To.type === 'group'){
|
||||
obj = {
|
||||
username: '模拟群员'+(Math.random()*100|0)
|
||||
,avatar: layui.cache.dir + 'images/face/'+ (Math.random()*72|0) + '.gif'
|
||||
,id: To.id
|
||||
,type: To.type
|
||||
,content: autoReplay[Math.random()*9|0]
|
||||
}
|
||||
} else {
|
||||
obj = {
|
||||
username: To.name
|
||||
,avatar: To.avatar
|
||||
,id: To.id
|
||||
,type: To.type
|
||||
,content: autoReplay[Math.random()*9|0]
|
||||
}
|
||||
layim.setChatStatus('<span style="color:#FF5722;">在线</span>');
|
||||
}
|
||||
layim.getMessage(obj);
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
//监听查看群员
|
||||
layim.on('members', function(data){
|
||||
//console.log(data);
|
||||
});
|
||||
|
||||
//监听聊天窗口的切换
|
||||
layim.on('chatChange', function(res){
|
||||
var type = res.data.type;
|
||||
console.log(res.data.id)
|
||||
if(type === 'friend'){
|
||||
//模拟标注好友状态
|
||||
//layim.setChatStatus('<span style="color:#FF5722;">在线</span>');
|
||||
} else if(type === 'group'){
|
||||
//模拟系统消息
|
||||
layim.getMessage({
|
||||
system: true
|
||||
,id: res.data.id
|
||||
,type: "group"
|
||||
,content: '模拟群员'+(Math.random()*100|0) + '加入群聊'
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
#end
|
||||
|
||||
#define flyColumn()
|
||||
<div class="fly-panel fly-column">
|
||||
<div class="layui-container">
|
||||
<ul class="layui-clear">
|
||||
<li class="layui-hide-xs #@columned('')"><a href="/column/">全部</a></li>
|
||||
<li class="#@columned('qz')"><a href="/column/qz">求助</a></li>
|
||||
<li class="#@columned('fx')"><a href="/column/fx">分享<!--<span class="layui-badge-dot"></span>--></a></li>
|
||||
<!--
|
||||
<li class="#@columned('jy')"><a href="/column/jy">建议</a></li>
|
||||
<li class="#@columned('gg')"><a href="/column/gg">公告</a></li>
|
||||
-->
|
||||
<li class="#@columned('dt')"><a href="/column/dt">动态</a></li>
|
||||
<li class="layui-hide-xs layui-hide-sm layui-show-md-inline-block"><span class="fly-mid"></span></li>
|
||||
|
||||
<!-- 用户登入后显示 -->
|
||||
<li class="layui-hide-xs layui-hide-sm layui-show-md-inline-block"><a href="/user?#index">我发表的贴</a>
|
||||
</li>
|
||||
<li class="layui-hide-xs layui-hide-sm layui-show-md-inline-block"><a href="/user?#collection">我收藏的贴</a></li>
|
||||
</ul>
|
||||
|
||||
<div class="fly-column-right layui-hide-xs">
|
||||
<span class="fly-search"><i class="layui-icon"></i></span>
|
||||
<a href="/jie/add" class="layui-btn">发表新帖</a>
|
||||
</div>
|
||||
<div class="layui-hide-sm layui-show-xs-block" style="margin-top: -10px; padding-bottom: 10px; text-align: center;">
|
||||
<a href="/jie/add" class="layui-btn">发表新帖</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
#end
|
||||
|
||||
#define user_side(e)
|
||||
<ul class="layui-nav layui-nav-tree layui-inline" lay-filter="user">
|
||||
<li class="layui-nav-item #if(e == '') layui-this #end">
|
||||
<a href="/user/#(mine.userid)">
|
||||
<i class="layui-icon"></i>
|
||||
我的主页
|
||||
</a>
|
||||
</li>
|
||||
<li class="layui-nav-item #if(e == 'index') layui-this #end">
|
||||
<a href="/user/">
|
||||
<i class="layui-icon"></i>
|
||||
用户中心
|
||||
</a>
|
||||
</li>
|
||||
<li class="layui-nav-item #if(e == 'set') layui-this #end">
|
||||
<a href="/user/set">
|
||||
<i class="layui-icon"></i>
|
||||
基本设置
|
||||
</a>
|
||||
</li>
|
||||
<!--<li class="layui-nav-item #if(e == 'message') layui-this #end">
|
||||
<a href="message.html">
|
||||
<i class="layui-icon"></i>
|
||||
我的消息
|
||||
</a>
|
||||
</li>-->
|
||||
</ul>
|
||||
#end
|
||||
Reference in New Issue
Block a user