// // SertifikatSementaraCell.swift // Sirani // // Created by Anhar Solehudin on 22/04/19. // Copyright © 2019 Anhar Solehudin. All rights reserved. // import UIKit import MaterialComponents.MaterialCards class SertifikatSementaraCell: UITableViewCell { @IBOutlet weak var card: MDCCard! @IBOutlet weak var lblAplikasiId: UILabel! @IBOutlet weak var lblNo: UILabel! @IBOutlet weak var lblTgl: UILabel! @IBOutlet weak var lblCustName: UILabel! @IBOutlet weak var lblEqpName: UILabel! @IBOutlet weak var lblMerk: UILabel! @IBOutlet weak var lblModel: UILabel! @IBOutlet weak var lblNegara: UILabel! // Modern Programmatic UI Elements private let modernContainer = UIView() private let modernBadgeView = UIView() private let modernBadgeIcon = UIImageView() private let modernNomorLabel = UILabel() private let modernCategoryLabel = UILabel() private let modernStatusPill = UIView() private let modernStatusLabel = UILabel() private let modernPerangkatLabel = UILabel() private let modernCompanyIcon = UIImageView() private let modernPemohonLabel = UILabel() private let modernSpecStack = UIStackView() private let modernMerkCard = UIView() private let modernMerkTitle = UILabel() private let modernMerkVal = UILabel() private let modernNegaraCard = UIView() private let modernNegaraTitle = UILabel() private let modernNegaraVal = UILabel() private let modernValidityCard = UIView() private let modernCalendarIcon = UIImageView() private let modernValidityLabel = UILabel() private let modernAplIdLabel = UILabel() private var isModernLayoutBuilt = false override func awakeFromNib() { super.awakeFromNib() self.selectionStyle = .none self.backgroundColor = .clear setupCardVisuals() setupModernLayout() } private func setupCardVisuals() { guard let card = card else { return } card.cornerRadius = 16 card.setShadowElevation(ShadowElevation(rawValue: 2), for: .normal) card.setShadowColor(UIColor.black.withAlphaComponent(0.06), for: .normal) card.layer.borderColor = UIColor(red: 228/255, green: 235/255, blue: 245/255, alpha: 1.0).cgColor card.layer.borderWidth = 1.0 card.backgroundColor = .white } private func setupModernLayout() { guard let card = card, !isModernLayoutBuilt else { return } isModernLayoutBuilt = true for subview in card.subviews { subview.isHidden = true } modernContainer.translatesAutoresizingMaskIntoConstraints = false modernContainer.backgroundColor = .clear card.addSubview(modernContainer) NSLayoutConstraint.activate([ modernContainer.topAnchor.constraint(equalTo: card.topAnchor, constant: 14), modernContainer.bottomAnchor.constraint(equalTo: card.bottomAnchor, constant: -14), modernContainer.leadingAnchor.constraint(equalTo: card.leadingAnchor, constant: 14), modernContainer.trailingAnchor.constraint(equalTo: card.trailingAnchor, constant: -14) ]) // 1. Header Bar let headerStack = UIStackView() headerStack.translatesAutoresizingMaskIntoConstraints = false headerStack.axis = .horizontal headerStack.alignment = .center headerStack.spacing = 10 modernContainer.addSubview(headerStack) modernBadgeView.translatesAutoresizingMaskIntoConstraints = false modernBadgeView.backgroundColor = UIColor(red: 254/255, green: 243/255, blue: 199/255, alpha: 1.0) modernBadgeView.layer.cornerRadius = 8 modernBadgeView.layer.masksToBounds = true modernBadgeIcon.translatesAutoresizingMaskIntoConstraints = false if #available(iOS 13.0, *) { modernBadgeIcon.image = UIImage(systemName: "hourglass.bottomhalf.filled") } modernBadgeIcon.tintColor = UIColor(red: 180/255, green: 83/255, blue: 9/255, alpha: 1.0) modernBadgeIcon.contentMode = .scaleAspectFit modernBadgeView.addSubview(modernBadgeIcon) let titleStack = UIStackView() titleStack.translatesAutoresizingMaskIntoConstraints = false titleStack.axis = .vertical titleStack.spacing = 2 modernCategoryLabel.translatesAutoresizingMaskIntoConstraints = false modernCategoryLabel.font = UIFont.systemFont(ofSize: 10, weight: .bold) modernCategoryLabel.textColor = UIColor(red: 180/255, green: 83/255, blue: 9/255, alpha: 1.0) modernCategoryLabel.text = "SERTIFIKAT SEMENTARA" modernNomorLabel.translatesAutoresizingMaskIntoConstraints = false modernNomorLabel.font = UIFont.systemFont(ofSize: 14, weight: .bold) modernNomorLabel.textColor = UIColor(red: 26/255, green: 32/255, blue: 44/255, alpha: 1.0) modernNomorLabel.numberOfLines = 1 titleStack.addArrangedSubview(modernCategoryLabel) titleStack.addArrangedSubview(modernNomorLabel) modernStatusPill.translatesAutoresizingMaskIntoConstraints = false modernStatusPill.layer.cornerRadius = 12 modernStatusPill.layer.masksToBounds = true modernStatusPill.backgroundColor = UIColor(red: 254/255, green: 243/255, blue: 199/255, alpha: 1.0) let statusDot = UIView() statusDot.translatesAutoresizingMaskIntoConstraints = false statusDot.layer.cornerRadius = 3.5 statusDot.backgroundColor = UIColor(red: 245/255, green: 158/255, blue: 11/255, alpha: 1.0) modernStatusLabel.translatesAutoresizingMaskIntoConstraints = false modernStatusLabel.font = UIFont.systemFont(ofSize: 11, weight: .bold) modernStatusLabel.textColor = UIColor(red: 180/255, green: 83/255, blue: 9/255, alpha: 1.0) modernStatusLabel.text = "SEMENTARA" let pillStack = UIStackView(arrangedSubviews: [statusDot, modernStatusLabel]) pillStack.translatesAutoresizingMaskIntoConstraints = false pillStack.axis = .horizontal pillStack.spacing = 5 pillStack.alignment = .center modernStatusPill.addSubview(pillStack) headerStack.addArrangedSubview(modernBadgeView) headerStack.addArrangedSubview(titleStack) headerStack.addArrangedSubview(modernStatusPill) // 2. Equipment Name modernPerangkatLabel.translatesAutoresizingMaskIntoConstraints = false modernPerangkatLabel.font = UIFont.systemFont(ofSize: 15, weight: .bold) modernPerangkatLabel.textColor = UIColor(red: 26/255, green: 32/255, blue: 44/255, alpha: 1.0) modernPerangkatLabel.numberOfLines = 2 modernContainer.addSubview(modernPerangkatLabel) // 3. Company Row let companyStack = UIStackView() companyStack.translatesAutoresizingMaskIntoConstraints = false companyStack.axis = .horizontal companyStack.spacing = 6 companyStack.alignment = .center modernContainer.addSubview(companyStack) modernCompanyIcon.translatesAutoresizingMaskIntoConstraints = false if #available(iOS 13.0, *) { modernCompanyIcon.image = UIImage(systemName: "building.2.fill") } modernCompanyIcon.tintColor = UIColor(red: 113/255, green: 128/255, blue: 150/255, alpha: 1.0) modernCompanyIcon.contentMode = .scaleAspectFit modernPemohonLabel.translatesAutoresizingMaskIntoConstraints = false modernPemohonLabel.font = UIFont.systemFont(ofSize: 13, weight: .medium) modernPemohonLabel.textColor = UIColor(red: 74/255, green: 85/255, blue: 104/255, alpha: 1.0) modernPemohonLabel.numberOfLines = 1 companyStack.addArrangedSubview(modernCompanyIcon) companyStack.addArrangedSubview(modernPemohonLabel) // 4. Spec Stack (Merk & Model | Negara) modernSpecStack.translatesAutoresizingMaskIntoConstraints = false modernSpecStack.axis = .horizontal modernSpecStack.distribution = .fillEqually modernSpecStack.spacing = 8 modernContainer.addSubview(modernSpecStack) func styleMiniCard(_ cardView: UIView, titleLabel: UILabel, valLabel: UILabel, title: String) { cardView.translatesAutoresizingMaskIntoConstraints = false cardView.backgroundColor = UIColor(red: 248/255, green: 250/255, blue: 253/255, alpha: 1.0) cardView.layer.cornerRadius = 8 cardView.layer.borderColor = UIColor(red: 235/255, green: 240/255, blue: 248/255, alpha: 1.0).cgColor cardView.layer.borderWidth = 1 titleLabel.translatesAutoresizingMaskIntoConstraints = false titleLabel.font = UIFont.systemFont(ofSize: 10, weight: .semibold) titleLabel.textColor = UIColor(red: 113/255, green: 128/255, blue: 150/255, alpha: 1.0) titleLabel.text = title valLabel.translatesAutoresizingMaskIntoConstraints = false valLabel.font = UIFont.systemFont(ofSize: 12, weight: .semibold) valLabel.textColor = UIColor(red: 45/255, green: 55/255, blue: 72/255, alpha: 1.0) valLabel.numberOfLines = 1 let stack = UIStackView(arrangedSubviews: [titleLabel, valLabel]) stack.translatesAutoresizingMaskIntoConstraints = false stack.axis = .vertical stack.spacing = 2 cardView.addSubview(stack) NSLayoutConstraint.activate([ stack.topAnchor.constraint(equalTo: cardView.topAnchor, constant: 6), stack.bottomAnchor.constraint(equalTo: cardView.bottomAnchor, constant: -6), stack.leadingAnchor.constraint(equalTo: cardView.leadingAnchor, constant: 8), stack.trailingAnchor.constraint(equalTo: cardView.trailingAnchor, constant: -8) ]) } styleMiniCard(modernMerkCard, titleLabel: modernMerkTitle, valLabel: modernMerkVal, title: "MERK & MODEL") styleMiniCard(modernNegaraCard, titleLabel: modernNegaraTitle, valLabel: modernNegaraVal, title: "NEGARA PEMBUAT") modernSpecStack.addArrangedSubview(modernMerkCard) modernSpecStack.addArrangedSubview(modernNegaraCard) // 5. Validity Footer Bar modernValidityCard.translatesAutoresizingMaskIntoConstraints = false modernValidityCard.backgroundColor = UIColor(red: 254/255, green: 249/255, blue: 240/255, alpha: 1.0) modernValidityCard.layer.cornerRadius = 10 modernContainer.addSubview(modernValidityCard) modernCalendarIcon.translatesAutoresizingMaskIntoConstraints = false if #available(iOS 13.0, *) { modernCalendarIcon.image = UIImage(systemName: "calendar") } modernCalendarIcon.tintColor = UIColor(red: 180/255, green: 83/255, blue: 9/255, alpha: 1.0) modernCalendarIcon.contentMode = .scaleAspectFit modernValidityLabel.translatesAutoresizingMaskIntoConstraints = false modernValidityLabel.font = UIFont.systemFont(ofSize: 11, weight: .medium) modernValidityLabel.textColor = UIColor(red: 120/255, green: 53/255, blue: 15/255, alpha: 1.0) modernAplIdLabel.translatesAutoresizingMaskIntoConstraints = false modernAplIdLabel.font = UIFont.systemFont(ofSize: 10, weight: .bold) modernAplIdLabel.textColor = UIColor(red: 180/255, green: 83/255, blue: 9/255, alpha: 1.0) let validityContentStack = UIStackView(arrangedSubviews: [modernCalendarIcon, modernValidityLabel]) validityContentStack.translatesAutoresizingMaskIntoConstraints = false validityContentStack.axis = .horizontal validityContentStack.spacing = 6 validityContentStack.alignment = .center let footerStack = UIStackView(arrangedSubviews: [validityContentStack, modernAplIdLabel]) footerStack.translatesAutoresizingMaskIntoConstraints = false footerStack.axis = .horizontal footerStack.distribution = .equalSpacing footerStack.alignment = .center modernValidityCard.addSubview(footerStack) // Constraints NSLayoutConstraint.activate([ headerStack.topAnchor.constraint(equalTo: modernContainer.topAnchor), headerStack.leadingAnchor.constraint(equalTo: modernContainer.leadingAnchor), headerStack.trailingAnchor.constraint(equalTo: modernContainer.trailingAnchor), modernBadgeView.widthAnchor.constraint(equalToConstant: 34), modernBadgeView.heightAnchor.constraint(equalToConstant: 34), modernBadgeIcon.centerXAnchor.constraint(equalTo: modernBadgeView.centerXAnchor), modernBadgeIcon.centerYAnchor.constraint(equalTo: modernBadgeView.centerYAnchor), modernBadgeIcon.widthAnchor.constraint(equalToConstant: 18), modernBadgeIcon.heightAnchor.constraint(equalToConstant: 18), statusDot.widthAnchor.constraint(equalToConstant: 7), statusDot.heightAnchor.constraint(equalToConstant: 7), pillStack.topAnchor.constraint(equalTo: modernStatusPill.topAnchor, constant: 5), pillStack.bottomAnchor.constraint(equalTo: modernStatusPill.bottomAnchor, constant: -5), pillStack.leadingAnchor.constraint(equalTo: modernStatusPill.leadingAnchor, constant: 10), pillStack.trailingAnchor.constraint(equalTo: modernStatusPill.trailingAnchor, constant: -10), modernPerangkatLabel.topAnchor.constraint(equalTo: headerStack.bottomAnchor, constant: 10), modernPerangkatLabel.leadingAnchor.constraint(equalTo: modernContainer.leadingAnchor), modernPerangkatLabel.trailingAnchor.constraint(equalTo: modernContainer.trailingAnchor), companyStack.topAnchor.constraint(equalTo: modernPerangkatLabel.bottomAnchor, constant: 6), companyStack.leadingAnchor.constraint(equalTo: modernContainer.leadingAnchor), companyStack.trailingAnchor.constraint(equalTo: modernContainer.trailingAnchor), modernCompanyIcon.widthAnchor.constraint(equalToConstant: 14), modernCompanyIcon.heightAnchor.constraint(equalToConstant: 14), modernSpecStack.topAnchor.constraint(equalTo: companyStack.bottomAnchor, constant: 10), modernSpecStack.leadingAnchor.constraint(equalTo: modernContainer.leadingAnchor), modernSpecStack.trailingAnchor.constraint(equalTo: modernContainer.trailingAnchor), modernValidityCard.topAnchor.constraint(equalTo: modernSpecStack.bottomAnchor, constant: 10), modernValidityCard.leadingAnchor.constraint(equalTo: modernContainer.leadingAnchor), modernValidityCard.trailingAnchor.constraint(equalTo: modernContainer.trailingAnchor), modernValidityCard.bottomAnchor.constraint(equalTo: modernContainer.bottomAnchor), modernCalendarIcon.widthAnchor.constraint(equalToConstant: 13), modernCalendarIcon.heightAnchor.constraint(equalToConstant: 13), footerStack.topAnchor.constraint(equalTo: modernValidityCard.topAnchor, constant: 8), footerStack.bottomAnchor.constraint(equalTo: modernValidityCard.bottomAnchor, constant: -8), footerStack.leadingAnchor.constraint(equalTo: modernValidityCard.leadingAnchor, constant: 10), footerStack.trailingAnchor.constraint(equalTo: modernValidityCard.trailingAnchor, constant: -10) ]) } func updateViews(sertifikatSementara: SertifikatSementara) { card?.isInteractable = false setupModernLayout() let nomor = sertifikatSementara.nomor.isEmpty ? "-" : sertifikatSementara.nomor modernNomorLabel.text = nomor lblNo?.text = nomor let tglFormatted = CommonHelper.formatDate(from: sertifikatSementara.tgl) let expFormatted = CommonHelper.formatDate(from: sertifikatSementara.exp) modernValidityLabel.text = "\(tglFormatted) s/d \(expFormatted)" lblTgl?.text = "\(tglFormatted) s/d \(expFormatted)" let cust = sertifikatSementara.cust_name.isEmpty ? "-" : sertifikatSementara.cust_name modernPemohonLabel.text = cust lblCustName?.text = cust let eqp = sertifikatSementara.eqp_name.isEmpty ? "-" : sertifikatSementara.eqp_name modernPerangkatLabel.text = eqp lblEqpName?.text = eqp var merk = "-" var model = "-" let models = sertifikatSementara.models let values = models.split(separator: "&") if values.count > 0 { let m = String(values[0]).trimmingCharacters(in: .whitespacesAndNewlines) if !m.isEmpty { merk = m } } if values.count > 1 { let mod = String(values[1]).trimmingCharacters(in: .whitespacesAndNewlines) if !mod.isEmpty { model = mod } } modernMerkVal.text = "\(merk) / \(model)" lblMerk?.text = "Merk: \(merk)" lblModel?.text = "Model: \(model)" let negara = sertifikatSementara.negara.isEmpty ? "-" : sertifikatSementara.negara modernNegaraVal.text = negara lblNegara?.text = negara modernAplIdLabel.text = "ID: \(sertifikatSementara.apl_id)" lblAplikasiId?.text = "\(sertifikatSementara.apl_id)" } }