本系列前三章:
Permission权限基本操作指令
User权限基本操作指令
设计自有权限管理系统设计思路
正文:
权限管理界面分三部分:一个点击进入该页面的按钮、以及该页面的权限列表、添加按钮,删除按钮;
权限管理界面页面是最基础的设计,并且和用户权限分配界面有着重要的关系.
首先需要在template,简称模板中加入一个点击按钮,功能是进入权限管理页面,代码如下:
该按钮的功能大致为:
利用ajax局部刷新出权限管理界面网页,且使用ajax中getJSON函数从后端view中返回所有权限信息(codename为中文的权限)以及相关添加删除按钮.
HTML页面编写javascript之前,先将必要的HTML标签写好,我们这里需要一个表格(table)和表单(form),如下:
接下来我们看按钮函数如何编写:
$('#qxgl').click(function(){ //权限管理 $("#interface").html("权限管理操作界面
"+ "你可以选择对应权限, 进行删除,也可以点击左侧权限管理按钮刷新权限页面!
") $("#t1 thead").html("单选框权限类型权限名称权限描述"); $.getJSON("{% url 'permmanage' %}", function(ret){ $('#t1 tbody').empty();$('#t1 tfoot').empty(); for (var i = 0; i <= ret.length - 1; i++) { $('#t1 tbody').append(""+ ""+ret[i].content_type_id+""+ret[i].codename+""+ ""+ret[i].name+""); } $('#t1 tfoot').append(""+ ""+ ""+ ""+ ""+ ""+ ""); }); }) 上面代码中$.getJSON的功能是从后台返回所有中文权限的json参数到前台,另外到这里我们需要知道两件事情:
第一:django的permisson有三个字段,分别对应content_type_id 权限类型,codename 权限名称,name 权限描述,permission的用法跟普通的模型使用一样第二:查询中文权限需要用到正则表达式,需要用到模型api中的iregex,查询全部中文权限代码:
Permission.objects.filter(codename__iregex=u'[\u4e00-\u9fa5]').values()
好了,到这里我们跳到django后端配置url和view便可实现该按钮功能:
配置url:home_patterns = [ url(r'permmanage/$', 'home.views.permmanage', name='permmanage'), ]urlpatterns = [ url(r'^$', 'login.views.login_view', name='login_view'), # url(r'^blog/', include('blog.urls')), url(r'^home/', include(home_patterns)), url(r'^admin/', include(admin.site.urls)),] 配置view:
def permmanage(request): #正则匹配中文u'[\u4e00-\u9fa5]' d = Permission.objects.filter(codename__iregex=u'[\u4e00-\u9fa5]').values() dlist = [] for i in d: dlist.append(i) return JsonResponse(dlist, safe=False)
下面编写对应的权限添加和删除操作,这里我便不详细说明了,具体可查看本系列文章中Permission权限基本操作指令
具体代码如下
view.py:
#权限添加def permaddtion(request): content_type_id = request.POST['id'] codename = request.POST['codename'] name = request.POST['name'] if Permission.objects.filter(codename = codename).exists(): relist = { 're':'该权限已存在,添加失败!'} return JsonResponse(relist) else: Permission.objects.create(content_type_id=int(content_type_id),codename=codename,name=name) relist = { 're':'该权限添加成功!'} return JsonResponse(relist)#权限删除def permdeletion(request): codename = request.POST['codename'] Permission.objects.get(codename=codename).delete() relist = { 're':"该权限删除成功!"} return JsonResponse(relist) url.py:
#首页url配置home_patterns = [ url(r'permaddtion/$', 'home.views.permaddtion', name='permaddtion'), url(r'permdeletion/$', 'home.views.permdeletion', name='permdeletion'),]
template:
$('#t1').on("click","#perm_add",function(){ //添加权限 var tj1 = $("#id").val(); var tj2 = $("#codename").val(); var tj3 = $("#name").val(); var pattern = /^[\u4E00-\u9FA5]{1,10}$/; if( tj1== ""){alert("权限类型必填!");} else{ if(isNaN(tj1)){alert("权限类型必须为数字!");}//数字判断 else{ if(tj2 == ""){alert("权限名称必填!");} else{ if(!pattern.test(tj2)){alert("权限名称必须为中文!");}//中文判断 else{ if( tj3 == ""){alert("权限内容必填!");} else{ //条件判断完毕,进行后台操作 $.post("{% url 'permaddtion' %}",//是,则进行下一步操作 { csrfmiddlewaretoken:"{ { csrf_token }}", id:tj1, codename:tj2, name:tj3, }, function(ret) { alert(ret['re']); }); }}}}} }) $('#interface').on("click","#perm_del",function(){ //删除权限 var re = $("input[name='permission']:checked").val();//获取权限名称 var pattern = /^[\u4E00-\u9FA5]{1,10}$/; if (!pattern.test(re)){alert("请选择一个权限名称,再进行删除权限操作!");}//判断是否选择单选框 else{ $.post("{% url 'permdeletion' %}",//是,则进行下一步操作 { csrfmiddlewaretoken:"{ { csrf_token }}", codename:re, }, function(ret) { alert(ret['re']); }); } })