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' }] }] }