优化pdf生成逻辑

This commit is contained in:
Minho
2017-05-13 12:12:37 +08:00
parent 0f0b110a49
commit 837d0da991
15 changed files with 1028 additions and 212 deletions

View File

@@ -53,7 +53,7 @@
{{if eq .Model.PrivatelyOwned 0}}
<li><a href="javascript:" data-toggle="modal" data-target="#shareProject">项目分享</a> </li>
<li role="presentation" class="divider"></li>
{{/*<li><a href="https://wiki.iminho.me/export/1" target="_blank"></a> </li>*/}}
<li><a href="{{urlfor "DocumentController.Export" ":key" .Model.Identify "output" "pdf"}}" target="_blank">项目导出PDF</a> </li>
{{end}}
<li><a href="{{urlfor "HomeController.Index"}}" title="返回首页">返回首页</a> </li>
@@ -77,7 +77,7 @@
<div class="tab-wrap">
<div class="tab-item manual-catalog">
<div class="catalog-list read-book-preview" id="sidebar">
{{.Result}}
{{.Result}}
</div>
</div>
@@ -104,12 +104,12 @@
</div>
</div>
</div>
</div>
<div class="article-content">
<div class="article-body {{if eq .Model.Editor "markdown"}}markdown-body editormd-preview-container{{else}}editor-content{{end}}" id="page-content">
{{.Content}}
</div>
<!--
{{/*
{{if .Model.IsDisplayComment}}
<div id="articleComment" class="m-comment">
@@ -155,7 +155,7 @@
</div>
</div>
{{end}}
*/}}
*/}}-->
</div>
</div>

View File

