luffy项目02

1. 二次封装Response

# utils/response.py


from rest_framework.response import Response

class APIResponse(Response):
    def __init__(self, status=100, msg='成功', http_status=None, template_name=None, exception=None, content_type=None, **kwargs):
    
    	if kwargs:
            data.update(kwargs)  # 这句话什么意思？{token:adfads, name:asdfa}
        
        super().__init__(data=data, status=http_status, template_name=template_name, headers=headers, exception=exception, content_type=content_type)
    
    

2. 后台数据库配置

# 使用MySQL -> 创建一个库（手动） ->  库名：luffy

# 项目配置文件中，连接这个数据库

# 新建库，并配置
	create database luffy default charset=utf8;
   
# 给数据库创建一个joshua用户，他只能操作luffy库 --》 避免风险，万一root用户密码泄露了，危险

# 5.7之前版本
select user,host,password from mysql.user;

# 5.7之后版本查看命令
select user,host,authentication_string from mysql.user;

# 设置权限账号密码
grant all privileges on luffy.* to 'joshua'@'%' identified by 'joshua123';
grant all privileges on luffy.* to 'joshua'@'localhost' identified by 'joshua123';
# 两句话都授权一下。。。。

# mysql -h 127.0.0.1 -P 3306 -uroot -p
"使用地址和不使用地址连接MySQL的区别："
如果在本地连接，不用地址速度会快，因为不走网络
# mysql -uroot -p

# 刷新权限
flush privileges;
从磁盘加载过来，从而立即生效


# 项目配置文件加入
下图


# django操作MySQL
默认使用MySQLdb操作 -- MySQLdb在python3以后不存在了
使用pymysql替换 --> django2.0.7版本及以上，如果使用MySQL替换

"关于pymysql和mysqlclient的选择"
# 这两句话，只要执行即可，放在哪里都行 --> 只要django执行，所有py文件中顶格写的代码都会执行
# 作用是？猴子补丁的动态替换，把原来使用mysqldb的都换成了pymysql
# 如果改源码，后期只要使用django，都要改他的源码，所以不使用这个了，换一个模块
# import pymysql
# pymysql.install_as_MySQLdb()
"使用mysqlclient不用写这两句话了！！"

# mysqlclient --> MySQLdb的3版本
但是mysqlclient很难装上，win上就看人品了。。实在装不上用whl文件装，Linux上有不同的解决方案-->
http://www.liuqingzheng.top/python/%E5%85%B6%E4%BB%96/01-%E5%90%84%E4%B8%BB%E6%B5%81Linux%E7%B3%BB%E7%BB%9F%E8%A7%A3%E5%86%B3pip%E5%AE%89%E8%A3%85mysqlclient%E6%8A%A5%E9%94%99/

pip install mysqlclient
"已成功安装！！！"

3. user模块user表设计

# 用户板块 --> 做成app
Python ../../manage.py startapp user

# 创建用户表，基于auth的user表扩写
"注意：在写好这个之前，不要先迁移数据库，如果迁移了数据库，这个就不行了"
	# 如果已经迁了，删除数据库，删除所有migrations文件，包含你自己的app，和auth，和admin
    
# user/models.py

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

class User(AbstractUser):
    mobile = models.CharField(max_length=11, unique=True)  # 唯一，长度11
    # 需要pillow包的支持，
    icon = models.ImageFiled(upload_to='icon', default='icon/default.png')
    
    class Meta:
        db_table = 'luffy_user'
        verbose_name= '用户表'
        verbose_name_plural = verbose_name
    
    def __str__(self):
        return self.username
    
# 配置文件中注册
# 把扩写了auth的user表注册一下
AUTH_USER_MODEL='user.User'

# 配置media文件夹
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

# 安装pillow
pip3 install pillow

# 开始迁移记录
makemigrations
migrate

4. 前台创建及配置

# 创建项目
vue create luffycity

# 使用pycharm打开

# 删除一些东西
	-helloworld.vue
    -aboutview.vue

    # app.vue见下图
    # homeview.view见下图
    # router/index.js见下图
   

# elementui，bootstrap，jQuery，axios配置
===========
npm install axios -S
# main.js
import axios from 'axios'
Vue.prototype.$axios = axios;
===========
npm install element-ui -S
# main.js
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)

===============
npm install jquery -S
npm install bootstrap@3 -S
# main.js
import 'bootstrap'
import 'bootstrap/dist/css/bootstrap.min.css'

# vue.config.js
const {defineConfig} = require('@vue/cli-service')
const webpack = require('webpack');

module.exports = defineConfig({
	transpileDependencies: true,
	configureWebpack: {
		plugins: [
			new webpack.ProvidePlugin({
				$: "jquery",
				jQuery: "jquery",
				"window.jQuery": "jquery",
				"window.$": "jquery",
				Popper: ["popper.js", "default"]
			})
		]
	}
});


# 全局css样式配置
body, h1, h2, h3, h4, h5, h6, p, table, tr, td, ul, li, a, form, input, select, option, textarea {
    margin: 0;
    padding: 0;
    font-size: 15px;
}

a {
    text-decoration: none;
    color: #333;
}

ul {
    list-style: none;
}

table {
    border-collapse: collapse; /* 合并边框 */
}

# main.js注册
// 把自己定义的global.css引入
import '@/assets/css/global.css'
import './assets/css/global.css'都可以


// 导入自定义配置全局的js
import settings from './assets/js/settings'
Vue.prototype.$settings = settings;


# 配置文件配置