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

Fixed taiga taskboard layout

stable
Xavier Julián 2014-06-25 11:17:55 +02:00
parent c222af1bd0
commit 3bb540b6d7
4 changed files with 73 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/coffee/modules/taskboard.coffee
View File

@ -87,7 +87,7 @@ class TaskboardController extends mixOf(taiga.Controller, taiga.PageMixin)
############################################################################# #############################################################################
## TaskboardDirective ## TaskboardDirective
############################################################################# #############################################################################
taiga = @.taiga
TaskboardDirective = -> TaskboardDirective = ->
######################### #########################
@ -96,6 +96,10 @@ TaskboardDirective = ->
linkSortable = ($scope, $el, $attrs, $ctrl) -> linkSortable = ($scope, $el, $attrs, $ctrl) ->
console.log "TaskboardDirective:linkSortable" console.log "TaskboardDirective:linkSortable"
taiga.bindOnce $scope, "statusList", (v) ->
console.log 33333, v
size = v.length * 300
$el.find(".task-row").css("width", size + "px")
link = ($scope, $el, $attrs) -> link = ($scope, $el, $attrs) ->
$ctrl = $el.controller() $ctrl = $el.controller()

64
app/partials/views/modules/taskboard-table.jade
View File

@ -5,25 +5,55 @@ div.taskboard-table
h2.task-colum_name(ng-repeat="s in statusList track by s.id", tg-bo-html="s.name") h2.task-colum_name(ng-repeat="s in statusList track by s.id", tg-bo-html="s.name")
div.taskboard-table-body div.taskboard-table-body
div.taskboard-table-inner div.taskboard-table-inner
div.taskboard_task-list.task-column div.task-row(ng-repeat="us in userstories track by us.id")
div.task-row(ng-repeat="us in userstories track by us.id") div.taskboard_task-list.task-column
div.tag-list div.tag-list
- for(var y = 0; y < 5; y++) - for(var y = 0; y < 5; y++)
include ../components/tag include ../components/tag
h3.task-title h3.task-title
span.task-num 125 span.task-num 125
span Invitacion de los usuarios a la plataforma span Invitacion de los usuarios a la plataforma
ul.task-list ul.task-list
li.task-status Open li.task-status Open
li UX li UX
span 4.5 span 4.5
li Diseño li Diseño
span 4.5 span 4.5
li Front li Front
span 4.5 span 4.5
li Back li Back
span 4.5 span 4.5
include ../components/addnewus include ../components/addnewus
div.taskboard_task-playground.task-column(ng-repeat="s in statusList track by s.id") div.taskboard_task-playground.task-column(ng-repeat="s in statusList track by s.id")
div.task-row(ng-repeat="us in userstories track by us.id")
include ../components/taskboard-task include ../components/taskboard-task
//
div.taskboard-table
div.taskboard-table-header
div.taskboard-table-inner
h2.task-colum_name "User story"
h2.task-colum_name(ng-repeat="s in statusList track by s.id", tg-bo-html="s.name")
div.taskboard-table-body
div.taskboard-table-inner
div.taskboard_task-list.task-column
div.task-row(ng-repeat="us in userstories track by us.id")
div.tag-list
- for(var y = 0; y < 5; y++)
include ../components/tag
h3.task-title
span.task-num 125
span Invitacion de los usuarios a la plataforma
ul.task-list
li.task-status Open
li UX
span 4.5
li Diseño
span 4.5
li Front
span 4.5
li Back
span 4.5
include ../components/addnewus
div.taskboard_task-playground.task-column(ng-repeat="s in statusList track by s.id")
div.task-row(ng-repeat="us in userstories track by us.id")
include ../components/taskboard-task

1
app/styles/modules/nav.scss
View File

@ -7,6 +7,7 @@
padding: 2rem .3rem; padding: 2rem .3rem;
position: fixed; position: fixed;
width: 90px; width: 90px;
z-index: 99;
} }
.logo { .logo {

38
app/styles/modules/taskboard-table.scss
View File

@ -1,3 +1,11 @@
//Table basic shared vars
$column-width: 300px;
$column-flex: 1;
$column-shrink: 0;
$column-margin: 0 .3rem 0 0;
.taskboard-table { .taskboard-table {
overflow: hidden; overflow: hidden;
width: 100%; width: 100%;
@ -7,20 +15,16 @@
margin-bottom: .5rem; margin-bottom: .5rem;
width: 100%; width: 100%;
.taskboard-table-inner { .taskboard-table-inner {
@extend %table-flex; @include table-flex();
overflow: hidden; overflow: hidden;
width: 3500px; //Just and example, should be JS calc
} }
.task-colum_name { .task-colum_name {
@extend %table-flex-child; @include table-flex-child($column-flex, $column-width, $column-shrink, $column-width);
@extend %large; @extend %large;
background: $whitish; background: $whitish;
margin: 0 .3rem; margin: $column-margin;
padding: .5rem 0; padding: .5rem 0;
text-align: center; text-align: center;
&:first-child {
margin-left: 0;
}
} }
} }
@ -30,23 +34,21 @@
overflow-y: scroll; overflow-y: scroll;
width: 100%; width: 100%;
.taskboard-table-inner { .taskboard-table-inner {
@extend %table-flex;
overflow: hidden; overflow: hidden;
width: 3500px; //Just and example, should be JS calc
} }
.task-column { .task-column {
@extend %table-flex-child; @include table-flex-child($column-flex, $column-width, $column-shrink, $column-width);
} margin: $column-margin;
.task-row {
height: 30rem;
margin: 0 .3rem 1rem;
margin-bottom: 1rem;
padding: 1rem; padding: 1rem;
} }
.task-row {
@include table-flex();
margin-bottom: .5rem;
min-height: 30rem;
width: 100%;
}
.taskboard_task-playground { .taskboard_task-playground {
.task-row { background: $whitish;
background: $whitish;
}
} }
} }