123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384 |
- <%@ page language="java" contentType="text/html; charset=UTF-8"
- pageEncoding="UTF-8"%>
- <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
- <%
- 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: 120px;}
- </style>
- </head>
- <body>
- <!-- 遮罩层 -->
- <div align="center" style="position: absolute; width: 100%; height: 100%; z-index: 1000;color:#fff!important;background-color:rgba(0,0,0,0.6); display: none;" id="imageTextSource">
- <div class="pt-20 mt-30" align="center" style="width: 830px; height:85%; overflow:auto;background-color: white;">
- <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: #F5FAFE; font-weight: bold;"> 素材资源
- <div class="text-c pl-10" style="float: right;">
- <input class="btn btn-success radius" type="button" value="确认" onclick="sureImageText()">
- <input class="btn radius" type="button" onclick="closeWindow(this, '')" value="取消">
- </div>
- </div>
- <div class="text-c radius pt-10 pb-10" style="float: inherit;padding-left: 2%; padding-right: 2%;" id="imageTextList">
- <!-- 显示在左侧的素材 -->
- <div class="text-c f-l" style="width: 375px;" id="leftImageText">
- <!-- 一个图文素材 -->
- <!-- <div class="text-c bk-gray radius mt-20 box-shadow" style="background-color: #F5FAFE">
- <div class="text-l pl-10 pt-10 pr-10">
- <span class="matext">【双十二5元现金券】12.7-14号,双12来袭,替你省下一个双11</span>
- <p>2015-02-08</p>
- </div>
- <div class="text-c pl-10 pb-10 pr-10" style="border-bottom: 1px solid #E8F5FF;">
- <img src="" alt="" class="maimg">
- </div>
- <div class="text-l min_img box-shadow" style="border-bottom: 1px solid #E8F5FF;width: 100%; height: 70px;" id="minzhezhao">
- <div class="f-l mt-10 mt-10" style="width: 75%;">
- <p class="ml-10"> ${imageTextMore.title }</p>
- </div>
- <div class="f-r text-r mt-5 mb-5" style="width: 24%;">
- <img src="${imageTextMore.imageUrl }" alt="缩略图" style="width: 60px; height: 60px; margin-right: 10px;">
- </div>
- </div>
- </div> -->
-
- </div>
- <!-- 显示在右侧的素材 -->
- <div class="text-c f-r" style="width: 375px;" id="rightImageText">
- <!-- 一个图文素材 -->
- <!-- <div class="text-c bk-gray radius mt-20 box-shadow">
- <div class="text-l pl-10 pt-10 pr-10">
- <span class="matext">【双十二5元现金券】12.7-14号,双12来袭,替你省下一个双11</span>
- <p>2015-02-08</p>
- </div>
- <div class="text-c pl-10 pb-10 pr-10">
- <img src="" alt="" class="maimg">
- </div>
- </div> -->
-
- </div>
- <!-- 右侧框end -->
- </div>
- </div>
- <!-- 整个素材框end -->
- </div>
- <!-- <div style="background-color:rgba(0,0,0,0.6); float: left;width: 100%; height: 50px; z-index: 2000;position:fixed;">dsfad</div> -->
- </div>
- <nav class="breadcrumb"><i class="Hui-iconfont"></i> 首页 <span class="c-gray en">></span> 微信管理 <span class="c-gray en">></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"></i></a></nav>
- <div class="pd-20" align="center">
- <div class="text-c bk-gray radius box-shadow" style="width: 700px;">
- <div class="text-l bk-gray radius pd-5 f-16 c-black" style="background-color: #F5FAFE; font-weight: bold;"> 首次关注回复</div>
- <div class="text-c radius pt-10 pb-10" style="float: inherit;padding-left: 4%; padding-right: 4%;">
- <!-- 显示在左侧的素材 -->
- <div class="text-c f-l" style="width: 650px;">
- <form action="${pageContext.request.contextPath }/admin/wx/updateandaddFirstJoinKey/${token}" method="post" id="myForm">
- <!-- 添加素材按钮 -->
- <div class="text-c bk-gray radius pd-20 mt-20">
-
- <div class="text-l pt-10">
- 回复类型:<span class="select-box inline" style="width: 100px;">
- <select name="reType" class="select" style="width: 90px;" id="selectTextAndImg">
- <c:choose>
- <c:when test="${firstJoinKey.reMessageType ==2}">
- <option value="1">文字</option>
- <option value="2" selected="selected">图文</option>
- </c:when>
- <c:otherwise>
- <option value="1" selected="selected">文字</option>
- <option value="2">图文</option>
- </c:otherwise>
- </c:choose>
- </select>
- </span>
- </div>
-
- <c:if test="${firstJoinKey.reMessageType == 1}">
- <!-- 自动回复图文素材模块 -->
- <div id="imgtext" style="display: none;">
- <div class="text-l mt-20">
- 图文资源:<span class="btn-upload form-group">
- <a href="javascript:void();" class="btn btn-primary upload-btn" onclick="return searchimgtext()"><i class="Hui-iconfont"></i>选择图文</a>
- </span>
- (<font style="color: red;">*</font><font style="font-size: 13px;">必填,请选择一条图文素材</font>)
- </div>
-
- <!-- 一个图文素材 -->
- <div class="text-c bk-gray radius mt-20 box-shadow" style="width: 350px;" id="imageText">
- <input type="hidden" id="refImageTextId" name="refImageTextId" value=""/>
- <div class="text-l pl-10 pt-10 pr-10">
- <span class="matext" id="mobanTitle">标题</span>
- <p id="mobanTime">2015-02-08</p>
- </div>
- <div class="text-c pl-10 pb-10 pr-10" style="border-bottom: 1px solid #E8F5FF;">
- <img src="" alt="" class="maimg" id="mobanImage">
- </div>
- <!-- <div class="text-l min_img box-shadow" style="border-bottom: 1px solid #E8F5FF;width: 100%; height: 70px;" id="">
- <div class="f-l mt-10 mt-10" style="width: 75%;">
- <p class="ml-10"> 标题</p>
- </div>
- <div class="f-r text-r mt-5 mb-5" style="width: 24%;">
- <img src="" alt="缩略图" style="width: 60px; height: 60px; margin-right: 10px;">
- </div>
- </div> -->
- </div>
- </div>
-
- <div class="text-l pl-10 pt-20 pr-10 pb-20" id="facetext">
- <span style="vertical-align: top; height: 100%; width: 20%;"> 回复:</span>
- <textarea rows='10' cols='30' style='reset;width:85%;' name="refText" id="bodyEdit">${firstJoinKey.reText}</textarea>
- </div>
- </c:if>
-
- <c:if test="${firstJoinKey.reMessageType == 2}">
- <!-- 自动回复图文素材模块 -->
- <div id="imgtext" style="display: block;">
- <div class="text-l mt-20">
- 图文资源:<span class="btn-upload form-group">
- <a href="javascript:void(0);" class="btn btn-primary upload-btn" onclick="searchimgtext()"><i class="Hui-iconfont"></i>选择图文</a>
- </span>
- (<font style="color: red;">*</font><font style="font-size: 13px;">必填,请选择一条图文素材</font>)
- </div>
- <c:if test="${!empty imageTextInfo }">
- <!-- 一个图文素材 -->
- <div class="text-c bk-gray radius mt-20 box-shadow" style="width: 350px;" id="imageText">
- <input type="hidden" id="refImageTextId" name="refImageTextId" value="${imageTextInfo.imagetextno }"/>
- <div class="text-l pl-10 pt-10 pr-10">
- <span class="matext" id="mobanTitle">${imageTextInfo.title }</span>
- <p id="mobanTime">${imageTextInfo.createtime }</p>
- </div>
- <div class="text-c pl-10 pb-10 pr-10" style="border-bottom: 1px solid #E8F5FF;">
- <img src="${imageTextInfo.imageurl }" alt="" class="maimg" id="mobanImage">
- </div>
- <c:if test="${!empty imageTextInfo.subVoList }">
- <c:forEach items="${imageTextInfo.subVoList }" var="imageTextChild">
- <div class='text-l min_img box-shadow' title='minimg' style='border-bottom: 1px solid #E8F5FF;width: 100%; height: 70px;'>
- <div class='f-l mt-10 mt-10' style='width: 75%;'>
- <p class='ml-10' style='color:black;'> ${imageTextChild.title }</p>
- </div>
- <div class='f-r text-r mt-5 mb-5' style='width: 24%;'>
- <img src='${imageTextChild.imageUrl }' alt='image' style='width: 60px; height: 60px; margin-right: 10px;'>
- </div>
- </div>
- </c:forEach>
- </c:if>
- </div>
-
- </c:if>
- </div>
-
- <div class="text-l pl-10 pt-20 pr-10 pb-20" id="facetext" style="display: none;">
- <span style="vertical-align: top; height: 100%; width: 20%;"> 回复:</span>
- <textarea rows='10' cols='30' style='reset;width:85%;' name="refText" id="bodyEdit">${firstJoinKey.reText}</textarea>
- </div>
- </c:if>
- <!-- 保存取消按钮 -->
- <div class="text-l pl-10 pt-20 pr-10 pb-20">
- <input class="btn btn-success radius" id="saveKeyAnswerButton" type="button" value="保存">
- <input class="btn disabled radius" type="button" value="取消">
- </div>
- </div>
- </form>
- </div>
- </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() {
- $("#selectTextAndImg").on("change", function() {
- if($("#selectTextAndImg").val() == 1) {
- //显示文字编辑器
- $("#imgtext").hide();
- $("#facetext").show();
- } else if($("#selectTextAndImg").val() == 2) {
- //显示图文素材选择器
- $("#facetext").hide();
- $("#imgtext").show();
- }
- });
-
- //保存事件
- $("#saveKeyAnswerButton").click(function() {
- var type = $("#selectTextAndImg").val();
- var imageTextId = $("#refImageTextId").val();
- var bodyEdit = $("#bodyEdit").val();
- var url = $("#myForm").attr("action");
- if(type == 1) {
- if(bodyEdit.length < 1 || bodyEdit.length > 200) {
- layer.msg("关键字长度在1~200个字符之间!", {icon: 1,time:1000});
- return false;
- } else {
- var reqJSON = {"type":type,"bodyEdit":bodyEdit};
- $.post(url, reqJSON, function(result) {
- if(result.msg == "tokenerr") {
- layer.msg("token表单验证失败!请刷新重试!", {icon: 5,time:1000});
- } else if(result.msg == "success"){
- layer.msg("保存成功!", {icon: 6,time:1000});
- $("#myForm").attr("action", "${pageContext.request.contextPath }/admin/wx/updateandaddFirstJoinKey/"+result.token);
- } else {
- layer.msg(result.msg, {icon: 5,time:1000});
- $("#myForm").attr("action", "${pageContext.request.contextPath }/admin/wx/updateandaddFirstJoinKey/"+result.token);
- }
- });
- }
- } else if(type == 2) {
- if(imageTextId == null || imageTextId == "") {
- layer.msg("请选择图文素材!", {icon: 1,time:1000});
- return false;
- } else {
- var reqJSON = {
- "type":type,
- "imageTextId":imageTextId
- };
- $.post(url, reqJSON, function(result) {
- if(result.msg == "tokenerr") {
- layer.msg("token表单验证失败!请刷新重试!", {icon: 5,time:1000});
- } else if(result.msg == "success"){
- layer.msg("保存成功!", {icon: 6,time:1000});
- $("#myForm").attr("action", "${pageContext.request.contextPath }/admin/wx/updateandaddFirstJoinKey/"+result.token);
- } else {
- layer.msg(result.msg, {icon: 5,time:1000});
- $("#myForm").attr("action", "${pageContext.request.contextPath }/admin/wx/updateandaddFirstJoinKey/"+result.token);
- }
- });
- }
- }
- });
- });
-
- var token = true;
-
- //获取请求资源
- function searchimgtext() {
- if(token) {
- token = false;
- //$("#imageTextSource").css("display", "block");
- var url = "${pageContext.request.contextPath}/admin/wx/showImageTextSource";
- $.post(url, {"time":new Date}, function(result) {
- $("#imageTextSource").css("display", "block");
- if(result != "") {
- for(var i = 0; i < result.length; i++) {
- if((i%2) == 0) {
- $("#leftImageText").append("<div id='sucai"+i+"' class='text-c bk-gray radius mt-20 box-shadow changeColor' style='background-color: #fff' onclick='changeDiv(this)'><input type='hidden' id='imageTextId' value='"+result[i].imageTextMD5+"'/><div class='text-l pl-10 pt-10 pr-10'><span class='matext'> "+result[i].title+"</span><p style='color:black;' id='datetime'> "+result[i].createtime+"</p></div><div class='text-c pl-10 pb-10 pr-10' style='border-bottom: 1px solid #E8F5FF;'><img src='"+result[i].imageurl+"' alt='' class='maimg'></div></div>");
- var moreImageText = result[i].subVoList;
- if(moreImageText != "" && moreImageText.length >= 1) {
- for(var j = 0; j < moreImageText.length; j++) {
- $("#sucai"+i).append("<div class='text-l min_img box-shadow' title='minimg' style='border-bottom: 1px solid #E8F5FF;width: 100%; height: 70px;'><div class='f-l mt-10 mt-10' style='width: 75%;'><p class='ml-10' style='color:black;'> "+moreImageText[j].title+"</p></div><div class='f-r text-r mt-5 mb-5' style='width: 24%;'><img src='"+moreImageText[j].imageUrl+"' alt='image' style='width: 60px; height: 60px; margin-right: 10px;'></div></div>");
- }
- }
- }
- if((i%2) == 1) {
- $("#rightImageText").append("<div id='sucai"+i+"' class='text-c bk-gray radius mt-20 box-shadow changeColor' style='background-color: #fff' onclick='changeDiv(this)'><input type='hidden' id='imageTextId' value='"+result[i].imageTextMD5+"'/><div class='text-l pl-10 pt-10 pr-10'><span class='matext'> "+result[i].title+"</span><p style='color:black;' id='datetime'> "+result[i].createtime+"</p></div><div class='text-c pl-10 pb-10 pr-10' style='border-bottom: 1px solid #E8F5FF;'><img src='"+result[i].imageurl+"' alt='' class='maimg'></div></div>");
- var moreImageText = result[i].subVoList;
- if(moreImageText != "" && moreImageText.length >= 1) {
- for(var j = 0; j < moreImageText.length; j++) {
- $("#sucai"+i).append("<div class='text-l min_img box-shadow' title='minimg' style='border-bottom: 1px solid #E8F5FF;width: 100%; height: 70px;'><div class='f-l mt-10 mt-10' style='width: 75%;'><p class='ml-10' style='color:black;'> "+moreImageText[j].title+"</p></div><div class='f-r text-r mt-5 mb-5' style='width: 24%;'><img src='"+moreImageText[j].imageUrl+"' alt='image' style='width: 60px; height: 60px; margin-right: 10px;'></div></div>");
- }
- }
- }
- }
- } else {
- //alert("暂时没有您要的信息");
- $("#imageTextList").html("<div style='color:black;'>暂没有任何图文素材,请及时添加!</div>");
- }
- return false;
- })
- } else {
- layer.msg("正在发送请求,请稍等...", {icon: 5,time:3000});
- }
- }
-
- //关闭图文资源
- function closeWindow(obj, id) {
- $("#imageTextSource").css("display", "none");
- $("#leftImageText").html("");
- $("#rightImageText").html("");
- token = true;
- }
-
- //选择使用哪一个图文,改变其背景颜色
- function changeDiv(obj) {
- $(".changeColor").each(function() {
- $(this).css("background-color","#fff")
- })
- $(obj).css("background-color", "#E8F5FF");
- }
-
- //确认图文
- function sureImageText() {
- $(".changeColor").each(function() {
- //alert($(this).css("background-color"));
- if($(this).css("background-color") == "rgb(232, 245, 255)") {
- //alert($(this).find("img[class='maimg']").attr("src"));
- $("#refImageTextId").val($(this).find(":input[type='hidden']").val());
- $("#mobanTitle").html($(this).find("span:nth-child(1)").html());//主图文标题回显
- $("#mobanTime").html($(this).find("p[id='datetime']").html());//主图文时间回显
- $("#mobanImage").attr("src", $(this).find("img[class='maimg']").attr("src"));//主图文状态回显
- $("#imageText .min_img").each(function() {
- $(this).remove();
- })
- $(this).find("div[title='minimg']").each(function() {
- //alert($(this).find("img[alt='image']").attr("src"));
- $("#imageText").append("<div class='text-l min_img box-shadow' style='border-bottom: 1px solid #E8F5FF;width: 100%; height: 70px;'><div class='f-l mt-10 mt-10' style='width: 75%;'><p class='ml-10'>"+$(this).find("p[class='ml-10']").html()+"</p></div><div class='f-r text-r mt-5 mb-5' style='width: 24%;'><img src='"+$(this).find("img[alt='image']").attr("src")+"' alt='缩略图' style='width: 60px; height: 60px; margin-right: 10px;'></div></div>");
- });
-
- }
- })
- $("#imageTextSource").css("display", "none");
- $("#leftImageText").html("");
- $("#rightImageText").html("");
- token = true;
- }
-
-
- </script>
- <script type="text/javascript">
- KindEditor.ready(function(K) {
- window.editor = K.create('#bodyEdit',{
- 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 : []//'emoticons'
- });
- });
- </script>
- </body>
- </html>
|