FireBoltt_ios/FireBoltt/FB_Modules/FB_Health/View/HealthStepItemCell.swift

//
//  HealthStepItemCell.swift
//  FireBoltt
//
//  Created by Sheldon on 2021/9/19.
//  Copyright © 2021 Sheldon. All rights reserved.
//

import UIKit

class HealthStepItemCell: CollectionViewCell {
    
    lazy var fb_titleLabel: UILabel = {
        let label = UILabel()
        label.textColor = kHexColor(0x2A2A2A)
        label.font = SystemMediumFont(18)
        label.text = MultiLanguageKey_FB.stepFB.localized
        return label
    }()
    lazy var fb_dateLabel: UILabel = {
        let label = UILabel()
        label.textColor = kHexColor(0x888888)
        label.font = SystemRegularFont(12)
        label.text = DateClass.timestampToStr(Int(Date().timeIntervalSince1970), formatStr: "yyyy/MM/dd")
        return label
    }()
    lazy var fb_bgView: UIView = {
        let view = UIView()
//        view.gradient(colors: [kHexColor(0x59AAFF), kHexColor(0x2B75FF)], locations: nil, autoLaoutFrame: CGRect(x: 0, y: 0, width: kScaleWidth(335), height: kScaleWidth(160)))
        view.gradient(colors: [.white, .white], locations: nil, autoLaoutFrame: CGRect(x: 0, y: 0, width: kScaleWidth(335), height: kScaleWidth(160)))
        view.layer.cornerRadius = 10
        view.layer.masksToBounds = true
        return view
    }()
    
    /// 步数
    lazy var stepProgress:XFGradientProgressView = {
        let view = XFGradientProgressView(frame: CGRect(x: 18, y: 30, width: 115, height: 115), start: kRGBA(35, 128, 255, 1), end: kRGBA(35, 128, 255, 1), backProgressColor: kRGBA(35, 128, 255, 0.4))
        view!.startAnimation(toProgress: 0, durationTime: 0, sImgName: "icon_step")
        return view!
    }()
    
    /// 热量
    lazy var distanceProgress:XFGradientProgressView = {
        let view = XFGradientProgressView(frame: CGRect(x: stepProgress.left+12.5, y: stepProgress.top+10, width: stepProgress.width-25, height: stepProgress.height-20), start: kRGBA(253, 161, 40, 1), end: kRGBA(253, 161, 40, 1), backProgressColor: kRGBA(253, 161, 40, 0.4))
        view!.startAnimation(toProgress: 0, durationTime: 0, sImgName: "icon_distance")
        return view!
    }()
    
    /// 总里程
    lazy var calorieProgress:XFGradientProgressView = {
        let view = XFGradientProgressView(frame: CGRect(x: distanceProgress.left+12.5, y: distanceProgress.top+10, width: distanceProgress.width-25, height: distanceProgress.height-19), start: kRGBA(255, 0, 96, 1), end: kRGBA(255, 0, 96, 1), backProgressColor: kRGBA(255, 0, 96, 0.4))
        view!.startAnimation(toProgress: 0, durationTime: 0, sImgName: "icon_calories")
        return view!
    }()
    
    
//    lazy var fb_stepCircleView: CircleView = {
//        let view = CircleView(lineWidth: 8, bottomColor: kHexColor(0xFFFFFF, 0.3), progressColor: kHexColor(0xFFFFFF), type: .doubleLine)
//        return view
//    }()
    
    /// 步数
    lazy var fb_stepValue: UILabel = {
        let label = UILabel()
        label.font = DigitalFont(25)
        label.textColor = kRGBA(42, 42, 42, 1)
        label.text = "0"
        return label
    }()
    
    /// 步数单位
    lazy var fb_stepUnit: UILabel = {
        let label = UILabel()
        label.font = SystemRegularFont(12)
        label.textColor = kRGBA(133, 133, 133, 1)
        label.text = MultiLanguageKey_FB.stepTipFB.localized
        return label
    }()
//    lazy var fb_dataCircleView: CircleView = {
//        let view = CircleView(lineWidth: 2, bottomColor: kHexColor(0xfffff, 0.3), type: .dottedLine)
//        return view
//    }()
    
    /// 千卡数据
    lazy var fb_stepCaloriesValue: UILabel = {
        let label = UILabel()
        label.font = DigitalFont(25)
        label.textColor = kRGBA(42, 42, 42, 1)
        label.text = "0"
        return label
    }()
    /// 公里数据
    lazy var fb_stepDistanceValue: UILabel = {
        let label = UILabel()
        label.font = DigitalFont(25)
        label.textColor = kRGBA(42, 42, 42, 1)
        label.text = "0"
        return label
    }()
    
    /// 千卡单位
    lazy var fb_stepCalories: UILabel = {
        let label = UILabel()
        label.font = SystemRegularFont(12)
        label.textColor = kRGBA(133, 133, 133, 1)
        label.text = MultiLanguageKey_FB.kcalFB.localized
        return label
    }()
    
