Improving us statuses for admin
parent
0c01020eaa
commit
69da3f1703
|
@ -110,7 +110,7 @@ ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
|||
itemEl.remove()
|
||||
|
||||
tdom.sortable({
|
||||
handle: ".project-values-row.visualization",
|
||||
handle: ".row.table-main.visualization",
|
||||
dropOnEmpty: true
|
||||
connectWith: ".project-values-body"
|
||||
revert: 400
|
||||
|
@ -187,7 +187,7 @@ ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
|||
event.preventDefault()
|
||||
target = angular.element(event.currentTarget)
|
||||
|
||||
row = target.parents(".project-values-row")
|
||||
row = target.parents(".row.table-main")
|
||||
row.hide()
|
||||
row.siblings(".edition").css("display": "flex")
|
||||
|
||||
|
@ -200,7 +200,7 @@ ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
|||
status = target.scope().status
|
||||
promise = $repo.save(status)
|
||||
promise.then =>
|
||||
row = target.parents(".project-values-row")
|
||||
row = target.parents(".row.table-main")
|
||||
row.hide()
|
||||
row.siblings(".visualization").css("display": "flex")
|
||||
|
||||
|
@ -210,7 +210,7 @@ ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
|||
$el.on "click", ".cancel", (event) ->
|
||||
event.preventDefault()
|
||||
target = angular.element(event.currentTarget)
|
||||
row = target.parents(".project-values-row")
|
||||
row = target.parents(".row.table-main")
|
||||
row.hide()
|
||||
row.siblings(".visualization").css("display": "flex")
|
||||
|
||||
|
@ -226,6 +226,25 @@ ProjectUsStatusDirective = ($log, $repo, $confirm, $location) ->
|
|||
$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()
|
||||
#body = angular.element("body")
|
||||
#body.one "click", (event) ->
|
||||
# $el.find(".select-color").hide()
|
||||
|
||||
$el.on "click", ".select-color .color", (event) ->
|
||||
# Selecting one color on color selector
|
||||
event.preventDefault()
|
||||
target = angular.element(event.currentTarget)
|
||||
console.log "TODO", target.data("color")
|
||||
$el.find(".select-color").hide()
|
||||
|
||||
link = ($scope, $el, $attrs) ->
|
||||
linkDragAndDrop($scope, $el, $attrs)
|
||||
linkStatus($scope, $el, $attrs)
|
||||
|
|
|
@ -2,5 +2,5 @@ div.popover.select-color
|
|||
ul
|
||||
- for (var z = 0; z < 21; z++)
|
||||
li.color
|
||||
input(type="text", placeholder="personalized colors")
|
||||
div.selected-color(style="background-color: red")
|
||||
input(type="text", placeholder="personalized colors", ng-model="status.color")
|
||||
div.selected-color(style="background-color: {{ status.color }}")
|
||||
|
|
|
@ -1,40 +1,47 @@
|
|||
section.project-values-table
|
||||
div.project-values-header
|
||||
div.project-values-row
|
||||
div.project-values-name
|
||||
span Name
|
||||
div.project-values-isclosed
|
||||
span Is closed?
|
||||
div.project-values-settings
|
||||
section.colors-table
|
||||
div.table-header
|
||||
div.row
|
||||
div.color-column Color
|
||||
div.status-name Name
|
||||
div.is-closed-column Is closed?
|
||||
div.options-column
|
||||
|
||||
div.project-values-body
|
||||
div.table-main
|
||||
form.sortable
|
||||
div(ng-repeat="status in usStatuses")
|
||||
div.project-values-row.visualization
|
||||
div.row.table-main.visualization
|
||||
span.icon.icon-drag-v
|
||||
div.project-values-name
|
||||
div.color-column
|
||||
div.current-color(style="background: {{ status.color }}")
|
||||
div.status-name
|
||||
span {{ status.name }}
|
||||
div.project-values-isclosed
|
||||
div.is-closed-column
|
||||
span {{ status.is_closed|yesNo }}
|
||||
div.project-values-settings
|
||||
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")
|
||||
|
||||
div.project-values-row.edition.hidden
|
||||
div.project-values-name
|
||||
div.row.table-main.edition.hidden
|
||||
div.color-column
|
||||
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.project-values-isclosed
|
||||
div.is-closed-column
|
||||
select(name="is_closed", ng-model="status.is_closed", ng-options="e.id as e.name for e in [{'id':true, 'name':'Yes'},{'id':false, 'name': 'No'}]", data-required="true")
|
||||
div.project-values-settings
|
||||
div.options-column
|
||||
a.save.icon.icon-floppy(href="", title="Add")
|
||||
a.cancel.icon.icon-delete(href="", title="Delete")
|
||||
|
||||
form
|
||||
div.project-values-row.new-us-status.hidden
|
||||
div.project-values-name
|
||||
div.row.table-main.new-us-status.hidden
|
||||
div.color-column
|
||||
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="newUs.name", data-required="true", data-maxlength="255")
|
||||
div.project-values-isclosed
|
||||
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")
|
||||
div.project-values-settings
|
||||
div.options-column
|
||||
a.add-new.icon.icon-floppy(href="", title="Add")
|
||||
a.delete-new.icon.icon-delete(href="", title="Delete")
|
||||
|
|
|
@ -6,10 +6,16 @@
|
|||
&:hover {
|
||||
background: transparent;
|
||||
}
|
||||
.row {
|
||||
padding-left: 50px;
|
||||
}
|
||||
}
|
||||
.row {
|
||||
@include table-flex(stretch, center, flex, row, wrap, center);
|
||||
padding: 1rem;
|
||||
&.edition {
|
||||
padding-left: 50px;
|
||||
}
|
||||
&:hover {
|
||||
background: lighten($green-taiga, 60%);
|
||||
@include transition (background .2s ease-in);
|
||||
|
@ -17,6 +23,10 @@
|
|||
@include transition (opacity .3s linear);
|
||||
opacity: 1;
|
||||
}
|
||||
cursor: move;
|
||||
}
|
||||
&.hidden {
|
||||
display: none;
|
||||
}
|
||||
.color-column,
|
||||
.is-closed-column,
|
||||
|
@ -29,6 +39,7 @@
|
|||
}
|
||||
.status-name {
|
||||
@include table-flex-child(6, 300px, 0);
|
||||
padding: 0 10px;
|
||||
}
|
||||
.options-column {
|
||||
max-width: 100px;
|
||||
|
|
Loading…
Reference in New Issue