mirror of
https://github.com/haiwen/seahub.git
synced 2025-08-02 07:47:32 +00:00
[dirent details] improvement; show more info for folders
This commit is contained in:
llj
parent
76d58cb025
commit
5d48dac96c
@ -2272,28 +2272,6 @@ button.sf-dropdown-toggle:focus {
|
||||
display:inline;
|
||||
margin-right:5px;
|
||||
}
|
||||
#dirent-details {
|
||||
width:320px;
|
||||
}
|
||||
.dirent-details-img-container {
|
||||
text-align:center;
|
||||
height:160px;
|
||||
padding:6px 0;
|
||||
}
|
||||
.dirent-details-img-container .thumbnail {
|
||||
max-width:calc(100% - 4px); /* `-4px` for full width thumbnail */
|
||||
max-height:100%;
|
||||
}
|
||||
.dirent-details-text-info-container {
|
||||
padding:10px 20px;
|
||||
}
|
||||
.dirent-details-text-info-container table {
|
||||
margin:0;
|
||||
}
|
||||
.dirent-details-text-info-container th,
|
||||
.dirent-details-text-info-container td {
|
||||
border:none;
|
||||
}
|
||||
.audit-item .audit-select-hidden {
|
||||
position:absolute;
|
||||
background:#fff;
|
||||
|
||||
@ -781,7 +781,7 @@
|
||||
</h3>
|
||||
</div>
|
||||
<div class="right-side-panel-con">
|
||||
<div class="dirent-details-img-container image-file-view">
|
||||
<div class="details-panel-img-container image-file-view">
|
||||
<span class="loading-icon"></span>
|
||||
<% if (thumbnail_url) { %>
|
||||
<img src="<%= thumbnail_url %>" class="thumbnail hide" alt="" />
|
||||
@ -790,18 +790,33 @@
|
||||
<% } %>
|
||||
</div>
|
||||
|
||||
<div class="dirent-details-text-info-container">
|
||||
<div class="details-panel-text-info-container">
|
||||
<table>
|
||||
<tr class="vh">
|
||||
<th width="35%"></th>
|
||||
<td width="65%"></td>
|
||||
</tr>
|
||||
|
||||
<% if (dirent.is_file) { %>
|
||||
<tr>
|
||||
<th>{% trans "Size" %}</th>
|
||||
<td><%= dirent.file_size %></td>
|
||||
</tr>
|
||||
<% } else { %>
|
||||
<tr>
|
||||
<th>{% trans "Folders" %}</th>
|
||||
<td class="dir-folder-counts"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>{% trans "Files" %}</th>
|
||||
<td class="dir-file-counts"><span class="loading-icon"></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>{% trans "Size" %}</th>
|
||||
<td class="dir-size"></td>
|
||||
</tr>
|
||||
<% } %>
|
||||
|
||||
<tr>
|
||||
<th>{% trans "Location" %}</th>
|
||||
<td><%- path %></td>
|
||||
|
||||
@ -73,7 +73,7 @@ define([
|
||||
this.listenTo(this.dir, 'reset', this.reset);
|
||||
|
||||
this.fileUploadView = new FileUploadView({dirView: this});
|
||||
this.direntDetailsView = new DirentDetailsView({dirView: this});
|
||||
this.direntDetailsView = new DirentDetailsView();
|
||||
|
||||
this.render();
|
||||
|
||||
|
||||
@ -8,11 +8,11 @@ define([
|
||||
|
||||
var View = Backbone.View.extend({
|
||||
id: 'dirent-details',
|
||||
className: 'right-side-panel hide', // `hide` is for 'clickItem' in `views/dir.js`
|
||||
className: 'details-panel right-side-panel',
|
||||
|
||||
template: _.template($('#dirent-details-tmpl').html()),
|
||||
|
||||
initialize: function(options) {
|
||||
initialize: function() {
|
||||
$("#main").append(this.$el);
|
||||
|
||||
var _this = this;
|
||||
@ -36,7 +36,7 @@ define([
|
||||
this.$el.html(this.template(this.data));
|
||||
|
||||
var _this = this;
|
||||
this.$('.dirent-details-img-container img').load(function() {
|
||||
this.$('.details-panel-img-container img').load(function() {
|
||||
_this.showImg();
|
||||
});
|
||||
this.$('.thumbnail').on('error', function() {
|
||||
@ -44,6 +44,17 @@ define([
|
||||
});
|
||||
},
|
||||
|
||||
update: function(part_data) {
|
||||
if (part_data.error) {
|
||||
this.$('.dir-folder-counts, .dir-file-counts, .dir-size')
|
||||
.html('<span class="error">' + gettext("Error") + '</span>');
|
||||
} else {
|
||||
this.$('.dir-folder-counts').html(part_data.dir_count);
|
||||
this.$('.dir-file-counts').html(part_data.file_count);
|
||||
this.$('.dir-size').html(part_data.size);
|
||||
}
|
||||
},
|
||||
|
||||
setConMaxHeight: function() {
|
||||
this.$('.right-side-panel-con').css({
|
||||
'height': $(window).height() - // this.$el `position:fixed; top:0;`
|
||||
@ -52,7 +63,7 @@ define([
|
||||
},
|
||||
|
||||
hide: function() {
|
||||
this.$el.css({'right': '-400px'}).hide();
|
||||
this.$el.css({'right': '-320px'});
|
||||
},
|
||||
|
||||
close: function() {
|
||||
@ -63,12 +74,12 @@ define([
|
||||
show: function(options) {
|
||||
this.data = options;
|
||||
this.render();
|
||||
this.$el.css({'right': '0px'}).show();
|
||||
this.$el.css({'right': '0px'});
|
||||
this.setConMaxHeight();
|
||||
},
|
||||
|
||||
showImg: function() {
|
||||
var $container = this.$('.dirent-details-img-container');
|
||||
var $container = this.$('.details-panel-img-container');
|
||||
$('.loading-icon', $container).hide();
|
||||
$('img', $container).show();
|
||||
},
|
||||
|
||||
@ -301,7 +301,34 @@ define([
|
||||
});
|
||||
}
|
||||
|
||||
this.dirView.direntDetailsView.show(data);
|
||||
var detailsView = this.dirView.direntDetailsView;
|
||||
detailsView.show(data);
|
||||
|
||||
// fetch other data for dir
|
||||
if (this.model.get('is_dir')) {
|
||||
$.ajax({
|
||||
url: Common.getUrl({
|
||||
'name': 'dir-details',
|
||||
'repo_id': this.dir.repo_id
|
||||
}),
|
||||
cache: false,
|
||||
data: {
|
||||
'path': Common.pathJoin([this.dir.path, this.model.get('obj_name')])
|
||||
},
|
||||
dataType: 'json',
|
||||
success: function(data) {
|
||||
detailsView.update({
|
||||
'dir_count': data.dir_count,
|
||||
'file_count': data.file_count,
|
||||
'size': Common.fileSizeFormat(data.size, 1)
|
||||
});
|
||||
},
|
||||
error: function() {
|
||||
detailsView.update({'error': true});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
this.closeMenu();
|
||||
return false;
|
||||
},
|
||||
|
||||
@ -114,7 +114,7 @@ define([
|
||||
clickItem: function(e) {
|
||||
var target = e.target || event.srcElement;
|
||||
if (this.$('td').is(target) &&
|
||||
$('#dirent-details').is(':visible')) { // after `#dirent-details` is shown
|
||||
$('#dirent-details').css('right') == '0px') { // after `#dirent-details` is shown
|
||||
this.viewDetails();
|
||||
}
|
||||
},
|
||||
@ -583,7 +583,34 @@ define([
|
||||
});
|
||||
}
|
||||
|
||||
this.dirView.direntDetailsView.show(data);
|
||||
var detailsView = this.dirView.direntDetailsView;
|
||||
detailsView.show(data);
|
||||
|
||||
// fetch other data for dir
|
||||
if (this.model.get('is_dir')) {
|
||||
$.ajax({
|
||||
url: Common.getUrl({
|
||||
'name': 'dir-details',
|
||||
'repo_id': this.dir.repo_id
|
||||
}),
|
||||
cache: false,
|
||||
data: {
|
||||
'path': Common.pathJoin([this.dir.path, this.model.get('obj_name')])
|
||||
},
|
||||
dataType: 'json',
|
||||
success: function(data) {
|
||||
detailsView.update({
|
||||
'dir_count': data.dir_count,
|
||||
'file_count': data.file_count,
|
||||
'size': Common.fileSizeFormat(data.size, 1)
|
||||
});
|
||||
},
|
||||
error: function() {
|
||||
detailsView.update({'error': true});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
this._hideMenu();
|
||||
return false;
|
||||
},
|
||||
|
||||
@ -96,6 +96,8 @@ define([
|
||||
case 'cp_dirents': return siteRoot + 'ajax/repo/' + options.repo_id + '/dirents/copy/';
|
||||
case 'get_dirents': return siteRoot + 'ajax/repo/' + options.repo_id + '/dirents/';
|
||||
|
||||
case 'dir-details': return siteRoot + 'api/v2.1/repos/' + options.repo_id + '/dir/detail/';
|
||||
|
||||
// Repos
|
||||
case 'repos': return siteRoot + 'api2/repos/';
|
||||
case 'deleted_repos': return siteRoot + 'api/v2.1/deleted-repos/';
|
||||
|
||||
Loading…
Reference in New Issue
Block a user