lujiuyin/suixinkan_uikit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

重建订单列表 UI 并严格对齐 Android 订单卡片

Browse Source
This commit is contained in:
汉秋
2026-07-07 09:12:06 +08:00
parent 28dc004110
commit 3bc017260f
17 changed files with 1235 additions and 379 deletions
Download Patch File Download Diff File Expand all files Collapse all files

144
suixinkan/UI/Orders/DepositOrderCardCell.swift
View File

@ -10,29 +10,35 @@ struct DepositOrderCardActions {
var onRefund: (() -> Void)?
var onPartialRefund: (() -> Void)?
var onVerify: (() -> Void)?
var onCallPhone: (() -> Void)?
var onTap: (() -> Void)?
}
/// 店铺订单卡片，对齐 Android `DepositOrderListScreen`。
/// 店铺订单卡片，严格对齐 Android `DepositOrderCard`。
final class DepositOrderCardCell: UITableViewCell {
static let reuseIdentifier = "DepositOrderCardCell"
private let cardView = UIView()
private let projectLabel = UILabel()
private let statusBadge = OrderStatusBadgeView()
private let amountLabel = UILabel()
private let timeLabel = UILabel()
private let uidLabel = UILabel()
private let phoneLabel = UILabel()
private let refundButton = UIButton(type: .system)
private let partialRefundButton = UIButton(type: .system)
private let verifyButton = UIButton(type: .system)
private let contentStack = UIStackView()
private let headerRow = UIStackView()
private let orderNumberLabel = UILabel()
private let statusBadge = DepositOrderStatusBadgeView()
private let createdAtLabel = UILabel()
private let typeChip = OrderTypeChipView()
private let infoStack = UIStackView()
private let phoneRow = OrderPhoneRowView(style: .deposit)
private let actionRow = UIStackView()
private let refundButton = OrderActionButton(title: "退款", style: .destructiveLight)
private let partialRefundButton = OrderActionButton(title: "部分退款", style: .dangerFilled)
private let verifyButton = OrderActionButton(title: "核销", style: .primaryFilled)
private var actions = DepositOrderCardActions()
override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
selectionStyle = .none
backgroundColor = .clear
contentView.backgroundColor = .clear
setupUI()
}
@ -43,98 +49,76 @@ final class DepositOrderCardCell: UITableViewCell {
func configure(item: StoreOrderItem, actions: DepositOrderCardActions) {
self.actions = actions
projectLabel.text = item.projectName.isEmpty ? item.orderTypeLabel : item.projectName
orderNumberLabel.text = "订单号: \(item.orderNumber)"
statusBadge.apply(status: item.orderStatus, text: item.orderStatusName)
amountLabel.text = "¥\(item.actualPayAmount)"
timeLabel.text = item.createdAt
uidLabel.text = "UID：\(item.userId)"
phoneLabel.text = OrderPhoneMask.mask(item.phone)
createdAtLabel.text = item.createdAt
typeChip.apply(text: item.orderTypeLabel)
infoStack.arrangedSubviews.forEach { $0.removeFromSuperview() }
addInfoRow(title: "项目名称", value: item.projectName)
addInfoRow(title: "订单金额", value: "¥ \(item.actualPayAmount)", primary: true)
addInfoRow(title: "付款时间", value: item.payTime.isEmpty ? "--" : item.payTime)
addInfoRow(title: "完成时间", value: item.completeTime.isEmpty ? "--" : item.completeTime)
addInfoRow(title: "用户 UID", value: String(item.userId))
infoStack.addArrangedSubview(phoneRow)
phoneRow.apply(phone: item.phone)
phoneRow.onTap = { [weak self] in self?.actions.onCallPhone?() }
let showVerify = item.orderType == StoreOrderType.offlineProduct && item.orderStatus == 20
verifyButton.isHidden = !showVerify
refundButton.isHidden = item.orderStatus != 20 && item.orderStatus != 30
partialRefundButton.isHidden = item.orderStatus != 20 && item.orderStatus != 30
}
private func setupUI() {
cardView.backgroundColor = .white
cardView.layer.cornerRadius = 12
cardView.backgroundColor = AppColor.cardBackground
cardView.layer.cornerRadius = OrderTokens.cardRadius
let tap = UITapGestureRecognizer(target: self, action: #selector(cardTapped))
cardView.addGestureRecognizer(tap)
projectLabel.font = .systemFont(ofSize: 16, weight: .medium)
amountLabel.font = .systemFont(ofSize: 16, weight: .semibold)
amountLabel.textColor = AppColor.primary
[timeLabel, uidLabel, phoneLabel].forEach {
$0.font = .systemFont(ofSize: 13)
$0.textColor = UIColor(hex: 0x6B7280)
}
orderNumberLabel.font = .app(.body)
orderNumberLabel.textColor = OrderTokens.orderNumber
createdAtLabel.font = .app(.caption)
createdAtLabel.textColor = OrderTokens.timestamp
configureActionButton(refundButton, title: "退款", color: UIColor(hex: 0xEF4444), bg: UIColor(hex: 0xFFE7E7))
configureActionButton(partialRefundButton, title: "部分退款", color: AppColor.primary, bg: UIColor(hex: 0xEFF6FF))
configureActionButton(verifyButton, title: "线下核销", color: .white, bg: UIColor(hex: 0x0073FF))
headerRow.axis = .horizontal
headerRow.alignment = .center
headerRow.distribution = .equalSpacing
headerRow.addArrangedSubview(orderNumberLabel)
headerRow.addArrangedSubview(statusBadge)
infoStack.axis = .vertical
infoStack.spacing = AppSpacing.xxs
actionRow.axis = .horizontal
actionRow.spacing = OrderTokens.cardGap
actionRow.distribution = .fillEqually
actionRow.addArrangedSubview(refundButton)
actionRow.addArrangedSubview(partialRefundButton)
refundButton.addTarget(self, action: #selector(refundTapped), for: .touchUpInside)
partialRefundButton.addTarget(self, action: #selector(partialRefundTapped), for: .touchUpInside)
verifyButton.addTarget(self, action: #selector(verifyTapped), for: .touchUpInside)
contentView.addSubview(cardView)
[projectLabel, statusBadge, amountLabel, timeLabel, uidLabel, phoneLabel, refundButton, partialRefundButton, verifyButton].forEach {
cardView.addSubview($0)
contentStack.axis = .vertical
contentStack.spacing = OrderTokens.cardGap
[headerRow, createdAtLabel, typeChip, infoStack, actionRow, verifyButton].forEach {
contentStack.addArrangedSubview($0)
}
contentView.addSubview(cardView)
cardView.addSubview(contentStack)
cardView.snp.makeConstraints { make in
make.edges.equalToSuperview().inset(UIEdgeInsets(top: 0, left: 16, bottom: 12, right: 16))
make.edges.equalToSuperview().inset(
UIEdgeInsets(top: 0, left: AppSpacing.md, bottom: OrderTokens.cardGap, right: AppSpacing.md)
)
}
projectLabel.snp.makeConstraints { make in
make.top.leading.equalToSuperview().inset(16)
}
statusBadge.snp.makeConstraints { make in
make.centerY.equalTo(projectLabel)
make.trailing.equalToSuperview().inset(16)
}
amountLabel.snp.makeConstraints { make in
make.top.equalTo(projectLabel.snp.bottom).offset(8)
make.leading.equalToSuperview().inset(16)
}
timeLabel.snp.makeConstraints { make in
make.top.equalTo(amountLabel.snp.bottom).offset(4)
make.leading.equalToSuperview().inset(16)
}
uidLabel.snp.makeConstraints { make in
make.top.equalTo(timeLabel.snp.bottom).offset(4)
make.leading.equalToSuperview().inset(16)
}
phoneLabel.snp.makeConstraints { make in
make.top.equalTo(uidLabel.snp.bottom).offset(4)
make.leading.equalToSuperview().inset(16)
}
refundButton.snp.makeConstraints { make in
make.top.equalTo(phoneLabel.snp.bottom).offset(12)
make.leading.equalToSuperview().inset(16)
make.height.equalTo(40)
make.width.equalTo(88)
make.bottom.equalToSuperview().inset(16)
}
partialRefundButton.snp.makeConstraints { make in
make.centerY.equalTo(refundButton)
make.leading.equalTo(refundButton.snp.trailing).offset(8)
make.height.equalTo(40)
make.width.equalTo(100)
}
verifyButton.snp.makeConstraints { make in
make.centerY.equalTo(refundButton)
make.trailing.equalToSuperview().inset(16)
make.height.equalTo(40)
make.width.equalTo(100)
contentStack.snp.makeConstraints { make in
make.edges.equalToSuperview().inset(OrderTokens.cardPadding)
}
}
private func configureActionButton(_ button: UIButton, title: String, color: UIColor, bg: UIColor) {
button.setTitle(title, for: .normal)
button.setTitleColor(color, for: .normal)
button.titleLabel?.font = .systemFont(ofSize: 14)
button.backgroundColor = bg
button.layer.cornerRadius = 8
private func addInfoRow(title: String, value: String, primary: Bool = false) {
let row = OrderInfoRowView()
row.apply(title: title, value: value, usesPrimaryValue: primary)
infoStack.addArrangedSubview(row)
}
@objc private func refundTapped() { actions.onRefund?() }