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>

View File

@@ -50,6 +50,7 @@ export default new Vuex.Store({
formSettings: {}, //this is the settings on forms that survive a refresh like grid number of items to show etc
formCustomTemplate: {}, //this is the custom fields settings for forms,
darkMode: false,
nativeDateTimeInput: false,
knownPassword: false,
newNotificationCount: 0
},
@@ -198,6 +199,9 @@ export default new Vuex.Store({
setDarkMode(state, data) {
state.darkMode = data;
},
setNativeDateTimeInput(state, data) {
state.nativeDateTimeInput = data;
},
setKnownPassword(state, data) {
state.knownPassword = data;
},

View File

@@ -113,6 +113,17 @@
></v-checkbox>
</v-col>
<v-col cols="12" sm="6" lg="4" xl="3">
<v-checkbox
v-model="nativeDateTimeInput"
:readonly="formState.readOnly"
:label="$ay.t('NativeDateTimeInput')"
ref="nativeDateTimeInput"
@change="nativeDateTimeInputChanged()"
data-cy="nativeDateTimeInput"
></v-checkbox>
</v-col>
<v-col cols="12" sm="6" lg="4" xl="3">
<v-text-field
v-model="obj.currencyName"
@@ -230,6 +241,7 @@ export default {
},
activeTranslationId: null,
darkMode: this.$store.state.darkMode,
nativeDateTimeInput: this.$store.state.nativeDateTimeInput,
obj: {
id: 0,
concurrency: 0,
@@ -306,6 +318,12 @@ export default {
vm.darkMode ? "$ayiSun" : "$ayiMoon"
);
},
nativeDateTimeInputChanged() {
console.log("Setting native date time input now");
const vm = this;
//vm.nativeDateTimeInput = !vm.nativeDateTimeInput;
vm.$store.commit("setNativeDateTimeInput", vm.nativeDateTimeInput);
},
mapUrlSelectionChanged(val) {
this.obj.mapUrlTemplate = val;
this.fieldValueChanged("mapUrlTemplate");
@@ -498,7 +516,8 @@ async function fetchTranslatedText(vm) {
"UserPhone1",
"UserPhone2",
"UserPageAddress",
"AuthTwoFactor"
"AuthTwoFactor",
"NativeDateTimeInput"
]);
}