有一次淘宝搞活动,有姐妹跟我吐槽,说她在购物车一键下单商品,被淘宝提示最多只能一次下单50个商品,导致一些商品没有抢到……在电商直播系统中,购物车功能是非常常见且重要的基础功能,它负责暂时存放用户感兴趣但仍在考虑的商品,方便用户进行比较,同时可以通过多个商品一键下单的方式实现促销功能。
在本篇文章中,你可以学到,云豹科技是如何在云豹电商直播源码中实现购物车功能的。

一、编辑功能

首先,设置右上角的编辑功能

    self.rightBtn.hidden = NO;
    [self.rightBtn setTitle:YZMsg(@"编辑") forState:0];
    [self.rightBtn setTitleColor:[UIColor blackColor] forState:0];
    [self initData];
[self.view addSubview:self.carTable];

二、底部全选功能

UI包括全选功能、删除功能、结算功能

-(void)createBottom{
    bottomView = [[UIView alloc]initWithFrame:CGRectMake(0, _window_height-50, _window_width, 50)];
    bottomView.backgroundColor = [UIColor whiteColor];
    [self.view addSubview:bottomView];
    
    allSelBtn = [UIButton buttonWithType:0];
    allSelBtn.frame = CGRectMake(0, 10, 80, 30);
    [allSelBtn setImage:[UIImage imageNamed:@"记录未选"] forState:0];
    [allSelBtn setImage:[UIImage imageNamed:@"记录选中"] forState:UIControlStateSelected];
    [allSelBtn setTitle:YZMsg(@"全选") forState:0];
    allSelBtn.titleLabel.font = [UIFont systemFontOfSize:14];
    [allSelBtn setTitleColor:[UIColor blackColor] forState:0];
    [allSelBtn setTitleEdgeInsets:UIEdgeInsetsMake(0, 10, 0, 0)];
    [allSelBtn addTarget:self action:@selector(allSelClick:) forControlEvents:UIControlEventTouchUpInside];
    [bottomView addSubview:allSelBtn];
    
    
    deleteBtn  = [UIButton buttonWithType:0];
    deleteBtn.frame = CGRectMake(_window_width-90, 10, 80, 30);
    [deleteBtn setTitleColor:normalColors forState:0];
    [deleteBtn setTitle:@"删除" forState:0];
    deleteBtn.titleLabel.font = [UIFont systemFontOfSize:14];
    deleteBtn.layer.cornerRadius = 15;
    deleteBtn.layer.borderColor = normalColors.CGColor;
    deleteBtn.layer.borderWidth = 1;
    deleteBtn.layer.masksToBounds = YES;
    [deleteBtn addTarget:self action:@selector(deleteClick) forControlEvents:UIControlEventTouchUpInside];
    [bottomView addSubview:deleteBtn];
    
    
    subView = [[UIView alloc]initWithFrame:CGRectMake(_window_width/2, 0, _window_width/2, 50)];
    subView.backgroundColor = [UIColor whiteColor];
    [bottomView addSubview:subView];
   
    submitBtn = [UIButton buttonWithType:0];
    submitBtn.frame = CGRectMake(subView.width-125, 7, 115, 36);
    submitBtn.layer.cornerRadius = 18;
    submitBtn.layer.masksToBounds = YES;
    CAGradientLayer *gradientLayer =  [CAGradientLayer layer];
    gradientLayer.frame = submitBtn.bounds;
    gradientLayer.startPoint = CGPointMake(0, 0);
    gradientLayer.endPoint = CGPointMake(1, 0);
    gradientLayer.locations = @[@(0),@(1.0)];//渐变点
    [gradientLayer setColors:@[(id)[RGB(252, 87, 48) CGColor],(id)[RGB(253, 125, 59) CGColor]]];//渐变数组
    [submitBtn.layer addSublayer:gradientLayer];

    [submitBtn setTitle:@"结算(0)" forState:0];
    [submitBtn setTitleColor:[UIColor whiteColor] forState:0];
//    [submitBtn setBackgroundColor:normalColors];
    submitBtn.titleLabel.font = [UIFont systemFontOfSize:14];
    [submitBtn addTarget:self action:@selector(SettlementClick) forControlEvents:UIControlEventTouchUpInside];
    [subView addSubview:submitBtn];
    
    allPriceLb = [[UILabel alloc]init];
    allPriceLb.font = [UIFont systemFontOfSize:14];
    NSString *normalStr = @"合计:¥0";
    NSMutableAttributedString *contentStr = [[NSMutableAttributedString alloc] initWithString:normalStr];
    NSRange redRange = NSMakeRange(3, normalStr.length-3);
    [contentStr addAttributes:@{NSForegroundColorAttributeName:[UIColor orangeColor],NSFontAttributeName:[UIFont boldSystemFontOfSize:16]} range:redRange];
    allPriceLb.attributedText = contentStr;
    [subView addSubview:allPriceLb];
    [allPriceLb mas_makeConstraints:^(MASConstraintMaker *make) {
        make.right.equalTo(submitBtn.mas_left).offset(-5);
        make.centerY.equalTo(submitBtn.mas_centerY);
    }];
    
}

