1107 lines
19 KiB
Plaintext
1107 lines
19 KiB
Plaintext
page {
|
||
background-color: #f3f3f3;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
view {
|
||
line-height: inherit;
|
||
}
|
||
|
||
.page-loading,
|
||
.page-empty,
|
||
.page-error {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
min-height: 60vh;
|
||
gap: 24rpx;
|
||
}
|
||
|
||
.empty-text,
|
||
.error-text {
|
||
font-size: 28rpx;
|
||
color: #a6a6a6;
|
||
}
|
||
|
||
.error-text {
|
||
color: #e34d59;
|
||
}
|
||
|
||
.retry-btn {
|
||
margin-top: 16rpx;
|
||
padding: 16rpx 48rpx;
|
||
background: #0052d9;
|
||
color: #ffffff;
|
||
font-size: 28rpx;
|
||
border-radius: 16rpx;
|
||
}
|
||
|
||
.retry-btn--hover {
|
||
opacity: 0.8;
|
||
}
|
||
|
||
.banner-section {
|
||
position: relative;
|
||
width: 100%;
|
||
overflow: hidden;
|
||
height: 100%;
|
||
}
|
||
|
||
.banner-bg-img {
|
||
position: absolute;
|
||
top: -50rpx;
|
||
left: 0;
|
||
width: 100%;
|
||
height: auto;
|
||
z-index: 0;
|
||
}
|
||
|
||
.banner-overlay {
|
||
position: relative;
|
||
z-index: 2;
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
padding: 36rpx 40rpx;
|
||
}
|
||
|
||
.coach-header {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 32rpx;
|
||
}
|
||
|
||
.avatar-box {
|
||
width: 98rpx;
|
||
height: 98rpx;
|
||
border-radius: 32rpx;
|
||
background: rgba(255, 255, 255, 0.2);
|
||
overflow: hidden;
|
||
flex-shrink: 0;
|
||
box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.15);
|
||
}
|
||
|
||
.avatar-img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.info-middle {
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
|
||
.name-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 14rpx;
|
||
margin-bottom: 8rpx;
|
||
}
|
||
|
||
.coach-name {
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.skill-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 14rpx;
|
||
}
|
||
|
||
.skill-tag {
|
||
padding: 4rpx 16rpx;
|
||
background: rgba(255, 255, 255, 0.2);
|
||
border-radius: 8rpx;
|
||
font-size: 22rpx;
|
||
color: rgba(255, 255, 255, 0.9);
|
||
}
|
||
|
||
.info-right-stats {
|
||
flex-shrink: 0;
|
||
text-align: right;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 12rpx;
|
||
font-weight: 500;
|
||
|
||
text-shadow:
|
||
0 0 12rpx rgba(84, 5, 5, 0.856),
|
||
0 0 2rpx rgba(84, 5, 5, 0.9);
|
||
}
|
||
|
||
.right-stat {
|
||
display: flex;
|
||
align-items: baseline;
|
||
gap: 8rpx;
|
||
justify-content: flex-end;
|
||
}
|
||
|
||
.right-stat-label {
|
||
font-size: 22rpx;
|
||
color: rgba(255, 255, 255);
|
||
}
|
||
|
||
.right-stat-value {
|
||
font-size: 28rpx;
|
||
font-weight: 700;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.main-content {
|
||
padding: 28rpx;
|
||
padding-bottom: 200rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 28rpx;
|
||
}
|
||
|
||
.card {
|
||
background: #ffffff;
|
||
border-radius: 32rpx;
|
||
padding: 36rpx;
|
||
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
|
||
}
|
||
|
||
.card-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 28rpx;
|
||
}
|
||
|
||
.section-title {
|
||
font-size: 28rpx;
|
||
font-weight: 600;
|
||
color: #242424;
|
||
position: relative;
|
||
padding-left: 20rpx;
|
||
margin-bottom: 28rpx;
|
||
}
|
||
|
||
.card-header .section-title {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.section-title::before {
|
||
content: '';
|
||
position: absolute;
|
||
left: 0;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
width: 6rpx;
|
||
height: 28rpx;
|
||
border-radius: 4rpx;
|
||
}
|
||
|
||
.title-blue::before {
|
||
background: linear-gradient(180deg, #0052d9, #5b9cf8);
|
||
}
|
||
|
||
.title-green::before {
|
||
background: linear-gradient(180deg, #00a870, #4cd964);
|
||
}
|
||
|
||
.title-orange::before {
|
||
background: linear-gradient(180deg, #ed7b2f, #ffc107);
|
||
}
|
||
|
||
.title-pink::before {
|
||
background: linear-gradient(180deg, #ec4899, #f472b6);
|
||
}
|
||
|
||
.title-purple::before {
|
||
background: linear-gradient(180deg, #7c3aed, #a78bfa);
|
||
}
|
||
|
||
.title-teal::before {
|
||
background: linear-gradient(180deg, #0d9488, #5eead4);
|
||
}
|
||
|
||
.header-hint {
|
||
font-size: 22rpx;
|
||
color: #a6a6a6;
|
||
}
|
||
|
||
.perf-grid {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 22rpx;
|
||
}
|
||
|
||
.perf-card {
|
||
border-radius: 24rpx;
|
||
padding: 22rpx;
|
||
border: 2rpx solid transparent;
|
||
}
|
||
|
||
.perf-blue {
|
||
background: linear-gradient(135deg, #eff6ff, #eef2ff);
|
||
border-color: rgba(191, 219, 254, 0.5);
|
||
}
|
||
|
||
.perf-green {
|
||
background: linear-gradient(135deg, #ecfdf5, #d1fae5);
|
||
border-color: rgba(167, 243, 208, 0.5);
|
||
}
|
||
|
||
.perf-orange {
|
||
background: linear-gradient(135deg, #fff7ed, #fef3c7);
|
||
border-color: rgba(253, 186, 116, 0.5);
|
||
}
|
||
|
||
.perf-purple {
|
||
background: linear-gradient(135deg, #faf5ff, #ede9fe);
|
||
border-color: rgba(196, 181, 253, 0.5);
|
||
}
|
||
|
||
.perf-label {
|
||
font-size: 24rpx;
|
||
color: #000000;
|
||
display: block;
|
||
margin-bottom: 24rpx;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.perf-value-row {
|
||
display: flex;
|
||
align-items: baseline;
|
||
gap: 4rpx;
|
||
}
|
||
|
||
.perf-value {
|
||
font-size: 42rpx;
|
||
font-weight: 700;
|
||
font-variant-numeric: tabular-nums;
|
||
}
|
||
|
||
.perf-unit {
|
||
font-size: 22rpx;
|
||
color: #000000;
|
||
}
|
||
|
||
.perf-sub {
|
||
font-size: 22rpx;
|
||
color: #979797;
|
||
display: block;
|
||
margin-top: -8rpx;
|
||
}
|
||
|
||
.perf-progress-box {
|
||
margin-top: 22rpx;
|
||
background: #fafafa;
|
||
border-radius: 24rpx;
|
||
padding: 22rpx 22rpx 50rpx 22rpx;
|
||
}
|
||
|
||
.perf-progress-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 18rpx;
|
||
}
|
||
|
||
.perf-progress-label {
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
color: #5e5e5e;
|
||
}
|
||
|
||
.perf-progress-hint {
|
||
font-size: 26rpx;
|
||
font-weight: 500;
|
||
color: #0052d9;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.perf-progress-bar {
|
||
height: 12rpx;
|
||
background: #e7e7e7;
|
||
border-radius: 6rpx;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.perf-progress-fill {
|
||
height: 100%;
|
||
background: linear-gradient(90deg, #0052d9, #5b9cf8);
|
||
border-radius: 6rpx;
|
||
transition: width 0.3s ease;
|
||
}
|
||
|
||
.perf-progress-footer {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-top: 10rpx;
|
||
}
|
||
|
||
.perf-progress-current,
|
||
.perf-progress-target {
|
||
font-size: 22rpx;
|
||
color: #c5c5c5;
|
||
}
|
||
|
||
.income-tabs {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8rpx;
|
||
}
|
||
|
||
.income-tab {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 4rpx;
|
||
font-size: 24rpx;
|
||
padding: 8rpx 20rpx;
|
||
border-radius: 100rpx;
|
||
color: #8b8b8b;
|
||
background: #f3f3f3;
|
||
}
|
||
|
||
.income-tab.active {
|
||
color: #0052d9;
|
||
background: #ecf2fe;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.income-tab--hover {
|
||
opacity: 0.7;
|
||
}
|
||
|
||
.income-tab-est {
|
||
font-size: 20rpx;
|
||
color: #ed7b2f;
|
||
}
|
||
|
||
.income-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 22rpx;
|
||
}
|
||
|
||
.income-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 16rpx;
|
||
}
|
||
|
||
.income-dot {
|
||
width: 14rpx;
|
||
height: 14rpx;
|
||
border-radius: 50%;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.dot-primary {
|
||
background: #0052d9;
|
||
}
|
||
|
||
.dot-success {
|
||
background: #00a870;
|
||
}
|
||
|
||
.dot-warning {
|
||
background: #ed7b2f;
|
||
}
|
||
|
||
.dot-purple {
|
||
background: #7c3aed;
|
||
}
|
||
|
||
.income-label {
|
||
flex: 1;
|
||
font-size: 28rpx;
|
||
color: #5e5e5e;
|
||
}
|
||
|
||
.income-amount {
|
||
font-size: 28rpx;
|
||
font-weight: 700;
|
||
color: #242424;
|
||
font-variant-numeric: tabular-nums;
|
||
}
|
||
|
||
.income-total {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding-top: 20rpx;
|
||
border-top: 2rpx solid #eeeeee;
|
||
}
|
||
|
||
.income-total-label {
|
||
font-size: 28rpx;
|
||
font-weight: 600;
|
||
color: #5e5e5e;
|
||
}
|
||
|
||
.income-total-value {
|
||
font-size: 28rpx;
|
||
font-weight: 700;
|
||
color: #00a870;
|
||
font-variant-numeric: tabular-nums;
|
||
}
|
||
|
||
.task-summary {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 16rpx;
|
||
font-size: 24rpx;
|
||
}
|
||
|
||
.task-summary-label {
|
||
font-weight: 700;
|
||
color: #4b4b4b;
|
||
}
|
||
|
||
.task-summary-recall {
|
||
color: #0052d9;
|
||
font-weight: 700;
|
||
}
|
||
|
||
.task-summary-callback {
|
||
color: #00a870;
|
||
font-weight: 700;
|
||
}
|
||
|
||
.task-summary-num {
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.task-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 14rpx;
|
||
}
|
||
|
||
.task-list-extra {
|
||
margin-top: 14rpx;
|
||
}
|
||
|
||
.task-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 18rpx;
|
||
padding: 18rpx;
|
||
border-radius: 16rpx;
|
||
border: 2rpx solid transparent;
|
||
}
|
||
|
||
.task-item-high-priority {
|
||
background: rgba(254, 226, 226, 0.6);
|
||
border-color: rgba(254, 202, 202, 0.6);
|
||
}
|
||
|
||
.task-item-priority {
|
||
background: rgba(255, 237, 213, 0.4);
|
||
border-color: rgba(253, 186, 116, 0.4);
|
||
}
|
||
|
||
.task-item-relationship {
|
||
background: rgba(252, 231, 243, 0.4);
|
||
border-color: rgba(249, 168, 212, 0.4);
|
||
}
|
||
|
||
.task-item-callback {
|
||
background: rgba(204, 251, 241, 0.4);
|
||
border-color: rgba(153, 246, 228, 0.4);
|
||
}
|
||
|
||
.task-item-abandoned {
|
||
background: #fafafa;
|
||
border-color: #eeeeee;
|
||
opacity: 0.55;
|
||
}
|
||
|
||
.task-tag-text {
|
||
font-size: 22rpx;
|
||
font-weight: 500;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.task-tag-text.high-priority {
|
||
color: #dc2626;
|
||
}
|
||
|
||
.task-tag-text.priority {
|
||
color: #ea580c;
|
||
}
|
||
|
||
.task-tag-text.relationship {
|
||
color: #db2777;
|
||
}
|
||
|
||
.task-tag-text.callback {
|
||
color: #0d9488;
|
||
}
|
||
|
||
.task-customer-name {
|
||
flex: 1;
|
||
min-width: 0;
|
||
font-size: 26rpx;
|
||
color: #242424;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.task-note-btn {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 4rpx;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.task-note-btn--hover {
|
||
opacity: 0.6;
|
||
}
|
||
|
||
.task-note-count {
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
color: #777777;
|
||
}
|
||
|
||
.task-pin {
|
||
font-size: 28rpx;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.task-abandoned-name {
|
||
flex: 1;
|
||
min-width: 0;
|
||
font-size: 24rpx;
|
||
color: #c5c5c5;
|
||
text-decoration: line-through;
|
||
}
|
||
|
||
.task-abandoned-reason {
|
||
font-size: 20rpx;
|
||
color: #c5c5c5;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.task-toggle {
|
||
margin-top: 22rpx;
|
||
text-align: center;
|
||
font-size: 24rpx;
|
||
color: #0052d9;
|
||
font-weight: 500;
|
||
padding: 12rpx 0;
|
||
}
|
||
|
||
.task-toggle--hover {
|
||
opacity: 0.7;
|
||
}
|
||
|
||
.top5-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 18rpx;
|
||
}
|
||
|
||
.top5-card {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 22rpx;
|
||
padding: 22rpx;
|
||
border-radius: 24rpx;
|
||
border: 2rpx solid transparent;
|
||
}
|
||
|
||
.top5-card--hover {
|
||
opacity: 0.85;
|
||
}
|
||
|
||
.top5-card-pink {
|
||
background: linear-gradient(135deg, rgba(252, 231, 243, 0.8), rgba(254, 205, 211, 0.4));
|
||
border-color: rgba(249, 168, 212, 0.4);
|
||
}
|
||
|
||
.top5-card-amber {
|
||
background: linear-gradient(135deg, rgba(254, 243, 199, 0.8), rgba(253, 230, 138, 0.4));
|
||
border-color: rgba(252, 211, 77, 0.4);
|
||
}
|
||
|
||
.top5-card-gray {
|
||
background: #fafafa;
|
||
border-color: #f3f3f3;
|
||
}
|
||
|
||
.top5-avatar {
|
||
width: 64rpx;
|
||
height: 64rpx;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.top5-avatar.gradient-pink {
|
||
background: linear-gradient(135deg, #f472b6, #e11d48);
|
||
}
|
||
|
||
.top5-avatar.gradient-amber {
|
||
background: linear-gradient(135deg, #fbbf24, #f97316);
|
||
}
|
||
|
||
.top5-avatar.gradient-green {
|
||
background: linear-gradient(135deg, #4ade80, #059669);
|
||
}
|
||
|
||
.top5-avatar.gradient-blue {
|
||
background: linear-gradient(135deg, #60a5fa, #4f46e5);
|
||
}
|
||
|
||
.top5-avatar.gradient-purple {
|
||
background: linear-gradient(135deg, #a78bfa, #7c3aed);
|
||
}
|
||
|
||
.top5-avatar-text {
|
||
font-size: 22rpx;
|
||
font-weight: 500;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.top5-info {
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
|
||
.top5-name-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8rpx;
|
||
margin-bottom: 8rpx;
|
||
}
|
||
|
||
.top5-name {
|
||
font-size: 24rpx;
|
||
font-weight: 600;
|
||
color: #242424;
|
||
}
|
||
|
||
.top5-heart {
|
||
font-size: 24rpx;
|
||
}
|
||
|
||
.top5-score {
|
||
font-size: 24rpx;
|
||
font-weight: 700;
|
||
font-variant-numeric: tabular-nums;
|
||
}
|
||
|
||
.top5-score-success {
|
||
color: #00a870;
|
||
}
|
||
|
||
.top5-score-warning {
|
||
color: #ed7b2f;
|
||
}
|
||
|
||
.top5-score-gray {
|
||
color: #8b8b8b;
|
||
}
|
||
|
||
.top5-stats {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 28rpx;
|
||
}
|
||
|
||
.top5-stat {
|
||
font-size: 22rpx;
|
||
color: #a6a6a6;
|
||
}
|
||
|
||
.top5-stat-val {
|
||
font-weight: 600;
|
||
color: #393939;
|
||
}
|
||
|
||
|
||
/* ── 近期服务明细 ── */
|
||
.svc-list { display: flex; flex-direction: column; }
|
||
.svc-card {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: flex-start;
|
||
padding: 20rpx 0;
|
||
border-bottom: 2rpx solid #f3f3f3;
|
||
}
|
||
.svc-card:last-child { border-bottom: none; }
|
||
.svc-card--hover { background: #f7f7f7; border-radius: 12rpx; }
|
||
.svc-content {
|
||
flex: 1;
|
||
margin-left: 20rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rpx;
|
||
}
|
||
.svc-row1 { display: flex; align-items: center; gap: 12rpx; }
|
||
.svc-customer { font-size: 28rpx; font-weight: 600; color: #242424; }
|
||
.svc-type {
|
||
font-size: 22rpx;
|
||
padding: 2rpx 12rpx;
|
||
border-radius: 8rpx;
|
||
background: rgba(0,0,0,0.06);
|
||
color: #555;
|
||
}
|
||
.svc-type-basic { background: rgba(0,82,217,0.10); color: #0052d9; }
|
||
.svc-type-incentive { background: rgba(0,168,112,0.10); color: #00a870; }
|
||
.svc-date { margin-left: auto; font-size: 22rpx; color: #a6a6a6; }
|
||
.svc-row2 { display: flex; align-items: center; }
|
||
.svc-row2-left { flex: 1; display: flex; align-items: center; gap: 12rpx; }
|
||
.svc-table-tag {
|
||
font-size: 22rpx;
|
||
padding: 2rpx 12rpx;
|
||
background: #ecf2fe;
|
||
color: #0052d9;
|
||
border-radius: 8rpx;
|
||
font-weight: 500;
|
||
}
|
||
.svc-duration { font-size: 22rpx; color: #8b8b8b; }
|
||
.svc-perf { font-size: 22rpx; color: #ed7b2f; }
|
||
.svc-income { font-size: 28rpx; font-weight: 700; color: #242424; font-variant-numeric: tabular-nums; }
|
||
.svc-more { margin-top: 24rpx; text-align: center; font-size: 24rpx; color: #0052d9; font-weight: 500; padding: 12rpx 0; }
|
||
.svc-more--hover { opacity: 0.7; }
|
||
|
||
.more-info-row {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding-bottom: 20rpx;
|
||
border-bottom: 2rpx solid #f3f3f3;
|
||
margin-bottom: 24rpx;
|
||
}
|
||
|
||
.more-info-label {
|
||
font-size: 28rpx;
|
||
color: #8b8b8b;
|
||
}
|
||
|
||
.more-info-value {
|
||
font-size: 28rpx;
|
||
color: #242424;
|
||
}
|
||
|
||
.history-table {
|
||
overflow-x: auto;
|
||
}
|
||
|
||
.history-thead {
|
||
display: flex;
|
||
border-bottom: 2rpx solid #eeeeee;
|
||
padding-bottom: 16rpx;
|
||
}
|
||
|
||
.history-th {
|
||
text-align: center;
|
||
font-size: 22rpx;
|
||
color: #8b8b8b;
|
||
font-weight: 500;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.history-th-left {
|
||
text-align: left;
|
||
width: 130rpx;
|
||
}
|
||
|
||
/* 服务客户 */
|
||
.history-th:nth-child(2) { width: 90rpx; }
|
||
/* 完成 回访/召回 */
|
||
.history-th:nth-child(3) { width: 160rpx; }
|
||
/* 业绩时长 */
|
||
.history-th:nth-child(4) { width: 120rpx; }
|
||
/* 工资 */
|
||
.history-th:nth-child(5) { width: 120rpx; }
|
||
|
||
.history-row {
|
||
display: flex;
|
||
padding: 20rpx 0;
|
||
border-bottom: 2rpx solid #fafafa;
|
||
}
|
||
|
||
.history-row-current {
|
||
background: rgba(0, 82, 217, 0.03);
|
||
border-radius: 8rpx;
|
||
padding: 20rpx 0rpx;
|
||
}
|
||
|
||
.history-td {
|
||
text-align: center;
|
||
font-size: 24rpx;
|
||
color: #242424;
|
||
font-variant-numeric: tabular-nums;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
/* 服务客户 */
|
||
.history-td:nth-child(2) { width: 90rpx; }
|
||
/* 完成 回访/召回 */
|
||
.history-td:nth-child(3) { width: 160rpx; }
|
||
/* 业绩时长 */
|
||
.history-td:nth-child(4) { width: 120rpx; }
|
||
/* 工资 */
|
||
.history-td:nth-child(5) { width: 120rpx; }
|
||
|
||
.history-td-left {
|
||
text-align: left;
|
||
width: 130rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8rpx;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.history-est {
|
||
font-size: 20rpx;
|
||
color: #ed7b2f;
|
||
}
|
||
|
||
.note-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 20rpx;
|
||
}
|
||
|
||
.note-item {
|
||
background: #fafafa;
|
||
border-radius: 24rpx;
|
||
border: 2rpx solid #e7e7e7;
|
||
padding: 24rpx;
|
||
}
|
||
|
||
.note-top {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 12rpx;
|
||
}
|
||
|
||
.note-author {
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
color: #242424;
|
||
}
|
||
|
||
.note-time {
|
||
font-size: 22rpx;
|
||
color: #a6a6a6;
|
||
}
|
||
|
||
.note-content {
|
||
font-size: 24rpx;
|
||
color: #5e5e5e;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
.note-empty {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
padding: 48rpx 0;
|
||
gap: 16rpx;
|
||
}
|
||
|
||
.empty-hint {
|
||
font-size: 24rpx;
|
||
color: #c5c5c5;
|
||
}
|
||
|
||
.bottom-bar {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
height: 128rpx;
|
||
background: rgba(255, 255, 255, 0.95);
|
||
backdrop-filter: blur(20px);
|
||
border-top: 2rpx solid #eeeeee;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 24rpx;
|
||
padding: 0 32rpx;
|
||
z-index: 100;
|
||
}
|
||
|
||
.btn-chat {
|
||
flex: 1;
|
||
height: 88rpx;
|
||
background: linear-gradient(135deg, #0052d9, #3b82f6);
|
||
color: #ffffff;
|
||
font-weight: 500;
|
||
border-radius: 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 12rpx;
|
||
font-size: 28rpx;
|
||
box-shadow: 0 8rpx 24rpx rgba(0, 82, 217, 0.3);
|
||
}
|
||
|
||
.btn-chat--hover {
|
||
opacity: 0.85;
|
||
}
|
||
|
||
.btn-note {
|
||
flex: 1;
|
||
height: 88rpx;
|
||
background: #f3f3f3;
|
||
color: #242424;
|
||
font-weight: 500;
|
||
border-radius: 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 12rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.btn-note--hover {
|
||
background: #e7e7e7;
|
||
}
|
||
|
||
.notes-popup-overlay {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
background: rgba(0, 0, 0, 0.5);
|
||
z-index: 200;
|
||
display: flex;
|
||
align-items: flex-end;
|
||
}
|
||
|
||
.notes-popup {
|
||
width: 100%;
|
||
background: #ffffff;
|
||
border-radius: 48rpx 48rpx 0 0;
|
||
padding: 40rpx;
|
||
padding-bottom: 64rpx;
|
||
max-height: 70vh;
|
||
overflow-y: auto;
|
||
}
|
||
|
||
.notes-popup-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 32rpx;
|
||
}
|
||
|
||
.notes-popup-title {
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
color: #242424;
|
||
}
|
||
|
||
.notes-popup-close {
|
||
width: 64rpx;
|
||
height: 64rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-radius: 50%;
|
||
background: #f3f3f3;
|
||
}
|
||
|
||
.notes-popup-close--hover {
|
||
background: #e7e7e7;
|
||
}
|
||
|
||
.notes-popup-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 20rpx;
|
||
}
|
||
|
||
.notes-popup-item {
|
||
padding: 28rpx;
|
||
background: #fafafa;
|
||
border-radius: 24rpx;
|
||
border: 2rpx solid #f3f3f3;
|
||
}
|
||
|
||
.notes-popup-item-top {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8rpx;
|
||
margin-bottom: 12rpx;
|
||
}
|
||
|
||
.notes-popup-item-date {
|
||
font-size: 22rpx;
|
||
color: #a6a6a6;
|
||
}
|
||
|
||
.notes-popup-item-text {
|
||
font-size: 24rpx;
|
||
color: #5e5e5e;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
.text-primary {
|
||
color: #0052d9 !important;
|
||
}
|
||
|
||
.text-success {
|
||
color: #00a870 !important;
|
||
}
|
||
|
||
.text-warning {
|
||
color: #ed7b2f !important;
|
||
}
|
||
|
||
.text-purple {
|
||
color: #7c3aed !important;
|
||
}
|
||
|
||
.safe-area-bottom {
|
||
padding-bottom: env(safe-area-inset-bottom);
|
||
}.card-title-row { margin-bottom: 24rpx; }
|
||
.card-title-row .section-title { margin-bottom: 0; }
|
||
|
||
.top-customer-list { display: flex; flex-direction: column; gap: 16rpx; }
|
||
.top-customer-item { display: flex; align-items: center; gap: 24rpx; padding: 16rpx 0; border-bottom: 2rpx solid #f3f3f3; }
|
||
.top-customer-item:last-child { border-bottom: none; }
|
||
.top-customer-item--hover { background: #f9f9f9; border-radius: 16rpx; }
|
||
.top-customer-avatar { width: 76rpx; height: 76rpx; border-radius: 20rpx; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||
.top-customer-avatar-text { font-size: 30rpx; font-weight: 500; color: #ffffff; }
|
||
.avatar-gradient-pink { background: linear-gradient(135deg, #f472b6, #e11d48); }
|
||
.avatar-gradient-amber { background: linear-gradient(135deg, #fbbf24, #f97316); }
|
||
.avatar-gradient-green { background: linear-gradient(135deg, #4ade80, #059669); }
|
||
.avatar-gradient-blue { background: linear-gradient(135deg, #60a5fa, #4f46e5); }
|
||
/* 头像渐变色由 app.wxss 全局 .avatar-{key} 统一提供（VI §8） */
|
||
.avatar-gradient-teal { background: linear-gradient(135deg, #2dd4bf, #10b981); }
|
||
.top-customer-info { flex: 1; min-width: 0; }
|
||
.top-customer-name-row { display: flex; align-items: center; gap: 8rpx; margin-bottom: 8rpx; }
|
||
.top-customer-name { font-size: 28rpx; font-weight: 600; color: #242424; }
|
||
.top-customer-heart { font-size: 24rpx; }
|
||
.top-customer-score { font-size: 24rpx; font-weight: 700; font-variant-numeric: tabular-nums; }
|
||
.top-customer-score-success { color: #00a870; }
|
||
.top-customer-score-warning { color: #ed7b2f; }
|
||
.top-customer-score-gray { color: #8b8b8b; }
|
||
.top-customer-stats { display: flex; align-items: center; gap: 24rpx; }
|
||
.top-customer-stat { font-size: 22rpx; color: #a6a6a6; }
|
||
.top-customer-stat-val { font-weight: 600; color: #393939; }
|
||
.toggle-btn { display: flex; align-items: center; justify-content: center; padding: 16rpx 0; font-size: 26rpx; color: var(--color-primary); font-weight: 500; margin-top: 8rpx; }
|
||
.toggle-btn--hover { opacity: 0.6; }
|
||
.task-item--hover { opacity: 0.75; }
|
||
|
||
/* perf-progress-box */
|
||
.perf-progress-box {
|
||
padding: 24rpx 24rpx 50rpx 24rpx;
|
||
border: 1rpx solid rgba(0, 0, 0, 0.2);
|
||
border-radius: 16rpx;
|
||
background: rgba(0, 139, 199, 0.02);
|
||
}
|
||
|
||
/* 近期服务明细 */
|