#override("css") #end #override("body")
<style>
#select6 {
width: 100%;
height: 36px;
}
</style>
<div class="ibox float-e-margins">
<div class="ibox-content">
<div class="col-sm-12">
<form id="validForm" class="form-horizontal m-t"
novalidate="novalidate">
<div class="form-group">
<label class="col-sm-2 control-label">*栏目：</label>
<div class="col-sm-5">
<select class="form-control" id="columnList">
</select>
</div>
</div>
<div class="hr-line-dashed"></div>
<div class="form-group">
<label class="col-sm-2 control-label">*分类：</label>
<div class="col-sm-5">
<select class="form-control">
<option value="">请选择</option>
<option value="1">孕期</option>
<option value="2">育儿</option>
<option value="3">其它</option>
</select>
</div>
</div>
<div class="hr-line-dashed"></div>
<div class="form-group">
<label class="col-sm-2 control-label">权重：</label>
<div class="col-sm-5">
<input type="text" class="form-control" class="form-control"
placeholder="选填" name="">
</div>
</div>
<div class="hr-line-dashed"></div>
<div class="form-group">
<label class="col-sm-2 control-label">*标签：</label>
<div class="col-sm-5">
<select id="select6" name="contentTagIds" multiple
data-selectator-keep-open="true">
</select>
</div>
</div>
<div class="hr-line-dashed"></div>
<div class="form-group">
<label class="col-sm-2 control-label" for="">*封面：</label>
<div class="col-sm-5">
<div class="btn-group m-b col-sm-12 ">
<label class="btn btn-sm btn-info w-sm col-sm-3"
onclick="switchContent(1)"> <i
class="fa fa-check text-active" id="commonCon"></i> 普通内容
</label> <label class="btn btn-sm btn-success w-sm col-sm-3"
onclick="switchContent(2)"> <i class="fa text-active"
id="specialCon"></i> 专题内容
</label>
</div>
<div class="col-sm-12 no-padder" id="container">
<div data-multiple="false"
title="点击上传" id="pickfiles"
class="btn btn-primary btn-upload m-b-sm">
<i class="fa fa-cloud-upload text"></i> 点击上传图片
</div>
<img class="b wrapper-xs w img-responsive" style="width: 200px" id="pickImage"
src="${ctx}/static/images/p0.jpg" />
</div>
</div>
</div>
<div class="hr-line-dashed"></div>
<div class="form-group">
<label class="col-sm-2 control-label">*标题：</label>
<div class="col-sm-5">
<input type="text" ng-maxlength="32" name="title"
class="form-control w-lg" required="" aria-required="true">
</div>
</div>
<div class="form-group" id="linkContent">
<label class="col-sm-2 control-label">*链接：</label>
<div class="col-sm-5">
<input type="text" type="url" name="link"
class="form-control w-lg" aria-required="true">
</div>
</div>
<div class="form-group" id="zaiyaoContent">
<label class="col-sm-2 control-label">*摘要：</label>
<div class="col-sm-5">
<input type="text" maxlength="255" name="introduction" class="form-control w-lg">
</div>
</div>
<div class="form-group" id="zhengwenConent">
<label class="col-sm-2 control-label">正文：</label>
<div class="col-sm-5">
<script id="editor" name="richText" type="text/plain"></script>
</div>
</div>
<div class="hr-line-dashed"></div>
<div class="form-group">
<div class="col-sm-7 col-sm-offset-3 pull-right">
<button type="button" class="btn btn-primary" onclick="save();">
<i class="fa fa-check"></i> 提交
</button>
<button type="button" class="btn btn-white"
onclick="parent.closeAll();">
<i class="fa fa-close"></i> 取消
</button>
</div>
</div>
</form>
</div>
</div>
</div>
#end #extends("/common/base_list.html")
<script type="text/javascript" charset="utf-8" src="${ctx}/static/js/plugins/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="${ctx}/static/js/plugins/ueditor/ueditor.all.min.js"></script>
<script type="text/javascript" charset="utf-8" src="${ctx}/static/js/plugins/ueditor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript" charset="utf-8" src="${ctx}/static/js/plugins/plupload/js/moxie.js"></script>
<script type="text/javascript" charset="utf-8" src="${ctx}/static/js/plugins/plupload/js/plupload.dev.js"></script>
<script type="text/javascript" charset="utf-8" src="${ctx}/static/js/plugins/plupload/js/i18n/zh_CN.js"></script>
<script type="text/javascript" src="${ctx}/static/js/plugins/qiniu/qiniu.min.js"></script>
<script type="text/javascript">
function switchContent(num) {
if (num == 1) {//普通内容
$("#commonCon").addClass("fa-check");
$("#specialCon").removeClass("fa-check");
$("#zaiyaoContent").show();
$("#zhengwenConent").show();
$("#linkContent").hide();
} else {
$("#commonCon").removeClass("fa-check");
$("#specialCon").addClass("fa-check");
$("#zaiyaoContent").hide();
$("#zhengwenConent").hide();
$("#linkContent").show();
}
}
function initUpload(){
var uploader = Qiniu.uploader({
runtimes: 'html5,flash,html4', //上传模式,依次退化
browse_button: 'pickfiles', //上传选择的点选按钮，**必需**
uptoken_url: "${ctx}/ueditor/uploadGetToken", //Ajax请求upToken的Url，**强烈建议设置**（服务端提供）
//uptoken:"hZgfmtYjqtz1UC96gy4uatu5FmyvtoPULkUB9QgA:J51SWS11RoS_0JhE_4LaU_YAWj4=:eyJzY29wZSI6Im1vbW15YmFieSIsImRlYWRsaW5lIjoxNDkzMDA2ODY3fQ==",
// uptoken : '<Your upload token>', //若未指定uptoken_url,则必须指定 uptoken ,uptoken由其他程序生成
unique_names: true, // 默认 false，key为文件名。若开启该选项，SDK为自动生成上传成功后的key（文件名）。
// save_key: true, // 默认 false。若在服务端生成uptoken的上传策略中指定了 `sava_key`，则开启，SDK会忽略对key的处理
domain: 'http://img1.healthbaby.com.cn/', //bucket 域名，下载资源时用到，**必需**
get_new_uptoken: false, //设置上传文件的时候是否每次都重新获取新的token
container: 'container', //上传区域DOM ID，默认是browser_button的父元素，
max_file_size: '100mb', //最大文件体积限制
flash_swf_url: '${ctx}/js/plugins/plupload/Moxie.swf', //引入flash,相对路径
max_retries: 3, //上传失败最大重试次数
dragdrop: false, //开启可拖曳上传
chunk_size: '4mb', //分块上传时，每片的体积
auto_start: true, //选择文件后自动上传，若关闭需要自己绑定事件触发上传
init: {
'FilesAdded': function(up, files) {
plupload.each(files, function(file) {
// var progress = new FileProgress(file, 'fsUploadProgress');
// progress.setStatus("等待...");
// progress.bindUploadCancel(up);
});
},
'BeforeUpload': function(up, file) {
// var progress = new FileProgress(file, 'fsUploadProgress');
// var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
// if (up.runtime === 'html5' && chunk_size) {
// progress.setChunkProgess(chunk_size);
// }
},
'UploadProgress': function(up, file) {
// var progress = new FileProgress(file, 'fsUploadProgress');
// var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
// progress.setProgress(file.percent + "%", file.speed, chunk_size);
},
'FileUploaded': function(up, file, info) {
// 每个文件上传成功后,处理相关的事情
// 其中 info 是文件上传成功后，服务端返回的json，形式如
// {
// "hash": "Fh8xVqod2MQ1mocfI4S4KpRL6D98",
// "key": "gogopher.jpg"
// }
// 参考http://developer.qiniu.com/docs/v6/api/overview/up/response/simple-response.html
//var progress = new FileProgress(err.file, 'fsUploadProgress');
// progress.setError();
// progress.setStatus(errTip);
var domain = up.getOption('domain');
var res = JSON.parse(info);
var sourceLink = domain + res.key; //获取上传成功后的文件的Url+
$("#pickImage").attr("src",sourceLink);
},
'Error': function(up, err, errTip) {
//上传出错时,处理相关的事情
},
'UploadComplete': function() {
//队列文件处理完毕后,处理相关的事情
},
'Key': function(up, file) {
var key = "";
return key
}
}
});
}
$(function() {
//初始化图片上传插件
initUpload();
//初始化
var ue = UE.getEditor('editor', {
initialFrameHeight : 200,
initialFrameWidth : "100%"
});
$.getJSON("${ctx}/contentCategories/selelist", function(data) {
if (data.success) {
var columnList = "<option value=''>请选择</option>";
data.data.forEach(function(d, i) {
columnList += "<option value='"+d.id+"'>" + d.name + "</option>";
});
$("#columnList").empty();
$("#columnList").append(columnList);
}
});
$.get("${ctx}/contentTags/seleList", "json", function(data) {
if (data.success) {
var seleHtml = "";
data.data.forEach(function(d, i) {
seleHtml += '<option value="'+d.id+'">' + d.tagName + '</option>';
});
$("#select6").empty();
$("#select6").append(seleHtml);
$('#select6').selectator({
prefix : 'selectator_', // CSS class prefix
height : 'auto', // auto or element
useDimmer : false, // dims the screen when option list is visible
useSearch : true, // if false, the search boxes are removed and
// `showAllOptionsOnFocus` is forced to true
keepOpen : true, // if true, then the dropdown will not close when
// selecting options, but stay open until losing focus
showAllOptionsOnFocus : true, // shows all options if input box is empty
selectFirstOptionOnSearch : true, // selects the topmost option on every search
searchCallback : function(value) {
}, // Callback function when enter is pressed and
// no option is active in multi select box
labels : {
search : 'Search...' // Placeholder text in search box in single select box
}
});
}
});
});
function save() {
if ($('#validForm').valid()) {
var data = $('#validForm').serialize();
var pickImgSrc = $("#pickImage").attr("src");
var content = UE.getEditor('editor').getContent();
data+="&content="+content;
data+="&image="+pickImgSrc;
//data+"&"
//ajaxPost(APP.PATH + "/contentMessageTemplate/create", data);
//parent.reloadGrid('dataTable');
}
}
</script>