mirror of
https://github.com/wekan/wekan.git
synced 2025-04-22 21:17:18 -04:00
Merge pull request #4479 from helioguardabaxo/master
Added Table View to My Cards
This commit is contained in:
Lauri Ojansivu
GitHub
commit
95b39f6d47
5 changed files with 180 additions and 21 deletions
|
|
@ -6,6 +6,16 @@ template(name="myCardsHeaderBar")
|
|||
i.fa.fa-list
|
||||
| {{_ 'my-cards'}}
|
||||
|
||||
.board-header-btns.left
|
||||
a.board-header-btn.js-my-cards-view-change(title="{{_ 'myCardsViewChange-title'}}")
|
||||
i.fa.fa-caret-down
|
||||
if $eq myCardsView 'boards'
|
||||
i.fa.fa-trello
|
||||
| {{_ 'myCardsViewChange-choice-boards'}}
|
||||
if $eq myCardsView 'table'
|
||||
i.fa.fa-table
|
||||
| {{_ 'myCardsViewChange-choice-table'}}
|
||||
|
||||
template(name="myCardsModalTitle")
|
||||
if currentUser
|
||||
h2
|
||||
|
|
@ -17,23 +27,89 @@ template(name="myCards")
|
|||
if searching.get
|
||||
+spinner
|
||||
else
|
||||
.wrapper
|
||||
each board in myCardsList
|
||||
.my-cards-board-wrapper
|
||||
.my-cards-board-title(class=board.colorClass, id="header")
|
||||
a(href=board.originRelativeUrl)
|
||||
+viewer
|
||||
= board.title
|
||||
each swimlane in board.mySwimlanes
|
||||
.my-cards-swimlane-title(class="{{#if swimlane.colorClass}}{{ swimlane.colorClass }}{{else}}swimlane-default-color{{/if}}")
|
||||
+viewer
|
||||
= swimlane.title
|
||||
each list in swimlane.myLists
|
||||
.my-cards-list-wrapper
|
||||
.my-cards-list-title(class=list.colorClass)
|
||||
+viewer
|
||||
= list.title
|
||||
each card in list.myCards
|
||||
.my-cards-card-wrapper
|
||||
a.minicard-wrapper(href=card.originRelativeUrl)
|
||||
+minicard(card)
|
||||
if $eq myCardsView 'boards'
|
||||
.wrapper
|
||||
each board in myCardsList
|
||||
.my-cards-board-wrapper
|
||||
.my-cards-board-title(class=board.colorClass, id="header")
|
||||
a(href=board.originRelativeUrl)
|
||||
+viewer
|
||||
= board.title
|
||||
each swimlane in board.mySwimlanes
|
||||
.my-cards-swimlane-title(class="{{#if swimlane.colorClass}}{{ swimlane.colorClass }}{{else}}swimlane-default-color{{/if}}")
|
||||
+viewer
|
||||
= swimlane.title
|
||||
each list in swimlane.myLists
|
||||
.my-cards-list-wrapper
|
||||
.my-cards-list-title(class=list.colorClass)
|
||||
+viewer
|
||||
= list.title
|
||||
each card in list.myCards
|
||||
.my-cards-card-wrapper
|
||||
a.minicard-wrapper(href=card.originRelativeUrl)
|
||||
+minicard(card)
|
||||
if $eq myCardsView 'table'
|
||||
.wrapper
|
||||
table.my-cards-board-table
|
||||
thead
|
||||
th {{_ "Card"}}
|
||||
th {{_ "List"}}
|
||||
th {{_ "Board"}}
|
||||
th {{_ "Swimlane"}}
|
||||
unless isMiniScreen
|
||||
th {{_ "Members"}}
|
||||
th {{_ "Labels"}}
|
||||
th {{_ "Due Date"}}
|
||||
tbody
|
||||
each board in myCardsList
|
||||
each swimlane in board.mySwimlanes
|
||||
each list in swimlane.myLists
|
||||
each card in list.myCards
|
||||
tr
|
||||
td
|
||||
unless isMiniScreen
|
||||
.my-cards-board-badge(class=board.colorClass, id="header")
|
||||
.my-cards-card-title-table
|
||||
a.minicard-wrapper(href=card.originRelativeUrl)
|
||||
{{card.title}}
|
||||
td
|
||||
{{list.title}}
|
||||
td
|
||||
a(href=board.originRelativeUrl)
|
||||
{{board.title}}
|
||||
td
|
||||
{{swimlane.title}}
|
||||
|
||||
unless isMiniScreen
|
||||
td
|
||||
.div
|
||||
each member in card.members
|
||||
a.name
|
||||
+userAvatar(userId=member noRemove=true)
|
||||
td
|
||||
.div
|
||||
each label in card.labelIds
|
||||
span.card-label(class="card-label-{{labelColor board label}}" title=name)
|
||||
{{labelName board label}}
|
||||
td
|
||||
if card.dueAt
|
||||
{{ moment card.dueAt 'LLL' }}
|
||||
|
||||
template(name="myCardsViewChangePopup")
|
||||
if currentUser
|
||||
ul.pop-over-list
|
||||
li
|
||||
with "myCardsViewChange-choice-boards"
|
||||
a.js-my-cards-view-boards
|
||||
i.fa.fa-trello.colorful
|
||||
| {{_ 'myCardsViewChange-choice-boards'}}
|
||||
if $eq Utils.myCardsView "boards"
|
||||
i.fa.fa-check
|
||||
hr
|
||||
li
|
||||
with "myCardsViewChange-choice-table"
|
||||
a.js-my-cards-view-table
|
||||
i.fa.fa-table.colorful
|
||||
| {{_ 'myCardsViewChange-choice-table'}}
|
||||
if $eq Utils.myCardsView "table"
|
||||
i.fa.fa-check
|
||||
|
|
|
|||
|
|
@ -7,12 +7,20 @@ BlazeComponent.extendComponent({
|
|||
return Utils.myCardsSort();
|
||||
},
|
||||
|
||||
myCardsView() {
|
||||
// eslint-disable-next-line no-console
|
||||
// console.log('sort:', Utils.myCardsView());
|
||||
return Utils.myCardsView();
|
||||
},
|
||||
|
||||
events() {
|
||||
return [
|
||||
{
|
||||
'click .js-toggle-my-cards-choose-sort': Popup.open(
|
||||
'myCardsSortChange',
|
||||
),
|
||||
'click .js-my-cards-view-change': Popup.open(
|
||||
'myCardsViewChange'),
|
||||
},
|
||||
];
|
||||
},
|
||||
|
|
@ -24,6 +32,24 @@ Template.myCards.helpers({
|
|||
},
|
||||
});
|
||||
|
||||
BlazeComponent.extendComponent({
|
||||
events() {
|
||||
return [
|
||||
{
|
||||
'click .js-my-cards-view-boards'() {
|
||||
Utils.setMyCardsView('boards');
|
||||
Popup.back();
|
||||
},
|
||||
|
||||
'click .js-my-cards-view-table'() {
|
||||
Utils.setMyCardsView('table');
|
||||
Popup.back();
|
||||
},
|
||||
},
|
||||
];
|
||||
},
|
||||
}).register('myCardsViewChangePopup');
|
||||
|
||||
class MyCardsComponent extends CardSearchPagedComponent {
|
||||
onCreated() {
|
||||
super.onCreated();
|
||||
|
|
@ -41,6 +67,24 @@ class MyCardsComponent extends CardSearchPagedComponent {
|
|||
);
|
||||
}
|
||||
|
||||
myCardsView() {
|
||||
// eslint-disable-next-line no-console
|
||||
//console.log('sort:', Utils.myCardsView());
|
||||
return Utils.myCardsView();
|
||||
}
|
||||
|
||||
labelName(board, labelId) {
|
||||
const label = board.getLabelById(labelId)
|
||||
const name = label.name
|
||||
return name
|
||||
}
|
||||
|
||||
labelColor(board, labelId) {
|
||||
const label = board.getLabelById(labelId)
|
||||
const color = label.color
|
||||
return color
|
||||
}
|
||||
|
||||
myCardsList() {
|
||||
const boards = [];
|
||||
let board = null;
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
border-width: 2px
|
||||
border-style: solid
|
||||
border-color: #a2a2a2
|
||||
|
||||
|
||||
.my-cards-board-title
|
||||
font-size: 1.4rem
|
||||
font-weight: bold
|
||||
|
|
@ -55,3 +55,23 @@
|
|||
max-width: 500px
|
||||
margin-right: auto
|
||||
margin-left: auto
|
||||
|
||||
.my-cards-board-table
|
||||
thead
|
||||
border-bottom: 3px solid #4d4d4d
|
||||
background-color: transparent
|
||||
th, td
|
||||
border: 0
|
||||
tr
|
||||
border-bottom: 2px solid #a2a2a2
|
||||
|
||||
.my-cards-card-title-table
|
||||
font-weight: bold
|
||||
padding-left: 2px
|
||||
|
||||
.my-cards-board-badge
|
||||
width:36px
|
||||
height:24px
|
||||
float:left
|
||||
border-radius:5px
|
||||
margin-right: 5px
|
||||
|
|
|
|||
|
|
@ -138,6 +138,21 @@ Utils = {
|
|||
Utils.reload();
|
||||
},
|
||||
|
||||
myCardsView() {
|
||||
let view = window.localStorage.getItem('myCardsView');
|
||||
|
||||
if (!view || !['boards', 'table'].includes(view)) {
|
||||
view = 'boards';
|
||||
}
|
||||
|
||||
return view;
|
||||
},
|
||||
|
||||
setMyCardsView(view) {
|
||||
window.localStorage.setItem('myCardsView', view);
|
||||
Utils.reload();
|
||||
},
|
||||
|
||||
// XXX We should remove these two methods
|
||||
goBoardId(_id) {
|
||||
const board = Boards.findOne(_id);
|
||||
|
|
|
|||
|
|
@ -939,6 +939,10 @@
|
|||
"list": "List",
|
||||
"board": "Board",
|
||||
"context-separator": "/",
|
||||
"myCardsViewChange-title": "My Cards View",
|
||||
"myCardsViewChangePopup-title": "My Cards View",
|
||||
"myCardsViewChange-choice-boards": "Boards",
|
||||
"myCardsViewChange-choice-table": "Table",
|
||||
"myCardsSortChange-title": "My Cards Sort",
|
||||
"myCardsSortChangePopup-title": "My Cards Sort",
|
||||
"myCardsSortChange-choice-board": "By Board",
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue