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

View File

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

View File

@ -22,7 +22,7 @@ section
data-maxlength="255"
)
.options-column
.options-column(tg-loading="loadingCreate")
a.add-new.e2e-save(href="")
tg-svg(
title="{{'COMMON.ADD' | translate}}",
@ -103,7 +103,7 @@ section
title="{{'ADMIN.COMMON.TITLE_ACTION_EDIT_VALUE' | translate}}"
)
a.delete-tag(href="")
a.delete-tag(href="", tg-loading="loadingDelete")
tg-svg(
svg-icon="icon-trash"
title="{{'ADMIN.COMMON.TITLE_ACTION_DELETE_VALUE' | translate}}"
@ -127,7 +127,7 @@ section
data-maxlength="255"
)
.options-column
.options-column(tg-loading="loadingEdit")
a.save.e2e-save(href="")
tg-svg(
title="{{'COMMON.SAVE' | translate}}"
@ -145,7 +145,9 @@ section
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
.current-color(
ng-if="tag.color"
@ -158,25 +160,27 @@ section
.status-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(
ng-if="mixingTags.toTag === tag.name"
translate="ADMIN.PROJECT_VALUES_TAGS.MIXING_HELP_TEXT"
)
a.mixing-confirm.button-green(
href=""
ng-if="mixingTags.toTag === tag.name && mixingTags.fromTags.length"
ng-if="mixingTags.fromTags.length"
translate="ADMIN.PROJECT_VALUES_TAGS.MIXING_MERGE"
)
a.mixing-cancel.button-gray(
href=""
ng-if="mixingTags.toTag === tag.name"
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"
)

View File

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