<style type="text/css"> .pull-left{width:100%} .no-padding{padding:3px !important;} .col-sm-3{padding:4px;} .thumbnail .caption{padding:0px;} .category-add{margin-top:30px;} .pagination-detail{display:none} .row-flex{margin-left: 15px;margin-right:5px;margin-top:2px;} .fixed-table-toolbar .pull-left {margin-bottom: 0px;margin-top: 0px;} .mask {position: absolute;opacity: 0;top: 0;border-radius: 10px;cursor: pointer;} .attach_select_image{margin: 0px;height: 151px;width: 100%;margin-top: 9px;position: relative;padding-right:10px} @media (max-width: 804px) {.pull-right{display:none}} @media (max-width: 777px) {.col-xs-6{width:33.333%}} @media (max-width: 600px) {.col-xs-6{width:50%}} @media (max-width: 578px) {#addCategory{display:none}} @media (max-width: 500px) {.col-xs-10{padding:0px;}} @media (max-width: 456px) {#moveImage{display:none}} @media (max-width: 350px) {#delImage{display:none}} </style> <div class="panel panel-default panel-intro"> <div class="panel-body"> <div id="myTabContent" class="tab-content"> <div class="tab-pane fade active in" id="one"> <div class="widget-body no-padding col-sm-2 col-md-2 col-xs-2"> <div class="list-group filter-type" style="margin-top:-3px;"> <a href="javascript:;" data-value="" style="margin-bottom:15px;" class="list-group-item active">全部</a> {foreach name="categoryList" id="item"} <a href="javascript:;" style="margin-bottom:15px;" data-value="{$key}" class="list-group-item">{$item}</a> {/foreach} </div> </div> <div class="fixed-table-toolbar col-sm-10 col-md-10 col-xs-10" > <div class="bs-bars pull-left toolbar" id="toolbar"> <a href="javascript:;" class="btn btn-primary btn-refresh" style="margin-left:20px" title="刷新"><i class="fa fa-refresh"></i> </a> <button class="btn btn-default dropdown-toggle" type="button" id="moveImage" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">移动至 <span class="caret"></span> </button> <ul class="dropdown-menu" aria-labelledby="moveImage"> {foreach name="categoryList" id="item"} <li><a href="javascript:;" data-value="{$key}">{$item}</a></li> {/foreach} </ul> <button class="btn btn-success" id="addCategory" style="position:relative;right:0px;top:-0px;">分类管理</button> <button class="btn btn-danger" id="delImage" style="position:relative;right:0px;top:-0px;">删除图片</button> <input type="hidden" name="multiple" id="multiple" value="{$multiple}"> <button type="button" id="faupload-images" class="btn btn-info faupload" data-multiple="true" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" style="position:relative;right:0px;top:-0px;"> <i class="fa fa-upload"></i> 上传图片 </button> <div class="input-group pull-right" style="width:180px;margin-right:9px"> <input class="form-control" name="filename" id="filename" type="text" placeholder="请输入文件名搜索"> <span class="input-group-addon"><i class="glyphicon glyphicon-search" style="cursor:pointer"></i></span> </div> </div> <table id="table" class="table table-striped table-bordered table-hover table-nowrap" data-search="false" data-show-toggle="false" data-show-columns="false" data-show-export="false" data-common-search="false" width="100%"> </table> </div> </div> </div> </div> </div> <script id="itemtpl" type="text/html"> <div class="col-lg-2 col-md-2 col-sm-3 col-xs-6" style="flex-direction:inherit"> <div class="thumbnail" title="<%=item.filesize%><%=item.filename%>"> <img class="picture" src="<%=item.fullurl%>" data-src="<%=item.url%>" onerror="this.src='{$domain}/ajax/icon?suffix=FAIL';this.onerror=null;" style="width:150px;height:150px;object-fit: cover;" alt="<%=item.title%>"> <input type="checkbox" value="<%=item.id%>" name="checkbox" style="display:none"> <div class="caption"> <h4><%=item.filename?item.filename.substring(0,8):'无'%></h4> </div> <div class="mask" name="mask" data-id="<%=item.id%>" data-select="0"> <img src="/assets/img/attach_select.png" class="attach_select_image"> </div> </div> </div> </script>