    /// 公里单位
    lazy var fb_stepDistance: UILabel = {
        let label = UILabel()
        label.font = SystemRegularFont(12)
        label.textColor = kRGBA(133, 133, 133, 1)
        label.text = MultiLanguageKey_FB.kmFB.localized
        return label
    }()
    
    /// 线条
    lazy var line: UILabel = {
        let label = UILabel()
        label.backgroundColor = kRGBA(235, 235, 235, 1)
        return label
    }()
    lazy var line1: UILabel = {
        let label = UILabel()
        label.backgroundColor = kRGBA(235, 235, 235, 1)
        return label
    }()
    
    /// 圆点
    lazy var point: UILabel = {
        let label = UILabel()
        label.backgroundColor = kRGBA(88, 157, 245, 1)
        label.layer.cornerRadius = 2.5
        label.layer.masksToBounds = true
        return label
    }()
    lazy var point1: UILabel = {
        let label = UILabel()
        label.backgroundColor = kRGBA(255, 0, 96, 1)
        label.layer.cornerRadius = 2.5
        label.layer.masksToBounds = true
        return label
    }()
    lazy var point2: UILabel = {
        let label = UILabel()
        label.backgroundColor = kRGBA(253, 161, 40, 1)
        label.layer.cornerRadius = 2.5
        label.layer.masksToBounds = true
        return label
    }()
    
    /// 问题提示
    lazy var tlabel: UILabel = {
        let label = UILabel()
        label.font = SystemRegularFont(13)
        label.textColor = kRGBA(42, 42, 42, 1)
        label.text = MultiLanguageKey_FB.stepNumberFB.localized
        return label
    }()
    lazy var tlabel1: UILabel = {
        let label = UILabel()
        label.font = SystemRegularFont(13)
        label.textColor = kRGBA(42, 42, 42, 1)
        label.text = MultiLanguageKey_FB.heatFB.localized
        return label
    }()
    lazy var tlabel2: UILabel = {
        let label = UILabel()
        label.font = SystemRegularFont(13)
        label.textColor = kRGBA(42, 42, 42, 1)
        label.text = MultiLanguageKey_FB.totalDistanceFB.localized
        return label
    }()
    
    
    
//    override init(frame: CGRect) {
//        super.init(frame: frame)
//        selectionStyle = .none
        
//        containerView.addSubview(titleLabel)
//        containerView.addSubview(dateLabel)
//        containerView.addSubview(bgView)
//        bgView.addSubview(stepCircleView)
//        bgView.addSubview(dataCircleView)
//        stepCircleView.addSubview(stepValue)
//        stepCircleView.addSubview(stepUnit)
//        dataCircleView.addSubview(stepCaloriesValue)
//        dataCircleView.addSubview(stepDistanceValue)
//        dataCircleView.addSubview(stepCalories)
//        dataCircleView.addSubview(stepDistance)
//        layoutUI()
//    }
    
//    required init?(coder: NSCoder) {
//        fatalError("init(coder:) has not been implemented")
//    }
    
    override func setUpUI() {
        containerView.addSubview(fb_titleLabel)
        containerView.addSubview(fb_dateLabel)
        containerView.addSubview(fb_bgView)
//        fb_bgView.addSubview(fb_stepCircleView)
//        fb_bgView.addSubview(fb_dataCircleView)
        fb_bgView.addSubview(stepProgress)
        fb_bgView.addSubview(distanceProgress)
        fb_bgView.addSubview(calorieProgress)
        
        fb_bgView.addSubview(fb_stepValue)
        fb_bgView.addSubview(fb_stepUnit)
        fb_bgView.addSubview(fb_stepCaloriesValue)
        fb_bgView.addSubview(fb_stepDistanceValue)
        fb_bgView.addSubview(fb_stepCalories)
        fb_bgView.addSubview(fb_stepDistance)
        
        fb_bgView.addSubview(line)
        fb_bgView.addSubview(line1)
        fb_bgView.addSubview(point)
        fb_bgView.addSubview(point1)
        fb_bgView.addSubview(point2)
        fb_bgView.addSubview(tlabel)
        fb_bgView.addSubview(tlabel1)
        fb_bgView.addSubview(tlabel2)
    }
    
