Ad example

app/javascript/dashboard/App.vue

@@ -28,6 +28,7 @@ import UpdateBanner from './components/app/UpdateBanner.vue';
 import vueActionCable from './helper/actionCable';
 import WootSnackbarBox from './components/SnackbarContainer';
 import rtlMixin from 'shared/mixins/rtlMixin';
+import * as chrono from 'chrono-node';
 import {
   registerSubscription,
   verifyServiceWorkerExistence,
@@ -81,6 +82,25 @@ export default {
   },
   mounted() {
     this.setLocale(window.chatwootConfig.selectedLocale);
+    console.log(
+      'An appointment on Sep 12-13unted --->',
+      chrono.parseDate('An appointment on Sep 12-13')
+    );
+    console.log('tomorrow --->', chrono.parseDate('tomorrow'));
+    console.log(
+      'tomorrow at 9.00AM --->',
+      chrono.parseDate('tomorrow at 9.00AM')
+    );
+    console.log('may 31 --->', chrono.parseDate('may 31'));
+    console.log('12.30 --->', chrono.parseDate('12.30'));
+    console.log('9.00AM --->', chrono.parseDate('9.00AM'));
+    console.log('tuesday --->', chrono.parseDate('tuesday'));
+    console.log('after 5 days --->', chrono.parseDate('after 5 days'));
+    console.log('tom 13.00 --->', chrono.parseDate('tom 13.00'));
+    console.log(
+      'next month 10.00AM --->',
+      chrono.parseDate('next month 10.00AM')
+    );
   },
   methods: {
     setLocale(locale) {

app/javascript/dashboard/components/CustomAttribute.vue

@@ -115,12 +115,10 @@
 </template>
 
 <script>
-import format from 'date-fns/format';
 import { required, url } from 'vuelidate/lib/validators';
 import { BUS_EVENTS } from 'shared/constants/busEvents';
 import MultiselectDropdown from 'shared/components/ui/MultiselectDropdown.vue';
 import { isValidURL } from '../helper/URLHelper';
-const DATE_FORMAT = 'yyyy-MM-dd';
 
 export default {
   components: {
@@ -144,9 +142,6 @@ export default {
 
   computed: {
     formattedValue() {
-      if (this.isAttributeTypeDate) {
-        return format(new Date(this.value || new Date()), DATE_FORMAT);
-      }
       if (this.isAttributeTypeCheckbox) {
         return this.value === 'false' ? false : this.value;
       }
@@ -193,8 +188,11 @@ export default {
       return this.$t('CUSTOM_ATTRIBUTES.VALIDATIONS.REQUIRED');
     },
     displayValue() {
-      if (this.attributeType === 'date') {
-        return format(new Date(this.editedValue), 'dd-MM-yyyy');
+      if (this.attributeType === 'date' && this.editedValue) {
+        return this.editedValue
+          .split('-')
+          .reverse()
+          .join('-');
       }
       return this.editedValue;
     },
@@ -247,17 +245,12 @@ export default {
       }
     },
     onUpdate() {
-      const updatedValue =
-        this.attributeType === 'date'
-          ? format(new Date(this.editedValue), DATE_FORMAT)
-          : this.editedValue;
-
       this.$v.$touch();
       if (this.$v.$invalid) {
         return;
       }
       this.isEditing = false;
-      this.$emit('update', this.attributeKey, updatedValue);
+      this.$emit('update', this.attributeKey, this.editedValue);
     },
     onDelete() {
       this.isEditing = false;

package.json

@@ -35,6 +35,7 @@
     "babel-plugin-syntax-jsx": "^6.18.0",
     "babel-plugin-transform-vue-jsx": "^3.7.0",
     "chart.js": "~2.9.4",
+    "chrono-node": "^2.6.3",
     "company-email-validator": "^1.0.8",
     "core-js": "3.11.0",
     "date-fns": "2.21.1",

yarn.lock

@@ -6859,6 +6859,13 @@ chrome-trace-event@^1.0.2:
   resolved "https://registry.yarnpkg.com/chrome-trace-event/-/chrome-trace-event-1.0.3.tgz#1015eced4741e15d06664a957dbbf50d041e26ac"
   integrity sha512-p3KULyQg4S7NIHixdwbGX+nFHkoBiA4YQmyWtjb8XngSKV124nJmRysgAeujbUVb15vh+RvFUfCPqU7rXk+hZg==
 
+chrono-node@^2.6.3:
+  version "2.6.3"
+  resolved "https://registry.yarnpkg.com/chrono-node/-/chrono-node-2.6.3.tgz#fa257cffb2dfc33fa5a01b26bd86f93741ca6dc5"
+  integrity sha512-VkWaaZnNulqzNH9i4XCdyI05OX6MFEnCMNKdZOR4w//wS5/E2qkwAss/O5sj6SfTZK84fX4SSOG4pzqjqIseiA==
+  dependencies:
+    dayjs "^1.10.0"
+
 ci-info@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-2.0.0.tgz#67a9e964be31a51e15e5010d58e6f12834002f46"
@@ -7790,6 +7797,11 @@ date-format-parse@^0.2.6:
   resolved "https://registry.yarnpkg.com/date-format-parse/-/date-format-parse-0.2.6.tgz#7ed42817efb6ec39532169eada9670ae3c627aa7"
   integrity sha512-sdxnYAWmLopeb+6Hmw+vo3or4OCJOnh4+YoJ9p+Id3o2EnNP0INpTqx7wr8UregfMpgaSZAH473R/ytiaB3gVg==
 
+dayjs@^1.10.0:
+  version "1.11.7"
+  resolved "https://registry.yarnpkg.com/dayjs/-/dayjs-1.11.7.tgz#4b296922642f70999544d1144a2c25730fce63e2"
+  integrity sha512-+Yw9U6YO5TQohxLcIkrXBeY73WP3ejHWVvx8XCk3gxvQDCTEmS48ZrSZCKciI7Bhl/uCMyxYtE9UqRILmFphkQ==
+
 de-indent@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"