taiga
/
taiga-front
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add some loading spinners in Admin > Attributes > Tags

stable
David Barragán Merino 2016-09-29 16:45:13 +02:00
parent ad26894225
commit 2dc38b516d
3 changed files with 60 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
app/coffee/modules/admin/project-values.coffee
View File

@ -724,8 +724,8 @@ class ProjectTagsController extends taiga.Controller
loadTags: => loadTags: =>
return @rs.projects.tagsColors(@scope.projectId).then (tags) => return @rs.projects.tagsColors(@scope.projectId).then (tags) =>
@scope.projectTagsAll = _.map(tags.getAttrs(), (color, name) => @scope.projectTagsAll = _.map tags.getAttrs(), (color, name) =>
@model.make_model('tag', {name: name, color: color})) @model.make_model('tag', {name: name, color: color})
@.filterAndSortTags() @.filterAndSortTags()
@.loading = false @.loading = false
@ -735,17 +735,20 @@ class ProjectTagsController extends taiga.Controller
(tag) => tag.name.indexOf(@scope.tagsFilter.name) != -1 (tag) => tag.name.indexOf(@scope.tagsFilter.name) != -1
) )
deleteTag: (tag) =>
return @rs.projects.deleteTag(@scope.projectId, tag)
createTag: (tag, color) => createTag: (tag, color) =>
return @rs.projects.createTag(@scope.projectId, tag, color) return @rs.projects.createTag(@scope.projectId, tag, color)
editTag: (from_tag, to_tag, color) => editTag: (from_tag, to_tag, color) =>
if from_tag == to_tag if from_tag == to_tag
to_tag = null to_tag = null
return @rs.projects.editTag(@scope.projectId, from_tag, to_tag, color) return @rs.projects.editTag(@scope.projectId, from_tag, to_tag, color)
deleteTag: (tag) =>
@scope.loadingDelete = true
return @rs.projects.deleteTag(@scope.projectId, tag).finally =>
@scope.loadingDelete = false
startMixingTags: (tag) => startMixingTags: (tag) =>
@scope.mixingTags.toTag = tag.name @scope.mixingTags.toTag = tag.name
@ -760,9 +763,13 @@ class ProjectTagsController extends taiga.Controller
confirmMixingTags: () => confirmMixingTags: () =>
toTag = @scope.mixingTags.toTag toTag = @scope.mixingTags.toTag
fromTags = @scope.mixingTags.fromTags fromTags = @scope.mixingTags.fromTags
@rs.projects.mixTags(@scope.projectId, toTag, fromTags).then => @scope.loadingMixing = true
@.cancelMixingTags() @rs.projects.mixTags(@scope.projectId, toTag, fromTags)
@.loadTags() .then =>
@.cancelMixingTags()
@.loadTags()
.finally =>
@scope.loadingMixing = false
cancelMixingTags: () => cancelMixingTags: () =>
@scope.mixingTags.toTag = null @scope.mixingTags.toTag = null
@ -825,7 +832,7 @@ ProjectTagsDirective = ($log, $repo, $confirm, $location, animationFrame, $trans
if focus if focus
$el.find(".new-value input:visible").first().focus() $el.find(".new-value input:visible").first().focus()
saveValue = (target) -> saveValue = (target) =>
formEl = target.parents("form") formEl = target.parents("form")
form = formEl.checksley() form = formEl.checksley()
return if not form.validate() return if not form.validate()
@ -834,29 +841,35 @@ ProjectTagsDirective = ($log, $repo, $confirm, $location, animationFrame, $trans
originalTag = tag.clone() originalTag = tag.clone()
originalTag.revert() originalTag.revert()
$scope.loadingEdit = true
promise = $ctrl.editTag(originalTag.name, tag.name, tag.color) promise = $ctrl.editTag(originalTag.name, tag.name, tag.color)
promise.then => promise.then =>
$ctrl.loadTags() $ctrl.loadTags().then =>
row = target.parents(".row.table-main") row = target.parents(".row.table-main")
row.addClass("hidden") row.addClass("hidden")
row.siblings(".visualization").removeClass('hidden') $scope.loadingEdit = false
row.siblings(".visualization").removeClass('hidden')
promise.then null, (response) -> promise.then null, (response) ->
$scope.loadingEdit = false
form.setErrors(response.data) form.setErrors(response.data)
saveNewValue = (target) -> saveNewValue = (target) =>
formEl = target.parents("form") formEl = target.parents("form")
formEl = target formEl = target
form = formEl.checksley() form = formEl.checksley()
return if not form.validate() return if not form.validate()
$scope.loadingCreate = true
promise = $ctrl.createTag($scope.newValue.tag, $scope.newValue.color) promise = $ctrl.createTag($scope.newValue.tag, $scope.newValue.color)
promise.then (data) => promise.then (data) =>
target.addClass("hidden") $ctrl.loadTags().then =>
$ctrl.loadTags() $scope.loadingCreate = false
initializeNewValue() target.addClass("hidden")
initializeNewValue()
promise.then null, (response) -> promise.then null, (response) ->
$scope.loadingCreate = false
form.setErrors(response.data) form.setErrors(response.data)
cancel = (target) -> cancel = (target) ->

32
app/partials/includes/modules/admin/project-tags.jade
View File

@ -22,7 +22,7 @@ section
data-maxlength="255" data-maxlength="255"
) )
.options-column .options-column(tg-loading="loadingCreate")
a.add-new.e2e-save(href="") a.add-new.e2e-save(href="")
tg-svg( tg-svg(
title="{{'COMMON.ADD' | translate}}", title="{{'COMMON.ADD' | translate}}",
@ -103,7 +103,7 @@ section
title="{{'ADMIN.COMMON.TITLE_ACTION_EDIT_VALUE' | translate}}" title="{{'ADMIN.COMMON.TITLE_ACTION_EDIT_VALUE' | translate}}"
) )
a.delete-tag(href="") a.delete-tag(href="", tg-loading="loadingDelete")
tg-svg( tg-svg(
svg-icon="icon-trash" svg-icon="icon-trash"
title="{{'ADMIN.COMMON.TITLE_ACTION_DELETE_VALUE' | translate}}" title="{{'ADMIN.COMMON.TITLE_ACTION_DELETE_VALUE' | translate}}"
@ -127,7 +127,7 @@ section
data-maxlength="255" data-maxlength="255"
) )
.options-column .options-column(tg-loading="loadingEdit")
a.save.e2e-save(href="") a.save.e2e-save(href="")
tg-svg( tg-svg(
title="{{'COMMON.SAVE' | translate}}" title="{{'COMMON.SAVE' | translate}}"
@ -145,7 +145,9 @@ section
tg-bind-scope tg-bind-scope
) )
form(tg-bind-scope) form(tg-bind-scope)
.row.mixing-row.table-main.visualization(class="{{ ctrl.mixingClass(tag) }}") .row.mixing-row.table-main.visualization(
ng-class="ctrl.mixingClass(tag)"
)
.color-column .color-column
.current-color( .current-color(
ng-if="tag.color" ng-if="tag.color"
@ -158,25 +160,27 @@ section
.status-name .status-name
span(tg-bo-html="tag.name") span(tg-bo-html="tag.name")
.mixing-options-column .mixing-options-column(
ng-if="mixingTags.toTag === tag.name"
tg-loading="loadingMixing"
)
.mixing-help-text( .mixing-help-text(
ng-if="mixingTags.toTag === tag.name"
translate="ADMIN.PROJECT_VALUES_TAGS.MIXING_HELP_TEXT" translate="ADMIN.PROJECT_VALUES_TAGS.MIXING_HELP_TEXT"
) )
a.mixing-confirm.button-green( a.mixing-confirm.button-green(
href="" href=""
ng-if="mixingTags.toTag === tag.name && mixingTags.fromTags.length" ng-if="mixingTags.fromTags.length"
translate="ADMIN.PROJECT_VALUES_TAGS.MIXING_MERGE" translate="ADMIN.PROJECT_VALUES_TAGS.MIXING_MERGE"
) )
a.mixing-cancel.button-gray( a.mixing-cancel.button-gray(
href="" href=""
ng-if="mixingTags.toTag === tag.name"
translate="COMMON.CANCEL" translate="COMMON.CANCEL"
) )
span.mixing-selected(
ng-if="mixingTags.fromTags.indexOf(tag.name) !== -1" .mixing-options-column(
ng-if="mixingTags.fromTags.indexOf(tag.name) !== -1"
)
tg-svg.mixing-selected(
title="{{'ADMIN.PROJECT_VALUES_TAGS.SELECTED' | translate}}"
svg-icon="icon-merge"
) )
tg-svg(
title="{{'ADMIN.PROJECT_VALUES_TAGS.SELECTED' | translate}}"
svg-icon="icon-merge"
)

12
app/styles/layout/admin-project-tags.scss
View File

@ -17,6 +17,10 @@
} }
.options-column { .options-column {
display: flex; display: flex;
.loading-spinner {
margin-right: 1.2rem;
width: 1.2rem;
}
} }
.current-color { .current-color {
&.empty-color { &.empty-color {
@ -80,6 +84,10 @@
cursor: default; cursor: default;
} }
} }
.loading-spinner {
margin-right: 1.2rem;
width: 1.2rem;
}
} }
.mix-tags { .mix-tags {
position: relative; position: relative;
@ -94,6 +102,10 @@
} }
.mixing-options-column { .mixing-options-column {
text-align: right; text-align: right;
.loading-spinner {
margin-right: 1.2rem;
width: 1.2rem;
}
} }
.mixing-tags-from, .mixing-tags-from,
.mixing-tags-to { .mixing-tags-to {