一步一步使用Ext JS MVC與Asp.Net MVC 3開發簡單的CMS後台管理系統之調整首頁顯示

登入後，因為只是重新整理首頁，並沒有跳轉頁面，因而要調整一下首頁顯示，以便登入後顯示系統介面。

要區分登入前和登入後，判斷Request的IsAuthenticated方法就可以。因為要通過伺服器段代碼執行不同的指令碼，因而要將Loder這些公用代碼抽出來獨立在一個Script塊裡，而不同的指令碼在不同的代碼裡，最終代碼如下：

<script>

   Ext.Loader.setConfig({

       enabled: true,

       paths: {

            'Ext.ux':'scripts/extjs/ux'

        }

    });

</script>

 

    @{

        if(Request.IsAuthenticated)

        {

            <script>

            </script>

        }

        else

        {

            <script>

               Ext.require('Ext.ux.Login');

 

                Ext.onReady(function () {

                   if (Ext.BLANK_IMAGE_URL.substr(0, 4) != "data") {

                        Ext.BLANK_IMAGE_URL ="Content/Images/s.gif";

                   }

 

                   Ext.ux.Login.show();

                })

            </script>

        }

    }

 

 

 

因為要調用應用程式產生介面，因而要讓Ext JS知道應用的目錄，所以在Loader的paths中加入以下代碼：

'SimpleCMS': 'scripts/app'

 

認證後，需要將使用者資訊寫如一個對象，以便控制應用程式的許可權，因而加入以下代碼：

            var roles = Roles.GetRolesForUser(User.Identity.Name);

            var rolesstring = "";

            foreach (var c in roles)

            {

               rolesstring += string.Format("'{0}',", c);

            }

           rolesstring = rolesstring.Substring(0, rolesstring.Length - 1);

            <script>

 

               SimpleCMS.Userinfo = {

                   Roles:[

                        @Html.Raw(rolesstring)

                   ]

               };

 

            </script>

 

這裡只是簡單的把使用者角色寫入Userinfo對象中。如果需要其它使用者資訊，可以根據具體情況構造這個對象，只要便於訪問就行了。

這裡有個問題，就是全部對象SimpleCMS在這裡可能為null，因而需要調用Ext的ns方法命名一下，這個可加在Loader下，代碼如下：

Ext.ns('SimpleCMS');

 

現在，在瀏覽器中開啟首頁，並使用admin登入，在Firebug中將看到16所示的原始碼，說明已經區分開登入前和登入後了。

650) this.width=650;" alt="" src="http://www.bkjia.com/uploads/allimg/131228/12453H542-0.PNG" />

圖16 在Firebug中看到的頁面原始碼

首頁已經調整好了，下一步要做的就是開始編寫Ext JS MVC要求的東西了。

本文出自 “黃燈橋的部落格” 部落格，請務必保留此出處http://dqhuang.blog.51cto.com/2522725/991732