@{
|
ViewBag.Title = "打印模板管理";
|
Layout = "~/Views/Shared/Master.cshtml";
|
}
|
<link href=@Url.Content("~/Content/fileinput/css/fileinput.min.css") rel="stylesheet" />
|
<script src=@Url.Content("~/Content/fileinput/js/fileinput.min.js")></script>
|
<script src=@Url.Content("~/Content/fileinput/js/fileinput_locale_zh.js")></script>
|
<script>
|
var viewModel;
|
$(function () {
|
viewModel = new myViewModel_Menus(@Html.Raw(Json.Encode(Model)));
|
ko.applyBindings(viewModel, $(".container")[0]);
|
})
|
function myViewModel_Menus(data)
|
{
|
var self = this;
|
self.seve = function () {
|
window.location.href = "@Url.Action("Noticeinfo", "Backstage")" ;
|
}
|
ko.mapping.fromJS(data, mapping, self)
|
}
|
var mapping = {
|
'MenusList': {
|
create: function (options) {
|
return new MenusList(options.data);
|
}
|
}
|
}
|
function MenusList(data)
|
{
|
self = this;
|
self.Download = function ()
|
{
|
var fileName = data.Contents;
|
|
var form = $("<form>"); //定义一个form表单
|
form.attr('style', 'display:none'); //在form表单中添加查询参数
|
form.attr('target', '');
|
form.attr('method', 'post');
|
form.attr('action', "@Url.Action("DownloadFile", "Backstage")");
|
|
var input1 = $('<input>');
|
input1.attr('type', 'hidden');
|
input1.attr('name', 'fileName');
|
input1.attr('value', fileName);
|
$('body').append(form); //将表单放置在web中
|
form.append(input1); //将查询参数控件提交到表单上
|
form.submit();
|
}
|
self.Upload = function (data)
|
{
|
$("#myModal").modal();
|
var oFileInput = new FileInput();
|
oFileInput.Init("txt_file", "@Url.Action("FileUpload", "Backstage")" + "?id=" + data.Id());
|
}
|
ko.mapping.fromJS(data, {}, self)
|
}
|
|
var FileInput = function () {
|
var oFile = new Object();
|
|
//初始化fileinput控件（第一次初始化）
|
oFile.Init = function (ctrlName, uploadUrl) {
|
var control = $('#' + ctrlName);
|
|
//初始化上传控件的样式
|
control.fileinput({
|
language: 'zh', //设置语言
|
uploadUrl: uploadUrl, //上传的地址
|
allowedFileExtensions: ['jpg', 'png', 'gif','doc'],//接收的文件后缀
|
showUpload: true, //是否显示上传按钮
|
showCaption: false,//是否显示标题
|
browseClass: "btn btn-primary", //按钮样式
|
|
maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
|
//minFileCount: 0,
|
maxFileCount: 100,
|
enctype: 'multipart/form-data',
|
validateInitialCount: true,
|
previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
|
|
msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
|
});
|
|
//导入文件上传完成之后的事件
|
$("#txt_file").on("fileuploaded", function (event, data, previewId, index) {
|
$("#myModal").modal("hide");
|
var data = data.response;
|
var x = data.file
|
alert("上传成功");
|
|
//1.初始化表格
|
var oTable = new TableInit();
|
oTable.Init();
|
|
});
|
}
|
return oFile;
|
};
|
</script>
|
<div class="container">
|
|
<div class="row">
|
<table class="table table-bordered">
|
<caption style="background:#5fb4d0;">打印模板管理列表</caption>
|
<thead>
|
<tr>
|
<th>模板名称</th>
|
<th>下载模板</th>
|
<th>覆盖模板</th>
|
</tr>
|
</thead>
|
<tbody data-bind="foreach:MenusList">
|
<tr>
|
<td data-bind="text:Name"></td>
|
<td>
|
<button class="btn btn-default btn-sm" data-bind="click:Download" >
|
<span class="glyphicon glyphicon-save"></span>
|
</button>
|
</td>
|
<td>
|
<button class="btn btn-default btn-sm" data-bind="click:Upload" >
|
<span class="glyphicon glyphicon-calendar"></span>
|
</button>
|
</td>
|
</tr>
|
|
</tbody>
|
</table>
|
</div>
|
<div class="row">
|
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
|
<div class="modal-dialog" role="document">
|
<div class="modal-content">
|
<div class="modal-header">
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
<h4 class="modal-title" id="myModalLabel">请选择你要上传的文件</h4>
|
</div>
|
<div class="modal-body">
|
<input type="file" name="txt_file" id="txt_file" multiple class="file-loading" />
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
