techouse/intl-date-time

International datepicker field for Laravel Nova.

Installs: 33 938

Dependents: 0

Suggesters: 0

Security: 0

Stars: 44

Watchers: 3

Forks: 9

Open Issues: 2

Language:Vue

v1.6.1 2020-09-12 09:31 UTC

README

Latest Version on Packagist Total Downloads Licence PHP version Codacy Badge GitHub stars

International datepicker for Laravel Nova

Apply localisation in 71 different locales to Laravel Nova's default DateTime field that currently doesn't support localisation out of the box.

International DateTime

Installation

You can install the package in to a Laravel app that uses Nova via composer:

composer require techouse/intl-date-time

Usage

The API is adapted from Nova's default DateTime Field.

The module itself offers a few optional configurations:

  • locale - OPTIONAL - Set the module's locale. If you do not it will automatically use your app's config('app.locale'). If you manually define an unsupported locale it will throw an Exception!
  • dateFormat - OPTIONAL - Set a date format. If you do not provide it the module will automatically use the appropriate locale's date format. The format must be MomentJS compatible!
  • timeFormat - OPTIONAL - Set a time format. The format must be MomentJS compatible! If you manually define an unsupported time format it will throw an Exception!
  • minDate - OPTIONAL - Set a minimum/earliest date (inclusively) allowed for selection. Has to be an instance of \DateTime or Carbon\Carbon. Defaults to null.
  • maxDate - OPTIONAL - Set a maximum/latest date (inclusively) allowed for selection. Has to be an instance of \DateTime or Carbon\Carbon. Defaults to null.
  • placeholder - OPTIONAL - Set a placeholder. If you do not want a placeholder set it to false.
  • errorMessage - OPTIONAL - Set a custom error message in case of an invalid date format. If you do not set it it will display an error message in the current locale.
  • errorMessageLocale - OPTIONAL - Set a custom error message locale. If not set it equals the set locale or your app's config('app.locale'). If you manually define an unsupported locale it will throw an Exception! Here is the list of all supported locales.
  • hideUserTimeZone - OPTIONAL - When applied hides the user time zone next to the form field. Default is false.
  • withShortcutButtons - OPTIONAL - When applied shows the user 3 shortcut buttons for 'yesterday, 'today' and 'tomorrow' below the calendar. The buttons are all in English and in order to translate them please edit your language JSON file in the directory resources/lang/vendor/nova.
  • withTime - OPTIONAL - Shortcut for displaying the full locale time, e.g. HH:mm:ss. NOTE: The timeFormat option has precedence over withTime.
  • withTimeShort - OPTIONAL - Shortcut for displaying the short locale time, e.g. HH:mm. NOTE: The timeFormat option has precedence over withTimeShort.

Simply use IntlDateTime class instead of DateTime directly or alias it like the example below so you won't have to refactor too much existing code.

<?php

namespace App\Nova;

use Carbon\Carbon;
use Illuminate\Http\Request;
use Techouse\IntlDateTime\IntlDateTime as DateTime;

