Просмотр исходного кода

fix(reminder-config): 恢复丢失的 <style scoped> 样式块,修复提醒设置页样式不加载

liaoxg 1 неделя назад
Родитель
Сommit
43d61e5669
1 измененных файлов с 205 добавлено и 0 удалено
  1. 205 0
      cfc-frontend/pages/reminder-config/index.vue

+ 205 - 0
cfc-frontend/pages/reminder-config/index.vue

@@ -242,3 +242,208 @@ export default {
   }
 }
 </script>
+
+<style scoped>
+.reminder-config-page {
+  box-sizing: border-box;
+  min-height: 100vh;
+  background: #F5F9FC;
+  overflow: hidden;
+}
+.content {
+  padding: 30rpx;
+  box-sizing: border-box;
+  width: 100%;
+  overflow: hidden;
+}
+.cfg-card {
+  background-color: #FFFFFF;
+  border-radius: 24rpx;
+  padding: 30rpx;
+  margin-bottom: 30rpx;
+  box-shadow: 0 4rpx 16rpx rgba(91, 155, 213, 0.08);
+}
+.cfg-card-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.cfg-card-title {
+  font-size: 30rpx;
+  font-weight: 600;
+  color: #1E293B;
+}
+.cfg-card-desc {
+  display: block;
+  margin-top: 12rpx;
+  font-size: 24rpx;
+  color: #94A3B8;
+  line-height: 1.6;
+}
+.cfg-switch {
+  padding: 10rpx 28rpx;
+  border-radius: 999rpx;
+  font-size: 26rpx;
+  background: #E2E8F0;
+  color: #64748B;
+}
+.cfg-switch-on {
+  background: linear-gradient(135deg, #5B9BD5, #8FC5E8);
+  color: #FFFFFF;
+  font-weight: 600;
+}
+.channel-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 20rpx;
+  margin-top: 24rpx;
+}
+.channel-item {
+  box-sizing: border-box;
+  position: relative;
+  display: flex;
+  align-items: center;
+  padding: 16rpx 24rpx;
+  border: 2rpx solid #E2E8F0;
+  border-radius: 20rpx;
+  background: #FFFFFF;
+  min-width: 200rpx;
+}
+.channel-selected {
+  border-color: #5B9BD5;
+  background: #5B9BD5;
+}
+.channel-disabled {
+  opacity: 0.55;
+}
+.channel-check {
+  position: absolute;
+  top: -8rpx;
+  right: -8rpx;
+  width: 32rpx;
+  height: 32rpx;
+  border-radius: 50%;
+  background-color: #FFFFFF;
+  color: #5B9BD5;
+  font-size: 20rpx;
+  font-weight: 900;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 2;
+  box-shadow: 0 2rpx 4rpx rgba(0,0,0,0.1);
+}
+.channel-info {
+  display: flex;
+  flex-direction: column;
+  gap: 6rpx;
+}
+.channel-name {
+  font-size: 26rpx;
+  color: #1E293B;
+  font-weight: 500;
+}
+.channel-selected .channel-name {
+  color: #FFFFFF;
+}
+.channel-reason {
+  font-size: 20rpx;
+  color: #94A3B8;
+}
+.channel-tip {
+  width: 100%;
+  margin-top: 16rpx;
+}
+.channel-tip-text {
+  font-size: 24rpx;
+  color: #5B9BD5;
+}
+.timing-list {
+  display: flex;
+  gap: 20rpx;
+  margin-top: 24rpx;
+}
+.timing-item {
+  flex: 1;
+  box-sizing: border-box;
+  padding: 24rpx;
+  border: 2rpx solid #E2E8F0;
+  border-radius: 20rpx;
+  display: flex;
+  flex-direction: column;
+  gap: 8rpx;
+}
+.timing-active {
+  border-color: #5B9BD5;
+  background: #F0F7FF;
+}
+.timing-name {
+  font-size: 28rpx;
+  font-weight: 600;
+  color: #1E293B;
+}
+.timing-active .timing-name {
+  color: #3A7CC4;
+}
+.timing-desc {
+  font-size: 22rpx;
+  color: #94A3B8;
+}
+.offset-row {
+  display: flex;
+  align-items: center;
+  margin-top: 30rpx;
+  padding: 20rpx 24rpx;
+  background: #F8FAFC;
+  border-radius: 16rpx;
+}
+.offset-label {
+  font-size: 26rpx;
+  color: #1E293B;
+  margin-right: 20rpx;
+}
+.offset-input {
+  flex: 1;
+  font-size: 28rpx;
+  color: #1E293B;
+}
+.offset-unit {
+  font-size: 24rpx;
+  color: #94A3B8;
+  margin-left: 12rpx;
+}
+.offset-hint {
+  display: block;
+  margin-top: 12rpx;
+  font-size: 22rpx;
+  color: #94A3B8;
+}
+.tip-card {
+  background: #D6EAF8;
+  border-radius: 16rpx;
+  padding: 24rpx 30rpx;
+  margin-bottom: 30rpx;
+}
+.tip-text {
+  font-size: 24rpx;
+  color: #3A7CC4;
+  line-height: 1.6;
+}
+.save-area {
+  padding: 40rpx 30rpx;
+}
+.save-btn {
+  background: linear-gradient(135deg, #5B9BD5, #3A7CC4);
+  color: #FFFFFF;
+  text-align: center;
+  padding: 28rpx 0;
+  border-radius: 999rpx;
+  font-size: 30rpx;
+  font-weight: 600;
+  box-shadow: 0 6rpx 20rpx rgba(91, 155, 213, 0.3);
+}
+.save-btn:active {
+  opacity: 0.9;
+  transform: scale(0.98);
+}
+</style>