Add setting for the first day of the week
This commit is contained in:
parent
641ccd1026
commit
e37145cd43
9 changed files with 87 additions and 49 deletions
|
@ -118,6 +118,7 @@ import {calculateDayInterval} from '@/helpers/time/calculateDayInterval'
|
||||||
import {calculateNearestHours} from '@/helpers/time/calculateNearestHours'
|
import {calculateNearestHours} from '@/helpers/time/calculateNearestHours'
|
||||||
import {closeWhenClickedOutside} from '@/helpers/closeWhenClickedOutside'
|
import {closeWhenClickedOutside} from '@/helpers/closeWhenClickedOutside'
|
||||||
import {createDateFromString} from '@/helpers/time/createDateFromString'
|
import {createDateFromString} from '@/helpers/time/createDateFromString'
|
||||||
|
import {mapState} from 'vuex'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'datepicker',
|
name: 'datepicker',
|
||||||
|
@ -127,14 +128,6 @@ export default {
|
||||||
show: false,
|
show: false,
|
||||||
changed: false,
|
changed: false,
|
||||||
|
|
||||||
flatPickerConfig: {
|
|
||||||
altFormat: 'j M Y H:i',
|
|
||||||
altInput: true,
|
|
||||||
dateFormat: 'Y-m-d H:i',
|
|
||||||
enableTime: true,
|
|
||||||
time_24hr: true,
|
|
||||||
inline: true,
|
|
||||||
},
|
|
||||||
// Since flatpickr dates are strings, we need to convert them to native date objects.
|
// Since flatpickr dates are strings, we need to convert them to native date objects.
|
||||||
// To make that work, we need a separate variable since flatpickr does not have a change event.
|
// To make that work, we need a separate variable since flatpickr does not have a change event.
|
||||||
flatPickrDate: null,
|
flatPickrDate: null,
|
||||||
|
@ -172,6 +165,19 @@ export default {
|
||||||
this.updateData()
|
this.updateData()
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
computed: mapState({
|
||||||
|
flatPickerConfig: state => ({
|
||||||
|
altFormat: 'j M Y H:i',
|
||||||
|
altInput: true,
|
||||||
|
dateFormat: 'Y-m-d H:i',
|
||||||
|
enableTime: true,
|
||||||
|
time_24hr: true,
|
||||||
|
inline: true,
|
||||||
|
locale: {
|
||||||
|
firstDayOfWeek: state.auth.settings.weekStart,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}),
|
||||||
methods: {
|
methods: {
|
||||||
setDateValue(newVal) {
|
setDateValue(newVal) {
|
||||||
if(newVal === null) {
|
if(newVal === null) {
|
||||||
|
|
|
@ -205,6 +205,7 @@ import UserService from '@/services/user'
|
||||||
import LabelService from '@/services/label'
|
import LabelService from '@/services/label'
|
||||||
import ListService from '@/services/list'
|
import ListService from '@/services/list'
|
||||||
import NamespaceService from '@/services/namespace'
|
import NamespaceService from '@/services/namespace'
|
||||||
|
import {mapState} from 'vuex'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'filters',
|
name: 'filters',
|
||||||
|
@ -243,14 +244,6 @@ export default {
|
||||||
list_id: '',
|
list_id: '',
|
||||||
namespace: '',
|
namespace: '',
|
||||||
},
|
},
|
||||||
flatPickerConfig: {
|
|
||||||
altFormat: 'j M Y H:i',
|
|
||||||
altInput: true,
|
|
||||||
dateFormat: 'Y-m-d H:i',
|
|
||||||
enableTime: true,
|
|
||||||
time_24hr: true,
|
|
||||||
mode: 'range',
|
|
||||||
},
|
|
||||||
|
|
||||||
usersService: UserService,
|
usersService: UserService,
|
||||||
foundusers: [],
|
foundusers: [],
|
||||||
|
@ -291,6 +284,19 @@ export default {
|
||||||
this.prepareFilters()
|
this.prepareFilters()
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
computed: mapState({
|
||||||
|
flatPickerConfig: state => ({
|
||||||
|
altFormat: 'j M Y H:i',
|
||||||
|
altInput: true,
|
||||||
|
dateFormat: 'Y-m-d H:i',
|
||||||
|
enableTime: true,
|
||||||
|
time_24hr: true,
|
||||||
|
mode: 'range',
|
||||||
|
locale: {
|
||||||
|
firstDayOfWeek: state.auth.settings.weekStart,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}),
|
||||||
methods: {
|
methods: {
|
||||||
change() {
|
change() {
|
||||||
this.$emit('input', this.params)
|
this.$emit('input', this.params)
|
||||||
|
|
|
@ -94,14 +94,6 @@ export default {
|
||||||
newTask: TaskModel,
|
newTask: TaskModel,
|
||||||
isTaskEdit: false,
|
isTaskEdit: false,
|
||||||
taskEditTask: TaskModel,
|
taskEditTask: TaskModel,
|
||||||
flatPickerConfig: {
|
|
||||||
altFormat: 'j M Y H:i',
|
|
||||||
altInput: true,
|
|
||||||
dateFormat: 'Y-m-d H:i',
|
|
||||||
enableTime: true,
|
|
||||||
onOpen: this.updateLastReminderDate,
|
|
||||||
onClose: this.addReminderDate,
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
|
|
|
@ -40,6 +40,7 @@
|
||||||
<script>
|
<script>
|
||||||
import TaskService from '../../../services/task'
|
import TaskService from '../../../services/task'
|
||||||
import flatPickr from 'vue-flatpickr-component'
|
import flatPickr from 'vue-flatpickr-component'
|
||||||
|
import {mapState} from 'vuex'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'defer-task',
|
name: 'defer-task',
|
||||||
|
@ -51,15 +52,6 @@ export default {
|
||||||
dueDate: null,
|
dueDate: null,
|
||||||
lastValue: null,
|
lastValue: null,
|
||||||
changeInterval: null,
|
changeInterval: null,
|
||||||
|
|
||||||
flatPickerConfig: {
|
|
||||||
altFormat: 'j M Y H:i',
|
|
||||||
altInput: true,
|
|
||||||
dateFormat: 'Y-m-d H:i',
|
|
||||||
enableTime: true,
|
|
||||||
time_24hr: true,
|
|
||||||
inline: true,
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
|
@ -102,6 +94,19 @@ export default {
|
||||||
this.lastValue = this.dueDate
|
this.lastValue = this.dueDate
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
computed: mapState({
|
||||||
|
flatPickerConfig: state => ({
|
||||||
|
altFormat: 'j M Y H:i',
|
||||||
|
altInput: true,
|
||||||
|
dateFormat: 'Y-m-d H:i',
|
||||||
|
enableTime: true,
|
||||||
|
time_24hr: true,
|
||||||
|
inline: true,
|
||||||
|
locale: {
|
||||||
|
firstDayOfWeek: state.auth.settings.weekStart,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}),
|
||||||
methods: {
|
methods: {
|
||||||
deferDays(days) {
|
deferDays(days) {
|
||||||
this.dueDate = new Date(this.dueDate)
|
this.dueDate = new Date(this.dueDate)
|
||||||
|
|
|
@ -9,6 +9,7 @@ export default class UserSettingsModel extends AbstractModel {
|
||||||
discoverableByName: false,
|
discoverableByName: false,
|
||||||
discoverableByEmail: false,
|
discoverableByEmail: false,
|
||||||
overdueTasksRemindersEnabled: true,
|
overdueTasksRemindersEnabled: true,
|
||||||
|
weekStart: 0,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -2,6 +2,13 @@ import {HTTPFactory} from '@/http-common'
|
||||||
import {ERROR_MESSAGE, LOADING} from '../mutation-types'
|
import {ERROR_MESSAGE, LOADING} from '../mutation-types'
|
||||||
import UserModel from '../../models/user'
|
import UserModel from '../../models/user'
|
||||||
|
|
||||||
|
const defaultSettings = settings => {
|
||||||
|
if (typeof settings.weekStart === 'undefined' || settings.weekStart === '') {
|
||||||
|
settings.weekStart = 0
|
||||||
|
}
|
||||||
|
return settings
|
||||||
|
}
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
namespaced: true,
|
namespaced: true,
|
||||||
state: () => ({
|
state: () => ({
|
||||||
|
@ -20,12 +27,12 @@ export default {
|
||||||
state.avatarUrl = info.getAvatarUrl()
|
state.avatarUrl = info.getAvatarUrl()
|
||||||
|
|
||||||
if (info.settings) {
|
if (info.settings) {
|
||||||
state.settings = info.settings
|
state.settings = defaultSettings(info.settings)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
setUserSettings(state, settings) {
|
setUserSettings(state, settings) {
|
||||||
state.settings = settings
|
state.settings = defaultSettings(settings)
|
||||||
const info = state.info !== null ? state.info : {}
|
const info = state.info !== null ? state.info : {}
|
||||||
info.name = settings.name
|
info.name = settings.name
|
||||||
state.info = info
|
state.info = info
|
||||||
|
|
|
@ -66,6 +66,7 @@ import GanttChart from '../../../components/tasks/gantt-component'
|
||||||
import flatPickr from 'vue-flatpickr-component'
|
import flatPickr from 'vue-flatpickr-component'
|
||||||
import Fancycheckbox from '../../../components/input/fancycheckbox'
|
import Fancycheckbox from '../../../components/input/fancycheckbox'
|
||||||
import {saveListView} from '@/helpers/saveListView'
|
import {saveListView} from '@/helpers/saveListView'
|
||||||
|
import {mapState} from 'vuex'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Gantt',
|
name: 'Gantt',
|
||||||
|
@ -85,14 +86,19 @@ export default {
|
||||||
dayWidth: 35,
|
dayWidth: 35,
|
||||||
dateFrom: null,
|
dateFrom: null,
|
||||||
dateTo: null,
|
dateTo: null,
|
||||||
flatPickerConfig: {
|
}
|
||||||
|
},
|
||||||
|
computed: mapState({
|
||||||
|
flatPickerConfig: state => ({
|
||||||
altFormat: 'j M Y',
|
altFormat: 'j M Y',
|
||||||
altInput: true,
|
altInput: true,
|
||||||
dateFormat: 'Y-m-d',
|
dateFormat: 'Y-m-d',
|
||||||
enableTime: false,
|
enableTime: false,
|
||||||
|
locale: {
|
||||||
|
firstDayOfWeek: state.auth.settings.weekStart,
|
||||||
},
|
},
|
||||||
}
|
})
|
||||||
},
|
}),
|
||||||
beforeMount() {
|
beforeMount() {
|
||||||
this.dateFrom = new Date((new Date()).setDate((new Date()).getDate() - 15))
|
this.dateFrom = new Date((new Date()).setDate((new Date()).getDate() - 15))
|
||||||
this.dateTo = new Date((new Date()).setDate((new Date()).getDate() + 30))
|
this.dateTo = new Date((new Date()).setDate((new Date()).getDate() + 30))
|
||||||
|
|
|
@ -81,14 +81,6 @@ export default {
|
||||||
cEndDate: null,
|
cEndDate: null,
|
||||||
|
|
||||||
showNothingToDo: false,
|
showNothingToDo: false,
|
||||||
|
|
||||||
flatPickerConfig: {
|
|
||||||
altFormat: 'j M Y H:i',
|
|
||||||
altInput: true,
|
|
||||||
dateFormat: 'Y-m-d H:i',
|
|
||||||
enableTime: true,
|
|
||||||
time_24hr: true,
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
|
@ -116,6 +108,16 @@ export default {
|
||||||
},
|
},
|
||||||
computed: mapState({
|
computed: mapState({
|
||||||
userAuthenticated: state => state.auth.authenticated,
|
userAuthenticated: state => state.auth.authenticated,
|
||||||
|
flatPickerConfig: state => ({
|
||||||
|
altFormat: 'j M Y H:i',
|
||||||
|
altInput: true,
|
||||||
|
dateFormat: 'Y-m-d H:i',
|
||||||
|
enableTime: true,
|
||||||
|
time_24hr: true,
|
||||||
|
locale: {
|
||||||
|
firstDayOfWeek: state.auth.settings.weekStart,
|
||||||
|
},
|
||||||
|
})
|
||||||
}),
|
}),
|
||||||
methods: {
|
methods: {
|
||||||
setDate() {
|
setDate() {
|
||||||
|
|
|
@ -132,6 +132,19 @@
|
||||||
Play a sound when marking tasks as done
|
Play a sound when marking tasks as done
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="field">
|
||||||
|
<label class="is-flex is-align-items-center">
|
||||||
|
<span>
|
||||||
|
Week starts on
|
||||||
|
</span>
|
||||||
|
<div class="select ml-2">
|
||||||
|
<select v-model.number="settings.weekStart">
|
||||||
|
<option value="0">Sunday</option>
|
||||||
|
<option value="1">Monday</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
<x-button
|
<x-button
|
||||||
:loading="userSettingsService.loading"
|
:loading="userSettingsService.loading"
|
||||||
|
|
Loading…
Reference in a new issue