Refactoring admin project values us statuses
Alejandro Alonso
parent
4003e1cb04
commit
74aba3394d
|
|
@ -31,10 +31,10 @@ bindOnce = @.taiga.bindOnce
|
|||
module = angular.module("taigaAdmin")
|
||||
|
||||
#############################################################################
|
||||
## Project Values Controller
|
||||
## Project values status Controller
|
||||
#############################################################################
|
||||
|
||||
class ProjectValuesController extends mixOf(taiga.Controller, taiga.PageMixin)
|
||||
class ProjectValuesStatusController extends mixOf(taiga.Controller, taiga.PageMixin)
|
||||
@.$inject = [
|
||||
"$scope",
|
||||
"$rootScope",
|
||||
|
|
@ -54,17 +54,18 @@ class ProjectValuesController extends mixOf(taiga.Controller, taiga.PageMixin)
|
|||
promise.then null, ->
|
||||
console.log "FAIL" #TODO
|
||||
|
||||
@scope.$on("admin:project-values:us-status:move", @.moveUsStatus)
|
||||
@scope.$on("admin:project-values:status:move", @.moveStatus)
|
||||
|
||||
loadProject: ->
|
||||
return @rs.projects.get(@scope.projectId).then (project) =>
|
||||
@scope.project = project
|
||||
return project
|
||||
|
||||
loadUsStatus: =>
|
||||
return @rs.userstories.listStatuses(@scope.projectId).then (usStatuses) =>
|
||||
@scope.usStatuses = usStatuses
|
||||
@scope.maxUsStatusOrder = _.max(usStatuses, "order").order
|
||||
loadStatus: =>
|
||||
#TODO:
|
||||
return @rs[@scope.resource].listStatuses(@scope.projectId).then (statuses) =>
|
||||
@scope.statuses = statuses
|
||||
@scope.maxStatusOrder = _.max(statuses, "order").order
|
||||
|
||||
loadInitialData: ->
|
||||
promise = @repo.resolve({pslug: @params.pslug}).then (data) =>
|
||||
|
|
@ -73,26 +74,26 @@ class ProjectValuesController extends mixOf(taiga.Controller, taiga.PageMixin)
|
|||
|
||||
return promise.then( => @q.all([
|
||||
@.loadProject(),
|
||||
@.loadUsStatus(),
|
||||
@.loadStatus(),
|
||||
]))
|
||||
|
||||
moveUsStatus: (ctx, itemUsStatus, itemIndex) =>
|
||||
usStatuses = @scope.usStatuses
|
||||
r = usStatuses.indexOf(itemUsStatus)
|
||||
usStatuses.splice(r, 1)
|
||||
usStatuses.splice(itemIndex, 0, itemUsStatus)
|
||||
_.each usStatuses, (usStatus, index) ->
|
||||
moveStatus: (ctx, itemStatus, itemIndex) =>
|
||||
statuses = @scope.statuses
|
||||
r = statuses.indexOf(itemStatus)
|
||||
statuses.splice(r, 1)
|
||||
statuses.splice(itemIndex, 0, itemStatus)
|
||||
_.each statuses, (usStatus, index) ->
|
||||
usStatus.order = index
|
||||
|
||||
@repo.saveAll(usStatuses)
|
||||
@repo.saveAll(statuses)
|
||||
|
||||
module.controller("ProjectValuesController", ProjectValuesController)
|
||||
module.controller("ProjectValuesStatusController", ProjectValuesStatusController)
|
||||
|
||||
#############################################################################
|
||||
## Project US Values Directive
|
||||
## Project values status directive
|
||||
#############################################################################
|
||||
|
||||
ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
||||
ProjectStatusDirective = ($log, $repo, $confirm, $location) ->
|
||||
|
||||
#########################
|
||||
## Drag & Drop Link
|
||||
|
|
@ -121,9 +122,9 @@ ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
|||
tdom.on "sortstop", (event, ui) ->
|
||||
parentEl = ui.item.parent()
|
||||
itemEl = ui.item
|
||||
itemUsStatus = itemEl.scope().status
|
||||
itemStatus = itemEl.scope().status
|
||||
itemIndex = itemEl.index()
|
||||
$scope.$broadcast("admin:project-values:us-status:move", itemUsStatus, itemIndex)
|
||||
$scope.$broadcast("admin:project-values:status:move", itemStatus, itemIndex)
|
||||
|
||||
$scope.$on "$destroy", ->
|
||||
$el.off()
|
||||
|
|
@ -134,14 +135,15 @@ ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
|||
|
||||
linkStatus = ($scope, $el, $attrs) ->
|
||||
$ctrl = $el.controller()
|
||||
statusType = $attrs.type
|
||||
|
||||
initializeNewUs = ->
|
||||
$scope.newUs = {
|
||||
initializeNewStatus = ->
|
||||
$scope.newStatus = {
|
||||
"name": ""
|
||||
"is_closed": false
|
||||
}
|
||||
|
||||
initializeNewUs()
|
||||
initializeNewStatus()
|
||||
submit = =>
|
||||
promise = $repo.save($scope.project)
|
||||
promise.then ->
|
||||
|
|
@ -161,30 +163,30 @@ ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
|||
|
||||
$el.on "click", ".show-add-new", (event) ->
|
||||
event.preventDefault()
|
||||
$el.find(".new-us-status").css('display': 'flex')
|
||||
$el.find(".new-status").css('display': 'flex')
|
||||
|
||||
$el.on "click", ".add-new", (event) ->
|
||||
event.preventDefault()
|
||||
form = $el.find(".new-us-status").parents("form").checksley()
|
||||
form = $el.find(".new-status").parents("form").checksley()
|
||||
return if not form.validate()
|
||||
|
||||
$scope.newUs.project = $scope.project.id
|
||||
$scope.newUs.order = $scope.maxUsStatusOrder + 1
|
||||
promise = $repo.create("userstory-statuses", $scope.newUs)
|
||||
$scope.newStatus.project = $scope.project.id
|
||||
$scope.newStatus.order = $scope.maxStatusOrder + 1
|
||||
promise = $repo.create(statusType, $scope.newStatus)
|
||||
promise.then =>
|
||||
$ctrl.loadUsStatus()
|
||||
$el.find(".new-us-status").hide()
|
||||
initializeNewUs()
|
||||
$ctrl.loadStatus()
|
||||
$el.find(".new-status").hide()
|
||||
initializeNewStatus()
|
||||
|
||||
promise.then null, (data) ->
|
||||
form.setErrors(data)
|
||||
|
||||
$el.on "click", ".delete-new", (event) ->
|
||||
event.preventDefault()
|
||||
$el.find(".new-us-status").hide()
|
||||
initializeNewUs()
|
||||
$el.find(".new-status").hide()
|
||||
initializeNewStatus()
|
||||
|
||||
$el.on "click", ".edit-us-status", (event) ->
|
||||
$el.on "click", ".edit-status", (event) ->
|
||||
event.preventDefault()
|
||||
target = angular.element(event.currentTarget)
|
||||
|
||||
|
|
@ -215,42 +217,17 @@ ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
|||
row.hide()
|
||||
row.siblings(".visualization").css("display": "flex")
|
||||
|
||||
$el.on "click", ".delete-us-status", (event) ->
|
||||
$el.on "click", ".delete-status", (event) ->
|
||||
event.preventDefault()
|
||||
target = angular.element(event.currentTarget)
|
||||
status = target.scope().status
|
||||
|
||||
#TODO: i18n
|
||||
title = "Delete User Story status"
|
||||
title = "Delete status"
|
||||
subtitle = status.name
|
||||
$confirm.ask(title, subtitle).then =>
|
||||
$repo.remove(status).then =>
|
||||
$ctrl.loadUsStatus()
|
||||
|
||||
$el.on "click", ".edition .current-color", (event) ->
|
||||
# Showing the color selector
|
||||
event.preventDefault()
|
||||
event.stopPropagation()
|
||||
target = angular.element(event.currentTarget)
|
||||
status = target.scope().status
|
||||
$el.find(".select-color").hide()
|
||||
target.siblings(".select-color").show()
|
||||
# Hide when click outside
|
||||
body = angular.element("body")
|
||||
body.on "click", (event) =>
|
||||
if angular.element(event.target).parent(".select-color").length == 0
|
||||
$el.find(".select-color").hide()
|
||||
body.ubind("click")
|
||||
|
||||
|
||||
$el.on "click", ".select-color .color", (event) ->
|
||||
# Selecting one color on color selector
|
||||
event.preventDefault()
|
||||
target = angular.element(event.currentTarget)
|
||||
status = target.scope().status
|
||||
$scope.$apply ->
|
||||
status.color = target.data("color")
|
||||
$el.find(".select-color").hide()
|
||||
$ctrl.loadStatus()
|
||||
|
||||
link = ($scope, $el, $attrs) ->
|
||||
linkDragAndDrop($scope, $el, $attrs)
|
||||
|
|
@ -261,5 +238,50 @@ ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
|||
|
||||
return {link:link}
|
||||
|
||||
module.directive("tgProjectStatus", ["$log", "$tgRepo", "$tgConfirm", "$tgLocation", ProjectStatusDirective])
|
||||
|
||||
module.directive("tgProjectUsStatus", ["$log", "$tgRepo", "$tgConfirm", "$tgLocation", ProjectUsStatusDirective])
|
||||
|
||||
#############################################################################
|
||||
## Color selection directive
|
||||
#############################################################################
|
||||
|
||||
ColorSelectionDirective = () ->
|
||||
|
||||
#########################
|
||||
## Color selection Link
|
||||
#########################
|
||||
|
||||
link = ($scope, $el, $attrs, $model) ->
|
||||
$ctrl = $el.controller()
|
||||
|
||||
$el.on "click", ".current-color", (event) ->
|
||||
# Showing the color selector
|
||||
event.preventDefault()
|
||||
event.stopPropagation()
|
||||
target = angular.element(event.currentTarget)
|
||||
$el.find(".select-color").hide()
|
||||
target.siblings(".select-color").show()
|
||||
# Hide when click outside
|
||||
body = angular.element("body")
|
||||
body.on "click", (event) =>
|
||||
if angular.element(event.target).parent(".select-color").length == 0
|
||||
$el.find(".select-color").hide()
|
||||
body.unbind("click")
|
||||
|
||||
$el.on "click", ".select-color .color", (event) ->
|
||||
# Selecting one color on color selector
|
||||
event.preventDefault()
|
||||
target = angular.element(event.currentTarget)
|
||||
$scope.$apply ->
|
||||
$model.$modelValue.color = target.data("color")
|
||||
$el.find(".select-color").hide()
|
||||
|
||||
$scope.$on "$destroy", ->
|
||||
$el.off()
|
||||
|
||||
return {
|
||||
link: link
|
||||
require:"ngModel"
|
||||
}
|
||||
|
||||
module.directive("tgColorSelection", ColorSelectionDirective)
|
||||
|
|
|
|||
|
|
@ -4,8 +4,8 @@ block head
|
|||
title Taiga Project management web application with scrum in mind!
|
||||
|
||||
block content
|
||||
div.wrapper(tg-project-us-status, ng-controller="ProjectValuesController as ctrl",
|
||||
ng-init="section='admin'")
|
||||
div.wrapper(tg-project-status, ng-controller="ProjectValuesStatusController as ctrl",
|
||||
ng-init="section='admin'; resource='userstories'", type="userstory-statuses")
|
||||
sidebar.menu-secondary.sidebar(tg-admin-navigation="project-values")
|
||||
include views/modules/admin-menu
|
||||
|
||||
|
|
@ -20,4 +20,4 @@ block content
|
|||
a.button.button-green.show-add-new(href="", title="Add New")
|
||||
span Add new status
|
||||
|
||||
include views/modules/admin/project-us-status
|
||||
include views/modules/admin/project-status
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ section.colors-table
|
|||
|
||||
div.table-main
|
||||
form.sortable
|
||||
div(ng-repeat="status in usStatuses")
|
||||
div(ng-repeat="status in statuses")
|
||||
div.row.table-main.visualization
|
||||
span.icon.icon-drag-v
|
||||
div.color-column
|
||||
|
|
@ -16,15 +16,16 @@ section.colors-table
|
|||
div.status-name
|
||||
span {{ status.name }}
|
||||
div.is-closed-column
|
||||
span {{ status.is_closed|yesNo }}
|
||||
div.icon.icon-check-square(ng-show="status.is_closed")
|
||||
div.options-column
|
||||
a.edit-us-status.icon.icon-edit(href="", title="Edit value")
|
||||
a.delete-us-status.icon.icon-delete(href="", title="Delete value")
|
||||
a.edit-status.icon.icon-edit(href="", title="Edit value")
|
||||
a.delete-status.icon.icon-delete(href="", title="Delete value")
|
||||
|
||||
div.row.table-main.edition.hidden
|
||||
div.color-column
|
||||
div.color-column(tg-color-selection, ng-model="status")
|
||||
div.current-color(style="background: {{ status.color }}")
|
||||
include ../../components/select-color
|
||||
|
||||
div.status-name
|
||||
input(name="name", type="text", placeholder="Write a name for the new status", ng-model="status.name", data-required="true", data-maxlength="255")
|
||||
div.is-closed-column
|
||||
|
|
@ -34,14 +35,15 @@ section.colors-table
|
|||
a.cancel.icon.icon-delete(href="", title="Delete")
|
||||
|
||||
form
|
||||
div.row.table-main.new-us-status.hidden
|
||||
div.color-column
|
||||
div.current-color(style="background: {{ status.color }}")
|
||||
div.row.table-main.new-status.hidden
|
||||
div.color-column(tg-color-selection, ng-model="newStatus")
|
||||
div.current-color(style="background: {{ newStatus.color }}")
|
||||
include ../../components/select-color
|
||||
|
||||
div.status-name
|
||||
input(name="name", type="text", placeholder="Write a name for the new status", ng-model="newUs.name", data-required="true", data-maxlength="255")
|
||||
input(name="name", type="text", placeholder="Write a name for the new status", ng-model="newStatus.name", data-required="true", data-maxlength="255")
|
||||
div.is-closed-column
|
||||
select(name="is_closed", ng-model="newUs.is_closed", ng-options="e.id as e.name for e in [{'id':true, 'name':'Yes'},{'id':false, 'name': 'No'}]", data-required="true")
|
||||
select(name="is_closed", ng-model="newStatus.is_closed", ng-options="e.id as e.name for e in [{'id':true, 'name':'Yes'},{'id':false, 'name': 'No'}]", data-required="true")
|
||||
div.options-column
|
||||
a.add-new.icon.icon-floppy(href="", title="Add")
|
||||
a.delete-new.icon.icon-delete(href="", title="Delete")
|
||||
|
|
@ -13,7 +13,8 @@
|
|||
.row {
|
||||
@include table-flex(stretch, center, flex, row, wrap, center);
|
||||
padding: 1rem;
|
||||
&.edition {
|
||||
&.edition,
|
||||
&.new-status {
|
||||
padding-left: 50px;
|
||||
}
|
||||
&:hover {
|
||||
|
|
|
|||
Loading…
Reference in New Issue