django-vue-admin测试环境搭建
- 引言
- 开发工具
- 入门demo示例
- 踩过的坑
- 数据库字符集
- 创建数据表
- 前端路由
- 自定义app
- 效果展示
引言
django-vue-admin框架，大幅度降低应用层代码难度,让每一个刚开始学习 django和vue的新手都能快速上手。这将会是你上手学习 django+vue的最佳代码。
开发工具
后端开发：pycharm
前端开发：webstorm
数据库：mysql
前端编译：nodejs
其他
入门demo示例
https://django-vue-admin.com/guide/getting-started
一定要按照这个步骤一点不差的去写，先把demo运行起来再去实现自己的想法。
踩过的坑
数据库字符集
mysql数据库要用最新的版本，新建数据库要选utf8mb4
创建数据表
在app的目录下要有migrations目录及__init__.py文件，否则在执行python manage.py init时，不会创建数据表。
python manage.py init
前端路由
前端的app views下面，这两个地方的路由保持一致。
自定义app
定义自己的基础数据
init_dictionary.json
[
{
"label": "产品类型",
"value": "product_type",
"parent": null,
"type": 0,
"color": null,
"is_value": false,
"status": true,
"sort": 8,
"remark": null,
"children": [
{
"label": "可库存产品",
"value": "0",
"parent": 46,
"type": 1,
"color": null,
"is_value": true,
"status": true,
"sort": 0,
"remark": null,
"children": []
},
{
"label": "服务类产品",
"value": "1",
"parent": 46,
"type": 1,
"color": null,
"is_value": true,
"status": true,
"sort": 1,
"remark": null,
"children": []
},
{
"label": "可消耗产品",
"value": "2",
"parent": 46,
"type": 1,
"color": null,
"is_value": true,
"status": true,
"sort": 2,
"remark": null,
"children": []
}
]
}
]
init_menu.json
[
{
"name": "测试demo",
"icon": "iconfont icon-xitongshezhi",
"sort": 20,
"is_link": false,
"is_catalog": true,
"web_path": "/jcerpDemo",
"component": "",
"component_name": "",
"status": true,
"cache": false,
"visible": true,
"parent": null,
"children": [
{
"name": "商品列表",
"icon": "ele-OfficeBuilding",
"sort": 3,
"is_link": false,
"is_catalog": false,
"web_path": "/jcerpDemo/ProductViewSet",
"component": "jcerp_demo/ProductViewSet/index",
"component_name": "ProductViewSet",
"status": true,
"cache": false,
"visible": true,
"parent": 1,
"children": [],
"menu_button": [
{
"name": "新增",
"value": "ProductViewSet:Create",
"api": "/api/ProductViewSet",
"method": 1
},
{
"name": "编辑",
"value": "ProductViewSet:Update",
"api": "/api/ProductViewSet/{id}/",
"method": 2
},
{
"name": "删除",
"value": "ProductViewSet:Delete",
"api": "/api/ProductViewSet/{id}/",
"method": 3
},
{
"name": "查询",
"value": "ProductViewSet:Search",
"api": "/api/ProductViewSet",
"method": 0
},
{
"name": "查看",
"value": "ProductViewSet:Retrieve",
"api": "/api/ProductViewSet/{id}/",
"method": 0
},
{
"name": "导出",
"value": "ProductViewSet:Export",
"api": "/api/ProductViewSet/export_data/",
"method": 1
},
{
"name": "导入",
"value": "ProductViewSet:Import",
"api": "/api/ProductViewSet/import_data/",
"method": 1
},
{
"name": "复制",
"value": "ProductViewSet:Copy",
"api": "/api/ProductViewSet",
"method": 1
}
],
"menu_field": []
}
],
"menu_button": [],
"menu_field": []
}
]
initialize.py
# 初始化
import os
import django
os.environ.setdefault("DJANGO_SETTINGS_MODULE", "application.settings")
django.setup()
from dvadmin.utils.core_initialize import CoreInitialize
from dvadmin.system.fixtures.initSerializer import (
UsersInitSerializer, DeptInitSerializer, RoleInitSerializer,
MenuInitSerializer, ApiWhiteListInitSerializer, DictionaryInitSerializer,
SystemConfigInitSerializer, RoleMenuInitSerializer, RoleMenuButtonInitSerializer
)
class Initialize(CoreInitialize):
def init_menu(self):
"""
初始化菜单信息
"""
self.init_base(MenuInitSerializer, unique_fields=['name', 'web_path', 'component', 'component_name'])
def init_dictionary(self):
"""
初始化字典表
"""
self.init_base(DictionaryInitSerializer, unique_fields=['value', 'parent', ])
def run(self):
self.init_menu()
self.init_dictionary()
if __name__ == "__main__":
Initialize(app='jcerp_demo').run()
再执行命令 python manage.py init初始化
效果展示
