Simple UI快速上手

Simple UI快速上手

在混合开发的模式下，如果想使用django admin，又嫌弃后台不符合你的审美？Simple UI给你想要的答案，我不是打广告的~

介绍

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

特点

👍 内置28款流行的主题

⚡️ pip闪电安装100%兼容原生admin无需修改代码

✨ 多标签页面，各个模块更加清晰明了

🎯 配置简单，极速上手，在settings.py中加入simpleui后启动立即生效，效率提升 100%！让后端开发得心应手。

☕️ Element-UI + Vue 加持，让古老的django admin 焕然一新。

支持django和python版本

支持的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'
        }]
    }]
}

---

更多操作参考官网：Simple UI