add datetime picker
This commit is contained in:
parent
df910d1ed2
commit
d64160961f
|
@ -1,26 +1,27 @@
|
||||||
const Datepicker = require('vanillajs-datepicker')
|
const Datepicker = require('vanillajs-datepicker')
|
||||||
|
const Flatpickr = require("flatpickr").default;
|
||||||
|
const French = require('flatpickr/dist/l10n/fr').default.fr;
|
||||||
|
|
||||||
const isDateSupported = () => {
|
require('flatpickr/dist/flatpickr.css')
|
||||||
const input = document.createElement('input');
|
|
||||||
const value = 'a';
|
|
||||||
|
|
||||||
input.setAttribute('type', 'date');
|
|
||||||
input.setAttribute('value', value);
|
|
||||||
|
|
||||||
return input.value !== value;
|
|
||||||
}
|
|
||||||
|
|
||||||
module.exports = () => {
|
module.exports = () => {
|
||||||
if (isDateSupported()) {
|
let inputs = document.querySelectorAll('input[type="date"]')
|
||||||
return
|
let size = inputs.length
|
||||||
}
|
|
||||||
|
|
||||||
const inputs = document.querySelectorAll('input[type="date"]')
|
|
||||||
const size = inputs.length
|
|
||||||
|
|
||||||
for (var i = 0, c = inputs.length; i < c; i++) {
|
for (var i = 0, c = inputs.length; i < c; i++) {
|
||||||
new Datepicker.Datepicker(inputs[i], {
|
new Datepicker.Datepicker(inputs[i], {
|
||||||
format: 'yyyy-mm-dd'
|
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
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -22,6 +22,7 @@
|
||||||
"@fortawesome/fontawesome-free": "^5.11.2",
|
"@fortawesome/fontawesome-free": "^5.11.2",
|
||||||
"bootstrap": "^4.3.1",
|
"bootstrap": "^4.3.1",
|
||||||
"choices.js": "^9.0.1",
|
"choices.js": "^9.0.1",
|
||||||
|
"flatpickr": "^4.6.9",
|
||||||
"jquery": "^3.6.0",
|
"jquery": "^3.6.0",
|
||||||
"lozad": "^1.16.0",
|
"lozad": "^1.16.0",
|
||||||
"particles.js": "^2.0.0",
|
"particles.js": "^2.0.0",
|
||||||
|
@ -31,7 +32,7 @@
|
||||||
"qrcodejs": "^1.0.0",
|
"qrcodejs": "^1.0.0",
|
||||||
"simplemde": "^1.11.2",
|
"simplemde": "^1.11.2",
|
||||||
"tinymce": "^5.7.1",
|
"tinymce": "^5.7.1",
|
||||||
"vanillajs-datepicker": "^1.1.2",
|
"vanillajs-datepicker": "^1.1.4",
|
||||||
"wire.css": "^1.2.5",
|
"wire.css": "^1.2.5",
|
||||||
"zxcvbn": "^4.4.2"
|
"zxcvbn": "^4.4.2"
|
||||||
}
|
}
|
||||||
|
|
|
@ -22,6 +22,8 @@ use Symfony\Component\Form\Extension\Core\Type\NumberType;
|
||||||
use Symfony\Component\Validator\Constraints\Range;
|
use Symfony\Component\Validator\Constraints\Range;
|
||||||
use Symfony\Component\Validator\Constraints\Url;
|
use Symfony\Component\Validator\Constraints\Url;
|
||||||
use Symfony\Component\Form\Extension\Core\Type\CheckboxType;
|
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
|
class PostType extends AbstractType
|
||||||
{
|
{
|
||||||
|
@ -128,16 +130,17 @@ class PostType extends AbstractType
|
||||||
|
|
||||||
$builder->add(
|
$builder->add(
|
||||||
'publishedAt',
|
'publishedAt',
|
||||||
DateType::class,
|
DateTimeType::class,
|
||||||
[
|
[
|
||||||
'label' => 'Date de publication',
|
'label' => 'Date de publication',
|
||||||
'required' => false,
|
'required' => false,
|
||||||
'html5' => true,
|
'html5' => false,
|
||||||
'widget' => 'single_text',
|
'widget' => 'single_text',
|
||||||
|
'format' => 'dd/MM/yyyy hh:mm',
|
||||||
'attr' => [
|
'attr' => [
|
||||||
|
'data-datetime' => '',
|
||||||
],
|
],
|
||||||
'constraints' => [
|
'constraints' => [
|
||||||
new Date(),
|
|
||||||
],
|
],
|
||||||
]
|
]
|
||||||
);
|
);
|
||||||
|
|
|
@ -2773,6 +2773,11 @@ find-up@^4.0.0:
|
||||||
locate-path "^5.0.0"
|
locate-path "^5.0.0"
|
||||||
path-exists "^4.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:
|
follow-redirects@^1.0.0:
|
||||||
version "1.13.3"
|
version "1.13.3"
|
||||||
resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.13.3.tgz#e5598ad50174c1bc4e872301e82ac2cd97f90267"
|
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-correct "^3.0.0"
|
||||||
spdx-expression-parse "^3.0.0"
|
spdx-expression-parse "^3.0.0"
|
||||||
|
|
||||||
vanillajs-datepicker@^1.1.2:
|
vanillajs-datepicker@^1.1.4:
|
||||||
version "1.1.4"
|
version "1.1.4"
|
||||||
resolved "https://registry.yarnpkg.com/vanillajs-datepicker/-/vanillajs-datepicker-1.1.4.tgz#247a5969739ca17895ae53e30218293e230e6cad"
|
resolved "https://registry.yarnpkg.com/vanillajs-datepicker/-/vanillajs-datepicker-1.1.4.tgz#247a5969739ca17895ae53e30218293e230e6cad"
|
||||||
integrity sha512-XJhvRx+VqtRjqrPlgNCQntLpCntFKPMBd8ahxZhLkvrWX0bNdpP3kz5j13L2Q0xfTAY/QMfQtVZvBvRF0NilcA==
|
integrity sha512-XJhvRx+VqtRjqrPlgNCQntLpCntFKPMBd8ahxZhLkvrWX0bNdpP3kz5j13L2Q0xfTAY/QMfQtVZvBvRF0NilcA==
|
||||||
|
|
Loading…
Reference in a new issue