三、主体页面

用tableview来展示,初始化界面以及设置代理

-(UITableView *)carTable{
    if (!_carTable) {
        _carTable = [[UITableView alloc]initWithFrame:CGRectMake(0, 64+statusbarHeight, _window_width, _window_height-64-statusbarHeight) style:UITableViewStylePlain];
        _carTable.delegate = self;
        _carTable.dataSource = self;
        _carTable.separatorStyle = UITableViewCellSeparatorStyleNone;
        _carTable.mj_header = [MJRefreshHeader headerWithRefreshingBlock:^{
            [self requstData];
        }];
        _carTable.mj_footer = [MJRefreshBackFooter footerWithRefreshingBlock:^{
            [self requstData];

        }];
    }
    return _carTable;
}

四、计算选中商品的价格

头部分组选中,在section上设置选中按钮,当点击按钮时选中当前分组,再次点击取消选中,同时计算选中商品的价格。
这里多说一句,我们文章开头提到的,某宝一次最多下单五十个商品,一是有对运营方面的考量,比如对客户信用值的考虑,二是为了缓解技术压力,尤其是在双十一等活动日,各种优惠措施叠加,计算选中商品的价格的时间会被延长,很容易影响加载时间,甚至导致服务器宕机,为避免这类尴尬情况,某宝不得已出台了相关措施。
电商直播系统一旦到了某个体量,就不得不出台一定的限制措施来节约资源了。

-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    ShopCarListModel*listModel = self.listArr[section];
    _headerView = [tableView dequeueReusableHeaderFooterViewWithIdentifier:@"ShopHistoryHeader"];
    if (_headerView == nil) {
        _headerView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, _window_width, 40)];
        _headerView.backgroundColor = [UIColor whiteColor];

    }
    _headerView.tag = section;
    sectionBtn = [UIButton buttonWithType:0];
    sectionBtn.frame = CGRectMake(15, 8, 22, 22);
    sectionBtn.tag = section;
    [sectionBtn setImage:[UIImage imageNamed:@"记录未选"] forState:UIControlStateNormal];
    [sectionBtn setImage:[UIImage imageNamed:@"记录选中"] forState:UIControlStateSelected];
    [sectionBtn addTarget:self action:@selector(sectionBtnClick:) forControlEvents:UIControlEventTouchUpInside];
    [self.headerView addSubview:sectionBtn];
    sectionBtn.hidden = YES;

    UIImageView *shopicon = [[UIImageView alloc]init];
    shopicon.layer.cornerRadius = 13;
    shopicon.layer.masksToBounds = YES;
    [shopicon sd_setImageWithURL:[[self.infos[section] valueForKey:@"shop_info"] valueForKey:@"avatar"]];
    [_headerView addSubview:shopicon];
    sectionBtn.hidden = NO;
    shopicon.frame = CGRectMake(sectionBtn.right+10, 5, 26, 26)
    UILabel *dateLb = [[UILabel alloc]init];
//    dateLb.frame = CGRectMake(shopicon.right+10, 8, _window_width, 22);
    dateLb.text = [[self.infos[section] valueForKey:@"shop_info"] valueForKey:@"name"];

    dateLb.font = [UIFont systemFontOfSize:14];
    dateLb.textColor = [UIColor blackColor];
    [_headerView addSubview:dateLb];
    [dateLb mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(shopicon.mas_right).offset(5);
        make.centerY.equalTo(shopicon.mas_centerY);
    }];
    
    UIImageView *rightImg = [[UIImageView alloc]init];
    rightImg.image = [UIImage imageNamed:@"shop_right"];
    [_headerView addSubview:rightImg];
    [rightImg mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(dateLb.mas_right);
        make.centerY.equalTo(dateLb.mas_centerY);
        make.width.height.mas_equalTo(16);
    }];
    sectionBtn.selected = listModel.groupSelected;
    if (listModel.goods_list.count == 0) {
        return nil;
    }
    return self.headerView;
}