class User extends Resource
{
    /**
     *  This is how you use and configure this module
     */
    public function fields(Request $request)
    {
        return [
            DateTime::make(__('Updated at'), 'updated_at')
                    /**
                     * The module automatically uses your app's locale 
                     * from config('app.locale'), however you can manually
                     * override this by setting it like this.
                     * 
                     * IMPORTANT: Check the list of supported locales below in this readme!
                     * 
                     * NOTE: If the automatic locale is not supported by MomentJS 
                     * the module defaults to 'en-gb' (British English).
                     */
                    ->locale('sl'),
                    
            DateTime::make(__('Created at'), 'created_at')
                    /**
                      * You can optionally set a custom DATE format.
                      * 
                      * It has to be compatible with MomentJS!!!
                      * https://momentjs.com/docs/#/displaying/format/
                      */
                    ->dateFormat('DD.MM.YYYY'),   
                    
            DateTime::make(__('Deleted at'), 'deleted_at')
                    /**
                      * You can optionally set a custom TIME format
                      * 
                      * It has to be compatible with MomentJS!!!
                      * https://momentjs.com/docs/#/displaying/format/
                      */
                    ->timeFormat('HH:mm:ss'),
                    
            DateTime::make(__('Packaged on'), 'packaged_on')
                    /**
                      * You can optionally set a placeholder, otherwise
                      * it will default to your timezone's date format 
                      */
                    ->placeholder('DD.MM.LLLL'),
                    
            DateTime::make(__('Shipped on'), 'shipped_on')
                    /**
                      * You can disable the placeholder by setting it to false
                      */
                    ->placeholder(false),
                    
            DateTime::make(__('Birthday'), 'birthday')
                    /**
                      * You can override the default date invalid error message
                      */
                    ->errorMessage("I don't think you were born on that day mate :D"),
                    
            DateTime::make(__('Day of graduation'), 'graduated_on')
                    /**
                      * Unless you override the error message locale it equals the locale setting
                      */
                    ->errorMessageLocale('de'),
                    
            DateTime::make(__('Takes place at'), 'takes_place_at')
                    /**
                     * Set a minimum/earliest date (inclusively) allowed for selection.
                     */
                    ->minDate(Carbon::parse('1990-05-30'))
                    /**
                     * Set a maximum/latest date (inclusively) allowed for selection.
                     */
                    ->maxDate(Carbon::today()),
            
            DateTime::make(__('Day you got married'), 'day_you_got_married')
                    /**
                     * Hide the user time zone next to the form input field.
                     */
                    ->hideUserTimeZone(),

            DateTime::make(__('Date of travel'), 'date_of_travel')
                    /**
                     * Display shortcut buttons for "yesterday", "today" and "tomorrow".
                     * Translate them in your language's JSON file located in resources/lang/vendor/nova.
                     */
                    ->withShortcutButtons(),

            DateTime::make(__('Time of arrival'), 'time_of_arrival')
                    /**
                     * Shortcut for displaying the full locale time, e.g. HH:mm:ss.
                     * 
                     * NOTE: The timeFormat option has precedence over withTime.
                     */
                    ->withTime(),

            DateTime::make(__('Time of reservation'), 'time_of_reservation')
                    /**
                     * Shortcut for displaying the short locale time, e.g. HH:mm.
                     * 
                     * NOTE: The timeFormat option has precedence over withTimeShort.
                     */
                    ->withTimeShort(),
        ];
    }

    /**
     * The rest of the Resource ... bla bla bla :)
     */
}

List of supported locales

This module supports only locales that are SUPPORTED BY BOTH MomentJS AND Flatpickr!

The 71 locales that are currently supported are:

Language locale
Albanian sq
Arabic ar
Azerbaijani az
Bangla bn
Belarusian be
Bosnian bs
Bulgarian bg
Burmese my
Catalan ca
Chinese (China) zh-cn
Chinese (Hong Kong) zh-hk
Chinese (Taiwan) zh-tw
Croatian hr
Czech cs
Danish da
Dutch nl
English en
English (Australia) en-au
English (Canada) en-ca
English (Ireland) en-ie
English (New Zealand) en-nz
English (United Kingdom) en-gb
Esperanto eo
Estonian et
Faroese fo
Finnish fi
French fr
French (Canada) fr-ca
French (Switzerland) fr-ch
Georgian ka
German de
German (Austria) de-at
German (Switzerland) de-ch
Greek el
Hebrew he
Hindi hi
Hungarian hu
Indonesian id
Icelandic is
Irish Gaelic ga
Italian it
Japanese ja
Kazakh kk
Khmer km
Korean ko
Latvian lv
Lithuanian lt
Macedonian mk
Malaysian ms
Mongolian mn
Norwegian nb
Persian fa
Polish pl
Portuguese pt
Portuguese (Brazil) pt-br
Punjabi pa-in
Romanian ro
Russian ru
Serbian sr
Serbian (Cyrillic) sr-cyrl
Sinhala si
Slovak sk
Slovenian sl
Spanish es
Spanish (Dominican Republic) es-do
Spanish (United States) es-us
Swedish sv
Thai th
Turkish tr
Ukrainian uk
Vietnamese vi
Welsh cy
NOTE

This an evolution of my original Slovenian DateTime