11

pages/mine/mine.vue

@@ -105,12 +105,23 @@
                         <uni-icons color="#909090" type="right" size="14"></uni-icons>
                     </view>
                 </view>
-                <view class="main-row btn-feel">
+                <view class="main-row btn-feel" @click="openReminderSettings">
                     <view class="row-left">
                         <image class="left-img" src="@/static/icon/server4.png"></image>
                         <text class="left-text">通知与提醒</text>
                     </view>
-                    <view class="row-right">已开启</view>
+                    <view class="row-right">
+                        <switch class="reminder-switch" :checked="reminderEnabled" @change="toggleReminder"></switch>
+                    </view>
+                </view>
+                <view class="main-row btn-feel" @click="openFeedbackPopup">
+                    <view class="row-left">
+                        <image class="left-img" src="@/static/icon/feedback.png"></image>
+                        <text class="left-text">评论与反馈</text>
+                    </view>
+                    <view class="row-right">
+                        <uni-icons color="#909090" type="right" size="14"></uni-icons>
+                    </view>
                 </view>
             </view>
             <view v-if="userType === 2" class="card-help button-click" @click="goToJobHelper">求职帮</view>
@@ -126,6 +137,39 @@
                     @close="close"
                 ></uni-popup-dialog>
             </uni-popup>
+            <!-- 提醒设置弹窗 -->
+            <uni-popup ref="reminderPopup" type="center">
+                <view class="reminder-popup">
+                    <view class="reminder-popup-title">提醒设置</view>
+                    <view class="reminder-popup-content">
+                        <view class="reminder-item" v-for="(item, index) in reminderOptions" :key="index">
+                            <view class="reminder-item-label">{{ item.label }}</view>
+                            <radio :value="item.value" :checked="reminderFrequency === item.value" @change="handleFrequencyChange"></radio>
+                        </view>
+                    </view>
+                    <view class="reminder-popup-footer">
+                        <button class="reminder-popup-btn" @click="closeReminderPopup">确定</button>
+                    </view>
+                </view>
+            </uni-popup>
+            <!-- 评论与反馈弹窗 -->
+            <uni-popup ref="feedbackPopup" type="center">
+                <view class="feedback-popup">
+                    <view class="feedback-popup-title">评论与反馈</view>
+                    <view class="feedback-popup-content">
+                        <textarea class="feedback-textarea" v-model="feedbackContent" placeholder="请输入您的评论或反馈..."></textarea>
+                        <view class="feedback-rating">
+                            <text class="feedback-rating-label">满意度评分：</text>
+                            <view class="feedback-stars">
+                                <text class="feedback-star" v-for="i in 5" :key="i" @click="setRating(i)" :class="{ 'active': rating >= i }">★</text>
+                            </view>
+                        </view>
+                    </view>
+                    <view class="feedback-popup-footer">
+                        <button class="feedback-popup-btn" @click="submitFeedback">提交</button>
+                    </view>
+                </view>
+            </uni-popup>
         </view>
         <template #footer>
             <!-- 统一使用系统tabBar -->
@@ -141,9 +185,24 @@ const { $api, navTo } = inject('globalFunction');
 import useUserStore from '@/stores/useUserStore';
 import { tabbarManager } from '@/utils/tabbarManager';
 const popup = ref(null);
+const reminderPopup = ref(null);
+const feedbackPopup = ref(null);
 const { userInfo, Completion } = storeToRefs(useUserStore());
 const counts = ref({});
 