五、电商直播源码中商品全选功能实现

首先修改全选按钮的状态。如果头部按钮不是选中状态,则调用头部选中按钮的方法选中整个分组

#pragma mark-----全部选择--------
-(void)allSelClick: (UIButton*)allSelectedBtn{
    allSelectedBtn.selected = !allSelectedBtn.selected; // 修改全选按钮的状态
    if (allSelectedBtn.selected) { // 如果全选按钮改变了为选中
        for (int i = 0; i <self.listArr.count; i ++) {
            ShopCarListModel * listModel = self.listArr[i];
            if (!listModel.groupSelected) {//遍历如果组不是选中状态
                [self headerSelectedBtnClick:i]; //模拟组头点击了一次
            }
        }
    }else{
        for (int i = 0; i < self.listArr.count; i ++) { // 遍历所有的组头点击
            [self headerSelectedBtnClick:i];
        }
    }
}

六、头部分组点击选中功能实现

从数据源中依次取出列表的外层model,设置临时属性记录数量,设置里层model的选中状态,当个数相同时,整个分组成六、 全部选中状态

- (void)headerSelectedBtnClick:(NSInteger)section {
    ShopCarListModel*listModel = self.listArr[section];
    listModel.groupSelected = !listModel.groupSelected;
    // 判断如果点击 | header选中
    if (listModel.groupSelected) {
        //    /// 判断组头的点击改变全选按钮
        NSInteger tempGroupSelectNum = 0;
        for (ShopCarListModel *model in  self.listArr) {
            if (model.groupSelected) {
                tempGroupSelectNum ++;
            }
            if (tempGroupSelectNum ==  self.listArr.count) {
                allSelBtn.selected = YES;

            }
        }
        for (ShopCarModel* goodsModel in listModel.goods_list) {
            if (!goodsModel.isSelected) {                                       //下面不是选中状态的cell
                goodsModel.isSelected = YES;
            }
        }
    } else {  // 取消header选中 所有都取消
        //全选按钮变为不选中
        allSelBtn.selected = NO;

        for (ShopCarModel* goodsModel in listModel.goods_list) {
            goodsModel.isSelected = NO;
        }
    }
    
    [_carTable reloadData];
    [self getAllPric];
}

七、 电商直播源码中商品删除功能实现

从数据源中取出相应的model,如果model 的状态是选中状态,则放入选中数组,处理数据上传接口

-(void)deleteClick{
    
    [selectHistory removeAllObjects];
    for (int i = 0; i < self.listArr.count; i ++) {
        ShopCarListModel*listModel = self.listArr[i];
        for (ShopCarModel* goodsModel in listModel.goods_list) {
            if (goodsModel.isSelected) {
                [selectHistory addObject:goodsModel];
            }
        }
    }
    NSString *delId = @"";
    for (ShopCarModel *model in selectHistory) {
        delId = [delId stringByAppendingFormat:@"%@,",model.idStr];
    }
    NSRange range = NSMakeRange(delId.length-1, 1);
    delId = [delId stringByReplacingCharactersInRange:range withString:@""];
    
    NSString *url = [purl stringByAppendingFormat:@"?service=Buyer.delShopCartGoods"];

    NSDictionary *signdic = @{@"uid":[Config getOwnID],@"token":[Config getOwnToken], @"time":[NSNumber numberWithLong: (long)[[NSDate date] timeIntervalSince1970]]};
    NSString *sign = [YBToolClass dynamicSortString:signdic];

    NSDictionary *dic = @{
                          @"uid":[Config getOwnID],
                          @"token":[Config getOwnToken],
                          @"time":[NSNumber numberWithLong: (long)[[NSDate date] timeIntervalSince1970]],
                          @"goodsids":delId,
                          @"sign":sign
                          };
    NSLog(@"-=-=-=-=:%@", dic);
    [YBNetworking postWithUrl:url Dic:dic Suc:^(NSDictionary *data, NSString *code, NSString *msg) {
        if ([code isEqual:@"0"]) {
            [self requstData];
        }else{
            [MBProgressHUD showError:msg];
        }
    } Fail:^(id fail) {

    }];

}

以上就是本文全部内容,该源代码节选自云豹电商直播系统源码,仅供参考,如需商用请支持正版。
声明:以上内容为作者:云豹科技官方 本人原创,未经作者本人同意,禁止转载,否则将追究相关法律责任