A project

1、创建 Django 环境

Pycharm  Python 3.7

pip install Django==2.2.5
pip install djangorestframework==3.10.2

2、项目创建
新建
extra_apps   （扩展的源码包）
apps         （放所有app）
media        （保存图片）
# 把extra_apps和apps标记为sources root,然后settings中也要加路径

# 修改 settings.py
import sys
sys.path.insert(0,BASE_DIR)
sys.path.insert(0,os.path.join(BASE_DIR, 'apps'))
sys.path.insert(0,os.path.join(BASE_DIR, 'extra_apps'))

3、创建 users

cd apps
python ../manage.py startapp users

users/models.py

from django.db import models
from datetime import datetime
from django.contrib.auth.models import AbstractUser

class UserProfile(AbstractUser):
    # 用户信息
    GENDER_CHOICES = (
        ("male", u"男"),
        ("female", u"女"),
    )
    # 用户用手机注册，姓名、生日和邮箱可以为空
    name = models.CharField("姓名", max_length=30, null=True, blank=True)
    # avatar = models.ImageField(upload_to="avatar/", verbose_name="用户头像", null=True, blank=True)
    avatar = models.CharField("用户头像", max_length=4096, default="avatar/", null=True, blank=True)
    birthday = models.DateField("出生年月", null=True, blank=True)
    gender = models.CharField("性别", max_length=6, choices=GENDER_CHOICES, default="male")
    mobile = models.CharField("电话", max_length=11, null=True, blank=True)
    title = models.CharField("职位", max_length=300, default="代码人", blank=True)
    email = models.EmailField("邮箱", max_length=100, null=True, blank=True)

    class Meta:
        verbose_name = "用户信息"
        verbose_name_plural = verbose_name

    def __str__(self):
        return self.username

settings.py

#重载系统的用户，让UserProfile生效
AUTH_USER_MODEL = 'users.UserProfile'


# 设置成中文环境
LANGUAGE_CODE = 'zh-hans'

TIME_ZONE = 'Asia/Shanghai'

USE_I18N = True

USE_L10N = True

USE_TZ = False

4、安装 Xadmin

安装依赖包 pip install -r xadmin.txt

将 xadmin 目录 放到 extra_apps

# urls.py
from django.urls import path
import xadmin
urlpatterns = [
    path('xadmin/', xadmin.site.urls),
]

把下面两个app注册到settings.py的INSTALLED_APPS中

'xadmin',
'crispy_forms'

5、启动

重新生成数据库

python manage.py makemigrations

python manage.py migrate

创建一个管理员用户  ps: 7net

python manage.py createsuperuser

运行

python manage.py runserver 

http://127.0.0.1:8000/xadmin

6、修改 

# users/adminx.py 新建
__author__ = '7net'
import xadmin
from xadmin import views

class BaseSetting(object):
    #添加主题功能
    enable_themes = True
    use_bootswatch = True


class GlobalSettings(object):
    #全局配置，后台管理标题和页脚
    site_title = "AILab"
    site_footer = "www.7net.cc"
    #菜单收缩
    menu_style = "accordion"


xadmin.site.register(views.BaseAdminView, BaseSetting)
xadmin.site.register(views.CommAdminView, GlobalSettings)

修改app名字为中文

# users/apps.py

from django.apps import AppConfig


class UsersConfig(AppConfig):
    name = 'users'
    #app名字后台显示中文
    verbose_name = "用户管理"

# users/__init__.py

default_app_config = 'users.apps.UsersConfig'

7、创建前端

vue init webpack front

cd front

npm install -D node-sass sass-loader

# 安装 UI 框架 https://element.eleme.cn/#/zh-CN

npm i element-ui -S

拷贝 static/css 主题文件

src 目录下创建api、store、axios，并创建相应的 index.js 文件

在 main.js 加载

安装 axios 用于http请求     npm install --save axios

安装 vuex 用于 web 存储   npm install --save vuex

$ npm run dev

创建 components/Home.vue

8、实现登录

使用 rest 框架

$ pip install djangorestframework==3.10.2

• pip install coreapi                         drf的文档支持
• pip install django-guardian           drf对象级别的权限支持

• pip install django-cors-headers  跨域问题

# urls.py
from django.urls import path
from django.urls import include

import xadmin

from rest_framework.documentation import include_docs_urls

urlpatterns = [
    path('xadmin/', xadmin.site.urls),
    path('docs',include_docs_urls(title='API 文档')),
    path('api-auth/',include('rest_framework.urls')),
]

重新生成数据库

安装 jwt 登录  

pip install djangorestframework-jwt

自定义用户登录

http://127.0.0.1:8000/docs