<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>对错</title>
<script th:include="sys/common/metaCSS" th:remove="tag"></script> 
<script th:include="sys/common/metaJS" th:remove="tag"></script> 
<script src="sys/js/jquery.validate.min.js" th:src="@{/static/sys/js/jquery.validate.min.js}"></script>
<script src="sys/js/jquery-validation/messages_zh.js" th:src="@{/static/sys/js/jquery-validation/messages_zh.js}"></script>
<script type="text/javascript" src="https://t.sharingschool.com/dcui/tools/ueditor/ueditor.config.js?version=1811271348"></script>
<script type="text/javascript" src="https://t.sharingschool.com/dcui/tools/ueditor/ueditor.all.min.js?version=1812061808"></script>
<script type="text/javascript" src="https://t.sharingschool.com/dcui/tools/ueditor/lang/zh-cn/zh-cn.js?version=1811271348"></script>

 <style>
    	.clearfix:after {
			visibility: hidden;
			display: block;
			font-size: 0;
			content: " ";
			clear: both;
			height: 0;
		}
		.clearfix { display: inline-table; }
		* html .clearfix { height: 1%; }
		.clearfix { display: block; }
		.fl{display:inline;float:left}
		clearfix >control-label-error{display:inline;float:left;marign-left:10px}
		 label.control-label-error {
  				color: Red;
             }
          .lispan {line-height: 34px;}   
          
          .select1{
   		    width:100%;
		    height: 32px;
		    line-height: 32px;
		    border-top: solid 1px #a7b5bc;
		    border-left: solid 1px #a7b5bc;
		    border-right: solid 1px #ced9df;
		    border-bottom: solid 1px #ced9df;
		    opacity:1;
	        margin-bottom: 10px;
    	}
    </style>
</head>

<body>
<div class="place">
    <span>位置：</span>
    <ul class="placeul">
		<li><a href="#">运营管理</a></li>
		<li><a th:href="@{/sys/story/storyList.html}">故事列表</a></li>
	</ul>
</div>
<div class="formbody">
	<div class="formtitle"><span th:text="${ws.id} ? '修改故事' :'新增故事'">新增故事</span></div>
	<form id="submitFrom"   method="post" class="form-horizontal form-validate">
		     <input type="hidden" name="id" th:if="${ws.id}" th:value="${ws.id}"/>
		     <input type="hidden" name="storyId" id="storyId" th:value="${ws.storyId}"/>
		     <input type="hidden" name="num" id="num" th:value="${ws.num}"/>
		     <input type="hidden" name="coverImg" id="coverImg" th:value="${ws.coverImg}"/>
		     <input type="hidden" name="coverName" id="coverName" th:value="${ws.coverName}"/>
		     <input type="hidden" name="qrCode" id="qrCode" th:if="${ws.qrCode}" th:value="${ws.qrCode}"/>
		<ul class="forminfo">
			<li class="clearfix">
				<label>标题:<b>*</b></label>
				<input type="hidden" name="title" id="title" class="dfinput fl" th:value="${ws.title}"/>
				<script id="editorTitle" type="text/plain"   style="line-height: 20px; overflow: hidden;width:80%;height:200px"></script>
			</li>
			<li class="clearfix">
				<label>标题时长明细:<b>*</b></label>
				<input type="text" name="titleLong" id="titleLong" class="dfinput fl" th:value="${ws.titleLong}"/>
			</li>
			<li class="clearfix">
				<label>图片标题:<b>*</b></label>
				<input type="text" name="imgTitle" id="imgTitle" class="dfinput fl" th:value="${ws.imgTitle}"/>
			</li>
			<li class="clearfix">
				<label>音频名称:<b>*</b></label>
				<input type="text" id="voiceTitle" name="voiceTitle" class="dfinput fl" th:value="${ws.voiceTitle}">
			</li>
			
			<li class="clearfix">
			    <input type="hidden" name="voice" id="voice" th:value="${ws.voice}"/>
				<label class="upload-file">音频<b>*</b></label>
				 <audio style="margin-left: 108px; margin-bottom: 20px;" id="voiceAudio" controls="controls" th:if="${ws.voice}" th:src="${imgUrl}+''+${ws.voice}" ></audio>
				<input type="file" id="upfile">
			</li>
			<li class="clearfix" >
			    <label>第几天：<b>*</b></label>
				<input type="number" id="daysNum" class="dfinput fl" name="daysNum" th:value="${ws.daysNum}" />
		   </li>
			 <li class="clearfix">
				<label>任务:<b>*</b></label>
				 <input type="hidden" name="taskName" id="taskName" th:value="${ws.taskName}"/>
				 <script id="editor" type="text/plain"   style="line-height: 20px; overflow: hidden;width:80%;height:300px"></script>
			</li>
			 <li class="clearfix">
				<label>回复标题:<b>*</b></label>
				 <input type="hidden" name="replyTitle" id="replyTitle" th:value="${ws.replyTitle}"/>
				 <script id="editorReplyTitle" type="text/plain"   style="line-height: 20px; overflow: hidden;width:80%;height:200px"></script>
			</li>
			
			 <li class="clearfix">
				<label>古诗目标:<b>*</b></label>
				
				<textarea rows="5" id="gsAims" name="gsAims" class="textinput"
				
				 style="width: 346px;    height: 112px;" cols="5">[[${ws.gsAims}]]</textarea>
				 
			 </li>
			 <li class="clearfix">
				<label>古诗正文:<b>*</b></label>
				
				<textarea rows="5" id="gsText" name="gsText" class="textinput"
				
				 style="width: 346px;    height: 112px;" cols="5">[[${ws.gsText}]]</textarea>
				 
			 </li>
			 <li class="clearfix">
				<label>古诗注释:<b>*</b></label>
				
				<textarea rows="5" id="gsNote" name="gsNote" class="textinput"
				
				 style="width: 346px;    height: 112px;" cols="5">[[${ws.gsNote}]]</textarea>
				 
			 </li>
			 <li class="clearfix">
				<label>古诗翻译:<b>*</b></label>
				
				<textarea rows="5" id="gsFanyi" name="gsFanyi" class="textinput"
				
				 style="width: 346px;    height: 112px;" cols="5">[[${ws.gsFanyi}]]</textarea>
				 
			 </li>
			
			<li>
				<label>&nbsp;</label>
				<button type="submit" class="btn">保存</button>
				<button type="button" class="btn" onclick="window.history.go(-1);">取消</button>
			</li>
		</ul>
	</form>
