Aligns affiliate commission with the reference theme: commission is credited to a dedicated COMMISSION asset pool the moment an order is paid, removing the 7-day settlement freeze, the settlement cron, and the settlement_days setting. - Ledger: add AssetType::COMMISSION (isolated from the recharge balance wallet) - CommissionLedger: credit-on-record + opportunistic debt repayment; refunds claw back the full commission from the pool, carrying any shortfall as debt (aksrt_commission_debt) that future commission pays down first - Withdrawal: make asset-aware via a source discriminator (commission vs balance); each pool keeps independent daily limits, pending gate, and reject-refund. Balance withdrawal (recharge + creator income) is unchanged - Fix pay_rebate_self_s: honor self-commission at purchase time - Revenue card: show pool balance + 累计/已提现 (drop 待结算), debt when present - Schema 2.0.0 -> 2.1.0: add commission_debt, drop freeze columns
223 lines
9.5 KiB
CSS
223 lines
9.5 KiB
CSS
/**
|
|
* User Center — 推广收益 panel: commission summary cards + 推广详情 / 佣金明细 / 推广用户 tabs.
|
|
*
|
|
* The 推广详情 card is a fixed-label/value row list (112px label + content),
|
|
* mirroring the reference theme's 推广中心 card. Status/feedback are text only,
|
|
* never colour-only.
|
|
*/
|
|
|
|
.uc-content .uc-revenue-panel { display: grid; gap: 18px; padding: 22px; border: 1px solid var(--color-line-soft, rgba(0,0,0,.06)); border-radius: 14px; background: var(--surface-1); }
|
|
|
|
/* The revenue page itself is a layout surface, not an additional card.
|
|
* Keep card styling on its inner summary/details components only. */
|
|
.uc-content #panel-revenue > .uc-revenue-panel,
|
|
.uc-content .uc-revenue-panel {
|
|
display: block;
|
|
gap: 0;
|
|
padding: 0;
|
|
border: 0;
|
|
border-radius: 0;
|
|
background: transparent;
|
|
box-shadow: none;
|
|
}
|
|
|
|
/* 推广收益新版布局:顶部概览卡 + 单一推荐奖励白卡。 */
|
|
.uc-content .uc-revenue-panel {
|
|
gap: 22px;
|
|
}
|
|
|
|
.uc-content .uc-commission-summary {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 18px;
|
|
}
|
|
|
|
.uc-content .uc-commission-card {
|
|
position: relative;
|
|
min-height: 116px;
|
|
padding: 16px 22px;
|
|
overflow: hidden;
|
|
border: 0;
|
|
border-radius: 18px;
|
|
box-shadow: 0 12px 28px rgba(15, 23, 42, .08);
|
|
}
|
|
|
|
.uc-content .uc-commission-card--ratio {
|
|
color: #fff;
|
|
background:
|
|
radial-gradient(circle at 86% 4%, rgba(255, 255, 255, .16) 0 22%, transparent 22.5%),
|
|
radial-gradient(circle at 32% 110%, rgba(213, 37, 43, .28) 0 42%, transparent 42.5%),
|
|
linear-gradient(135deg, #ff6d61 0%, #ff3e3e 100%);
|
|
}
|
|
|
|
.uc-content .uc-commission-card--balance {
|
|
color: #fff;
|
|
background:
|
|
radial-gradient(circle at 14% 96%, rgba(11, 103, 204, .2) 0 44%, transparent 44.5%),
|
|
radial-gradient(circle at 100% 100%, rgba(255, 255, 255, .12) 0 28%, transparent 28.5%),
|
|
linear-gradient(135deg, #48b7ee 0%, #2b8fe8 100%);
|
|
}
|
|
|
|
.uc-content .uc-commission-card__body {
|
|
display: grid;
|
|
position: relative;
|
|
z-index: 1;
|
|
align-content: space-between;
|
|
gap: 8px;
|
|
min-height: 84px;
|
|
}
|
|
|
|
.uc-content .uc-commission-card__body > span,
|
|
.uc-content .uc-commission-card__body > p,
|
|
.uc-content .uc-commission-card__body strong,
|
|
.uc-content .uc-commission-card__body strong small {
|
|
color: inherit;
|
|
}
|
|
|
|
.uc-content .uc-commission-card__body > span:first-child {
|
|
margin: 0;
|
|
font-size: 15px;
|
|
opacity: .85;
|
|
}
|
|
|
|
.uc-content .uc-commission-card__body strong {
|
|
font-size: 34px;
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
}
|
|
|
|
.uc-content .uc-commission-card__body strong small {
|
|
margin-left: 4px;
|
|
font-size: 15px;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.uc-content .uc-commission-card--ratio .uc-commission-card__body strong small {
|
|
margin-left: 6px;
|
|
font-size: 20px;
|
|
}
|
|
|
|
.uc-content .uc-commission-card__body > p {
|
|
margin: 0;
|
|
font-size: 13px;
|
|
opacity: .9;
|
|
}
|
|
|
|
/* 我的佣金:累计 / 已提现(含欠款)副信息。 */
|
|
.uc-content .uc-commission-card__meta {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 4px 16px;
|
|
}
|
|
|
|
/* 待偿欠款:退款收回不足挂账,副信息里以描边标签弱提示。 */
|
|
.uc-content .uc-commission-card__debt {
|
|
padding: 0 8px;
|
|
border-radius: 999px;
|
|
background: rgba(255, 255, 255, .22);
|
|
}
|
|
|
|
/* 立即提现按钮:贴右居中,对齐参考主题 .abs-right。 */
|
|
.uc-content .uc-commission-card__action {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 16px;
|
|
z-index: 2;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
padding: 7px 14px;
|
|
transform: translateY(-50%);
|
|
border: 0;
|
|
border-radius: 999px;
|
|
color: #fff;
|
|
background: rgba(255, 255, 255, .22);
|
|
font-size: 13px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.uc-content .uc-commission-card__action:hover {
|
|
background: rgba(255, 255, 255, .32);
|
|
}
|
|
|
|
/* 提现按钮所在卡片:正文右侧预留空间,避免与按钮重叠。 */
|
|
.uc-content .uc-commission-card--balance:has(.uc-commission-card__action) .uc-commission-card__body {
|
|
padding-right: 96px;
|
|
}
|
|
|
|
/* 三 Tab 推广收益:佣金详细页采用紧凑的一列信息清单。 */
|
|
.uc-content .uc-reward-area { display: grid; gap: 18px; padding: 24px 28px 30px; border-radius: 18px; background: var(--surface-1, #fff); box-shadow: 0 8px 26px rgba(15, 23, 42, .06); }
|
|
.uc-content .uc-commission-summary + .uc-reward-area { margin-top: 28px; }
|
|
.uc-content .uc-reward-area__heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
|
|
.uc-content .uc-reward-area__heading h3 { margin: 0; font-size: 20px; }
|
|
.uc-content .uc-reward-area__heading > span { color: var(--color-ink-4); font-size: 13px; }
|
|
.uc-content .uc-reward-tabs { display: flex; gap: 24px; border-bottom: 1px solid var(--color-line-soft, rgba(15, 23, 42, .08)); }
|
|
.uc-content .uc-reward-tabs a { position: relative; padding: 0 0 12px; color: var(--color-ink-4); font-size: 14px; text-decoration: none; }
|
|
.uc-content .uc-reward-tabs a.is-active { color: var(--color-primary); font-weight: 700; }
|
|
.uc-content .uc-reward-tabs a.is-active::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; border-radius: 99px; background: var(--color-primary); content: ""; }
|
|
.uc-content .uc-revenue-summary-list { display: grid; gap: 0; max-width: 920px; }
|
|
.uc-content .uc-reward-pane--detail { grid-template-columns: minmax(0, 1fr); width: 100%; }
|
|
.uc-content .uc-reward-pane--detail .uc-revenue-summary-list { width: 100%; max-width: none; }
|
|
.uc-content .uc-revenue-summary-row { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 54px; padding: 8px 0; border-bottom: 1px solid var(--color-line-soft, rgba(15, 23, 42, .07)); }
|
|
.uc-content .uc-revenue-summary-row > span { color: var(--color-ink-3); font-size: 14px; }
|
|
.uc-content .uc-revenue-summary-row > strong { color: var(--color-ink); font-size: 16px; }
|
|
.uc-content .uc-revenue-summary-row > em { color: var(--color-ink-4); font-style: normal; }
|
|
.uc-content .uc-revenue-summary-row--link { grid-template-columns: 112px minmax(0, 1fr) auto auto; }
|
|
.uc-content .uc-revenue-summary-row--link input { width: 100%; max-width: 100%; min-width: 0; height: 38px; padding: 0 10px; border: 1px solid var(--color-line-soft, rgba(15, 23, 42, .12)); border-radius: 7px; color: var(--color-primary); background: var(--surface-2, #f8fafc); }
|
|
.uc-content .uc-revenue-summary-row--link button { min-width: 76px; height: 38px; padding: 0 12px; border-radius: 7px; white-space: nowrap; }
|
|
.uc-content .uc-revenue-summary-row--link small { grid-column: 2 / -1; min-height: 16px; color: var(--color-success, #16a34a); font-size: 12px; }
|
|
.uc-content .uc-revenue-summary-row--link small.is-error { color: var(--color-error, #dc2626); }
|
|
.uc-content .uc-revenue-summary-row--link button[hidden] { display: none; }
|
|
|
|
.uc-content .uc-revenue-summary-row--total > div { display: flex; flex-wrap: wrap; gap: 12px; }
|
|
.uc-content .uc-revenue-summary-row--total strong { padding: 7px 11px; border-radius: 7px; color: var(--color-primary); background: var(--surface-2, #f8fafc); font-size: 14px; }
|
|
.uc-content .uc-revenue-summary-row--explain { align-items: start; padding-top: 16px; border-bottom: 0; }
|
|
.uc-content .uc-revenue-summary-row--explain .uc-reward-richtext { grid-column: 2 / -1; color: var(--color-ink-3); font-size: 14px; line-height: 1.75; }
|
|
.uc-content .uc-revenue-summary-row--explain .uc-reward-richtext p { margin: 0; }
|
|
.uc-content .uc-revenue-user-list { display: grid; }
|
|
.uc-content .uc-revenue-user-row { display: flex; align-items: center; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--color-line-soft, rgba(15, 23, 42, .07)); }
|
|
.uc-content .uc-revenue-user-row img { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; background: var(--surface-2); }
|
|
.uc-content .uc-revenue-user-row > div { display: grid; flex: 1; gap: 3px; min-width: 0; }
|
|
.uc-content .uc-revenue-user-row small { color: var(--color-ink-4); font-size: 12px; }
|
|
.uc-content .uc-revenue-user-row > span { color: var(--color-success, #16a34a); font-size: 12px; }
|
|
|
|
@media (max-width: 720px) {
|
|
.uc-content .uc-commission-summary {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 560px) {
|
|
.uc-content .uc-commission-card {
|
|
min-height: 100px;
|
|
padding: 20px;
|
|
}
|
|
|
|
.uc-content .uc-commission-card__body {
|
|
min-height: 72px;
|
|
}
|
|
|
|
.uc-content .uc-commission-card__body strong {
|
|
font-size: 28px;
|
|
}
|
|
|
|
.uc-content .uc-reward-area { padding: 20px 16px 24px; }
|
|
.uc-content .uc-commission-summary + .uc-reward-area { margin-top: 20px; }
|
|
.uc-content .uc-reward-area__heading { display: grid; gap: 4px; }
|
|
.uc-content .uc-reward-tabs { gap: 16px; overflow-x: auto; }
|
|
.uc-content .uc-revenue-summary-row { grid-template-columns: 92px minmax(0, 1fr) auto; gap: 8px; }
|
|
.uc-content .uc-revenue-summary-row--link { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; }
|
|
.uc-content .uc-revenue-summary-row--link input { width: 100%; min-width: 0; }
|
|
.uc-content .uc-revenue-summary-row--link button { min-width: 62px; padding: 0 9px; }
|
|
.uc-content .uc-revenue-summary-row--link > span { grid-column: 1 / -1; }
|
|
.uc-content .uc-revenue-summary-row--link small { grid-column: 1 / -1; }
|
|
.uc-content .uc-revenue-summary-row--explain { grid-template-columns: 1fr; }
|
|
.uc-content .uc-revenue-summary-row--explain .uc-reward-richtext { grid-column: 1; }
|
|
}
|
|
|
|
/* 推广海报预览弹窗:舞台居中,canvas 自适应弹窗宽度。 */
|
|
.uc-content .uc-affiliate-poster { display: grid; place-items: center; min-height: 120px; }
|
|
.uc-content .uc-affiliate-poster img,
|
|
.uc-content .uc-affiliate-poster canvas { display: block; max-width: 100%; height: auto; margin: 0 auto; border-radius: 12px; background: var(--surface-2, #f7f8fa); }
|
|
.uc-content .uc-affiliate-poster p { margin: 0; text-align: center; }
|