Handle cleared quick entry time
This commit is contained in:
parent
08354ac897
commit
ad62aac6af
|
|
@ -76,7 +76,9 @@ const selectedLedgerLabel = computed(() => {
|
||||||
const names = visibleNames.slice(0, 3).join(",");
|
const names = visibleNames.slice(0, 3).join(",");
|
||||||
return visibleNames.length > 1 ? `${names} 等 ${visibleNames.length} 个账本` : names;
|
return visibleNames.length > 1 ? `${names} 等 ${visibleNames.length} 个账本` : names;
|
||||||
});
|
});
|
||||||
|
const occurredAtValid = computed(() => Boolean(occurredAt.value) && !Number.isNaN(new Date(occurredAt.value).getTime()));
|
||||||
const dateLabel = computed(() => {
|
const dateLabel = computed(() => {
|
||||||
|
if (!occurredAtValid.value) return "选择时间";
|
||||||
const date = new Date(occurredAt.value);
|
const date = new Date(occurredAt.value);
|
||||||
const now = new Date();
|
const now = new Date();
|
||||||
const datePart = isSameDay(date, now)
|
const datePart = isSameDay(date, now)
|
||||||
|
|
@ -84,6 +86,10 @@ const dateLabel = computed(() => {
|
||||||
: `${date.getMonth() + 1}月${date.getDate()}日`;
|
: `${date.getMonth() + 1}月${date.getDate()}日`;
|
||||||
return `${datePart} ${pad(date.getHours())}:${pad(date.getMinutes())}`;
|
return `${datePart} ${pad(date.getHours())}:${pad(date.getMinutes())}`;
|
||||||
});
|
});
|
||||||
|
const canSave = computed(() => {
|
||||||
|
const amount = Math.round(calculatedAmount.value * 100);
|
||||||
|
return Number.isFinite(amount) && amount > 0 && occurredAtValid.value;
|
||||||
|
});
|
||||||
const selectorOptions = computed<(EntryTypeOption | Category)[]>(() => {
|
const selectorOptions = computed<(EntryTypeOption | Category)[]>(() => {
|
||||||
if (selectorLevel.value === "type") {
|
if (selectorLevel.value === "type") {
|
||||||
const current = entryTypes.find((option) => option.id === entryType.value);
|
const current = entryTypes.find((option) => option.id === entryType.value);
|
||||||
|
|
@ -345,7 +351,7 @@ function toggleLedger(ledgerId: string) {
|
||||||
|
|
||||||
function saveEntry() {
|
function saveEntry() {
|
||||||
const amount = Math.round(calculatedAmount.value * 100);
|
const amount = Math.round(calculatedAmount.value * 100);
|
||||||
if (!Number.isFinite(amount) || amount <= 0) return;
|
if (!canSave.value) return;
|
||||||
|
|
||||||
emit("save", {
|
emit("save", {
|
||||||
type: entryType.value,
|
type: entryType.value,
|
||||||
|
|
@ -377,7 +383,7 @@ function saveEntry() {
|
||||||
<ChevronDown :size="13" />
|
<ChevronDown :size="13" />
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<button class="header-date-button" type="button" @click="openDatePicker">
|
<button class="header-date-button" :class="{ invalid: !occurredAtValid }" type="button" :aria-invalid="!occurredAtValid" @click="openDatePicker">
|
||||||
<CalendarDays :size="16" />
|
<CalendarDays :size="16" />
|
||||||
<span>{{ dateLabel }}</span>
|
<span>{{ dateLabel }}</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
@ -514,7 +520,7 @@ function saveEntry() {
|
||||||
<button type="button" class="key number-key" @click="appendDigit('1')">1</button>
|
<button type="button" class="key number-key" @click="appendDigit('1')">1</button>
|
||||||
<button type="button" class="key number-key" @click="appendDigit('2')">2</button>
|
<button type="button" class="key number-key" @click="appendDigit('2')">2</button>
|
||||||
<button type="button" class="key number-key" @click="appendDigit('3')">3</button>
|
<button type="button" class="key number-key" @click="appendDigit('3')">3</button>
|
||||||
<button type="button" class="key save-key" aria-label="完成记账" title="完成记账" @click="saveEntry">
|
<button type="button" class="key save-key" :disabled="!canSave" aria-label="完成记账" title="完成记账" @click="saveEntry">
|
||||||
<Check :size="27" />
|
<Check :size="27" />
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -761,6 +761,12 @@ input:focus-visible {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.header-date-button.invalid {
|
||||||
|
border-color: #e9a79c;
|
||||||
|
background: #fff2ef;
|
||||||
|
color: #c94635;
|
||||||
|
}
|
||||||
|
|
||||||
.native-date-input {
|
.native-date-input {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 14px;
|
right: 14px;
|
||||||
|
|
@ -910,6 +916,11 @@ input:focus-visible {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.save-key:disabled {
|
||||||
|
background: #d8e1de;
|
||||||
|
color: #8a9894;
|
||||||
|
}
|
||||||
|
|
||||||
.category-focus-scrim {
|
.category-focus-scrim {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
inset: 0;
|
inset: 0;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue