• 权限分配之一级菜单优化添加和编辑页面图标


    这里就好说了。  使用的还是 forms 组件。 将图标的input框, 搞成了 redio 单选框。
    直接看代码:

    from django import forms
    from django.utils.safestring import mark_safe
    from django.core.exceptions import ValidationError, NON_FIELD_ERRORS
    from rbac import models
    
    # mark_safe 告诉django这个是安全的,渲染页面时, 不要转换成特殊符号。
    
    ICON_LIST = [
        ['fa-hand-scissors-o', '<i aria-hidden="true" class="fa fa-hand-scissors-o"></i>'],
        ['fa-hand-spock-o', '<i aria-hidden="true" class="fa fa-hand-spock-o"></i>'],
        ['fa-hand-stop-o', '<i aria-hidden="true" class="fa fa-hand-stop-o"></i>'],
        ['fa-handshake-o', '<i aria-hidden="true" class="fa fa-handshake-o"></i>'],
        ['fa-hard-of-hearing', '<i aria-hidden="true" class="fa fa-hard-of-hearing"></i>'],
        ['fa-hashtag', '<i aria-hidden="true" class="fa fa-hashtag"></i>'],
        ['fa-hdd-o', '<i aria-hidden="true" class="fa fa-hdd-o"></i>'],
        ['fa-headphones', '<i aria-hidden="true" class="fa fa-headphones"></i>'],
        ['fa-heart', '<i aria-hidden="true" class="fa fa-heart"></i>'],
        ['fa-heart-o', '<i aria-hidden="true" class="fa fa-heart-o"></i>'],
        ['fa-heartbeat', '<i aria-hidden="true" class="fa fa-heartbeat"></i>'],
        ['fa-history', '<i aria-hidden="true" class="fa fa-history"></i>'],
        ['fa-home', '<i aria-hidden="true" class="fa fa-home"></i>'],
        ['fa-hotel', '<i aria-hidden="true" class="fa fa-hotel"></i>'],
        ['fa-hourglass', '<i aria-hidden="true" class="fa fa-hourglass"></i>'],
        ['fa-hourglass-1', '<i aria-hidden="true" class="fa fa-hourglass-1"></i>'],
        ['fa-hourglass-2', '<i aria-hidden="true" class="fa fa-hourglass-2"></i>'],
        ['fa-hourglass-3', '<i aria-hidden="true" class="fa fa-hourglass-3"></i>'],
        ['fa-hourglass-end', '<i aria-hidden="true" class="fa fa-hourglass-end"></i>'],
        ['fa-hourglass-half', '<i aria-hidden="true" class="fa fa-hourglass-half"></i>'],
        ['fa-hourglass-o', '<i aria-hidden="true" class="fa fa-hourglass-o"></i>'],
        ['fa-hourglass-start', '<i aria-hidden="true" class="fa fa-hourglass-start"></i>'],
        ['fa-i-cursor', '<i aria-hidden="true" class="fa fa-i-cursor"></i>'],
        ['fa-id-badge', '<i aria-hidden="true" class="fa fa-id-badge"></i>'],
        ['fa-id-card', '<i aria-hidden="true" class="fa fa-id-card"></i>'],
        ['fa-id-card-o', '<i aria-hidden="true" class="fa fa-id-card-o"></i>'],
        ['fa-image', '<i aria-hidden="true" class="fa fa-image"></i>'],
        ['fa-mail-reply-all', '<i aria-hidden="true" class="fa fa-mail-reply-all"></i>'],
        ['fa-reply', '<i aria-hidden="true" class="fa fa-reply"></i>'],
        ['fa-reply-all', '<i aria-hidden="true" class="fa fa-reply-all"></i>'],
        ['fa-retweet', '<i aria-hidden="true" class="fa fa-retweet"></i>'],
        ['fa-wrench', '<i aria-hidden="true" class="fa fa-wrench"></i>']]
    
    for item in ICON_LIST:
        item[1] = mark_safe(item[1])
    
    
    class MenuForm(forms.ModelForm):
        '''菜单form'''
    
        class Meta:
            model = models.Menu
            fields = ["title", "icon"]
            widgets = {
                "title": forms.TextInput(attrs={"class": "form-control"}),
                "icon": forms.RadioSelect(
                    choices=ICON_LIST,
                    attrs={'class': 'clearfix'}
                )
            }
    

     为icon字段,的展示。 搞成一个RadioSelect()   choices 属性就是所有的要展示的图标。

    ['fa-wrench', make_safe('<i aria-hidden="true" class="fa fa-wrench"></i>'])]

    每个列表都是一个图标,  第一个参数是,要保存到数据库中的icon字段的值。 第二个参数是进行展示时的样式。
    一样要使用  make_safe() 告诉,django 这个字符串时可以信任的, 不然都是字符串展示出来了。

    然后就是, 给这些标签加一点再, 更改一点样式:

        <style type="text/css">
            ul {list-style-type: none;padding: 0;}
            ul li {float: left;padding: 10px;padding-left: 0; 80px;}
            ul li i {font-size: 18px;margin-left: 5px;color: #6d6565;}
        </style>
    

     注,不是所有的都要这样改,  只是添加页面中的   ul 下的标签。
    写样式的时候, 不要起了冲突就好!

  • 相关阅读:
    转载:AAC编解码概述
    转载:ADTS header
    wcf寄宿在iis上的跨域访问问题【不止是添加跨域文件】
    转 http 分析工具
    时间管理1
    关于silverlight和Wcf分布式部署注意问题(收藏夹)
    c#修改xml文件
    关于在线编辑的异常
    创业文摘5--从程序员转向企业家的10个建议
    silverlight 后台代码生成gridview
  • 原文地址:https://www.cnblogs.com/chengege/p/10710679.html
Copyright © 2020-2023  润新知