Browse Source

add datetime picker

develop
Simon Vieille 2 weeks ago
parent
commit
d64160961f
  1. 31
      assets/js/admin/datepicker.js
  2. 3
      package.json
  3. 9
      src/Form/Blog/PostType.php
  4. 7
      yarn.lock

31
assets/js/admin/datepicker.js

@ -1,26 +1,27 @@
const Datepicker = require('vanillajs-datepicker')
const Flatpickr = require("flatpickr").default;
const French = require('flatpickr/dist/l10n/fr').default.fr;
const isDateSupported = () => {
const input = document.createElement('input');
const value = 'a';
input.setAttribute('type', 'date');
input.setAttribute('value', value);
return input.value !== value;
}
require('flatpickr/dist/flatpickr.css')
module.exports = () => {
if (isDateSupported()) {
return
}
const inputs = document.querySelectorAll('input[type="date"]')
const size = inputs.length
let inputs = document.querySelectorAll('input[type="date"]')
let size = inputs.length
for (var i = 0, c = inputs.length; i < c; i++) {
new Datepicker.Datepicker(inputs[i], {
format: 'yyyy-mm-dd'
})
}
inputs = document.querySelectorAll('input[data-datetime]')
size = inputs.length
for (var i = 0, c = inputs.length; i < c; i++) {
Flatpickr(inputs[i], {
enableTime: true,
dateFormat: "d/m/Y h:i",
locale: French
})
}
}

3
package.json

@ -22,6 +22,7 @@
"@fortawesome/fontawesome-free": "^5.11.2",
"bootstrap": "^4.3.1",
"choices.js": "^9.0.1",
"flatpickr": "^4.6.9",
"jquery": "^3.6.0",
"lozad": "^1.16.0",
"particles.js": "^2.0.0",
@ -31,7 +32,7 @@
"qrcodejs": "^1.0.0",
"simplemde": "^1.11.2",
"tinymce": "^5.7.1",
"vanillajs-datepicker": "^1.1.2",
"vanillajs-datepicker": "^1.1.4",
"wire.css": "^1.2.5",
"zxcvbn": "^4.4.2"
}

9
src/Form/Blog/PostType.php

@ -22,6 +22,8 @@ use Symfony\Component\Form\Extension\Core\Type\NumberType;
use Symfony\Component\Validator\Constraints\Range;
use Symfony\Component\Validator\Constraints\Url;
use Symfony\Component\Form\Extension\Core\Type\CheckboxType;
use Symfony\Component\Validator\Constraints\DateTime;
use Symfony\Component\Form\Extension\Core\Type\DateTimeType;
class PostType extends AbstractType
{
@ -128,16 +130,17 @@ class PostType extends AbstractType
$builder->add(
'publishedAt',
DateType::class,
DateTimeType::class,
[
'label' => 'Date de publication',
'required' => false,
'html5' => true,
'html5' => false,
'widget' => 'single_text',
'format' => 'dd/MM/yyyy hh:mm',
'attr' => [
'data-datetime' => '',
],
'constraints' => [
new Date(),
],
]
);

7
yarn.lock

@ -2773,6 +2773,11 @@ find-up@^4.0.0:
locate-path "^5.0.0"
path-exists "^4.0.0"
flatpickr@^4.6.9:
version "4.6.9"
resolved "https://registry.yarnpkg.com/flatpickr/-/flatpickr-4.6.9.tgz#9a13383e8a6814bda5d232eae3fcdccb97dc1499"
integrity sha512-F0azNNi8foVWKSF+8X+ZJzz8r9sE1G4hl06RyceIaLvyltKvDl6vqk9Lm/6AUUCi5HWaIjiUbk7UpeE/fOXOpw==
follow-redirects@^1.0.0:
version "1.13.3"
resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.13.3.tgz#e5598ad50174c1bc4e872301e82ac2cd97f90267"
@ -6104,7 +6109,7 @@ validate-npm-package-license@^3.0.1:
spdx-correct "^3.0.0"
spdx-expression-parse "^3.0.0"
vanillajs-datepicker@^1.1.2:
vanillajs-datepicker@^1.1.4:
version "1.1.4"
resolved "https://registry.yarnpkg.com/vanillajs-datepicker/-/vanillajs-datepicker-1.1.4.tgz#247a5969739ca17895ae53e30218293e230e6cad"
integrity sha512-XJhvRx+VqtRjqrPlgNCQntLpCntFKPMBd8ahxZhLkvrWX0bNdpP3kz5j13L2Q0xfTAY/QMfQtVZvBvRF0NilcA==

Loading…
Cancel
Save