hexiugang
/
iamberry-common-parent


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
							<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<%
String path = request.getContextPath();
String basePath = path + "/common/";
%>
<!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="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<LINK rel="Bookmark" href="/favicon.ico" >
<LINK rel="Shortcut Icon" href="/favicon.ico" />
<!--[if lt IE 9]>
<script type="text/javascript" src="lib/html5.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>
<script type="text/javascript" src="lib/PIE_IE678.js"></script>
<![endif]-->
<link href="<%=basePath %>admin/css/H-ui.min.css" rel="stylesheet" type="text/css" />
<link href="<%=basePath %>admin/css/H-ui.admin.css" rel="stylesheet" type="text/css" />
<link href="<%=basePath %>admin/css/style.css" rel="stylesheet" type="text/css" />
<link href="<%=basePath %>admin/lib/Hui-iconfont/1.0.1/iconfont.css" rel="stylesheet" type="text/css" />

<!--[if IE 6]>
<script type="text/javascript" src="http://lib.h-ui.net/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<title>单图文编辑</title>
<style type="text/css">
	.matext{font-size: 16px; color: #0088CC; font-weight: bold;}
	.maimg{width: 100%; height: 150px;}
</style>

</head>
<body>
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 微信管理 <span class="c-gray en">&gt;</span> 单图文编辑 <a class="btn btn-success radius r mr-20" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
<div class="pd-20" align="center">
  <div class="text-c bk-gray radius box-shadow" style="width: 800px;">
	<div class="text-l bk-gray radius pd-5 f-16 c-black"  style="background-color: #E8F5FF; font-weight: bold;">&nbsp;添加单图文</div>
	<div class="text-c radius pt-10 pb-10" style="float: inherit;padding-left: 2%; padding-right: 2%;">
		<!-- 显示在左侧的素材 -->
		<div class="text-c f-l mt-10" style="width: 375px;background-color: #F8F8F8;">
			<!-- 一个图文素材 -->
			<div class="text-c bk-gray radius box-shadow">
				<div  class="text-l pl-10 pt-10 pr-10">
					<span class="matext" id="oneImageTextTitleEG">标题</span>
					<p>${currDate }</p>
				</div>
				<div class="text-c pl-10 pb-10 pr-10">
					<img id="imageReturn" src="" alt="图片" class="maimg"> 
				</div>
				
			</div>
			
		</div>
		<!-- 显示在右侧的素材 -->
		<div class="text-c f-r mt-10" style="width: 375px; background-color: #F8F8F8;">
		<form action="${pageContext.request.contextPath }/admin/wx/addOrUpdateOneImageText/${operationType}/${token}" method="post" id="myForm">
			<input type="hidden" name="updateImageTextId" id="updateImageTextId" value="">
			<!-- 一个图文素材 -->
			<div class="text-c bk-gray radius box-shadow">
				<div  class="text-l pl-10 pt-10 pr-10">
					<span class="f-16">标题<font style="color: red;">*</font><font style="font-size: 13px;">(必填，不能超过64个字)</font></span>
					<p><input type="text" value="" id="oneImageTextTitle" name="oneImageTextTitle" class="input-text radius size-M"/></p>
				</div>
				
				<div  class="text-l pl-10 pt-5 pr-10">
					<span class="f-16">封面<font style="color: red;">*</font><font style="font-size: 13px;">(必须上传一张图片, 大图片建议尺寸：360像素 * 200像素)</font></span>
					<p style="width: 300px;">
						<span class="btn-upload form-group" style="width: 300px;">
						  <input class="input-text upload-url radius" style="width: 180px;"  type="text" name="oneImageTextImage" id="imageUrl" readonly><a href="javascript:void();" class="btn btn-primary radius"><i class="Hui-iconfont" >&#xe642;</i> 浏览图片</a>
						  <input type="button" name="" id="image1" style="width: 180px;" class="input-file">
						</span>
					</p>
				</div>
				
				<div  class="text-l pl-10 pt-5 pr-10">
					<span class="f-16"  id="addsummary"><a href="javascript:void();" style="color:#0088CC; text-decoration: none;">添加摘要</a></span>
					<p id="addsummary1" style="display: none;"><textarea rows='3' cols='30' id='oneImageTextsummary' name='oneImageTextsummary' style='width:100%;'></textarea></p>
				</div>
				
				<div  class="text-l pl-10 pt-10 pr-10">
					<span class="f-16">正文<font style="color: red;">*</font><font style="font-size: 13px;">(必填，不能超过10000个字符)</font></span>
					<p><textarea rows='10' cols='30' name="oneImageTextMainText" id="oneImageTextMainText" style='width:100%;'></textarea></p>
				</div>
				
				<div  class="text-l pl-10 pt-5 pr-10">
					<span class="f-16"  id="outlink"><a href="javascript:void();" style="color:#0088CC; text-decoration: none;">添加外链接</a></span>
					<p id="outlink1" style="display: none;"><input type='text' id="externalLlink" name='externalLlink' class='input-text radius size-M'/></p>
				</div>
				
				<div  class="text-l pl-10 pt-5 pr-10">
					<span class="f-16"  id="originallink"><a href="javascript:void();" style="color:#0088CC; text-decoration: none;">添加原文链接</a></span>
					<p id="originallink1" style="display: none;"><input type='text' name='originalLink' id="originalLink" class='input-text radius size-M'/></p>
				</div>
				
				<div  class="text-l pl-10 pt-20 pr-10 pb-20">
					<input class="btn btn-success radius" type="button" id="submitForm" value="保存">&nbsp;&nbsp;&nbsp;
					<input class="btn disabled radius" type="button" value="取消">
				</div>
			</div>
		</div>
		</form>
	</div>
	
  </div>
</div>
<script type="text/javascript" src="<%=basePath %>admin/lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="<%=basePath %>admin/lib/Validform/5.3.2/Validform.min.js"></script>  
<script type="text/javascript" src="<%=basePath %>admin/lib/layer/1.9.3/layer.js"></script>
<script type="text/javascript" src="<%=basePath %>admin/js/H-ui.js"></script> 
<script type="text/javascript" src="<%=basePath %>admin/js/H-ui.admin.js"></script> 
<script charset="utf-8" src="<%=basePath %>other/kingedit/kindeditor-min.js"></script>
<script charset="utf-8" src="<%=basePath %>other/kingedit/lang/zh_CN.js"></script>
<script type="text/javascript">
	
	
	$(function() {
		//表单提交
		$("#submitForm").click(function() {
			var title = $("#oneImageTextTitle").val();
			var summary = $("#oneImageTextsummary").val();
			var imageUrl = $("#imageUrl").val();
			var mainText = $("#oneImageTextMainText").val();
			var externalLlink = $("#externalLlink").val();
			var originalLink = $("#originalLink").val();
			if(title.length > 64 ||title.length < 1) {
				layer.msg('标题长度在1至64个字符长度!',{icon:1,time:2000});
			} else if(imageUrl.length == 0) {
				layer.msg('请上传封面图片',{icon:1,time:2000});
			} else if(mainText == "" && externalLlink == "") {
				layer.msg('正文和外链接至少填写一个',{icon:1,time:2000});
			} else {
				var url = $("#myForm").attr("action");
				var json = {
						"title":title,
						"imageUrl":imageUrl,
						"digest":summary,
						"mainText":mainText,
						"clickOutUrl":externalLlink,
						"sourceUrl":originalLink
						
				};
				$.post(url, json, function(result) {
					if(result.msg == 'success') {
						layer.msg('添加成功!',{icon:1,time:2000});
						location.href = "${pageContext.request.contextPath}/admin/wx/showMaterialList";
					} else {
						layer.msg(result.msg,{icon:5,time:2000});
					}
				})
			}
		});
		
		//点击内容摘要，显示内容摘要的文本框
		$("#addsummary").click(function() {
			$("#addsummary").html("摘要 (不能超过120个字)");
			$("#addsummary1").css("display", "block");
		});
		
		//点击添加外链接
		$("#outlink").click(function() {
			$("#outlink").html("<span class='f-16'>外链接地址<br/><font style='font-size: 13px;'>(设置后，点击图文消息，不会进入图文详情，而进入外链所设地址)</font></span>");
			$("#outlink1").css("display", "block");
		});
		
		//点击添加原文链接
		$("#originallink").click(function() {
			$("#originallink").html("<span class='f-16'>原文链接<font style='font-size: 13px;'>(在图文详情页面中会生成“阅读原文”链接)</font></span>");
			$("#originallink1").css("display", "block");
		});
		
		
		//标题的实时监控
		$("#oneImageTextTitle").bind("input propertychange", function(){
			$("#oneImageTextTitleEG").html($("#oneImageTextTitle").val());
		});
		
		//标题失去焦点
		$("#oneImageTextTitle").blur(function() {
			if($("#oneImageTextTitle").val().length == 0 ) {
				$("#oneImageTextTitleEG").html("标题");
			} else if($("#oneImageTextTitle").val().length >= 64) {
				layer.msg('标题长度不能超过64个字符!',{icon: 5,time:2000});
			}
		});
	});

</script>
<script type="text/javascript">
	KindEditor.ready(function(K) {
        window.editor = K.create('#oneImageTextMainText',{
        	fileManagerJson : '<%= path %>/common/other/kingedit/jsp/file_manager_json.jsp',
            uploadJson : '<%= path %>/common/other/kingedit/jsp/upload_json.jsp',
             allowFileManager : true,
             afterBlur: function(){this.sync();},
             items : ['fullscreen', 'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
                      'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image',
                      'emoticons','insertorderedlist', 'insertunorderedlist']
         });
	});
	
	//配置上传插件
	KindEditor.ready(function(K) {
		var editor = K.editor({
			fileManagerJson : '<%= path %>/common/other/kingedit/jsp/file_manager_json.jsp',
            uploadJson : '<%= path %>/common/other/kingedit/jsp/upload_json.jsp',
			allowFileManager : true
		});
		K('#image1').click(function() {
			editor.loadPlugin('image', function() {
				editor.plugin.imageDialog({
					imageUrl : K('#imageUrl').val(),
					clickFn : function(url, title, width, height, border, align) {
					    if (url.indexOf("http://h5.iamberry.com") > -1) {
                            url.replace("http://h5.iamberry.com","");
						}
						K('#imageUrl').val(url);
						//将图片回显到左侧的样板上
						$("#imageReturn").attr("src", url);
						editor.hideDialog();
					}
				});
			});
		});
	});
</script>

</body>
</html>