@@ -84,7 +84,7 @@
<div id="htmlEditor" class="manual-editormd-active" style="height: 100%"></div>
</div>
<div class="manual-editor-status">
<div id="attachInfo" class="item"></div>
<div id="attachInfo" class="item">0 个附件</div>
</div>
</div>
@@ -153,13 +153,13 @@
</div>
</template>
<template v-else-if="item.state == 'error'">
<div class="error-message text">
上传失败
</div>
<span class="error-message">${item.message}</span>
<button type="button" class="btn btn-sm close" @click="removeAttach(item.attachment_id)">
<i class="fa fa-remove" aria-hidden="true"></i>
</button>
</template>
<template v-else>
<input type="hidden" name="attach_id[0]" :value="item.attach_id">
<input type="text" class="form-control" placeholder="附件名称" :value="item.file_name">
<a :href="item.http_path" target="_blank" :title="item.file_name">${item.file_name}</a>
<span class="text">(${(item.file_size/1024/1024).toFixed(4)}MB)</span>
<span class="error-message">${item.message}</span>
<button type="button" class="btn btn-sm close" @click="removeAttach(item.attachment_id)">
@@ -174,7 +174,7 @@
<div class="modal-footer">
<span id="add-error-message" class="error-message"></span>
<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
<button type="button" class="btn btn-primary" id="btnUploadAttachFile">确定</button>
<button type="button" class="btn btn-primary" id="btnUploadAttachFile" data-dismiss="modal">确定</button>
</div>
</div>
</form>
@@ -202,8 +202,17 @@
delimiters : ['${','}'],
methods : {
removeAttach : function ($attach_id) {
console.log($attach_id);
var $this = this;
var item = $this.lists.filter(function ($item) {
return $item.attachment_id == $attach_id;
});
if(item && item[0].hasOwnProperty("state")){
$this.lists = $this.lists.filter(function ($item) {
return $item.attachment_id != $attach_id;
});
return;
}
$.ajax({
url : "{{urlfor "DocumentController.RemoveAttachment"}}",
type : "post",
@@ -211,21 +220,23 @@
success : function (res) {
console.log(res);
if(res.errcode === 0){
for(var i in $this.lists){
var item = $this.lists[i];
if (item.attachment_id == res.data.attachment_id){
$this.lists.$remove(item);
break;
}
}
$this.lists = $this.lists.filter(function ($item) {
return $item.attachment_id != $attach_id;
});
}else{
layer.msg(res.message);
}
}
});
}
},
watch : {
lists : function ($lists) {
$("#attachInfo").text(" " + $lists.length + " 个附件")
}
}
});
</script>
<script src="/static/js/editor.js" type="text/javascript"></script>
<script src="/static/js/html-editor.js" type="text/javascript"></script>
@@ -267,16 +278,22 @@
var item = window.vueApp.lists[i];
if(item.attachment_id == file.id){
item.state = "error";
item.message = "上传失败";
break;
}
}
}).on("uploadSuccess",function (file, res) {
console.log(file);
for(var index in window.vueApp.lists){
var item = window.vueApp.lists[index];
if(item.id === file.id){
window.vueApp.lists.splice(index,1,res.attach);
if(item.attachment_id === file.id){
if(res.errcode === 0) {
window.vueApp.lists.splice(index, 1, res.attach);
}else{
item.message = res.message;
item.state = "error";
}
break;
}
}

View File

@@ -25,7 +25,8 @@
<link href="{{cdncss "/static/editor.md/css/editormd.css"}}" rel="stylesheet">
<link href="{{cdncss "/static/css/jstree.css"}}" rel="stylesheet">
<link href="{{cdncss "/static/highlight/styles/zenburn.css"}}" rel="stylesheet">
<link href="{{cdncss "/static/css/markdown.css"}}" rel="stylesheet">
<link href="{{cdncss "/static/webuploader/webuploader.css"}}" rel="stylesheet">
<link href="/static/css/markdown.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
@@ -111,7 +112,7 @@
<div id="docEditor" class="manual-editormd-active"></div>
</div>
<div class="manual-editor-status">
<div id="attachInfo" class="item">0 个附件</div>
</div>
</div>
@@ -154,13 +155,186 @@
</form>
</div>
</div>
<div class="modal fade" id="uploadAttachModal" tabindex="-1" role="dialog" aria-labelledby="uploadAttachModalLabel">
<div class="modal-dialog" role="document">
<form method="post" id="uploadAttachModalForm" class="form-horizontal">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">上传附件</h4>
</div>
<div class="modal-body">
<div class="attach-drop-panel">
<div class="upload-container" id="filePicker"><i class="fa fa-upload" aria-hidden="true"></i></div>
</div>
<div class="attach-list" id="attachList">
<template v-for="item in lists">
<div class="attach-item" :id="item.attachment_id">
<template v-if="item.state == 'wait'">
<div class="progress">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100">
<span class="sr-only">0% Complete (success)</span>
</div>
</div>
</template>
<template v-else-if="item.state == 'error'">
<span class="error-message">${item.message}</span>
<button type="button" class="btn btn-sm close" @click="removeAttach(item.attachment_id)">
<i class="fa fa-remove" aria-hidden="true"></i>
</button>
</template>
<template v-else>
<a :href="item.http_path" target="_blank" :title="item.file_name">${item.file_name}</a>
<span class="text">(${(item.file_size/1024/1024).toFixed(4)}MB)</span>
<span class="error-message">${item.message}</span>
<button type="button" class="btn btn-sm close" @click="removeAttach(item.attachment_id)">
<i class="fa fa-remove" aria-hidden="true"></i>
</button>
<div class="clearfix"></div>
</template>
</div>
</template>
</div>
</div>
<div class="modal-footer">
<span id="add-error-message" class="error-message"></span>
<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
<button type="button" class="btn btn-primary" id="btnUploadAttachFile" data-dismiss="modal">确定</button>
</div>
</div>
</form>
</div>
</div>
<script src="{{cdnjs "/static/jquery/1.12.4/jquery.min.js"}}"></script>
<script src="{{cdnjs "/static/vuejs/vue.min.js"}}" type="text/javascript"></script>
<script src="{{cdnjs "/static/bootstrap/js/bootstrap.min.js"}}"></script>
<script src="{{cdnjs "/static/webuploader/webuploader.min.js"}}" type="text/javascript"></script>
<script src="{{cdnjs "/static/jstree/3.3.4/jstree.min.js"}}" type="text/javascript"></script>
<script src="{{cdnjs "/static/editor.md/editormd.js"}}" type="text/javascript"></script>
<script type="text/javascript" src="{{cdnjs "/static/layer/layer.js"}}"></script>
<script src="{{cdnjs "/static/js/jquery.form.js"}}" type="text/javascript"></script>
<script src="{{cdnjs "/static/js/editor.js"}}" type="text/javascript"></script>
<script src="{{cdnjs "/static/js/markdown.js"}}" type="text/javascript"></script>
<script type="text/javascript">
window.vueApp = new Vue({
el : "#attachList",
data : {
lists : []
},
delimiters : ['${','}'],
methods : {
removeAttach : function ($attach_id) {
var $this = this;
var item = $this.lists.filter(function ($item) {
return $item.attachment_id == $attach_id;
});
if(item && item[0].hasOwnProperty("state")){
$this.lists = $this.lists.filter(function ($item) {
return $item.attachment_id != $attach_id;
});
return;
}
$.ajax({
url : "{{urlfor "DocumentController.RemoveAttachment"}}",
type : "post",
data : { "attach_id" : $attach_id},
success : function (res) {
console.log(res);
if(res.errcode === 0){
$this.lists = $this.lists.filter(function ($item) {
return $item.attachment_id != $attach_id;
});
}else{
layer.msg(res.message);
}
}
});
}
},
watch : {
lists : function ($lists) {
$("#attachInfo").text(" " + $lists.length + " 个附件")
}
}
});
</script>
<script src="/static/js/editor.js" type="text/javascript"></script>
<script src="/static/js/markdown.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#attachInfo").on("click",function () {
$("#uploadAttachModal").modal("show");
});
window.uploader = null;
$("#uploadAttachModal").on("shown.bs.modal",function () {
if(window.uploader === null){
try {
window.uploader = WebUploader.create({
auto: true,
dnd : true,
swf: '/static/webuploader/Uploader.swf',
server: '{{urlfor "DocumentController.Upload"}}',
formData : { "identify" : {{.Model.Identify}},"doc_id" : window.selectNode.id },
pick: "#filePicker",
fileVal : "editormd-file-file",
fileNumLimit : 1,
compress : false
}).on("beforeFileQueued",function (file) {
uploader.reset();
}).on( 'fileQueued', function( file ) {
var item = {
state : "wait",
attachment_id : file.id,
file_size : file.size,
file_name : file.name,
message : "正在上传"
};
window.vueApp.lists.splice(0,0,item);
}).on("uploadError",function (file,reason) {
for(var i in window.vueApp.lists){
var item = window.vueApp.lists[i];
if(item.attachment_id == file.id){
item.state = "error";
item.message = "上传失败";
break;
}
}
}).on("uploadSuccess",function (file, res) {
for(var index in window.vueApp.lists){
var item = window.vueApp.lists[index];
if(item.attachment_id === file.id){
if(res.errcode === 0) {
window.vueApp.lists.splice(index, 1, res.attach);
}else{
item.message = res.message;
item.state = "error";
}
break;
}
}
}).on("beforeFileQueued",function (file) {
}).on("uploadComplete",function () {
}).on("uploadProgress",function (file, percentage) {
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
$percent.css( 'width', percentage * 100 + '%' );
});
}catch(e){
console.log(e);
}
}
});
});
</script>
</body>
</html>