分享一下解決Dcat Admin左側選單不重新整理的問題

Ly_ii 發表於 2021-06-19

起因

遇到一個需求,客戶要選單欄提示當前欄目下未處理資料的數量

解決過程

  • 首先我想到的是直接在後端獲取到相關的資料,然後前端渲染,修改app\Admin\bootstrap.php

       \Dcat\Admin\Layout\Content::resolving(function (\Dcat\Admin\Layout\Content $content) {
          //未稽核文章數
          $unCheckedArticle = \App\Models\Article::query()->where('status', false)->count();
          //未稽核需求數
          $unCheckedNeed = \App\Models\Need::query()->where('status', false)->count();
          //未稽核作品數
          $unCheckedProduct = \App\Models\Product::query()->where('status', false)->count();
    
          $total = $unVerifyProduct + $unVerifyNeed + $unVerifyArticle;
          view()->share([
             'unCheckedArticle' => $unCheckedArticle,
              'unCheckedNeed' => $unCheckedNeed,
              'unCheckedProduct' => $unCheckedProduct,
              'total' => $total
          ]);
      });
  • 修改前端頁面後展示沒有問題

分享一下解決Dcat Admin左側選單不重新整理的問題

  • 後面測試發現,在編輯,修改過後選單欄的數量是不更新的(必須手動重新整理頁面),想了一下,哦,可能是pjax的問題

    分享一下解決Dcat Admin左側選單不重新整理的問題

    於是我想禁用pjax,全站重新整理,修改app\Admin\bootstrap.php

      Admin::disablePjax();  

    結果是沒有效果的,去看一下,這個是不是有點小問題~ [@Jiangqh] (learnku.com/users/38389)
    分享一下解決Dcat Admin左側選單不重新整理的問題
    分享一下解決Dcat Admin左側選單不重新整理的問題
    換個寫法(依然沒用!)

       (new Admin())->pjax(false);

去查了很多資料(百度,手動狗頭),也沒有解決問題的方法,偶然看到了pjax的事件,然後有了思路

新建admin-extend.js

     (function($){
        var AdminExtended = {
            init: function(){
                var self = this;
                $(document).on('pjax:start', function() {

                });

                $(document).on('pjax:end', function() {

                });

                $(document).on('pjax:complete', function() {
                    self.refreshPage();
                });
                // 正常頁面載入成功後的初始化
                self.refreshPage()
            },
            refreshPage: function() {
              window.location.reload()

            }

        };
        window.AdminExtended = AdminExtended;
    })(jQuery);

    $(document).ready(function()
    {
        AdminExtended.init();
    }); 

全域性載入寫好的JS檔案,回到app\Admin\bootstrap.php

if (\Illuminate\Support\Facades\Route::current()->uri() != 'admin/auth/login') {
    Admin::js('/vendor/dcat-admin/dcat/js/admin-extend.js');
}

在回頭去測試,pjax重新整理後會重新整站重新整理頁面(右邊內容區會重新整理兩次),功能基本實現了,可是體驗太差(忍不了)

優化

    refreshPage: function() {
        //  window.location.reload()
        $.ajax({
        url: 'xxx',
        success: function(result) {
        //jquery操作DOM
        }
        })
    } 

refreshPage方法改為了非同步去獲取資料,jquery去操作DOM,體驗好多了

分享一下解決Dcat Admin左側選單不重新整理的問題

結束

想問下大佬@Jiangqh 有沒簡單點的解決方法:neutral_face:

本作品採用《CC 協議》,轉載必須註明作者和本文連結

相關文章