refactor: full width edit task

This commit is contained in:
2026-07-14 14:19:11 +02:00
parent fb6ca23662
commit d380e8baff
2 changed files with 33 additions and 32 deletions
+6 -6
View File
@@ -62,7 +62,7 @@ watch(cron, () => {
<template> <template>
<div class="flex gap-2"> <div class="flex gap-2">
<select v-model="cronType" class="select" @change="onChangeCronType"> <select v-model="cronType" class="select flex-1" @change="onChangeCronType">
<option :value="CronType.ONE_TIME"> <option :value="CronType.ONE_TIME">
{{ $t("cron.type.one_time") }} {{ $t("cron.type.one_time") }}
</option> </option>
@@ -85,7 +85,7 @@ watch(cron, () => {
<select <select
v-if="cronType === CronType.EVERY_DAY" v-if="cronType === CronType.EVERY_DAY"
v-model="cronValue" v-model="cronValue"
class="select" class="select flex-1"
@change="onChangeCronValue" @change="onChangeCronValue"
> >
<option <option
@@ -99,7 +99,7 @@ watch(cron, () => {
<select <select
v-if="cronType === CronType.EVERY_WEEK" v-if="cronType === CronType.EVERY_WEEK"
v-model="cronValue" v-model="cronValue"
class="select" class="select flex-1"
@change="onChangeCronValue" @change="onChangeCronValue"
> >
<option <option
@@ -113,7 +113,7 @@ watch(cron, () => {
<select <select
v-if="cronType === CronType.EVERY_MONTH" v-if="cronType === CronType.EVERY_MONTH"
v-model="cronValue" v-model="cronValue"
class="select" class="select flex-1"
@change="onChangeCronValue" @change="onChangeCronValue"
> >
<option <option
@@ -136,7 +136,7 @@ watch(cron, () => {
<select <select
v-if="cronType === CronType.EVERY_YEAR" v-if="cronType === CronType.EVERY_YEAR"
v-model="cronValue" v-model="cronValue"
class="select" class="select flex-1"
@change="onChangeCronValue" @change="onChangeCronValue"
> >
<option <option
@@ -151,7 +151,7 @@ watch(cron, () => {
v-if="cronType === CronType.SPECIFIC" v-if="cronType === CronType.SPECIFIC"
v-model="rawCron" v-model="rawCron"
type="text" type="text"
class="input font-mono" class="input font-mono flex-1"
:class="valid ? '' : 'input-error'" :class="valid ? '' : 'input-error'"
@input="onInputRawCron" @input="onInputRawCron"
/> />
+27 -26
View File
@@ -102,37 +102,38 @@ watch(task, () => {
<template> <template>
<div class="list-row text-left"> <div class="list-row text-left">
<div class="content-center"> <template v-if="!editMode">
<input <div class="content-center">
:id="refreshKey.toFixed(0)" <input
type="checkbox" :id="refreshKey.toFixed(0)"
class="checkbox" type="checkbox"
:checked="checked" class="checkbox"
@click.prevent="onCheck" :checked="checked"
/> @click.prevent="onCheck"
</div> />
<div
v-if="!editMode"
class="cursor-pointer text-lg select-none"
@click.prevent="editMode = true"
>
<div>{{ task.name }}</div>
<div
v-if="showLastChecked && !checked && task.check_date"
class="font-light text-xs italic"
>
{{ $t("checked") }}
{{ relativeTime(task.check_date, $i18n.locale) }}
</div> </div>
<div <div
v-if="showNextReset && checked && nextReset" class="cursor-pointer text-lg select-none"
class="font-light text-xs italic" @click.prevent="editMode = true"
> >
{{ $t("resets") }} {{ relativeTime(nextReset, $i18n.locale) }} <div>{{ task.name }}</div>
<div
v-if="showLastChecked && !checked && task.check_date"
class="font-light text-xs italic"
>
{{ $t("checked") }}
{{ relativeTime(task.check_date, $i18n.locale) }}
</div>
<div
v-if="showNextReset && checked && nextReset"
class="font-light text-xs italic"
>
{{ $t("resets") }} {{ relativeTime(nextReset, $i18n.locale) }}
</div>
</div> </div>
</div> </template>
<template v-else> <template v-else>
<div class="flex flex-col gap-2"> <div class="list-col-grow flex flex-col gap-2">
<div class="flex justify-evenly"> <div class="flex justify-evenly">
<button class="btn btn-square me-1" @click="onClose"> <button class="btn btn-square me-1" @click="onClose">
<x-icon /> <x-icon />