This commit is contained in:
2021-10-30 00:18:29 +00:00
parent 9a10d34a79
commit f529a52db0
4 changed files with 146 additions and 92 deletions

View File

@@ -3,101 +3,130 @@
<div>
<v-row>
<template v-if="!readonly">
<v-col xs6>
<v-dialog v-model="dlgdate" width="300px">
<template v-slot:activator="{ on }">
<v-text-field
v-on="on"
prepend-icon="$ayiCalendarAlt"
@click:prepend="dlgdate = true"
<template v-if="!$store.state.nativeDateTimeInput">
<v-col xs6>
<v-dialog v-model="dlgdate" width="300px">
<template v-slot:activator="{ on }">
<v-text-field
v-on="on"
prepend-icon="$ayiCalendarAlt"
@click:prepend="dlgdate = true"
:value="dateValue"
:label="label"
:rules="rules"
readonly
:error="!!hasErrors"
:data-cy="'dtfpick:' + testId"
></v-text-field>
</template>
<v-date-picker
:value="dateValue"
:label="label"
:rules="rules"
readonly
:error="!!hasErrors"
:data-cy="'dtfpick:' + testId"
></v-text-field>
</template>
<v-date-picker
@input="updateDateValue"
:locale="languageName"
:data-cy="'dpick:' + testId"
>
<v-btn
text
color="primary"
@click="$emit('input', null)"
:data-cy="'dpickdelete:' + testId"
>{{ $ay.t("Delete") }}</v-btn
>
<v-spacer></v-spacer>
<v-btn
text
color="primary"
@click="setToday()"
:data-cy="'dpicktoday:' + testId"
>{{ $ay.t("DateRangeToday") }}</v-btn
>
<v-spacer></v-spacer>
<v-btn
text
color="primary"
@click="dlgdate = false"
:data-cy="'dpickok:' + testId"
>{{ $ay.t("OK") }}</v-btn
>
</v-date-picker>
</v-dialog>
</v-col>
<v-col xs6>
<v-dialog v-model="dlgtime" width="300px">
<template v-slot:activator="{ on }">
<v-text-field
v-on="on"
:value="readonlyTimeFormat()"
label
prepend-icon="$ayiClock"
@click:prepend="dlgtime = true"
readonly
:error="!!hasErrors"
:data-cy="'ttfpick:' + testId"
></v-text-field>
</template>
<v-time-picker
scrollable
ampm-in-title
:format="hour12 ? 'ampm' : '24hr'"
:value="timeValue"
@input="updateTimeValue"
:data-cy="'tpick:' + testId"
>
<v-btn
text
color="primary"
@click="$emit('input', null)"
:data-cy="'ttfpickdelete:' + testId"
>{{ $ay.t("Delete") }}</v-btn
>
<v-spacer></v-spacer>
<v-btn
text
color="primary"
@click="setNow()"
:data-cy="'ttfpicknow:' + testId"
>{{ $ay.t("Now") }}</v-btn
>
<v-spacer></v-spacer>
<v-btn
text
color="primary"
@click="dlgtime = false"
:data-cy="'ttfpickok:' + testId"
>{{ $ay.t("OK") }}</v-btn
>
</v-time-picker>
</v-dialog>
</v-col>
</template>
<template v-if="$store.state.nativeDateTimeInput">
<v-col cols="6">
<v-text-field
ref="dateField"
:value="dateValue"
@input="updateDateValue"
:locale="languageName"
@change="updateDateValue"
:readonly="readonly"
:disabled="disabled"
:label="label"
:rules="rules"
type="date"
:error-messages="errorMessages"
:data-cy="'dpick:' + testId"
>
<v-btn
text
color="primary"
@click="$emit('input', null)"
:data-cy="'dpickdelete:' + testId"
>{{ $ay.t("Delete") }}</v-btn
>
<v-spacer></v-spacer>
<v-btn
text
color="primary"
@click="setToday()"
:data-cy="'dpicktoday:' + testId"
>{{ $ay.t("DateRangeToday") }}</v-btn
>
<v-spacer></v-spacer>
<v-btn
text
color="primary"
@click="dlgdate = false"
:data-cy="'dpickok:' + testId"
>{{ $ay.t("OK") }}</v-btn
>
</v-date-picker>
</v-dialog>
</v-col>
<v-col xs6>
<v-dialog v-model="dlgtime" width="300px">
<template v-slot:activator="{ on }">
<v-text-field
v-on="on"
:value="readonlyTimeFormat()"
label
prepend-icon="$ayiClock"
@click:prepend="dlgtime = true"
readonly
:error="!!hasErrors"
:data-cy="'ttfpick:' + testId"
></v-text-field>
</template>
<v-time-picker
scrollable
ampm-in-title
:format="hour12 ? 'ampm' : '24hr'"
></v-text-field>
</v-col>
<v-col cols="6">
<v-text-field
ref="timeField"
:value="timeValue"
@input="updateTimeValue"
:data-cy="'tpick:' + testId"
>
<v-btn
text
color="primary"
@click="$emit('input', null)"
:data-cy="'ttfpickdelete:' + testId"
>{{ $ay.t("Delete") }}</v-btn
>
<v-spacer></v-spacer>
<v-btn
text
color="primary"
@click="setNow()"
:data-cy="'ttfpicknow:' + testId"
>{{ $ay.t("Now") }}</v-btn
>
<v-spacer></v-spacer>
<v-btn
text
color="primary"
@click="dlgtime = false"
:data-cy="'ttfpickok:' + testId"
>{{ $ay.t("OK") }}</v-btn
>
</v-time-picker>
</v-dialog>
</v-col>
@change="updateTimeValue"
:readonly="readonly"
:disabled="disabled"
type="time"
:data-cy="'timeinput:' + testId"
></v-text-field>
</v-col>
</template>
</template>
<template v-else>
<v-col>
@@ -121,6 +150,7 @@
<script>
export default {
data: () => ({
nativeInput: true,
dlgdate: false,
dlgtime: false,
timeZoneName: window.$gz.locale.getResolvedTimeZoneName(),

View File

@@ -32,6 +32,7 @@
:value="readonlyFormat()"
:label="label"
readonly
prepend-icon="$ayiCalendarAlt"
></v-text-field>
</template>
</v-row>