+// 提醒设置
+const reminderEnabled = ref(true);
+const reminderFrequency = ref('realtime');
+const reminderOptions = ref([
+    { label: '实时提醒', value: 'realtime' },
+    { label: '每小时提醒', value: 'hourly' },
+    { label: '每天提醒', value: 'daily' }
+]);
+
+// 评论与反馈
+const feedbackContent = ref('');
+const rating = ref(0);
+
 // 获取用户类型，参考首页的实现方式
 const userType = computed(() => {
     // 优先从store获取，如果为空则从缓存获取
@@ -236,6 +295,57 @@ function goToMessage(){
 	navTo('/pages/msglog/msglog');
 }
 
+// 切换提醒开启/关闭状态
+function toggleReminder(e) {
+    reminderEnabled.value = e.detail.value;
+}
+
+// 打开提醒设置弹窗
+function openReminderSettings() {
+    reminderPopup.value.open();
+}
+
+// 关闭提醒设置弹窗
+function closeReminderPopup() {
+    reminderPopup.value.close();
+}
+
+// 处理提醒频率变化
+function handleFrequencyChange(e) {
+    reminderFrequency.value = e.detail.value;
+}
+
+// 打开评论与反馈弹窗
+function openFeedbackPopup() {
+    feedbackPopup.value.open();
+}
+
+// 关闭评论与反馈弹窗
+function closeFeedbackPopup() {
+    feedbackPopup.value.close();
+}
+
+// 设置评分
+function setRating(score) {
+    rating.value = score;
+}
+
+// 提交反馈
+function submitFeedback() {
+    // 模拟提交成功
+    uni.showToast({
+        title: '反馈提交成功',
+        icon: 'success'
+    });
+    // 清空表单
+    feedbackContent.value = '';
+    rating.value = 0;
+    // 延迟关闭弹窗，确保用户能看到成功提示
+    setTimeout(() => {
+        closeFeedbackPopup();
+    }, 1000);
+}
+
 </script>
 
 <style lang="stylus" scoped>
@@ -470,4 +580,136 @@ function goToMessage(){
         margin-left: 20rpx;
     }
 }
+
+// 提醒设置弹窗样式
+.reminder-popup {
+    width: 600rpx;
+    background: #FFFFFF;
+    border-radius: 20rpx;
+    padding: 32rpx;
+    
+    .reminder-popup-title {
+        font-size: 32rpx;
+        font-weight: 600;
+        color: #333333;
+        text-align: center;
+        margin-bottom: 32rpx;
+    }
+    
+    .reminder-popup-content {
+        margin-bottom: 40rpx;
+        
+        .reminder-item {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            padding: 24rpx 0;
+            border-bottom: 1rpx solid #F0F0F0;
+            
+            &:last-child {
+                border-bottom: none;
+            }
+            
+            .reminder-item-label {
+                font-size: 28rpx;
+                color: #333333;
+            }
+        }
+    }
+    
+    .reminder-popup-footer {
+        display: flex;
+        justify-content: center;
+        
+        .reminder-popup-btn {
+            width: 100%;
+            height: 80rpx;
+            background: #256BFA;
+            color: #FFFFFF;
+            font-size: 28rpx;
+            font-weight: 500;
+            border-radius: 10rpx;
+            border: none;
+        }
+    }
+}
+
+// 提醒开关样式
+.reminder-switch {
+    transform: scale(0.8);
+}
+
+// 评论与反馈弹窗样式
+.feedback-popup {
+    width: 600rpx;
+    background: #FFFFFF;
+    border-radius: 20rpx;
+    padding: 32rpx;
+    
+    .feedback-popup-title {
+        font-size: 32rpx;
+        font-weight: 600;
+        color: #333333;
+        text-align: center;
+        margin-bottom: 32rpx;
+    }
+    
+    .feedback-popup-content {
+        margin-bottom: 40rpx;
+        
+        .feedback-textarea {
+            width: 100%;
+            height: 200rpx;
+            border: 1rpx solid #E5E5E5;
+            border-radius: 10rpx;
+            padding: 20rpx;
+            font-size: 28rpx;
+            color: #333333;
+            resize: none;
+            margin-bottom: 32rpx;
+        }
+        
+        .feedback-rating {
+            display: flex;
+            align-items: center;
+            
+            .feedback-rating-label {
+                font-size: 28rpx;
+                color: #333333;
+                margin-right: 20rpx;
+            }
+            
+            .feedback-stars {
+                display: flex;
+                
+                .feedback-star {
+                    font-size: 40rpx;
+                    color: #E5E5E5;
+                    margin-right: 16rpx;
+                    cursor: pointer;
+                    
+                    &.active {
+                        color: #FFD700;
+                    }
+                }
+            }
+        }
+    }
+    
+    .feedback-popup-footer {
+        display: flex;
+        justify-content: center;
+        
+        .feedback-popup-btn {
+            width: 100%;
+            height: 80rpx;
+            background: #256BFA;
+            color: #FFFFFF;
+            font-size: 28rpx;
+            font-weight: 500;
+            border-radius: 10rpx;
+            border: none;
+        }
+    }
+}
 </style>