</div>
</body>
<script th:include="sys/common/fileUpload" th:remove="tag"></script> 
<script type="text/javascript">

$(function(){
	$("#submitFrom").validate({
		rules : {
			
			taskName : {
				required : true
			},
			title : {
				required : true
			},
			titleLong : {
				required : true
			},
			imgTitle : {
				required : true
			},
			voiceTitle : {
				required : true
			},
			daysNum : {
				required : true,
				digits:true
			}
		},
		messages: {
			taskName : {
				required : "不能为空"
			},
			title : {
				required : "不能为空"
			},
			titleLong : {
				required : "不能为空"
			},
			imgTitle : {
				required : "不能为空"
			},
			voiceTitle : {
				required : "不能为空"
			},
			daysNum : {
				required : "不能为空",
				digits:"必须输入整数"
			}
			
		},
		errorPlacement : function(error, element) {
				error.appendTo(element.parent()); 
		},
		submitHandler : function(form) {
			roleFrom();
		}
	});
	
});
function roleFrom(){
	var url="[[${sysUrl}]]/sys/story/storyTaskSave";
	var contents = UE.getEditor('editor').getContent();
	$('#taskName').val(contents);
	var editorTitle = UE.getEditor('editorTitle').getContent();
	$('#title').val(editorTitle);
	var editorReplyTitle = UE.getEditor('editorReplyTitle').getContent();
	$('#replyTitle').val(editorReplyTitle);
	var params = $("#submitFrom").serialize();
	$.post(url,params,function(data){
		if(data != null){
				if(data.meta.success){
					parent.layer.msg("操作成功!",{icon:1});
			    	setTimeout(function(){
			    		window.location.href ='[[${sysUrl}]]/sys/story/storyTaskList.html?EQ_storyId=[[${ws.storyId}]]';
					},1000);
				}else{
					parent.layer.msg(data.meta.message,{icon:11});
				}
		}
		
	});
}

$(function(){
	initUpload(uploadAudio("upfile","上传音频"),"voice","voiceAudio");
});

//附件上传
function uploadFile(){
	$("#upfile").uploadify("upload", "*");
}

</script>

<script type="text/javascript">
          
var editor = new baidu.editor.ui.Editor({
	elementPathEnabled : false
    ,wordCount:false         //是否开启字数统计
    ,maximumWords:1000       //允许的最大字符数
    ,wordCountMsg:'当前已输入 {#count} 个字符，您还可以输入{#leave} 个字符'
    //超出字数限制提示  留空支持多语言自动切换，否则按此配置显示
    ,wordOverFlowMsg:'<span style="color:red;">你输入的字符个数已经超出最大允许值！</span>' 
});
var editorTitle = new baidu.editor.ui.Editor({
	elementPathEnabled : false
    ,wordCount:false         //是否开启字数统计
    ,maximumWords:1000       //允许的最大字符数
    ,wordCountMsg:'当前已输入 {#count} 个字符，您还可以输入{#leave} 个字符'
    //超出字数限制提示  留空支持多语言自动切换，否则按此配置显示
    ,wordOverFlowMsg:'<span style="color:red;">你输入的字符个数已经超出最大允许值！</span>' 
});
var editorReplyTitle = new baidu.editor.ui.Editor({
	elementPathEnabled : false
    ,wordCount:false         //是否开启字数统计
    ,maximumWords:1000       //允许的最大字符数
    ,wordCountMsg:'当前已输入 {#count} 个字符，您还可以输入{#leave} 个字符'
    //超出字数限制提示  留空支持多语言自动切换，否则按此配置显示
    ,wordOverFlowMsg:'<span style="color:red;">你输入的字符个数已经超出最大允许值！</span>' 
});

$(function(){
	editor.render('editor');
	editor.ready( function () { 
		 editor.setContent($('#taskName').val()); 
	 });  
	editorTitle.render('editorTitle');
	editorTitle.ready( function () { 
		editorTitle.setContent($('#title').val()); 
	 });  
	editorReplyTitle.render('editorReplyTitle');
	editorReplyTitle.ready( function () { 
		editorReplyTitle.setContent($('#replyTitle').val()); 
	 });  
	
});
</script>
</html>