プラグイン > その他 > datetimepickerの動作について |
その他
スレッド表示 | 新しいものから | 前のトピック | 次のトピック | 下へ |
投稿者 | スレッド |
---|---|
beginnerA |
投稿日時: 2023/1/27 22:25
対応状況: 解決済
|
新米 ![]() ![]() 登録日: 2020/6/13 居住地: 投稿: 4 |
datetimepickerの動作について ▼テンプレート
[EC-CUBE] 4.2.0 [OS] Linux [PHP] 8.1.9 [データベース] MySQL 8.0.28 [WEBサーバ] Apache [ブラウザ] Chrome [導入プラグインの有無] プリインストールプラグイン [カスタマイズの有無] オリジナルプラグイン作成中 [現象] 現在勉強を兼ねてオリジナルプラグインの作成を試しています。 プラグインの仕様としては管理者権限と下位権限で管理画面側の画面表示を切り替えするものです。 プラグインのEvent.phpにて条件分岐させテンプレートを切り分けしています。 商品一覧ページのテンプレートを条件分岐させています。 プラグインのEvent.php ========== /** * @param TemplateEvent $templateEvent * @var Crawler */ public function onTemplateAdminProductIndex(TemplateEvent $templateEvent) { if (管理権限の条件分岐) { //管理者なら $source = $this->twig->getLoader() ->getSourceContext("@plgName/admin/Product/index.twig") ->getCode(); $templateEvent->setSource($source); } else { //管理者下位権限なら $source = $this->twig->getLoader() ->getSourceContext("@plgName/admin/Product/index_custom.twig") ->getCode(); $templateEvent->setSource($source); } } 上記に加え、SearchProductTypeExtensionを作成して詳細検索のフォーム部分のカスタマイズも行なっています。 SearchProductTypeExtension.php ========== /** * {@inheritdoc} */ public function buildForm(FormBuilderInterface $builder, array $options) { ~~ 処理 ~~ if (管理権限の条件分岐) { //管理者なら $builder->add(~~~ ~~処理~~ } else { //管理者下位権限なら $builder->remove('tag_id'); } ~~ 処理 ~~ } このような処理を行なっています。 管理者権限でログインして商品一覧ページを閲覧した場合、表示も問題なくフォームも正常に動いています。 管理者下位権限でログインして商品一覧ページを閲覧した際、ページは表示されますが詳細検索のフォーム部分に異常があります。 【正常】 ・登録日のinput部分 年/月/日 --:-- ■ 〜 年/月/日 --:-- ■ ・更新日 年/月/日 --:-- ■ 〜 年/月/日 --:-- ■ ※■にはカレンダーアイコンが入ります。 このように表示され、クリックするとEC-CUBEのピッカーが表示されます。 しかし、管理者下位権限で閲覧した場合 【異常】 ・登録日のinput部分 yyyy/mm/dd --:-- 〜 yyyy/mm/dd --:-- ・更新日 yyyy/mm/dd --:-- 〜 yyyy/mm/dd --:-- 以上のように表示され、カレンダーアイコンも表示されません。 この状態ではEC-CUBE仕様のピッカーも表示されないのですが、 https://gyroibaraki.com/wp-content/uploads/2021/03/694d52529b92d14d48f28b5ab94e8b6c.png [引用] 上記の形式に近い日付までが選べるピッカーは表示されます。 私自身は原因はEventを経由して別のテンプレートに分岐させた上で、FormExtensionで拡張している事で各々の読み込みのタイミングの兼ね合いかと思っています。 試しに@ShoppingMall/admin/Product/index_custom.twigのscriptブロック部分に以下のコードを代入してみました。 <script> $(function() { if ($('[type="date"]').prop('type') != 'date') { // input type属性でdateが利用できるかどうか(カレンダー表示できないブラウザ対応) $.when( $.getScript("{{ asset('assets/js/vendor/moment.min.js', 'admin') }}"), $.getScript("{{ asset('assets/js/vendor/moment-with-locales.min.js', 'admin') }}"), $.getScript("{{ asset('assets/js/vendor/tempusdominus-bootstrap-4.min.js', 'admin') }}") ).done(function() { // datetimepicker で value が消えてしまうので data-value に保持しておく $('input.datetimepicker-input').each(function() { $(this).data('value', $(this).val()); }); $('input.datetimepicker-input').datetimepicker({ locale: '{{ eccube_config.locale }}', format: 'YYYY-MM-DD HH:mm', useCurrent: false, buttons: { showToday: true, showClose: true }, }); // datetimepicker で value が消えてしまうので更新 $('input.datetimepicker-input').each(function() { $(this).val($(this).data('value')); }); }); } }); </script> 【結果】 ・登録日のinput部分 yyyy/mm/dd --:-- 〜 yyyy/mm/dd --:-- ・更新日 yyyy/mm/dd --:-- 〜 yyyy/mm/dd --:-- 表示についてはそのままですが、クリックするとdatetimepickerが呼ばれます。 しかし、datetimepickerの上に先ほどの形式のピッカーが被って表示されてします形です。 それでもdatetimepickerの方で選択して検索をすると検索と検索結果は正常に走っているようです。 input部分も検索後にValueが引き継がれている状態なので、その部分については機能しているような気がします。 解決策としては、@plgName/admin/Product/index_custom.twigに対して、searchProductTypeをクローン、リネームしたものを作成して動作させれば機能する気もするのですが、それを行わないで解決する方法はないでしょうか。 [解決したいこと] ・EC-CUBEの商品一覧 詳細検索のデフォルトのピッカーを表示させたい ・年/月/日 --:-- ■ の表示形式にしたい ※■にはカレンダーアイコンが入ります。 お分かりになる方がおりましたら、教えていただけると幸いです。 よろしくお願い致します。 2023/1/30日追記====== 自己解決しました。 原因は、管理下位権限で閲覧する際にFireFoxで閲覧していた為、ピッカー部分の表示がChromeの際と異なっていた為でした。 お騒がせ致しました。 firefoxの場合、ピッカー部分は yyyy/mm/dd --:-- と表記になり、日付はピッカーで選択し、時間はキー入力する形になるようです。 この表示について、yyyy/mm/dd を年月日とする方法はあるのでしょうか。 この疑問だけは解決できないままです。 |
スレッド表示 | 新しいものから | 前のトピック | 次のトピック | トップ |