開發(fā)文件列表主界面

開發(fā)文件列表主界面一、目錄21.效果預覽圖2.實現(xiàn)步驟3.功能驗證測試二、效果預覽圖3三、步驟實現(xiàn)4在/WebRoot/WEB-INF/jsp/comment文件夾下創(chuàng)建header.jsp<divclass="topbar"style="z-index:1;"><divclass="content"><divclass="top_left"><ahref="javascript:void(0)"class="topbar_menutitle"draggable="false">

<imgsrc="assets/images/logo-black.png"alt="NOimage"class="gridview-img"style="width:130%"></a>

<aclass="topbar_menuthis"target="_self"draggable="false"href="home.action"><iclass="font-iconmenu-explorer"></i>文件管理</a></div><divclass="top_right"><divclass="menu_group"><ahref="#"id="topbar_user"data-toggle="dropdown"class="topbar_menu"draggable="false"><iclass="font-iconicon-user"></i>${USER_CONTEXT.username}

<bclass="caret"></b></a><ulclass="dropdown-menumenu-topbar_userpull-rightanimatedmenuShow"role="menu"aria-labelledby="topbar_user"><li><ahref="grxx.action"draggable="false"><iclass="font-iconfafa-sign-out"></i>個人信息</a></li><li><ahref="logout.action"draggable="false"><iclass="font-iconfafa-sign-out"></i>退出</a></li></ul></div></div><divstyle="clear:both"></div></div></div>三、步驟實現(xiàn)5在/WebRoot/WEB-INF/jsp/comment文件夾下創(chuàng)建header.jsp<divclass="frame-header"><divclass="header-content"><divclass="header-left"><divclass="btn-groupbtn-group-sm"><buttononclick="javascript:history.go(-1);"

class="btnbtn-default"id="history_back"title="后退"type="button"><iclass="font-iconfafa-arrow-left"></i></button><buttononclick="javascript:history.go(1);"

class="btnbtn-default"id="history_next"title="前進"type="button"><iclass="font-iconfafa-arrow-right"></i></button><buttononclick="javascript:location.reload();"

class="btnbtn-default"id="refresh"title="強制刷新"type="button"><iclass="font-iconfafa-refresh"></i></button></div></div><!--/headerleft--><divclass="header-middle"><ahref="home.action"><buttonclass="btnbtn-default"id="home"title="我的文檔"><iclass="font-iconfafa-home"></i></button></a><divid="yarnball"title="點擊進入編輯狀態(tài)"style="display:block;"><ulclass="yarnball"style="left:3px;width:859px;"><liclass="yarnletfirst"><atitle=""href="home.action"style="z-index:2;">三、步驟實現(xiàn)6在/WebRoot/WEB-INF/jsp/comment文件夾下創(chuàng)建header.jsp<spanclass="left-yarn"></span><spanclass="address_icogroupSelf"></span><spanclass="title_name"style="top:-2px;position:relative;">全部</span></a></li><c:iftest="${type==2}"><liclass="yarnlet"><atitle=""href="category.action?type=2"style="z-index:1;"><spanclass="title_name">文檔</span></a></li></c:if><c:iftest="${type==1}"><liclass="yarnlet"><atitle=""href="category.action?type=1"style="z-index:1;"><spanclass="title_name">圖片</span></a></li></c:if><c:iftest="${type==3}"><liclass="yarnlet"><atitle=""href="category.action?type=3"style="z-index:1;"><spanclass="title_name">視頻</span></a></li></c:if><c:iftest="${type==4}"><liclass="yarnlet"><atitle=""href="category.action?type=4"style="z-index:1;"><spanclass="title_name">音樂</span></a></li></c:if><c:iftest="${type==5}"><liclass="yarnlet"><atitle=""href="category.action?type=5"style="z-index:1;"><spanclass="title_name">其他</span></a></li></c:if><c:iftest="${type==6}"><liclass="yarnlet"><atitle=""href="shareFile.action"style="z-index:1;"><spanclass="title_name">我的分享</span></a></li></c:if><c:iftest="${type==7}"><liclass="yarnlet"><atitle=""href="garbage.action"style="z-index:1;"><spanclass="title_name">垃圾箱</span></a></li></c:if></ul></div>三、步驟實現(xiàn)7在/WebRoot/WEB-INF/jsp/comment文件夾下創(chuàng)建header.jsp<divid="yarnball_input"style="display:none;"><inputtype="text"name="path"value=""class="path"id="path"></div></div><divclass="header-right"><inputtype="text"name="seach"id="navbarInput-01"><aclass="btnbtn-default"id="searchfiles"title="搜索"type="button"onclick="searchfile()"><iclass="font-iconfafa-search"></i></a></div>

</div></div>三、步驟實現(xiàn)8在/WebRoot/WEB-INF/jsp/comment文件夾下創(chuàng)建left.jsp<divclass="main"><divclass="main-left"style="z-index:1;"><divclass="main-left"style="z-index:1;"><divclass="list-groupcategory"style="margin:10px;"><aclass="list-group-item"id="r_active"href="home.action"><spanclass="glyphiconglyphicon-homeleft-icon"></span>

全部文件</a><aclass="list-group-item"href="category.action?type=2"><spanclass="glyphiconglyphicon-fileleft-icon">

</span>

我的文檔</a><aclass="list-group-item"href="category.action?type=1"><spanclass="glyphiconglyphicon-pictureleft-icon"></span>

我的圖片</a><aclass="list-group-item"href="category.action?type=3"><spanclass="glyphiconglyphicon-filmleft-icon"></span>

