Simple UI 的使用

Simple UI 的使用

使用手册：https://simpleui.72wo.com/docs/simpleui/QUICK.html#自定义主题

Simple UI 是django admin的一个主题 是一个基于element-ui+vue开发，重写和优化90%以上的页面。 与suit是同类产品。我们是一个更符合国人审美和使用习惯的一个主题

支持的Python版本

版本	说明
Python2.7.x	不支持
Python3.x	支持
Python3.7.x	支持
Python3.8.x	支持
Python3.9.x	支持

支持的Django版本

版本	说明
Django1.x	不支持
Django2.x	支持
Django3.x	支持

安装

pip install django-simpleui

在自己项目的settings.py文件中INSTALLED_APPS的第一行加入simpleui

  # Application definition

  INSTALLED_APPS = [
      'simpleui',
      'django.contrib.admin',
      'django.contrib.auth',
      'django.contrib.contenttypes',
      'django.contrib.sessions',
      'django.contrib.messages',
      'django.contrib.staticfiles',
      ...
  ]

模型

from django.db import models


# Create your models here.

class Book(models.Model):
    name = models.CharField(max_length=32,help_text='书名')
    price = models.DecimalField(max_digits=5, decimal_places=2,help_text='价钱')
    author = models.CharField(max_length=32,help_text='作者')

    # 对象描述，显示书名
    def __str__(self):
        return self.name

    # 表名中文解释
    class Meta:
        '''
        verbose_name 顾名思义 起一个复杂点的名称，一般用来作中文解释

        verbose_name_plural 顾名思义是一个复数名称，因中文没有复数
        但django有时又会将用户的驼峰命名拆成单个词，给最后的词加复数，和用户的本义不符，
        因些加了这样一个选项来处理尴尬 比如 Blog Articals 或是 分类管理s
        '''
        # verbose_name = '图书表'
        verbose_name_plural = '图书表'

admin

from django.contrib import admin

from .models import Book


# Register your models here.

class BookAdmin(admin.ModelAdmin):
    # 设置列表可显示的字段
    list_display = ('name', 'price', 'author')
    # 设置过滤选项
    list_filter = ('name', 'price')


admin.site.register(Book, BookAdmin)

自定义菜单

import time
SIMPLEUI_CONFIG = {
    'system_keep': False,
    'menu_display': ['Simpleui', '测试', '权限认证', '动态菜单测试'],      # 开启排序和过滤功能, 不填此字段为默认排序和全部显示, 空列表[] 为全部不显示.
    'dynamic': True,    # 设置是否开启动态菜单, 默认为False. 如果开启, 则会在每次用户登陆时动态展示菜单内容
    'menus': [{
        'name': 'Simpleui',
        'icon': 'fas fa-code',
        'url': 'https://gitee.com/tompeppa/simpleui'
    }, {
        'app': 'auth',
        'name': '权限认证',
        'icon': 'fas fa-user-shield',
        'models': [{
            'name': '用户',
            'icon': 'fa fa-user',
            'url': 'auth/user/'
        }]
    }, {
        # 自2021.02.01+ 支持多级菜单，models 为子菜单名
        'name': '多级菜单测试',
        'icon': 'fa fa-file',
      	# 二级菜单
        'models': [{
            'name': 'Baidu',
            'icon': 'far fa-surprise',
            # 第三级菜单 ，
            'models': [
                {
                  'name': '爱奇艺',
                  'url': 'https://www.iqiyi.com/dianshiju/'
                  # 第四级就不支持了，element只支持了3级
                }, {
                    'name': '百度问答',
                    'icon': 'far fa-surprise',
                    'url': 'https://zhidao.baidu.com/'
                }
            ]
        }, {
            'name': '内网穿透',
            'url': 'https://www.wezoz.com',
            'icon': 'fab fa-github'
        }]
    }, {
        'name': '动态菜单测试' ,
        'icon': 'fa fa-desktop',
        'models': [{
            'name': time.time(),
            'url': 'http://baidu.com',
            'icon': 'far fa-surprise'
        }]
    }]
}