WebContent/WEB-INF/jsp/pc/goods/goodsEdit.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<title>商品编辑</title>
		<link rel="stylesheet" href="/zzhnc/res/plugins/layui/css/layui.css">
		<link rel="stylesheet" href="/zzhnc/res/css/basic.css">
		<style type="text/css">
			.activity-rule-box {
				padding-left: 20px;
			}
			
			#myEditor img {
				width: 80%;
			}
			
			#myEditor {
				margin: 0 !important;
			}
			
			.layui-form-select dl {
				max-height: 190px;
			}
			
			#allmap {
				top: 10px;
				width: 100%;
				height: 400px;
				overflow: hidden;
				margin: 0;
			}
			
			.layui-upload-list {
				width: 200px;
				max-height: 200px;
				overflow: hidden;
				clear: both;
				border-radius: 4px;
			}
			
			.layui-upload-list img {
				width: 100%;
				margin-top: 15px;
			}
			
			#connect-container {
				float: left;
				width: 400px
			}
			
			#connect-container div {
				padding: 5px;
			}
			
			#console-container {
				float: left;
				margin-left: 15px;
				width: 400px;
			}
			
			#console {
				border: 1px solid #CCCCCC;
				border-right-color: #999999;
				border-bottom-color: #999999;
				height: 170px;
				overflow-y: scroll;
				padding: 5px;
				width: 100%;
			}
			
			#console p {
				padding: 0;
				margin: 0;
			}
			
			#container * {
				-webkit-box-sizing: content-box;
				-moz-box-sizing: content-box;
				box-sizing: content-box;
			}
			
			#container *:before,
			.edui-container *:after {
				-webkit-box-sizing: content-box;
				-moz-box-sizing: content-box;
				box-sizing: content-box;
			}
			
			#container img {
				max-width: 80%;
			}
		</style>
		<script src="http://cdn.sockjs.org/sockjs-0.3.min.js"></script>
		<body class="wrap">
			<div class="layui-form Detailbtn" style="display: block;">
				<form action="server.php" method="post">
					<div class="layui-form-item">
						<label class="layui-form-label"><i
				style="color: red; margin-right: 5px;">*</i>商品主标题</label>
						<div class="layui-input-inline" style="width: 390px;">
							<input type="text" name="title" lay-verify="title" placeholder="商品主标题" class="layui-input">
						</div>
						<div class="layui-form-mid layui-word-aux">不超过20个汉字</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label"><i
				style="color: red; margin-right: 5px;">*</i>商品副标题</label>
						<div class="layui-input-inline" style="width: 390px;">
							<input type="text" name="subtitle" lay-verify="title" placeholder="商品副标题" class="layui-input">
						</div>
						<div class="layui-form-mid layui-word-aux">不超过20个汉字</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label"><i
				style="color: red; margin-right: 5px;">*</i>商品主图</label>

						<div class="layui-input-inline" style="width: 390px;">
							<div class="layui-upload">
								<button type="button" class="layui-btn" id="upload" style="margin:0 20px 0 0;float:left;">上传商品主图</button>
								<span class="layui-form-mid layui-word-aux">建议尺寸：200*200</span>
								<div class="layui-upload-list">
									<img class="layui-upload-img mainpictrue" src="">
									<input type="text" style="display:none;" name="imgurl">
									<p id="demoText"></p>
								</div>
							</div>
						</div>
						<div class="layui-form-mid layui-word-aux"></div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label"><i
				style="color: red; margin-right: 5px;">*</i>详细信息</label>
						<div class="layui-input-block">
							<!-- 加载编辑器的容器 -->
							<script id="container" name="content" type="text/plain">
								这里写你的初始化内容
							</script>

						</div>
					</div>

					<div class="layui-form-item" style="margin-top: 30px;">
						<button class="layui-btn" lay-submit lay-filter="submit">提交</button>
						<button class="layui-btn layui-btn-primary resetBtn">重置</button>
					</div>
				</form>
			</div>

		</body>

		<script src='/zzhnc/res/js/jquery.min.js'></script>
		<script src="/zzhnc/res/plugins/layui/layui.js" charset="utf-8"></script>
		<script type="text/javascript" src="/zzhnc/res/js/me.js"></script>
		<script>
			window.onload = function() {
				UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
				UE.Editor.prototype.getActionUrl = function(action) {
					if(action == 'uploadimage' || action == 'uploadscrawl' || action == 'uploadimage') {
						return '/zzhnc/upload/NewUploadImg';
					} else {
						return this._bkGetActionUrl.call(this, action);
					}
				}
				window.UEDITOR_CONFIG.initialFrameWidth = 900;
				window.UEDITOR_CONFIG.initialFrameHeight = 600;
				//UE.getEditor("container");  
				var ue = UE.getEditor('container', {
					autoHeight: false
				});

			}

			layui.use(['form', 'element', 'laydate', 'layer', 'laypage', 'layedit', 'upload'], function() {
				var form = layui.form(),
					element = layui.element(),
					laydate = layui.laydate,
					layer = layui.layer,
					laypage = layui.laypage;
				var $ = layui.jquery,
					upload = layui.upload;

				//普通图片上传
				//普通图片上传
				var uploadInst = upload.render({
					elem: '#upload',
					url: '/zzhnc/upload/UploadImg',
					done: function(data) {
						console.log(data)
						if(data.code == 0) {
							imgurl = data.data;
							$("input[name=imgurl]").val(imgurl);
							$(".mainpictrue").attr("src", imgurl);

						}

						//如果上传失败
						if(data.code > 0) {
							return layer.msg('上传失败');
						}
						//上传成功
					}

				});

				$(".resetBtn").on("click", function() {
					$("input[name=title]").val("");
					$("textarea[name=content]").val("");
					$("input[name=imgurl]").val("");
					$(".mainpictrue").attr("src", "");
					form.render();
				})
				var id = getUrl_G("id");
				if(id > 0) {
					$.post("/zzhnc/article/getArticle", {
						id: id
					}, function(data) {
						console.log(data);
						if(data.code == 0) {
							$("input[name=title]").val(data.data.title);
							//$("textarea[name=content]").val(data.data.content);	
							//重新渲染
							UE.getEditor("container").ready(function() {
								UE.getEditor("container").setContent(unescape(data.data.content));
							})
							$("input[name=imgurl]").attr("src", data.data.imgurl);
							$(".mainpictrue").attr("src", data.data.imgurl);
							form.render();
						}
					})

				}

				form.on('submit(submit)', function(data) {
					var title = $("input[name=title]").val();
					var content = UE.getEditor('container').getContent();
					var imgurl = $("input[name=imgurl]").val();
					if(title == "") {
						top.layer.msg("请填写文章标题");
						return false;
					} else {
						if(strlen(title) > 40) {
							top.layer.msg("文章标题不超过20个汉字");
							return false;
						}
					}
					if(imgurl == "") {
						top.layer.msg("请上传主图");
						return false;
					}
					if(content == "") {
						top.layer.msg("请输入内容");
						return false;
					}
					console.log()
					if(id > 0) {
						//修改项目
						$.post("/zzhnc/article/updateArticle", {
							id: id,
							title: title,
							content: content,
							imgurl: imgurl
						}, function(data) {
							console.log(data);
							if(data.code == 0) {
								top.layer.msg("修改成功");

							} else {
								top.layer.msg(data.msg);
							}
						})
					} else {
						//添加项目
						$.post("/zzhnc/article/addArticle", {
							title: title,
							content: content,
							imgurl: imgurl
						}, function(data) {
							console.log(data);
							if(data.code == 0) {
								top.layer.msg("添加成功");
								form.render();
							} else {
								top.layer.msg(data.msg);
							}
						})
					}
					return false;

				});

			})
		</script>

		<!-- 配置文件 -->
		<script type="text/javascript" src="/zzhnc/res/UE/ueditor.config.js"></script>
		<!-- 编辑器源码文件 -->
		<script type="text/javascript" src="/zzhnc/res/UE/ueditor.all.js"></script>
		<!-- 实例化编辑器 -->

</html>