mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-21 20:47:08 -05:00
Update project-list list to a table and show last updated user
This commit is contained in:
parent
ab10336110
commit
c072961183
7 changed files with 144 additions and 138 deletions
|
@ -1,7 +1,4 @@
|
|||
- var titleClasses = settings.overleaf ? "col-xs-6 col-sm-4 col-md-6" : "col-xs-6"
|
||||
- var lastUpdatedClasses = settings.overleaf ? " col-xs-4 col-sm-3 col-md-2" : "col-xs-4"
|
||||
|
||||
div(class=titleClasses)
|
||||
td.selectProject
|
||||
input.select-item(
|
||||
select-individual,
|
||||
type="checkbox",
|
||||
|
@ -10,29 +7,29 @@ div(class=titleClasses)
|
|||
stop-propagation="click"
|
||||
aria-label=translate('select_project') + " '{{ project.name }}'"
|
||||
)
|
||||
span
|
||||
a.projectName(
|
||||
ng-href="{{projectLink(project)}}"
|
||||
td.projectName
|
||||
a.projectName(
|
||||
ng-href="{{projectLink(project)}}"
|
||||
stop-propagation="click"
|
||||
) {{project.name}}
|
||||
span(
|
||||
ng-controller="TagListController"
|
||||
)
|
||||
.tag-label(
|
||||
ng-repeat='tag in project.tags'
|
||||
stop-propagation="click"
|
||||
) {{project.name}}
|
||||
span(
|
||||
ng-controller="TagListController"
|
||||
)
|
||||
.tag-label(
|
||||
ng-repeat='tag in project.tags'
|
||||
stop-propagation="click"
|
||||
)
|
||||
a.label.label-default.tag-label-name(
|
||||
href,
|
||||
ng-click="selectTag(tag)"
|
||||
) {{tag.name}}
|
||||
a.label.label-default.tag-label-remove(
|
||||
href
|
||||
ng-click="removeProjectFromTag(project, tag)"
|
||||
) ×
|
||||
a.label.label-default.tag-label-name(
|
||||
href,
|
||||
ng-click="selectTag(tag)"
|
||||
) {{tag.name}}
|
||||
a.label.label-default.tag-label-remove(
|
||||
href
|
||||
ng-click="removeProjectFromTag(project, tag)"
|
||||
) ×
|
||||
|
||||
.col-xs-2
|
||||
span.owner {{ownerName()}}
|
||||
td
|
||||
span.owner {{userDisplayName(project.owner)}}
|
||||
span(ng-if="isLinkSharingProject(project)")
|
||||
|
|
||||
i.fa.fa-link.small(
|
||||
|
@ -41,64 +38,52 @@ div(class=titleClasses)
|
|||
tooltip-append-to-body="true"
|
||||
)
|
||||
|
||||
div(class=lastUpdatedClasses)
|
||||
if settings.overleaf
|
||||
span.last-modified(tooltip="{{project.lastUpdated | formatDate}}") {{project.lastUpdated | fromNowDate}}
|
||||
else
|
||||
span.last-modified {{project.lastUpdated | formatDate}}
|
||||
td
|
||||
span.last-modified(tooltip="{{project.lastUpdated | formatDate}}")
|
||||
| {{project.lastUpdated | fromNowDate}}
|
||||
span(ng-show='project.lastUpdatedBy')
|
||||
|
|
||||
| by {{userDisplayName(project.lastUpdatedBy)}}
|
||||
|
||||
if settings.overleaf
|
||||
.hidden-xs.col-sm-3.col-md-2.action-btn-row
|
||||
div(
|
||||
ng-if="!project.isTableActionInflight"
|
||||
td.text-right
|
||||
div(
|
||||
ng-if="!project.isTableActionInflight"
|
||||
)
|
||||
button.btn.btn-link.action-btn(
|
||||
tooltip=translate('copy'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="clone($event)"
|
||||
)
|
||||
button.btn.btn-link.action-btn(
|
||||
tooltip=translate('copy'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="clone($event)"
|
||||
)
|
||||
i.icon.fa.fa-files-o
|
||||
button.btn.btn-link.action-btn(
|
||||
tooltip=translate('download'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="download($event)"
|
||||
)
|
||||
i.icon.fa.fa-cloud-download
|
||||
button.btn.btn-link.action-btn(
|
||||
ng-if="!project.archived && isOwner()"
|
||||
tooltip=translate('archive'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="archiveOrLeave($event)"
|
||||
)
|
||||
i.icon.fa.fa-inbox
|
||||
button.btn.btn-link.action-btn(
|
||||
ng-if="!project.archived && !isOwner()"
|
||||
tooltip=translate('leave'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="archiveOrLeave($event)"
|
||||
)
|
||||
i.icon.fa.fa-sign-out
|
||||
button.btn.btn-link.action-btn(
|
||||
ng-if="project.archived"
|
||||
tooltip=translate('unarchive'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="restore($event)"
|
||||
)
|
||||
i.icon.fa.fa-reply
|
||||
button.btn.btn-link.action-btn(
|
||||
ng-if="project.archived && isOwner()"
|
||||
tooltip=translate('delete_forever'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="deleteProject($event)"
|
||||
)
|
||||
i.icon.fa.fa-trash
|
||||
div(
|
||||
ng-if="project.isTableActionInflight"
|
||||
i.icon.fa.fa-files-o
|
||||
button.btn.btn-link.action-btn(
|
||||
tooltip=translate('download'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="download($event)"
|
||||
)
|
||||
i.fa.fa-spinner.fa-spin
|
||||
i.icon.fa.fa-cloud-download
|
||||
button.btn.btn-link.action-btn(
|
||||
ng-if="!project.archived && isOwner()"
|
||||
tooltip=translate('archive'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="archiveOrLeave($event)"
|
||||
)
|
||||
i.icon.fa.fa-inbox
|
||||
button.btn.btn-link.action-btn(
|
||||
ng-if="!project.archived && !isOwner()"
|
||||
tooltip=translate('leave'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="archiveOrLeave($event)"
|
||||
)
|
||||
i.icon.fa.fa-sign-out
|
||||
button.btn.btn-link.action-btn(
|
||||
ng-if="project.archived"
|
||||
tooltip=translate('unarchive'),
|
||||
tooltip-placement="top",
|
||||
tooltip-append-to-body="true",
|
||||
ng-click="restore($event)"
|
||||
)
|
||||
i.icon.fa.fa-reply
|
||||
|
|
|
@ -123,54 +123,44 @@
|
|||
|
||||
.col-xs-12
|
||||
.card.card-thin.project-list-card
|
||||
ul.list-unstyled.project-list.structured-list(
|
||||
select-all-list,
|
||||
ng-if="projects.length > 0",
|
||||
max-height="projectListHeight - 25",
|
||||
ng-cloak
|
||||
)
|
||||
li.container-fluid
|
||||
.row
|
||||
- var titleClasses = settings.overleaf ? " col-xs-6 col-sm-4 col-md-6" : "col-xs-6"
|
||||
- var lastUpdatedClasses = settings.overleaf ? " col-xs-4 col-sm-3 col-md-2" : "col-xs-4"
|
||||
|
||||
div(class=titleClasses)
|
||||
input.select-all(
|
||||
select-all,
|
||||
type="checkbox"
|
||||
aria-label=translate('select_all_projects')
|
||||
)
|
||||
span.header.clickable(ng-click="changePredicate('name')") #{translate("title")}
|
||||
i.tablesort.fa(ng-class="getSortIconClass('name')")
|
||||
.col-xs-2
|
||||
span.header.clickable(ng-click="changePredicate('accessLevel')") #{translate("owner")}
|
||||
i.tablesort.fa(ng-class="getSortIconClass('accessLevel')")
|
||||
div(class=lastUpdatedClasses)
|
||||
span.header.clickable(ng-click="changePredicate('lastUpdated')") #{translate("last_modified")}
|
||||
i.tablesort.fa(ng-class="getSortIconClass('lastUpdated')")
|
||||
if settings.overleaf
|
||||
.hidden-xs.col-sm-3.col-md-2.action-btn-row-header
|
||||
span.header #{translate("actions")}
|
||||
li.project_entry.container-fluid(
|
||||
ng-repeat="project in visibleProjects | orderBy:predicate:reverse",
|
||||
ng-controller="ProjectListItemController"
|
||||
)
|
||||
.row(
|
||||
ng-if="!project.isV1Project"
|
||||
select-row
|
||||
)
|
||||
include ./item
|
||||
.row(
|
||||
ng-if="project.isV1Project"
|
||||
)
|
||||
include ./v1-item
|
||||
li(
|
||||
ng-if="visibleProjects.length == 0",
|
||||
.table-wrapper(max-height="projectListHeight - 25",)
|
||||
table.table.table-hover.project-list(
|
||||
select-all-list,
|
||||
ng-if="projects.length > 0",
|
||||
ng-cloak
|
||||
)
|
||||
.row
|
||||
.col-xs-12.text-centered
|
||||
small #{translate("no_projects")}
|
||||
thead
|
||||
tr
|
||||
th.selectProject
|
||||
input.select-all(
|
||||
select-all,
|
||||
type="checkbox"
|
||||
aria-label=translate('select_all_projects')
|
||||
)
|
||||
th.projectName
|
||||
span.header.clickable(ng-click="changePredicate('name')") #{translate("title")}
|
||||
i.tablesort.fa(ng-class="getSortIconClass('name')")
|
||||
th
|
||||
span.header.clickable(ng-click="changePredicate('accessLevel')") #{translate("owner")}
|
||||
i.tablesort.fa(ng-class="getSortIconClass('accessLevel')")
|
||||
th
|
||||
span.header.clickable(ng-click="changePredicate('lastUpdated')") #{translate("last_modified")}
|
||||
i.tablesort.fa(ng-class="getSortIconClass('lastUpdated')")
|
||||
if settings.overleaf
|
||||
th.text-right
|
||||
span.header #{translate("actions")}
|
||||
tbody
|
||||
tr.project_entry(
|
||||
ng-repeat="project in visibleProjects | orderBy:predicate:reverse",
|
||||
ng-controller="ProjectListItemController"
|
||||
)
|
||||
include ./item
|
||||
tr(
|
||||
ng-if="visibleProjects.length == 0",
|
||||
ng-cloak
|
||||
)
|
||||
td(colspan=5).text-center
|
||||
small #{translate("no_projects")}
|
||||
|
||||
div.welcome.text-centered(ng-if="projects.length == 0", ng-cloak)
|
||||
h2 #{translate("welcome_to_sl")}
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
) {{project.name}}
|
||||
|
||||
.col-xs-2
|
||||
span.owner {{ownerName()}}
|
||||
span.owner {{userDisplayName(project.owner)}}
|
||||
|
||||
.col-xs-4.col-sm-3.col-md-2
|
||||
span.last-modified(tooltip="{{project.lastUpdated | formatDate}}") {{project.lastUpdated | fromNowDate}}
|
|
@ -485,11 +485,11 @@ define [
|
|||
$scope.isLinkSharingProject = (project) ->
|
||||
return project.source == 'token'
|
||||
|
||||
$scope.ownerName = () ->
|
||||
if $scope.project.accessLevel == "owner"
|
||||
$scope.userDisplayName = (user) ->
|
||||
if user._id == window.user_id
|
||||
return "You"
|
||||
else if $scope.project.owner?
|
||||
return [$scope.project.owner.first_name, $scope.project.owner.last_name].filter((n) -> n?).join(" ")
|
||||
else if user?
|
||||
return [user.first_name, user.last_name].filter((n) -> n?).join(" ")
|
||||
else
|
||||
return "None"
|
||||
|
||||
|
|
|
@ -314,8 +314,38 @@ ul.structured-list {
|
|||
padding: 0 (@line-height-computed / 4);
|
||||
}
|
||||
|
||||
ul.project-list {
|
||||
li {
|
||||
.table-wrapper {
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
table.project-list {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
|
||||
th when (@is-overleaf = true) {
|
||||
font-weight: 600;
|
||||
}
|
||||
th when (@is-overleaf = false) {
|
||||
text-transform: uppercase;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
// thead > tr > th {
|
||||
// padding-top: @line-height-computed / 8;
|
||||
// }
|
||||
|
||||
td {
|
||||
@media (min-width: @screen-md-min) {
|
||||
white-space: nowrap;
|
||||
}
|
||||
&.projectName {
|
||||
white-space: normal;
|
||||
width: 50%;
|
||||
}
|
||||
&.selectProject {
|
||||
width: 1%;
|
||||
}
|
||||
|
||||
.last-modified when (@is-overleaf = false) {
|
||||
font-size: .8rem;
|
||||
}
|
||||
|
@ -325,12 +355,13 @@ ul.project-list {
|
|||
.owner when (@is-overleaf = false) {
|
||||
margin-right: 0;
|
||||
}
|
||||
.projectName {
|
||||
a.projectName {
|
||||
margin-right: @line-height-computed / 4;
|
||||
padding: 0;
|
||||
vertical-align: inherit;
|
||||
white-space: normal;
|
||||
text-align: left;
|
||||
color: @structured-list-link-color;
|
||||
}
|
||||
|
||||
.tag-label {
|
||||
|
|
|
@ -34,7 +34,7 @@ th {
|
|||
// Bottom align for column headings
|
||||
> thead > tr > th {
|
||||
vertical-align: bottom;
|
||||
border-bottom: 2px solid @table-border-color;
|
||||
border-bottom: 1px solid @table-border-color;
|
||||
}
|
||||
// Remove top border from thead by default
|
||||
> caption + thead,
|
||||
|
|
|
@ -110,7 +110,7 @@
|
|||
//## Customizes the `.table` component with basic values, each used across all table variations.
|
||||
|
||||
//** Padding for `<th>`s and `<td>`s.
|
||||
@table-cell-padding: 8px;
|
||||
@table-cell-padding: @line-height-computed / 4;
|
||||
//** Padding for cells in `.table-condensed`.
|
||||
@table-condensed-cell-padding: 5px;
|
||||
|
||||
|
|
Loading…
Reference in a new issue