    override func layoutUI() {
        fb_titleLabel.snp.makeConstraints { (make) in
            make.top.equalTo(kScaleWidth(20))
            make.left.equalTo(25)
        }
        fb_dateLabel.snp.makeConstraints { (make) in
            make.bottom.equalTo(fb_titleLabel.snp.bottom)
            make.right.equalTo(-25)
        }
        fb_bgView.snp.makeConstraints { (make) in
            make.top.equalTo(fb_titleLabel.snp.bottom).offset(10)
            make.left.equalTo(20)
            make.right.equalTo(-20)
            make.height.equalTo(kScaleWidth(160))
        }
//        fb_stepCircleView.snp.makeConstraints { (make) in
//            make.centerY.equalToSuperview()
//            make.width.height.equalTo(kScaleWidth(130))
//            make.left.equalTo(kScaleWidth(28))
//        }
        fb_stepUnit.snp.makeConstraints { (make) in
            make.top.equalTo(fb_bgView)
            make.right.equalTo(fb_bgView.snp_right).inset(18.5)
            make.height.equalTo(kScaleWidth(160)/3)
        }
        
        fb_stepValue.snp.makeConstraints { (make) in
            make.centerY.equalTo(fb_stepUnit)
            make.right.equalTo(fb_bgView.snp_right).inset(52.5)
        }
        
//        fb_dataCircleView.snp.makeConstraints { (make) in
//            make.centerY.equalToSuperview()
//            make.width.height.equalTo(kScaleWidth(130))
//            make.right.equalTo(-kScaleWidth(28))
//        }
        
        fb_stepCalories.snp.makeConstraints { (make) in
            make.right.equalTo(fb_bgView.snp_right).inset(18.5)
            make.height.equalTo(kScaleWidth(160)/3)
            make.top.equalTo(fb_stepUnit.snp_bottom)
        }
        
        fb_stepCaloriesValue.snp.makeConstraints { (make) in
            make.centerY.equalTo(fb_stepCalories)
            make.right.equalTo(fb_bgView.snp_right).inset(52.5)
        }
        
        
        fb_stepDistance.snp.makeConstraints { (make) in
            make.right.equalTo(fb_bgView.snp_right).inset(18.5)
            make.height.equalTo(kScaleWidth(160)/3)
            make.top.equalTo(fb_stepCalories.snp_bottom)
        }
        fb_stepDistanceValue.snp.makeConstraints { (make) in
            make.centerY.equalTo(fb_stepDistance)
            make.right.equalTo(fb_bgView.snp_right).inset(52.5)
        }
        
        line.snp.makeConstraints { make in
            make.right.equalTo(fb_bgView.snp_right).inset(12)
            make.left.equalTo(fb_bgView).offset(160)
            make.top.equalTo(fb_stepUnit.snp_bottom)
            make.height.equalTo(0.5)
        }
        line1.snp.makeConstraints { make in
            make.right.equalTo(fb_bgView.snp_right).inset(12)
            make.left.equalTo(fb_bgView).offset(160)
            make.top.equalTo(fb_stepCalories.snp_bottom)
            make.height.equalTo(0.5)
        }
        
        point.snp.makeConstraints { make in
            make.left.equalTo(line.snp_left);
            make.centerY.equalTo(fb_stepUnit);
            make.size.equalTo(CGSize(width: 5, height: 5))
        }
        point1.snp.makeConstraints { make in
            make.left.equalTo(line.snp_left);
            make.centerY.equalTo(fb_stepCalories);
            make.size.equalTo(CGSize(width: 5, height: 5))
        }
        point2.snp.makeConstraints { make in
            make.left.equalTo(line.snp_left);
            make.centerY.equalTo(fb_stepDistance);
            make.size.equalTo(CGSize(width: 5, height: 5))
        }
        
        tlabel.snp.makeConstraints { make in
            make.left.equalTo(point.snp_right).offset(10)
            make.centerY.equalTo(point);
        }
        
        tlabel1.snp.makeConstraints { make in
            make.left.equalTo(point1.snp_right).offset(10)
            make.centerY.equalTo(point1);
        }
        
        tlabel2.snp.makeConstraints { make in
            make.left.equalTo(point2.snp_right).offset(10)
            make.centerY.equalTo(point2);
        }
        
    }

    override func bind(model: ViewModel) {
        super.bind(model: model)
        guard let viewModel = model as? StepCellViewModels else { return }
        viewModel.step
            .bind(to: fb_stepValue.rx.text)
            .disposed(by: cellDisposeBag)
        viewModel.calories
            .bind(to: fb_stepCaloriesValue.rx.text)
            .disposed(by: cellDisposeBag)
        viewModel.distance
            .bind(to: fb_stepDistanceValue.rx.text)
            .disposed(by: cellDisposeBag)
        viewModel.progress
            .subscribe(onNext: { [weak self] (progress) in
//                self?.fb_stepCircleView.updateProcess(process: Float(progress))
                self?.stepProgress .startAnimation(toProgress: CGFloat(Float(progress)), durationTime: 0, sImgName: "icon_step")
                self?.distanceProgress .startAnimation(toProgress: CGFloat(Float(progress)), durationTime: 0, sImgName: "icon_distance")
                self?.calorieProgress .startAnimation(toProgress: CGFloat(Float(progress)), durationTime: 0, sImgName: "icon_calories")
            })
            .disposed(by: cellDisposeBag)
        viewModel.dateStr
            .bind(to: fb_dateLabel.rx.text)
            .disposed(by: cellDisposeBag)
    }
    
}