django+vue+framework第十二天，添加评分

新人学习django 是按照这个大佬的教程学习的
链接: https://www.cnblogs.com/derek1184405959/p/8733194.html.

很多步骤都是按照上面的教程学习的，这里只是记录一下自己学习的过程和一些错误
如果有人想要系统的学习，建议去上面那位大佬处学习
先在pycharm中的user_operations中的models中新建一个UserSource的model

class UserSource(models.Model):
    user = models.ForeignKey(User, on_delete=models.CASCADE, verbose_name="用户")
    goods = models.ForeignKey(Goods, on_delete=models.CASCADE, verbose_name="商品", help_text="商品id")
    rating=models.IntegerField(verbose_name="用户对商品的评分",default=0)
    timestamp=models.DateTimeField("添加时间",default=datetime.now())

    class Meta:
        verbose_name="用户评分"
        verbose_name_plural=verbose_name
    def __str__(self):
        return self.user.username

然后是序列化serializer

class  UserSourceSerilaizer(serializers.ModelSerializer):
    #获取当前用户
    user=serializers.HiddenField(
        default=serializers.CurrentUserDefault()
    )

    class Meta:
        # validate实现唯一联合，一个商品只能评分一次
        validators = [
            UniqueTogetherValidator(
                queryset=UserSource.objects.all(),
                fields=('user', 'goods'),
                # message的信息可以自定义
                message="大大，已经评分了哦"
            )
        ]
        model = UserSource
        # 评分的时候需要返回商品的id，因为取消评分的时候必须知道商品的id是多少
        fields = ("user", "goods", 'id',"rating")


class UserSourceDetailSerilaizer(serializers.ModelSerializer):
    """
    用户评分详情
    """
    #通过用户id获取评分的商品，需要嵌套商品的序列化
    goods=GoodsSerializer()
    class Meta:
        model=UserSource
        fields=("goods","id","rating","user")

新建viewSet

class UserSourceViewSet(viewsets.GenericViewSet,mixins.ListModelMixin,mixins.CreateModelMixin,mixins.DestroyModelMixin):
    """
    用户评分
    """
    serializer_class = UserSourceDetailSerilaizer
    #permission是用来做权限判断的
    ## IsAuthenticated：必须登录用户；IsOwnerOrReadOnly：必须是当前登录的用户可以查看
    permission_classes = (IsAuthenticated,IsOwnerOrReadOnly)
    #auth做用户认证
    authentication_classes = (JSONWebTokenAuthentication,SessionAuthentication)
    #搜索的字段
    lookup_field = "goods_id"


    #动态选择序列化方式
    def get_serializer_class(self):
        if self.action=="list":
            return UserSourceDetailSerilaizer
        elif self.action=="create":
            return UserSourceSerilaizer

        return  UserSourceDetailSerilaizer
    def get_queryset(self):
        #只能查看当前登录用户的评分，不会获取所有用户的评分
        return UserSource.objects.filter(user=self.request.user)

创建url

# 配置用户评分的url
router.register(r'source', UserSourceViewSet, basename="source")

查看是否显示

修改vue，添加用户的评分显示和评分功能

类比于收藏字段
首先复制collection.vue为source.vue
然后更改字段

然后更改member-menu.vue
添加一个我的评分的menu



然后更改api，添加获取用户评分的api

//评分
export const addSource = params => { return axios.post(`${local_host}/source/`, params) }

//取消评分
export const delSource = goodsId => { return axios.delete(`${local_host}/source/`+goodsId+'/') }

export const getAllSource = () => { return axios.get(`${local_host}/source/`) }

//判断是否评分
export const getSource = goodsId => { return axios.get(`${local_host}/source/`+goodsId+'/') }

查看

添加评分的按钮
在商品详情的productDetail.vue中添加



不同的按钮传回去不同的评分

清除商品上方的index
修改掉

将箭头中原先的内容删除掉
同理修改


index已经删除掉了