1
0

Add repeat mode setting for tasks

See https://kolaente.dev/vikunja/api/pulls/834
This commit is contained in:
kolaente
2021-04-14 10:24:07 +02:00
parent 6e58acf98f
commit 4ed5d1e8fe
3 changed files with 50 additions and 42 deletions

View File

@ -5,52 +5,56 @@
<x-button type="secondary" class="is-small" @click="() => setRepeatAfter(1, 'weeks')">Every Week</x-button>
<x-button type="secondary" class="is-small" @click="() => setRepeatAfter(1, 'months')">Every Month</x-button>
</div>
<div class="columns is-align-items-center">
<div class="is-flex column">
<p class="pr-4">
Each
</p>
<div class="field has-addons is-fullwidth">
<div class="control">
<input
:disabled="disabled"
@change="updateData"
class="input"
placeholder="Specify an amount..."
v-model="repeatAfter.amount"/>
</div>
<div class="control">
<div class="select">
<select :disabled="disabled" @change="updateData" v-model="repeatAfter.type">
<option value="hours">Hours</option>
<option value="days">Days</option>
<option value="weeks">Weeks</option>
<option value="months">Months</option>
<option value="years">Years</option>
</select>
</div>
<div class="is-flex is-align-items-center mb-2">
<label for="repeatMode" class="is-fullwidth">
Repeat mode:
</label>
<div class="control">
<div class="select">
<select @change="updateData" v-model="task.repeatMode" id="repeatMode">
<option :value="repeatModes.REPEAT_MODE_DEFAULT">Default</option>
<option :value="repeatModes.REPEAT_MODE_MONTH">Monthly</option>
<option :value="repeatModes.REPEAT_MODE_FROM_CURRENT_DATE">From Current Date</option>
</select>
</div>
</div>
</div>
<div class="is-flex" v-if="task.repeatMode !== repeatModes.REPEAT_MODE_MONTH">
<p class="pr-4">
Each
</p>
<div class="field has-addons is-fullwidth">
<div class="control">
<input
:disabled="disabled"
@change="updateData"
class="input"
placeholder="Specify an amount..."
v-model="repeatAfter.amount"
type="number"
/>
</div>
<div class="control">
<div class="select">
<select :disabled="disabled" @change="updateData" v-model="repeatAfter.type">
<option value="hours">Hours</option>
<option value="days">Days</option>
<option value="weeks">Weeks</option>
<option value="months">Months</option>
<option value="years">Years</option>
</select>
</div>
</div>
</div>
<fancycheckbox
:disabled="disabled"
@change="updateData"
class="column"
v-model="task.repeatFromCurrentDate"
v-tooltip="'When marking the task as done, all dates will be set relative to the current date rather than the date they had before.'"
>
Repeat from current date
</fancycheckbox>
</div>
</div>
</template>
<script>
import Fancycheckbox from '../../input/fancycheckbox'
import repeatModes from '@/models/taskRepeatModes'
export default {
name: 'repeatAfter',
components: {Fancycheckbox},
data() {
return {
task: {},
@ -58,12 +62,12 @@ export default {
amount: 0,
type: '',
},
repeatModes: repeatModes,
}
},
props: {
value: {
default: () => {
},
default: () => {},
required: true,
},
disabled: {
@ -107,8 +111,4 @@ p {
.input {
min-width: 2rem;
}
.fancycheckbox {
padding: 0;
}
</style>