F24d9 custom time format (#473)

* fix password reset bug

* feat: time format in dat input

* fix lint issues

* fix time prefill, time format backend

* fix time format in OpenDate

---------

Co-authored-by: Julien Nahum <julien@nahum.net>

client/components/open/forms/OpenFormField.vue

@@ -306,6 +306,7 @@ export default {
         inputProperties.searchable = (inputProperties.options.length > 4)
       } else if (field.type === 'date') {
         inputProperties.dateFormat = field.date_format
+        inputProperties.timeFormat = field.time_format
         if (field.with_time) {
           inputProperties.withTime = true
         }

client/components/open/forms/components/FormSubmissions.vue

@@ -163,12 +163,11 @@
 <script>
 import Fuse from 'fuse.js'
 import clonedeep from 'clone-deep'
-import VSwitch from '../../../forms/components/VSwitch.vue'
 import OpenTable from '../../tables/OpenTable.vue'
 
 export default {
   name: 'FormSubmissions',
-  components: {OpenTable, VSwitch},
+  components: {OpenTable},
   props: {},
 
   setup() {

client/components/open/forms/fields/components/FieldOptions.vue

@@ -254,6 +254,14 @@
         :searchable="true"
         help="Make sure to select the same timezone you're using in Notion. Leave blank otherwise."
       />
+      <flat-select-input
+        v-if="field.with_time"
+        name="time_format"
+        class="mt-4"
+        :form="field"
+        :options="timeFormatOptions"
+        label="Time format"
+      />
       <flat-select-input
         name="date_format"
         class="mt-4"
@@ -413,6 +421,7 @@
         name="prefill"
         class="mt-3"
         :form="field"
+        :time-format="field.time_format"
         :with-time="field.with_time === true"
         :date-range="field.date_range === true"
         label="Pre-filled value"
@@ -645,6 +654,10 @@ export default {
         }
       })
     },
+    timeFormatOptions() {
+      return [{ name: '13:00', value: '24', },
+      { name: '01:00 PM', value: '12', },]
+    },
     displayBasedOnAdvanced() {
       if (this.field.generates_uuid || this.field.generates_auto_increment_id) {
         return false
@@ -755,7 +768,7 @@ export default {
         this.field.disable_future_dates = false
         this.field.disable_past_dates = false
       } else {
-        this.field.prefill = null
+        this.field.prefill = this.field.prefill ?? null
       }
     },
     onFieldAllowCreationChange(val) {
@@ -823,7 +836,8 @@ export default {
           max_char_limit: 2000
         },
         date: {
-          date_format: this.dateFormatOptions[0].value
+          date_format: this.dateFormatOptions[0].value,
+          time_format: this.timeFormatOptions[0].value
         }
       }
       if (this.field.type in defaultFieldValues) {

client/components/open/tables/components/OpenDate.vue

@@ -39,9 +39,10 @@ export default {
     formattedDate(val) {
       if (!val) return ''
       const dateFormat = _has(this.property, 'date_format') ? this.property.date_format : 'dd/MM/yyyy'
+      const timeFormat = _has(this.property, 'time_format') ? this.property.time_format : '24'
       if (this.property?.with_time) {
         try {
-          return format(new Date(val), dateFormat + ' HH:mm')
+          return format(new Date(val), dateFormat + (timeFormat == 12 ? ' p':' HH:mm'))
         } catch (e) {
           return ''
         }