Files
smartDriveEEUniApp/unpackage/dist/dev/mp-weixin/pages/champion/components/training-tab.wxss
2026-01-20 08:46:36 +08:00

441 lines
9.6 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* 内容区域 - 使用绝对定位从tab页底部开始到底部导航栏结束 */
.tab-content.data-v-00a5184a {
position: absolute;
top: 160rpx; /* 导航栏(88rpx) + tab页(72rpx) = 160rpx */
left: 0;
right: 0;
bottom: 96rpx; /* 底部导航栏高度 */
background-color: #F5F5F5;
padding: 24rpx 16rpx 0 16rpx; /* 顶部24rpx间距底部0 */
box-sizing: border-box;
overflow-y: auto;
}
/* 陪练内容区域使用相同定位 */
.training-content.data-v-00a5184a {
position: absolute;
top: 160rpx; /* 导航栏(88rpx) + tab页(72rpx) = 160rpx */
left: 0;
right: 0;
bottom: 96rpx; /* 底部导航栏高度 */
background-color: #F5F5F5;
padding: 24rpx 16rpx 0 16rpx; /* 顶部24rpx间距与列表项间距一致底部0 */
box-sizing: border-box;
overflow-y: auto;
}
.service-status-toolbar.data-v-00a5184a {
display: flex;
flex-wrap: nowrap;
align-items: center;
gap: 8rpx; /* 增加间距,避免元素被挤压 */
padding: 12rpx 8rpx; /* 增加内边距,给搜索框更多空间 */
margin-bottom: 24rpx; /* 与列表项间距保持一致24rpx */
background-color: #F8F8FA;
border-radius: 8rpx;
border: 1px solid #EFEFF2;
overflow-x: auto;
min-height: 64rpx; /* 设置最小高度,确保搜索区域不被挤压 */
box-sizing: border-box;
}
.toolbar-total.data-v-00a5184a {
font-size: 24rpx;
color: #666;
white-space: nowrap;
flex-shrink: 0;
margin-right: 8rpx; /* 增加右边距,与搜索框保持距离 */
line-height: 1.2;
padding: 0 4rpx; /* 增加左右内边距 */
}
.toolbar-input.data-v-00a5184a {
flex: 1;
min-width: 120rpx; /* 增加最小宽度,避免被挤压变形 */
max-width: 200rpx; /* 设置最大宽度,保持合理比例 */
height: 56rpx; /* 稍微增加高度,提升可用性 */
line-height: 56rpx;
background-color: #F5F6FA;
border-radius: 8rpx;
padding: 0 12rpx; /* 增加左右内边距 */
font-size: 24rpx;
border: 1px solid transparent;
box-sizing: border-box;
flex-shrink: 1; /* 允许适当收缩,但保持最小宽度 */
}
.toolbar-picker.data-v-00a5184a {
flex: 1;
min-width: 120rpx;
max-width: 200rpx;
flex-shrink: 1;
}
.toolbar-picker-view.data-v-00a5184a {
height: 56rpx;
line-height: 56rpx;
background-color: #F5F6FA;
border-radius: 8rpx;
padding: 0 12rpx;
display: flex;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
}
.toolbar-picker-text.data-v-00a5184a {
font-size: 24rpx;
color: #333;
flex: 1;
}
.toolbar-picker-placeholder.data-v-00a5184a {
font-size: 24rpx;
color: #b0b0b0;
flex: 1;
}
.toolbar-actions.data-v-00a5184a {
display: flex;
align-items: center;
margin-left: auto;
flex-shrink: 0;
gap: 8rpx; /* 增加按钮之间的间距 */
}
.toolbar-btn.data-v-00a5184a {
padding: 0 12rpx; /* 增加左右内边距 */
height: 56rpx; /* 与输入框高度保持一致 */
min-width: 56rpx;
color: #2A68FF;
display: flex;
align-items: center;
justify-content: center;
gap: 4rpx; /* 增加图标和文字之间的间距 */
font-size: 24rpx;
font-weight: 400;
line-height: 1;
box-sizing: border-box;
}
.toolbar-btn text.data-v-00a5184a {
color: #2A68FF;
}
.service-card.data-v-00a5184a {
width: 100%;
box-sizing: border-box;
background-color: #FFFFFF;
border-radius: 16rpx;
padding: 32rpx;
margin-bottom: 24rpx;
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04);
overflow: visible;
}
.training-card-item.data-v-00a5184a {
padding-left: 32rpx;
padding-right: 32rpx;
padding-top: 32rpx;
padding-bottom: 32rpx;
position: relative;
}
.card-header.data-v-00a5184a {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20rpx;
width: 100%;
box-sizing: border-box;
padding: 0;
margin: 0;
position: relative;
}
.training-card-action-btn.data-v-00a5184a {
width: 60rpx;
height: 60rpx;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
margin-left: auto;
margin-right: 0;
margin-top: 0;
margin-bottom: 0;
flex-shrink: 0;
flex-grow: 0;
position: relative;
padding: 0;
}
.training-card-action-btn uni-icons.data-v-00a5184a {
display: block;
margin: 0;
padding: 0;
line-height: 1;
}
.training-card-action-btn.data-v-00a5184a:active {
opacity: 0.7;
}
.training-action-menu.data-v-00a5184a {
position: absolute;
top: 60rpx;
right: 32rpx;
width: 160rpx;
background-color: #FFFFFF;
border-radius: 12rpx;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15);
z-index: 100;
overflow: hidden;
margin-right: 0;
}
.training-action-menu-item.data-v-00a5184a {
padding: 24rpx 32rpx;
font-size: 28rpx;
color: #333;
text-align: center;
background-color: #FFFFFF;
}
.training-action-menu-item.data-v-00a5184a:active {
background-color: #F5F5F5;
}
.training-action-menu-mask.data-v-00a5184a {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: transparent;
z-index: 99;
}
.staff-info.data-v-00a5184a {
display: flex;
align-items: center;
flex: 1;
min-width: 0;
margin: 0;
padding: 0;
}
.staff-avatar.data-v-00a5184a {
width: 64rpx;
height: 64rpx;
background-color: #2196F3;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-right: 16rpx;
margin-left: 0;
margin-top: 0;
margin-bottom: 0;
flex-shrink: 0;
}
.avatar-text.data-v-00a5184a {
font-size: 32rpx;
color: #FFFFFF;
font-weight: 500;
}
.staff-name.data-v-00a5184a {
font-size: 32rpx;
font-weight: 500;
color: #333;
}
.customer-tags.data-v-00a5184a {
display: flex;
flex-wrap: wrap;
margin-bottom: 20rpx;
gap: 12rpx;
box-sizing: border-box;
margin-left: 0;
margin-right: 0;
padding: 0;
width: 100%;
max-width: 100%;
}
.customer-info.data-v-00a5184a {
margin-bottom: 16rpx;
display: flex;
flex-direction: column;
gap: 8rpx;
box-sizing: border-box;
margin-left: 0;
margin-right: 0;
padding: 0;
width: 100%;
max-width: 100%;
}
.customer-name.data-v-00a5184a {
font-size: 28rpx;
color: #555;
}
.tag-item.data-v-00a5184a {
padding: 8rpx 16rpx;
border-radius: 8rpx;
box-sizing: border-box;
word-wrap: break-word;
word-break: break-all;
display: inline-block;
max-width: 100%;
}
.tag-blue.data-v-00a5184a {
background-color: #E3F2FD;
}
.tag-blue text.data-v-00a5184a {
font-size: 24rpx;
color: #1976D2;
}
.tag-orange.data-v-00a5184a {
background-color: #FFF3E0;
}
.tag-orange text.data-v-00a5184a {
font-size: 24rpx;
color: #F57C00;
}
.tag-status.data-v-00a5184a {
background-color: #F3F4F6;
}
.tag-status text.data-v-00a5184a {
font-size: 24rpx;
color: #666;
}
.service-duration.data-v-00a5184a {
padding-top: 16rpx;
border-top: 1px solid #F0F0F0;
}
.service-duration text.data-v-00a5184a {
font-size: 26rpx;
color: #999;
}
.service-status-empty.data-v-00a5184a {
padding: 48rpx 0;
text-align: center;
color: #999;
font-size: 28rpx;
}
.service-status-loading-more.data-v-00a5184a {
padding: 24rpx 0;
text-align: center;
color: #999;
font-size: 26rpx;
}
/* 添加素材弹出框样式 */
.material-popup-mask.data-v-00a5184a {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
z-index: 999;
}
.material-popup.data-v-00a5184a {
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: calc(100vw - 80rpx);
max-width: 90%;
box-sizing: border-box;
height: 80vh;
max-height: 80vh;
background-color: #FFFFFF;
border-radius: 16rpx;
z-index: 1000;
display: flex;
flex-direction: column;
box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
overflow: hidden;
}
.popup-header.data-v-00a5184a {
display: flex;
align-items: center;
justify-content: space-between;
padding: 32rpx;
border-bottom: 1px solid #E0E0E0;
flex-shrink: 0;
}
.popup-title.data-v-00a5184a {
font-size: 36rpx;
font-weight: 500;
color: #333;
}
.popup-close.data-v-00a5184a {
width: 48rpx;
height: 48rpx;
display: flex;
align-items: center;
justify-content: center;
}
.popup-content.data-v-00a5184a {
flex: 1;
min-height: 0;
padding: 20rpx 20rpx 28rpx;
box-sizing: border-box;
overflow-y: auto;
}
/* 陪练中列表弹窗样式 */
.training-item-list-popup.data-v-00a5184a {
max-height: 80vh;
}
.training-item-list-popup .popup-content.data-v-00a5184a {
padding: 24rpx;
}
.training-item-card.data-v-00a5184a {
margin-bottom: 24rpx;
}
.training-item-card.data-v-00a5184a:last-child {
margin-bottom: 0;
}
/* 表单样式 */
.form-item.data-v-00a5184a {
display: flex;
align-items: flex-start;
margin-bottom: 20rpx;
gap: 16rpx;
flex-direction: column;
}
.form-item__label.data-v-00a5184a {
font-size: 32rpx;
color: #333;
font-weight: 500;
width: 100%;
text-align: left;
}
.form-item__textarea.data-v-00a5184a {
width: 100%;
min-height: 200rpx;
background-color: #f9fafb;
border-radius: 12rpx;
padding: 24rpx;
font-size: 32rpx;
color: #333;
box-sizing: border-box;
border: 1px solid #e5e7eb;
}
/* 操作按钮样式 */
.training-item-actions.data-v-00a5184a {
display: flex;
gap: 24rpx;
margin-top: 24rpx;
padding-top: 24rpx;
border-top: 1px solid #F0F0F0;
}
.action-btn.data-v-00a5184a {
flex: 1;
height: 88rpx;
border-radius: 12rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 32rpx;
font-weight: 500;
}
.action-btn--continue.data-v-00a5184a {
background-color: #f3f4f6;
color: #2A68FF;
border: 1px solid #d1d5db;
}
.action-btn--continue.data-v-00a5184a:active {
background-color: #e5e7eb;
}
.action-btn--end.data-v-00a5184a {
background-color: #f3f4f6;
color: #2A68FF;
border: 1px solid #d1d5db;
}
.action-btn--end.data-v-00a5184a:active {
background-color: #e5e7eb;
}