|
|
@@ -1,220 +1,214 @@
|
|
|
-<!DOCTYPE html>
|
|
|
-<html>
|
|
|
-<head>
|
|
|
- <meta charset="utf-8">
|
|
|
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
|
|
- <title>Me博客后台管理系统</title>
|
|
|
- <link rel="stylesheet" href="__ROOT__/css/layui.css" media="all">
|
|
|
- <script src="__ROOT__/layui.js"></script>
|
|
|
- <script src="__ROOT__/lay/modules/jquery.js"></script>
|
|
|
-
|
|
|
-
|
|
|
-<!-- 上传图片按钮样式 -->
|
|
|
-<style>
|
|
|
-.upflie {
|
|
|
-width: 80px;
|
|
|
-height: 28px;
|
|
|
-text-align: center;
|
|
|
-vertical-align: middle;
|
|
|
-border-radius: 2px;
|
|
|
--webkit-border-radius: 2px;
|
|
|
--moz-border-radius: 2px;
|
|
|
-color: #fff;
|
|
|
-cursor: pointer;
|
|
|
-background: #009688;
|
|
|
-border: 1px solid #009688;
|
|
|
-outline: none;
|
|
|
-position: relative;
|
|
|
-display: inline-block;
|
|
|
-overflow: hidden;
|
|
|
-text-decoration: none;
|
|
|
-line-height: 28px;
|
|
|
-}
|
|
|
-.upflie input {
|
|
|
-position: absolute;
|
|
|
-font-size: 10px;
|
|
|
-width: 200px;
|
|
|
-border: none;
|
|
|
-cursor: pointer;
|
|
|
-right: 0;
|
|
|
-top: 0;
|
|
|
-opacity: 0;
|
|
|
-}
|
|
|
-a:hover {
|
|
|
-display: inline-block;
|
|
|
-color: #fff;
|
|
|
-text-decoration: none;
|
|
|
-cursor: pointer!important;
|
|
|
-opacity: 0.8;
|
|
|
-}
|
|
|
-.upflie :hover {
|
|
|
-display: inline-block;
|
|
|
-overflow: hidden;
|
|
|
-color: #fff!important;
|
|
|
-cursor: pointer;
|
|
|
-text-decoration: none;
|
|
|
-}
|
|
|
-</style>
|
|
|
-<!-- end -->
|
|
|
-
|
|
|
-
|
|
|
-</head>
|
|
|
-<body>
|
|
|
- <form class="layui-form" action="{:url('article/add')}" style="padding: 30px" method="post" enctype="multipart/form-data" >
|
|
|
-
|
|
|
- <div class="layui-form-item">
|
|
|
- <label class="layui-form-label">文章标题</label>
|
|
|
- <div class="layui-input-inline" style="width:400px;">
|
|
|
- <input type="text" name="title" id="uname" placeholder="请输入标题" autocomplete="off" class="layui-input">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="layui-form-item">
|
|
|
- <label class="layui-form-label">文章作者</label>
|
|
|
- <div class="layui-input-inline" style="width:400px;">
|
|
|
- <input type="text" name="author" id="upass" placeholder="请输入作者" autocomplete="off" class="layui-input">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="layui-form-item">
|
|
|
- <label class="layui-form-label">图片</label>
|
|
|
- <div class="layui-input-inline" style="width:400px;">
|
|
|
- <a class="upflie">添加图片
|
|
|
- <input type="file" name="pic" id="pic" autocomplete="off" onchange="imgChange()" lay-verify="pics" >
|
|
|
- </a>
|
|
|
-
|
|
|
- <a class="upflie">取消
|
|
|
- <input type="button" value="取消" onclick="call()" />
|
|
|
- </a>
|
|
|
-
|
|
|
- <img id="imghead" width="260" height="180" src="/static/admin/images/noimage.png" />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="layui-form-item">
|
|
|
- <label class="layui-form-label">文章关键词</label>
|
|
|
- <div class="layui-input-inline" style="width:400px;">
|
|
|
- <input type="text" name="keywords" id="upass" placeholder="请输入关键词,多个关键词需用英文逗号分隔" autocomplete="off" class="layui-input">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="layui-form-item layui-form-text">
|
|
|
- <label class="layui-form-label" >文章简介</label>
|
|
|
- <div class="layui-input-block" style="width:1101px">
|
|
|
- <textarea name="desc" class="layui-textarea" placeholder="请输入简介"></textarea>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="layui-form-item layui-form-text">
|
|
|
- <label class="layui-form-label" style="width:80px">内容</label>
|
|
|
- <div class="layui-input-block">
|
|
|
- <textarea placeholder="请输入内容" class="layui-textarea" name="content" id="content" style="border:0;padding:0"></textarea>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- <div class="layui-form-item">
|
|
|
- <label class="layui-form-label">是否推荐</label>
|
|
|
- <div class="layui-input-block">
|
|
|
- <input type="radio" name="state" value="1" title="推荐" >
|
|
|
- <input type="radio" name="state" value="0" title="不推荐" >
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="layui-form-item">
|
|
|
- <div class="layui-input-block">
|
|
|
- <button type="submit" class="layui-btn" lay-submit lay-filter="sub">立即添加</button>
|
|
|
- <button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </form>
|
|
|
-
|
|
|
-
|
|
|
-<!-- 百度编辑器配置文件引入 -->
|
|
|
-<script type="text/javascript" src="/static/extr/ueditor/ueditor.config.js"></script>
|
|
|
-<script type="text/javascript" src="/static/extr/ueditor/ueditor.all.js"></script>
|
|
|
-
|
|
|
-<!-- 实例化编辑器 在需要使用百度编辑的的文本域中加入 id='content'
|
|
|
-(例如：<textarea type='text' id="content" name="content" placeholder="请输入邮件内容" class="layui-textarea">)和下面UE中的对应，可以改成自己定义的只要一致就行-->
|
|
|
-<script type="text/javascript">
|
|
|
- UE.getEditor('content',{initialFrameWidth:1100,initialFrameHeight:500,
|
|
|
- toolbars: [
|
|
|
- [
|
|
|
- 'bold', //加粗
|
|
|
- 'indent', //首行缩进
|
|
|
- 'snapscreen', //截图
|
|
|
- 'italic', //斜体
|
|
|
- 'underline', //下划线
|
|
|
- 'strikethrough', //删除线
|
|
|
- 'formatmatch', //格式刷
|
|
|
- 'horizontal', //分隔线
|
|
|
- 'time', //时间
|
|
|
- 'date', //日期
|
|
|
- 'fontfamily', //字体
|
|
|
- 'fontsize', //字号
|
|
|
- 'paragraph', //段落格式
|
|
|
- 'link', //超链接
|
|
|
- 'emotion', //表情
|
|
|
- 'spechars', //特殊字符
|
|
|
- 'searchreplace', //查询替换
|
|
|
- 'forecolor', //字体颜色
|
|
|
- 'backcolor', //背景色
|
|
|
- 'edittip ', //编辑提示
|
|
|
- 'touppercase', //字母大写
|
|
|
- 'tolowercase', //字母小写
|
|
|
- ]]
|
|
|
- });
|
|
|
-</script>
|
|
|
-
|
|
|
-
|
|
|
-<script>
|
|
|
-
|
|
|
-layui.use(['form', 'layedit', 'jquery','upload','element'], function(){
|
|
|
- var form = layui.form
|
|
|
- ,element = layui.element
|
|
|
- ,layer = layui.layer
|
|
|
- ,$ = layui.jquery
|
|
|
- ,upload = layui.upload
|
|
|
- ;
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- //表单图片格式验证
|
|
|
- form.verify({
|
|
|
- pics: [//验证图片格式 ^$:判断为空
|
|
|
- /(?:^$|jpg|gif|png|jpeg)$/, '图片上传格式错误'
|
|
|
- ],
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-});
|
|
|
-</script>
|
|
|
-
|
|
|
-
|
|
|
-<script>
|
|
|
- // 图片显示(添加图片的时候显示当前图片)
|
|
|
- function imgChange() {
|
|
|
- //在图片 <input type="file" name="pic" id="pic" autocomplete="off" onchange="imgChange()">/*添加一个事件进行操作*/
|
|
|
- //<img id="imghead" width="260" height="180" /> <!--图片显示位置-->
|
|
|
- //获取点击的文本框
|
|
|
- var file =document.getElementById("pic");
|
|
|
- var imgUrl =window.URL.createObjectURL(file.files[0]);
|
|
|
- var img =document.getElementById('imghead');
|
|
|
- img.setAttribute('src',imgUrl); // 修改img标签src属性值
|
|
|
- };
|
|
|
-
|
|
|
- //实现取消图片上传功能
|
|
|
- function call() {
|
|
|
- //将img的src属性赋值为空串
|
|
|
- document.getElementById("imghead").src = "/static/admin/images/noimage.png";
|
|
|
- //选择文件框的value属性赋值为空串
|
|
|
- document.getElementById("pic").value = "";
|
|
|
- }
|
|
|
-</script>
|
|
|
-
|
|
|
-</body>
|
|
|
+<!DOCTYPE html>
|
|
|
+<html>
|
|
|
+<head>
|
|
|
+ <meta charset="utf-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
|
|
+ <title>Me博客后台管理系统</title>
|
|
|
+ <link rel="stylesheet" href="__ROOT__/css/layui.css" media="all">
|
|
|
+ <script src="__ROOT__/layui.js"></script>
|
|
|
+ <script src="__ROOT__/lay/modules/jquery.js"></script>
|
|
|
+
|
|
|
+
|
|
|
+<!-- 上传图片按钮样式 -->
|
|
|
+<style>
|
|
|
+.upflie {
|
|
|
+width: 80px;
|
|
|
+height: 28px;
|
|
|
+text-align: center;
|
|
|
+vertical-align: middle;
|
|
|
+border-radius: 2px;
|
|
|
+-webkit-border-radius: 2px;
|
|
|
+-moz-border-radius: 2px;
|
|
|
+color: #fff;
|
|
|
+cursor: pointer;
|
|
|
+background: #009688;
|
|
|
+border: 1px solid #009688;
|
|
|
+outline: none;
|
|
|
+position: relative;
|
|
|
+display: inline-block;
|
|
|
+overflow: hidden;
|
|
|
+text-decoration: none;
|
|
|
+line-height: 28px;
|
|
|
+}
|
|
|
+.upflie input {
|
|
|
+position: absolute;
|
|
|
+font-size: 10px;
|
|
|
+width: 200px;
|
|
|
+border: none;
|
|
|
+cursor: pointer;
|
|
|
+right: 0;
|
|
|
+top: 0;
|
|
|
+opacity: 0;
|
|
|
+}
|
|
|
+a:hover {
|
|
|
+display: inline-block;
|
|
|
+color: #fff;
|
|
|
+text-decoration: none;
|
|
|
+cursor: pointer!important;
|
|
|
+opacity: 0.8;
|
|
|
+}
|
|
|
+.upflie :hover {
|
|
|
+display: inline-block;
|
|
|
+overflow: hidden;
|
|
|
+color: #fff!important;
|
|
|
+cursor: pointer;
|
|
|
+text-decoration: none;
|
|
|
+}
|
|
|
+</style>
|
|
|
+<!-- end -->
|
|
|
+
|
|
|
+
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+ <form class="layui-form" action="{:url('article/add')}" style="padding: 30px" method="post" enctype="multipart/form-data" >
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <label class="layui-form-label">文章标题</label>
|
|
|
+ <div class="layui-input-inline" style="width:400px;">
|
|
|
+ <input type="text" name="title" id="uname" placeholder="请输入标题" autocomplete="off" class="layui-input">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <label class="layui-form-label">文章作者</label>
|
|
|
+ <div class="layui-input-inline" style="width:400px;">
|
|
|
+ <input type="text" name="author" id="upass" placeholder="请输入作者" autocomplete="off" class="layui-input">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <label class="layui-form-label">图片</label>
|
|
|
+ <div class="layui-input-inline" style="width:400px;">
|
|
|
+ <a class="upflie">添加图片
|
|
|
+ <input type="file" name="pic" id="pic" autocomplete="off" onchange="imgChange()" lay-verify="pics" >
|
|
|
+ </a>
|
|
|
+
|
|
|
+ <a class="upflie">取消
|
|
|
+ <input type="button" value="取消" onclick="call()" />
|
|
|
+ </a>
|
|
|
+
|
|
|
+ <img id="imghead" width="260" height="180" src="/static/admin/images/noimage.png" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <label class="layui-form-label">文章关键词</label>
|
|
|
+ <div class="layui-input-inline" style="width:400px;">
|
|
|
+ <input type="text" name="keywords" id="upass" placeholder="请输入关键词,多个关键词需用英文逗号分隔" autocomplete="off" class="layui-input">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <div class="layui-form-item layui-form-text">
|
|
|
+ <label class="layui-form-label" style="width:80px">内容</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <textarea placeholder="请输入内容" class="layui-textarea" name="content" id="content" style="border:0;padding:0"></textarea>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <label class="layui-form-label">是否推荐</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input type="radio" name="state" value="1" title="推荐" >
|
|
|
+ <input type="radio" name="state" value="0" title="不推荐" >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <button type="submit" class="layui-btn" lay-submit lay-filter="sub">立即添加</button>
|
|
|
+ <button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+
|
|
|
+
|
|
|
+<!-- 百度编辑器配置文件引入 -->
|
|
|
+<script type="text/javascript" src="/static/extr/ueditor/ueditor.config.js"></script>
|
|
|
+<script type="text/javascript" src="/static/extr/ueditor/ueditor.all.js"></script>
|
|
|
+
|
|
|
+<!-- 实例化编辑器 在需要使用百度编辑的的文本域中加入 id='content'
|
|
|
+(例如：<textarea type='text' id="content" name="content" placeholder="请输入邮件内容" class="layui-textarea">)和下面UE中的对应，可以改成自己定义的只要一致就行-->
|
|
|
+<script type="text/javascript">
|
|
|
+ UE.getEditor('content',{initialFrameWidth:1100,initialFrameHeight:500,
|
|
|
+ toolbars: [
|
|
|
+ [
|
|
|
+ 'bold', //加粗
|
|
|
+ 'indent', //首行缩进
|
|
|
+ 'snapscreen', //截图
|
|
|
+ 'italic', //斜体
|
|
|
+ 'underline', //下划线
|
|
|
+ 'strikethrough', //删除线
|
|
|
+ 'formatmatch', //格式刷
|
|
|
+ 'horizontal', //分隔线
|
|
|
+ 'time', //时间
|
|
|
+ 'date', //日期
|
|
|
+ 'fontfamily', //字体
|
|
|
+ 'fontsize', //字号
|
|
|
+ 'paragraph', //段落格式
|
|
|
+ 'link', //超链接
|
|
|
+ 'emotion', //表情
|
|
|
+ 'spechars', //特殊字符
|
|
|
+ 'searchreplace', //查询替换
|
|
|
+ 'forecolor', //字体颜色
|
|
|
+ 'backcolor', //背景色
|
|
|
+ 'edittip ', //编辑提示
|
|
|
+ 'touppercase', //字母大写
|
|
|
+ 'tolowercase', //字母小写
|
|
|
+ ]]
|
|
|
+ });
|
|
|
+</script>
|
|
|
+
|
|
|
+
|
|
|
+<script>
|
|
|
+
|
|
|
+layui.use(['form', 'layedit', 'jquery','upload','element'], function(){
|
|
|
+ var form = layui.form
|
|
|
+ ,element = layui.element
|
|
|
+ ,layer = layui.layer
|
|
|
+ ,$ = layui.jquery
|
|
|
+ ,upload = layui.upload
|
|
|
+ ;
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ //表单图片格式验证
|
|
|
+ form.verify({
|
|
|
+ pics: [//验证图片格式 ^$:判断为空
|
|
|
+ /(?:^$|jpg|gif|png|jpeg)$/, '图片上传格式错误'
|
|
|
+ ],
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+});
|
|
|
+</script>
|
|
|
+
|
|
|
+
|
|
|
+<script>
|
|
|
+ // 图片显示(添加图片的时候显示当前图片)
|
|
|
+ function imgChange() {
|
|
|
+ //在图片 <input type="file" name="pic" id="pic" autocomplete="off" onchange="imgChange()">/*添加一个事件进行操作*/
|
|
|
+ //<img id="imghead" width="260" height="180" /> <!--图片显示位置-->
|
|
|
+ //获取点击的文本框
|
|
|
+ var file =document.getElementById("pic");
|
|
|
+ var imgUrl =window.URL.createObjectURL(file.files[0]);
|
|
|
+ var img =document.getElementById('imghead');
|
|
|
+ img.setAttribute('src',imgUrl); // 修改img标签src属性值
|
|
|
+ };
|
|
|
+
|
|
|
+ //实现取消图片上传功能
|
|
|
+ function call() {
|
|
|
+ //将img的src属性赋值为空串
|
|
|
+ document.getElementById("imghead").src = "/static/admin/images/noimage.png";
|
|
|
+ //选择文件框的value属性赋值为空串
|
|
|
+ document.getElementById("pic").value = "";
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+</body>
|
|
|
</html>
|
