Bootstrap +mvc实现网络共享文件查阅（应用于企业ISO等共享文件呈现）
选择MVC因为为当前主流框架，bootstap为了任何客户端浏览网页都可以自适应
以上两个框架均为本人第一次使用，因此记录下来，希望可以帮助到有同样需求的人
要求如果是PDF文件直接网页打开，如果是别的文件可以下载或者打开
在Models 建立基类
public string Path { get; set; }//路径
public string TitleC { get; set; }//文件夹中文名
public string menu { get; set; }//菜单名 为了显示在台头
public List<string> Dict { get; set; } //存放目录
public List<string> Files { get; set; }//存放文件
public ActionResult Index(string fn, string titleC,string menu)
{
if (string.IsNullOrEmpty(fn)) fn = Server.MapPath("~/Application Forms (体系文件)/Forms/ISO 受控表格");
if (string.IsNullOrEmpty(titleC)) titleC = "公司ISO受控表单";
if (string.IsNullOrEmpty(menu)) menu = Server.MapPath("~/Application Forms (体系文件)/Forms/ISO 受控表格");
var dict = new List<string>();
var files = new List<string>();
foreach (var obj in subs)
{
if (Directory.Exists(obj))
{
dict.Add(obj); }
else { files.Add(obj); }
var m = new ViewManageIndexViewModel //返回到客户端
{ Dict = dict, Files = files, Path = fn, TitleC = titleC, menu=menu }; return View(m); }
这样可以基本实现指定路径下读取文件和文件夹呈现在客户端
下面为客户端代码以下为bootstrap 的响应式菜单当到手机上会自动自适应效果见下图
<nav class="navbar navbar-inverse" role="navigation">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"></a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="" >HOME</a></li>
<li class="dropdown" style="">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">FORMS <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu">
<li>@Html.ActionLink("ISO 受控表格", "Index", new { fn = Server.MapPath("~/Application Forms (体系文件)/FORMS/ISO 受控表格"),menu=Server.MapPath("~/Application Forms (体系文件)/FORMS/ISO 受控表格"), titleC = "公司ISO 受控表单" })</li>
<li>@Html.ActionLink("EHS 受控表格", "Index", new { fn = Server.MapPath("~/Application Forms (体系文件)/FORMS/EHS 受控表格"), menu = Server.MapPath("~/Application Forms (体系文件)/FORMS/EHS 受控表格"), titleC = "公司EHS 受控表格" })</li>
<li>@Html.ActionLink("其他表格", "Index", new { fn = Server.MapPath("~/Application Forms (体系文件)/FORMS/其他表格"), menu = Server.MapPath("~/Application Forms (体系文件)/FORMS/其他表格"), titleC = "公司其他表格" })</li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">POLICIES <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">HR POLICIES</a></li>
<li><a href="#">GA POLICIES</a></li>
<li><a href="#">IT POLICIES</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
文件的呈现才有bootstrap的table class="table table-bordered" 可以在窗口变小的时候自动生成滚动条效果见下图
<table class="table table-bordered">
<thead>
<tr>
<th>文件名</th>
<th>修改时间</th>
<th>操作</th>
</tr>
</thead>
<tbody>
@foreach (var d in Model.Files)
{
if ((@File.GetAttributes(d) & FileAttributes.Hidden) != FileAttributes.Hidden)
{
<tr>
<td> @Path.GetFileNameWithoutExtension(d)</td>
<td> @String.Format("{0:yyyy-MM-dd}", @File.GetLastWriteTime(d))</td>
@* <td> @System.Diagnostics.FileVersionInfo.GetVersionInfo(d).FileVersion
</td>*@
@if(@Path.GetExtension(d)==".pdf")
{
<td> @Html.ActionLink("表单申请流程", "openfile", new { path = Path.Combine(Model.Path, "流程"), fileName = Path.GetFileName(d).Substring(0, 11) + ".pdf" })
@Html.ActionLink("查看文件", "openfile", new { path = Model.Path, fileName = Path.GetFileName(d) })</td>
}
else
{
<td> @Html.ActionLink("查看文件/下载文件", "GetFileFromDisk", new { path = Model.Path, fileName = Path.GetFileName(d) })</td>
}
</tr>
}
}
</tbody>
</table>
当点击查看文件时调用的方法是
public FilePathResult GetFileFromDisk(string path, string fileName)
{
return File(path + "\\" + fileName, "application/zip-x-compressed", fileName);
}
这个时候点击以后会下显示器下方显示
我不想出现下载的按钮只想在线打开所以改写如下
Response.ContentType = "Application/pdf";
// string fileName = inFilePath.Substring(inFilePath.LastIndexOf('\\') + 1);
Response.AddHeader("content-disposition", "filename=" + filename);
Response.WriteFile(path + "\\" + filename);
Response.End();
以上基本完成所要功能
