ASP.NET MVC+EF框架+EasyUI实现权限管理系列(14)-主框架搭建
?? ASP.NET MVC+EF框架+EasyUI實(shí)現(xiàn)權(quán)限管系列
(開篇)???(1):框架搭建????(2):數(shù)據(jù)庫(kù)訪問層的設(shè)計(jì)Demo????(3):面向接口編程???(4 ):業(yè)務(wù)邏輯層的封裝?
??(5):前臺(tái)Jquery easyUI實(shí)現(xiàn)????(6):EF上下文實(shí)例管理????(7):DBSession的封裝???(8):DBSession線程內(nèi)唯一??
??(9):TT摸版的學(xué)習(xí)????(10):VSS源代碼管理???(11):驗(yàn)證碼實(shí)現(xiàn)和底層修改??(12):實(shí)現(xiàn)用戶異步登錄和T4模板
?? ?(13):權(quán)限設(shè)計(jì)
前言：昨天我們把權(quán)限的那一部分設(shè)計(jì)完成了，前面的十三篇博客就是這個(gè)博客系列的靈魂，大家可以仔細(xì)的研究前面的這13篇博客，那么從后面開始我們就開始研究前臺(tái)和后臺(tái)對(duì)應(yīng)用，我決定后面的東西我會(huì)說的很快，而且大部分內(nèi)容都是相同的，所以我只是做一個(gè)案例，其他的我都只是截圖表示一下，希望大家能夠諒解。通過這個(gè)系列博客我希望大家都能夠?qū)W得一定的東西，也是為我們灌輸一個(gè)面向?qū)ο蟮乃枷?#xff0c;下面我們開始今天的設(shè)計(jì)，首頁(yè)框架的搭建。
在第13張我寫了權(quán)限的設(shè)計(jì)，但是最后有和吉日嘎拉聯(lián)系了一下，它的建議我覺得非常好，所以我會(huì)將我的權(quán)限系統(tǒng)的架構(gòu)在稍微的改一下，改成和它的數(shù)據(jù)庫(kù)相兼容，今天在下面我會(huì)說一下，希望大家能夠關(guān)注。
1．搭建框架初介紹
(1)前面的代碼我們基本寫完了，明天我將我的實(shí)體模型改一下，這樣我們的底層的東西基本就寫完了，那么后面我們所有的內(nèi)容都就局限在UI層了，UI層就是實(shí)現(xiàn)頁(yè)面的展示。
(2)那么我們做為程序員，如果不是團(tuán)隊(duì)開發(fā)軟件的話，那么我們一般按照什么步驟來開發(fā)軟件呢，我是這樣實(shí)現(xiàn)的，首先我們實(shí)現(xiàn)登錄頁(yè)面，當(dāng)然我們的登錄信息已經(jīng)實(shí)現(xiàn)了，然后我們就開始搭建主框架(程序展示的框架)，最后就是根據(jù)菜單我們把他的增刪查改實(shí)現(xiàn)，一般情況下我們做項(xiàng)目也就這樣了，然后我們針對(duì)表一個(gè)表一個(gè)表的給搞定。今天我們先搭建框架。
(3)主框架就是當(dāng)用戶登錄成功之后首次轉(zhuǎn)到的頁(yè)面的顯示。
2.使用EasyUI搭建框架
(1)首先我們?cè)陧?xiàng)目中添加一個(gè)Home控制器，然后對(duì)Index方法添加視圖，添加了一個(gè)Index頁(yè)面，這個(gè)頁(yè)面就是要求用戶登錄之后展示的頁(yè)面。
(2)那么我們的框架怎么寫呢？這里可能大部分人會(huì)問的，你是自己寫還是用別人的啊，當(dāng)然肯定你也能想到，我是用別人的，因?yàn)橹灰憧次业牟┛偷拿QeasyUI，那么熟悉easyUI的人肯定就會(huì)想到我用的是Jquery EasyUI的主框架,下面我就介紹一些easyUI的主框架吧。
(3)如果我們下載了JqueryeasyUI的幫助文檔的話，我們就會(huì)找到easyUI的文檔里面還有Demo的案例，然后我們?cè)侔咐锌梢哉业接腥齻€(gè)Layout的展示，大家可以看一下，我在這里決定使用第二個(gè)：layout1，樣式如圖所示：
3.Layout1后臺(tái)框架的實(shí)現(xiàn)
(1)首先我們將Layout1中的關(guān)于架構(gòu)的東西全部拷貝到我們新建的Home控制器下面的Index.cshtml文件中，代碼如下：
1 <html> 2 3 <head> 4 5 <metaname="viewport"content="width=device-width"/> 6 7 <title>Kencery(韓迎龍)&&權(quán)限設(shè)計(jì)初始頁(yè)</title> 8 9 @*添加Jquery EasyUI的樣式*@ 10 11 <linkhref="~/Content/JqueryEasyUI/themes/default/easyui.css"rel="stylesheet"/> 12 13 <linkhref="~/Content/JqueryEasyUI/themes/icon.css"rel="stylesheet"/> 14 15 <style> 16 17 #top { 18 19 text-shadow:3px3px3pxred,6px6px6pxblack,10px10px10pxBlue; 20 21 text-align:center; 22 23 } 24 25 </style> 26 27 @*添加Jquery，EasyUI和easyUI的語言包的JS文件*@ 28 29 <scriptsrc="~/Content/JqueryEasyUI/jquery-1.8.0.min.js"></script> 30 31 <scriptsrc="~/Content/JqueryEasyUI/jquery.easyui.min.js"></script> 32 33 <scriptsrc="~/Content/JqueryEasyUI/locale/easyui-lang-zh_CN.js"></script> 34 35 @*執(zhí)行JavaScript的腳本*@ 36 37 <script> 38 39 $(function(){ 40 41 //讀取動(dòng)態(tài)變化的時(shí)間 42 43 ReadDateTimeShow(); 44 45 }); 46 47 48 49 //讀取動(dòng)態(tài)變化的時(shí)間 50 51 functionReadDateTimeShow(){ 52 53 varyear=newDate().getFullYear(); 54 55 varMonth=newDate().getMonth()+1; 56 57 varDay=newDate().getDate(); 58 59 varTime=newDate().toLocaleTimeString(); 60 61 varAddDate=year+"年"+Month+"月"+Day+"日,時(shí)間:"+Time; 62 63 $("#date").text(AddDate); 64 65 } 66 67 </script> 68 69 </head> 70 71 <bodyclass="easyui-layout"> 72 73 74 75 @*--------------------------------------網(wǎng)站頭部開始（TOP）--------------------------------------*@ 76 77 <divdata-options="region:'north',split:true"title="MVC權(quán)限系統(tǒng)(Top)"style="height:90px;"> 78 79 <divclass="easyui-layout"data-options="fit:true"style="background:#ccc;"> 80 81 <divid="top"data-options="region:'center'"style="text-align:center;"> 82 83 <h1>隴原之家后臺(tái)權(quán)限管理系統(tǒng)——Kencery（韓迎龍） @@ MVC權(quán)限系統(tǒng)</h1> 84 85 </div> 86 87 <divdata-options="region:'east',split:true"style="width:500px;"> 88 89 <marquee>歡迎管理員<fontcolor="red"size="5">@ViewBag.UName</font>登錄隴原之家后臺(tái)管理</marquee> 90 91 <divstyle="float: right; padding-right:30px; font-size: 14px; padding-top: 6px;"> 92 93 當(dāng)前時(shí)間：<bid="date"></b>  <ahref="/Login/Index"><b>注銷</b></a> 94 95 </div> 96 97 </div> 98 99 </div> 100 101 </div> 102 103 @*--------------------------------------網(wǎng)站頭部結(jié)束（TOP）--------------------------------------*@ 104 105 106 107 @*--------------------------------------網(wǎng)站菜單欄開始（Left）--------------------------------------*@ 108 109 <divdata-options="region:'west',split:true"title="菜單導(dǎo)航"style="width:180px;padding:1px;overflow:hidden;"> 110 111 <divclass="easyui-accordion"data-options="fit:true,border:false"> 112 113 <divtitle="后臺(tái)管理用戶列表"iconcls="icon-edit"data-options="selected:true"style="padding:10px;overflow:auto;"> 114 115 @*------存放菜單項(xiàng)-------*@ 116 117 <p><ahref="javascript:void(0)">用戶管理</a></p> 118 119 <p><ahref="javascript:void(0)">角色管理</a></p> 120 121 <p><ahref="javascript:void(0)">權(quán)限管理</a></p> 122 123 </div> 124 125 <divtitle="網(wǎng)站廣告管理"iconcls="icon-edit"style="padding:10px;"> 126 127 content2 128 129 </div> 130 131 <divtitle="網(wǎng)站新聞管理"iconcls="icon-edit"style="padding:10px"> 132 133 content3 134 135 </div> 136 137 </div> 138 139 </div> 140 141 @*--------------------------------------網(wǎng)站結(jié)束（Left）--------------------------------------*@ 142 143 144 145 @*--------------------------------------網(wǎng)站中間部分開始（Center）面包屑--------------------------------------*@ 146 147 <divdata-options="region:'center'"title="網(wǎng)站首頁(yè)>用戶管理〉用戶列表"style="overflow:hidden;"> 148 149 150 151 </div> 152 153 @*--------------------------------------網(wǎng)站中間部分結(jié)束（Center）--------------------------------------*@ 154 155 156 157 @*--------------------------------------網(wǎng)站右邊菜單開始（Right）--------------------------------------*@ 158 159 <divdata-options="region:'east',iconCls:'icon-reload',split:true"title="日歷信息"style="width:235px;"> 160 161 <divclass="easyui-calendar"style="width:230px;height:230px;"></div> 162 163 </div> 164 165 @*--------------------------------------網(wǎng)站右邊菜單結(jié)束（Right）--------------------------------------*@ 166 167 168 169 @*--------------------------------------網(wǎng)站頭部開始（Foot）--------------------------------------*@ 170 171 <divdata-options="region:'south',split:true"title="MVC權(quán)限系統(tǒng)(Foot)"style="height:60px; background:#efefef;"> 172 173 <divclass="easyui-layout"data-options="fit:true"style="background:#ccc;"> 174 175 <divdata-options="region:'center'"style="text-align:center;padding:10px;">版權(quán)所有： @@Kencery(韓迎龍) &&2013-2030 </div> 176 177 </div> 178 179 </div> 180 181 @*--------------------------------------網(wǎng)站頭部結(jié)束（Foot）--------------------------------------*@ 182 183 </body> 184 185 </html>(2)當(dāng)我們寫完這些代碼的時(shí)候，然后將我們的路由改回系統(tǒng)默認(rèn)的路由，這時(shí)候我們就可以運(yùn)行界面看到我們的設(shè)計(jì)的后臺(tái)效果了。
(3)這樣我們整個(gè)框架就都搭建完成了，大家可以看看這個(gè)效果，并且自己也可以實(shí)現(xiàn)以下這個(gè)效果，后續(xù)項(xiàng)目我就不貼出了，都寫了詳細(xì)的注釋，大家可以自己按照這個(gè)思路來寫一遍。
(4)當(dāng)然最后要說的是如果大家有什么好的意見，關(guān)于我前面所有的博客的布局或者是內(nèi)容，我都會(huì)盡力的去弄好，大家提出的需求我都改了吧，這里要感謝的就是第十三篇下面的所有的評(píng)論人，你們讓我懂得了更多的東西，謝謝大家的支持。
4.吉日嘎拉的相知
(1)說起吉日噶拉，可能大部分玩博客園的人都知道，它的權(quán)限寫的非常好，記得去年在長(zhǎng)春上班的時(shí)候，我們主任讓我和另外一個(gè)哥們共同寫一個(gè)權(quán)限的需求，當(dāng)時(shí)剛畢業(yè)，什么都不懂，一整迷茫之后我們便開始各種查找，各種百度，谷歌，最后我就知道了吉日噶拉，那時(shí)候他寫了好多博客，我們就開始研究，并且下載了他的視頻來看，最后我們?cè)O(shè)計(jì)了一個(gè)方案，也是和我現(xiàn)在的權(quán)限管理差不多，最后我們也用了我們?cè)O(shè)計(jì)的那個(gè)權(quán)限，這樣我就知道了他(吉日嘎拉)。
(2)后來到我寫這個(gè)系列的時(shí)候，我剛開始寫的時(shí)候人家就已經(jīng)在留言里面支持我，并且回復(fù)我的一些錯(cuò)誤和觀點(diǎn)，我當(dāng)時(shí)就非常高興，我想那么牛的人居然也看我的博客，后來我想想可能正是人家搞權(quán)限的，所以看看我寫的怎么樣，再到后來，也就是我上面一篇博客的時(shí)候，吉日嘎拉給我留言，留言截圖如下：
?
?
(3)在這個(gè)里面吉日建議我能夠把我的權(quán)限的這些表的設(shè)計(jì)能夠和他的設(shè)計(jì)的一樣，這樣也就是我們能夠公用數(shù)據(jù)庫(kù)，開發(fā)出兼容的東西出來，當(dāng)時(shí)說完的時(shí)候，心里真是暗自高興，想人家權(quán)限搞了多少年了，我一個(gè)初出道的小屁孩居然能和人家的數(shù)據(jù)庫(kù)設(shè)計(jì)搞兼容，這對(duì)我的技術(shù)是一個(gè)多么高的提升啊，所以就非常樂意的用QQ聯(lián)系了人家，然后經(jīng)過了長(zhǎng)達(dá)1個(gè)小時(shí)的聊天，最后我把方案定下來了，我覺得要想發(fā)展還是要用人家的權(quán)限模版，而且人家給了我他的數(shù)據(jù)庫(kù)設(shè)計(jì)和一些文檔性的東西，這里秀一下我們的聊天紀(jì)錄，至于有些東西實(shí)在不敢秀，希望大家理解：
?
(4)就這樣，我就覺得我的權(quán)限系統(tǒng)現(xiàn)在修改成走兼容道路，最后我們的軟件都能公用一個(gè)數(shù)據(jù)庫(kù)的設(shè)計(jì)。具體的設(shè)計(jì)請(qǐng)看我下篇博客的說明，我會(huì)說出來具體的設(shè)計(jì)，后面的項(xiàng)目我就不貼出來了，希望大家都能理解。
5.小結(jié)
(1)這篇博客到這里我想也就完事了，這篇博客主要是為了說明一下我要修改架構(gòu)，簡(jiǎn)單的搭建了一下框架，最后闡述了一些我和吉日的一些過往，呵呵，希望大家能夠給出意見，你們的意見是我們進(jìn)步的動(dòng)力。
(2)下篇博客我就開始重新搭建框架，希望大家能夠堅(jiān)持看下去，今天就不說了，現(xiàn)在我要把登錄的信息修改的更加的詳細(xì)一點(diǎn)。
Kencery返回本系列開篇
?
?
相信自己，你就是下一個(gè)奇跡！
?
posted on 2015-01-21 08:56 NET未來之路 閱讀(...) 評(píng)論(...) 編輯 收藏轉(zhuǎn)載于:https://www.cnblogs.com/lonelyxmas/p/4237936.html
總結(jié)
以上是生活随笔為你收集整理的ASP.NET MVC+EF框架+EasyUI实现权限管理系列(14)-主框架搭建的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 工商银行信用卡挂失补办怎么弄？手续费要多
- 下一篇： [转载]AngularJS之Factor