创建模型类
生成迁移文件进行迁移
#收获地址users
class Addr(models.Model):
name=models.CharField(max_length=16,verbose_name='收货人')
tel=models.CharField(max_length=16,verbose_name='手机号')
addr=models.CharField(max_length=200,verbose_name='收获地址')
is_default=models.BooleanField(default=False,verbose_name='默认地址')
user=models.ForeignKey(User,on_delete=models.CASCADE,verbose_name='用户')
class Meta:
verbose_name='用户地址'
verbose_name_plural=verbose_name
def __str__(self):
return '(%s)-%s'%(self.name,self.user)
获取用户信息，收货地址信息，添加/修改/删除地址信息
#获取用户信息
class Userinfoview(APIView):
#获取用户信息及用户的地址信息
def get(self,request):
user=request.META.get('USER')
if not user:
return Response({
'code':400,
'msg':'用户未登录'
})
user_id=user['user_id']
user_info=User.objects.filter(id=user_id).first()
addr_list=user_info.addr_set.all()
addr_all=[]
#用户的收获地址信息
for i in addr_list:
addr_all.append({
'id':i.id,
'name':i.name,
'tel':i.tel,
'addr':i.addr,
'is_default':i.is_default
})
return Response({
'code':200,
'msg':'获取成功',
'user':{
'username':user_info.username,
'mobile':user_info.mobile,
'addr':addr_all
}
})
#修改地址信息
def put(self,request):
user = request.META.get('USER')
if not user:
return Response({
'code': 400,
'msg': '用户未登录'
})
user_id = user['user_id']
mobile=request.data.get('mobile')
addrs=request.data.get('addrs')
#获取一下用户信息
user_info=User.objects.filter(id=user_id).first()
if user_info.mobile !=mobile:
user_info.mobile=mobile
user_info.save()
#修改地址，首先得获取到地址
addr_all=user_info.addr_set.all()
for i in addr_all:
for j in addrs:
#两个id不一致，不需要比对
if i.id != j['id']:
continue
#只有当两个一致的时候，才需要比对是否发生修改
if j['name']!=i.name:
i.name=j['name']
if j['tel']!=i.tel:
i.tel=j['tel']
if j['addr']!=i.addr:
i.addr=j['addr']
if j['tel']!=i.tel:
i.tel=j['tel']
i.save()
return Response({
'code':200,
'msg':'修改成功'
})
#收货地址
class Addrview(APIView):
#添加收货地址
def post(self,request):
user = request.META.get('USER')
if not user:
return Response({
'code': 400,
'msg': '用户未登录'
})
user_id = user['user_id']
user_info=User.objects.filter(id=user_id).first()
name=request.data.get('name') #收货人
tel=request.data.get('tel') #联系方式
addr=request.data.get('addr') #收货地址
is_default=request.data.get('is_default') #是否默认地址
#校验数据
if (not name) or(not tel) or (not addr):
return Response({
'code':400,
'msg':'请把信息填写完整'
})
if is_default: #把数据库的所有默认地址全部取消
Addr.objects.filter(is_default=1).update(is_default=False)
# 把数据写入到数据库
Addr.objects.create(
name=name,tel=tel,addr=addr,is_default=is_default,user=user_info
)
return Response({
'code':200,
'msg':'地址添加成功'
})
#删除收货地址
def delete(self,request):
user = request.META.get('USER')
if not user:
return Response({
'code': 400,
'msg': '用户未登录'
})
user_id = user['user_id']
addr_id=request.data.get('id')
#通过验证地址id和用户id把符合条件的地址i想你想取出来
addr_info=Addr.objects.filter(id=addr_id,user_id=user_id).first()
if not addr_info:
return Response({
'code':400,
'msg':'收获地址不存在'
})
addr_info.delete()
return Response({
'code':200,
'msg':'删除地址成功'
})
配置路由
from django.urls import path
from users import views
urlpatterns = [
path('info/',views.Userinfoview.as_view()), #获取用户信息
path('addr/',views.Addrview.as_view()), #用户收获地址
]
前端
获取用户信息，收货地址信息，添加/修改/删除地址信息
找到对应的vue组件对对应的功能函数进行配置
例如：User.vue
//router-link被点击时，判断用户是否登录
// 登录后向后端发送异步请求，获取用户信息
activated() {
// 未登录时，弹出登录组件
if (!this.$store.getters.getUser.userName) {
this.$store.dispatch("setShowLogin", true);
}
// TODO 获取用户信息
this.$axios.get('/user/info/',{
'headers':{
'token':localStorage.getItem('token')
}
}).then((result) => {
if (result.data.code==200){
this.userInfo.username=result.data.user.username
this.userInfo.phone=result.data.user.mobile
this.userInfo.addrs=result.data.user.addr
}else{
this.notifyError(result.data.msg)
}
}).catch((err) => {
console.log(err)
});
},
methods: {
// 修改个人信息
updateUserInfo() {
console.log("修改个人信息...");
// TODO 修改个人信息 收货地址信息
this.$axios.put('/user/info/',{
'mobile':this.userInfo.phone,
'addrs':this.userInfo.addrs,
},{
'headers':{
'token':localStorage.getItem('token')
},
}).then((result) => {
if (result.data.code==200){
this.notifySucceed(result.data.msg)
}else{
this.notifyError(result.data.msg)
}
}).catch((err) => {
console.log(err)
});
},
// 更改个人密码
updatePassword() {
console.log("修改个人密码...");
this.$store.dispatch("setUpdatePw", true);
},
deleteAddr(addr_id) {
// TODO 删除该地址
console.log("删除ID", addr_id)
this.$axios.delete('/user/addr/',{
'headers':{
'token':localStorage.getItem('token')
},
'data':{
'id':addr_id
}
}).then((result) => {
if (result.data.code==200){
this.notifySucceed(result.data.msg)
// 前端移除要删除的地址信息
for (var i=0;i
let temp=this.userInfo.addrs[i]
if(temp['id']==addr_id){
this.userInfo.addrs.splice(i,1)
}
}
}else{
this.notifyError(result.data.msg)
}
}).catch((err) => {
console.log(err)
});
},
// 添加地址
addAddr() {
console.log("增加地址...");
// TODO 增加地址
this.$axios.post('/user/addr/',{
'name':this.receiver,
'tel':this.receive_mobile,
'addr':this.receive_addr,
'is_default':this.is_default,
},{
'headers':{
'token':localStorage.getItem('token')
}
}).then((result) => {
if (result.data.code==200){
this.notifySucceed(result.data.msg)
this.receiver=''
this.receive_mobile=''
this.receive_addr=''
this.is_default=false
}else{
this.notifyError(result.data.msg)
}
}).catch((err) => {
console.log(err)
});
},
},
修改用户密码
后端
修改登录用户的密码
#修改用户密码
class Changepwdview(Addrview):
def put(self,request):
user = request.META.get('USER')
if not user:
return Response({
'code': 400,
'msg': '用户未登录'
})
user_id = user['user_id']
old_pwd=request.data.get('opwd') #旧密码
pwd=request.data.get('pwd') #新密码
pwd_re=request.data.get('pwd_re') #确认新密码
user_info=User.objects.filter(id=user_id).first()
if old_pwd!=user_info.password:
#说明原始的密码输入有问题
return Response({
'code':400,
'msg':'原始密码有问题'
})
if pwd!=pwd_re:
return Response({
'code':400,
'msg':'密码输入不一致'
})
user_info.password=pwd
user_info.save()
return Response({
'code':200,
'msg':'修改成功'
})
配置路由
from django.urls import path
from users import views
urlpatterns = [
path('pwd/change/',views.Changepwdview.as_view()) #修改用户密码
]
前端
获取用户信息，收货地址信息，添加/修改/删除地址信息
找到对应的vue组件对对应的功能函数进行配置
修改登录用户的密码
例如：UpdatePw.vue
updatePassword() {
// 通过element自定义表单校验规则，校验用户输入的用户信息
this.$refs["ruleForm"].validate((valid) => {
//如果通过校验开始请求后端
if (valid) {
// TODO 修改密码
this.$axios.put('/user/pwd/change/',{
'opwd':this.LoginUser.originPw,
'pwd':this.LoginUser.newPw,
'pwd_re':this.LoginUser.confirmNewPw
},{
'headers':{
'token':localStorage.getItem('token')
}
}).then((result) => {
if (result.data.code==200){
this.notifySucceed(result.data.msg)
this.LoginUser.originPw=''
this.LoginUser.newPw=''
this.LoginUser.confirmNewPw=''
this.setUpdatePw=false
}else{
this.notifyError(result.data.msg)
}
}).catch((err) => {
console.log(err)
});
}
});
},
