local-it/vikunja-frontend
0
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Task Priorities (#19)

Browse source
This commit is contained in:
konrad 2019-03-03 15:03:08 +00:00 committed by Gitea
parent d66382b581
commit aac137f8a4
6 changed files with 75 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
src/components/lists/ShowList.vue
View file

@ -41,7 +41,18 @@
</div>
<span class="tasktext" :class="{ 'done': l.done}">
{{l.text}}
<i v-if="l.dueDate > 0" :class="{'overdue': (l.dueDate <= new Date())}"> - Due on {{new Date(l.dueDate).toLocaleString()}}</i>
<i v-if="l.dueDate > 0" :class="{'overdue': (l.dueDate <= new Date())}"> - Due on {{new Date(l.dueDate).toLocaleString()}}</i>
<span v-if="l.priority >= priorities.HIGH" class="high-priority" :class="{'not-so-high': l.priority === priorities.HIGH}">
<span class="icon">
<icon icon="exclamation"/>
</span>
<template v-if="l.priority === priorities.HIGH">High</template>
<template v-if="l.priority === priorities.URGENT">Urgent</template>
<template v-if="l.priority === priorities.DO_NOW">DO NOW</template>
<span class="icon" v-if="l.priority === priorities.DO_NOW">
<icon icon="exclamation"/>
</span>
</span>
</span>
</label>
<div @click="editTask(l.id)" class="icon settings">
@ -156,6 +167,22 @@
</div>
</div>
<div class="field">
<label class="label" for="">Priority</label>
<div class="control priority-select">
<div class="select">
<select v-model="taskEditTask.priority">
<option :value="priorities.UNSET">Unset</option>
<option :value="priorities.LOW">Low</option>
<option :value="priorities.MEDIUM">Medium</option>
<option :value="priorities.HIGH">High</option>
<option :value="priorities.URGENT">Urgent</option>
<option :value="priorities.DO_NOW">DO NOW</option>
</select>
</div>
</div>
</div>
<div class="field">
<label class="label" for="subtasks">Subtasks</label>
<div class="tasks noborder" v-if="taskEditTask.subtasks && taskEditTask.subtasks.length > 0">
@ -210,6 +237,7 @@
import TaskService from '../../services/task'
import TaskModel from '../../models/task'
import ListModel from '../../models/list'
import priorities from '../../models/priorities'
export default {
data() {
@ -218,6 +246,7 @@
listService: ListService,
taskService: TaskService,
priorities: priorities,
list: {},
newTask: TaskModel,
isTaskEdit: false,

17
src/components/lists/ShowTasks.vue
View file

@ -20,9 +20,20 @@
</label>
</div>
<span class="tasktext">
{{l.text}}
<i v-if="l.dueDate > 0" :class="{'overdue': (new Date(l.dueDate * 1000) <= new Date())}"> - Due on {{formatUnixDate(l.dueDate)}}</i>
{{l.text}}
<i v-if="l.dueDate > 0" :class="{'overdue': (new Date(l.dueDate * 1000) <= new Date())}"> - Due on {{formatUnixDate(l.dueDate)}}</i>
<span v-if="l.priority >= priorities.HIGH" class="high-priority" :class="{'not-so-high': l.priority === priorities.HIGH}">
<span class="icon">
<icon icon="exclamation"/>
</span>
<template v-if="l.priority === priorities.HIGH">High</template>
<template v-if="l.priority === priorities.URGENT">Urgent</template>
<template v-if="l.priority === priorities.DO_NOW">DO NOW</template>
<span class="icon" v-if="l.priority === priorities.DO_NOW">
<icon icon="exclamation"/>
</span>
</span>
</span>
</label>
</div>
</div>
@ -33,6 +44,7 @@
import {HTTP} from '../../http-common'
import message from '../../message'
import TaskService from '../../services/task'
import priorities from '../../models/priorities'
export default {
name: "ShowTasks",
@ -42,6 +54,7 @@
tasks: [],
hasUndoneTasks: false,
taskService: TaskService,
priorities: priorities,
}
},
props: {

2
src/main.js
View file

@ -40,6 +40,7 @@ import { faCalendar } from '@fortawesome/free-solid-svg-icons'
import { faBars } from '@fortawesome/free-solid-svg-icons'
import { faPowerOff } from '@fortawesome/free-solid-svg-icons'
import { faCalendarWeek } from '@fortawesome/free-solid-svg-icons'
import { faExclamation } from '@fortawesome/free-solid-svg-icons'
import { faTimesCircle } from '@fortawesome/free-regular-svg-icons'
import { faCalendarAlt } from '@fortawesome/free-regular-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
@ -64,6 +65,7 @@ library.add(faBars)
library.add(faPowerOff)
library.add(faCalendarWeek)
library.add(faCalendarAlt)
library.add(faExclamation)
Vue.component('icon', FontAwesomeIcon)

8
src/models/priorities.json Normal file
View file

@ -0,0 +1,8 @@
{
"UNSET": 0,
"LOW": 1,
"MEDIUM": 2,
"HIGH": 3,
"URGENT": 4,
"DO_NOW": 5
}

18
src/styles/tasks.scss
View file

@ -54,6 +54,18 @@
color: $red;
}
}
.high-priority{
color: $red;
.icon {
vertical-align: middle;
}
&.not-so-high {
color: $orange;
}
}
}
input[type="checkbox"] {
@ -102,4 +114,10 @@
}
}
}
.priority-select{
.select, select{
width: 100%;
}
}
}

4
todo.md
View file

@ -89,8 +89,8 @@
* [ ] Users with access to a namespace
* [ ] Teams with access to a list
* [ ] Teams with access to a namespace
* [ ] Priorities
* [ ] Sachen mit hoher Prio irgendwie hervorheben (rotes Dreieck zb)
* [x] Priorities
* [x] Highlight tasks with high priority
* [ ] Assignees
* [ ] Labels
* [ ] Timeline/Calendar view -> Dazu tasks die in einem Bestimmten Bereich due sind, macht dann das Frontend