我的視頻</a><aclass="list-group-item"href="category.action?type=4"><spanclass="glyphiconglyphicon-musicleft-icon"></span>

我的音樂</a><aclass="list-group-item"href="category.action?type=5"><spanclass="glyphiconglyphicon-inboxleft-icon"></span>

其他</a><aclass="list-group-item"href="category.action?type=5"><spanclass="glyphiconglyphicon-inboxleft-icon"></span>

我的分享</a><aclass="list-group-itemactive"href="garbage.action"><spanclass="glyphiconglyphicon-trashleft-icon"></span>

垃圾箱</a></div><divclass="main-left-use">9在/WebRoot/WEB-INF/jsp/comment文件夾下創(chuàng)建left.jsp<divclass="progressprogress-uprogress-xs"><divclass="progress-barprogress-bar-blue"id="progress-bar"role="progressbar"aria-valuemin="0"aria-valuemax="100"style=""></div></div><h3class="heading-xs"style="font-size:10px;padding:010px">容量：<spanclass=""id="totle"></span><spanclass="capacitypull-right"><ahref="javascript:void(0)">擴容</a></span></h3></div></div></div></div>三、步驟實現(xiàn)10在/WebRoot/WEB-INF/jsp文件夾下main.jsp添加如下代碼<divclass="tools"><divclass="tools-left"><!--文件功能--><divclass="btn-groupbtn-group-smkod_path_toolfl-left"><divid="result-uploader"class="rightupload-filemainfl"style="float:left"></div><buttonclass="btnbtn-default"type="button"onclick="newdir()"

id="newdir"><iclass="font-iconfafa-folder-open-o"style="color:#888"></i>新建文件夾</button><buttonclass="btnbtn-default"style="display:block;"type="button"onclick="deletefile()"

id="delete"><iclass="font-iconglyphiconglyphicon-trash"style="color:#888"></i>刪除</button><aclass="btnbtn-default"type="button"style="display:block;"onclick="downloadfile()"href="javascript:void(0)"id="download"style="background:#F6F6F6;">

<iclass="font-iconglyphiconglyphicon-download-alt"style="color:#888"></i>下載</a>三、步驟實現(xiàn)11在/WebRoot/WEB-INF/jsp文件夾下main.jsp添加如下代碼<buttonclass="btnbtn-default"style="display:block;"type="button"id="rename"onclick="renanme()"><iclass="font-iconglyphiconglyphicon-pencil"style="color:#888"></i>重命名</button><aclass='btnbtn-default'style="display:none;"href="javascript:void(0);"onclick="downloadfile()"id="download">

<spanclass="glyphiconglyphicon-download-alt"><span>下載文件</a><ahref="javascript:void(0);"class='btnbtn-default'style="display:block;"id="copy"onclick="getdir1()">

<spanclass="glyphiconglyphicon-file"></span>復制</a>

<ahref="javascript:void(0);"class='btnbtn-default'style="display:block;"id="move"onclick="getdir1()">

<spanclass="glyphiconglyphicon-transfer"></span>移動</a>

<ahref="javascript:void(0);"class='btnbtn-default'style="display:block;"id="rename"onclick="renanme()"><spanclass="glyphiconglyphicon-pencil"></span>重命名</a>

<aclass='btnbtn-default'style="display:none"id="Dataanalysis"target="_blank">

</a><ulstyle="position:relative;float:left;padding-left:0px">三、步驟實現(xiàn)12在/WebRoot/WEB-INF/jsp文件夾下main.jsp添加如下代碼<liclass="dropdown"style="list-style:none"><aclass="dropdown-togglebtnbtn-default"data-toggle="dropdown"id="selectColumn"style="display:none;border-radius:0px;padding:4px12px;"href="javascript:void(0);">數(shù)據(jù)分析</a><ulclass="dropdown-menucloudanys"style="margin-top:4px!important;"><li><ahref="javascript:void(0);"onclick="analysis(1)">詞云分析</a></li><liclass="divider"></li><li><ahref="javascript:void(0);"onclick="analysis(2)">柱狀分析</a></li><liclass="divider"></li><li><ahref="javascript:void(0);"onclick="analysis(3)">氣泡分析</a></li></ul></li></ul></div><divclass="clearfix"></div></div></div>三、步驟實現(xiàn)13在/WebRoot/WEB-INF/jsp文件夾下main.jsp添加如下代碼<tableclass="tablemb-0"><thead><tr><thclass="table-checkbox"style="position:relative;left:13px;"><labelclass="checkboxcheckbox-position"style="min-height:0"for="checkbox1">

<spanclass="iconsicon-span"><spanclass="first-iconfui-checkbox-unchecked"></span><spanclass="second-iconfui-checkbox-checked"></span></span>

<inputname="chkAll"type="checkbox"id="operAll"onClick="getAll()"

value="checkbox"class="main-check"></label></th><thclass="mainfile-name">文件名</th><thclass="hidetable-filepositionmainfile-position">文件位置</th><thclass="mainfile-size">大小</th><thclass="mainfile-size"id="share_th">分享</th>

<thclass="mainchange-date">修改日期</th></tr></thead><tbodyid="tab"><c:forEachvar="fb"items="${list}"><tr><tdstyle="top:-6px;position:relative;left:13px;"><labelclass="checkboxtable-checkboxposition"for="checkbox1">三、步驟實現(xiàn)14在/WebRoot/WEB-INF/jsp文件夾下main.jsp添加如下代碼<spanclass="iconsmain-icons">

<spanclass="first-iconfui-checkbox-unchecked"></span>

<spanclass="second-iconfui-checkbox-checked"></span></span>

<inputtype="checkbox"name='check'class="main-tab