美文网首页bifangback
bifangback-发布单过滤(基于多个值)

bifangback-发布单过滤(基于多个值)

作者: 万州客 | 来源:发表于2021-02-28 13:19 被阅读0次

    春节过完,又开始继续我的bifang项目了。由于感觉自己工作到了一个瓶颈状态,想看看自己有没有其它人生可能性。于是,上周提离职了。可能对于一个40多岁的男人来说,作事不应该太冲动。但,再这样拖下去,也就老了。下一步怎么走?先走完bifang,出书(和出版商有约定,书稿计划国庆左右完成,注重CI/CD的实战流水线,敬请关注),作视频直播,都有可能啦~
    闲话不表,今天再记录一下关于django_filters如何过滤多个前端值的写法。

    一,原始需求

    比如,在新建的发布单列表时,环境流转列表时,部署列表时。因为发布单状态不一样,显示的发布单是不一样的。(还没有编译构建完成的发布单,是不应该出现在环境流转当中的,而只是编译完成,没有环境流转的,也不需要出现在部署列表中)

    二,后端过滤器实现

    通过一个过滤方法来实现

    class ReleaseFilter(FilterSet):
        name = filters.CharFilter(field_name='name', lookup_expr='icontains',)
        begin_time = filters.DateTimeFilter(field_name='create_date', lookup_expr='gte',)
        end_time = filters.DateTimeFilter(field_name='create_date', lookup_expr='lte',)
        sort = OrderingFilter(fields=('create_date',))
        # 自定义过滤方法
        deploy_status = filters.CharFilter(field_name='deploy_status', method='deploy_status_filter', )
    
        def deploy_status_filter(self, queryset, field_name, value):
            # 前端传过来的deploy_status为字符串,将其转换为列表,就可以过滤需要的发布单了
            filter_list = value.split(',')
            # 外建基于列表过滤的语法
            return queryset.filter(deploy_status__name__in=filter_list)
    
        class Meta:
            model = Release
            fields = ['name', 'begin_time', 'end_time', 'deploy_status']
    

    三,前端传参数示例

    URL请求可能是这样
    http://127.0.0.1:8000/release/list/?name=&currentPage=1&pageSize=20&begin_time=&end_time=&deploy_status=Ready,Ongoing,Failed,Success&sort=

    四,Vue中带参数请求的写法

    1,获取请求的函数

    fetchData(){
          API.ReleaseList(this.params).then((res)=>{
            let result = res.data
            if(res.status == 200 && result.code == 0){
              this.total = result.data.count
              this.dataSource = result.data.results;
              console.log(this.dataSource)
            } else {
              this.dataSource = []
            }
          })
        },
    

    2,params的data定义

    params:{
            name:"",
            currentPage:1,
            pageSize:20,
            begin_time:"",
            end_time:"",
            deploy_status: 'Ready,Ongoing,Failed,Success',
            sort:""
          }
    

    五,可能的样子

    2021-02-28 13_19_08-悬浮球.png

    相关文章

      网友评论

        本文标题:bifangback-发布单过滤(基于多个值)

        本文链接:https://www.haomeiwen.com/subject/bndgfltx.html