sdz/ks-app-employment-service
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

通知与提醒、评论与反馈开发

Browse Source
This commit is contained in:
FengHui
2026-04-16 19:03:15 +08:00
parent 7796261deb
commit 56437a88ea
2 changed files with 246 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

247
pages/mine/company-mine.vue
View File

@@ -43,12 +43,23 @@
<uni-icons type="right" size="14" color="#909090"></uni-icons>
</view>
</view>
<view class="service-item btn-feel">
<view class="service-item btn-feel" @click="openReminderSettings">
<view class="service-left">
<uni-icons type="notification" size="20" color="#256BFA"></uni-icons>
<text class="service-text">通知与提醒</text>
</view>
<view class="service-status">已开启</view>
<view class="service-status">
<switch class="reminder-switch" :checked="reminderEnabled" @change="toggleReminder"></switch>
</view>
</view>
<view class="service-item btn-feel" @click="openFeedbackPopup">
<view class="service-left">
<uni-icons type="chat" size="20" color="#256BFA"></uni-icons>
<text class="service-text">评论与反馈</text>
</view>
<view class="service-status">
<uni-icons type="right" size="14" color="#909090"></uni-icons>
</view>
</view>
<view class="service-item btn-feel" @click="handleInstitutionClick(1)">
<view class="service-left">
@@ -97,6 +108,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>
</AppLayout>
</template>
@@ -107,6 +151,21 @@ import useUserStore from '@/stores/useUserStore';
const { $api, navTo } = inject('globalFunction');
const popup = ref(null);
const reminderPopup = ref(null);
const feedbackPopup = ref(null);
// 提醒设置
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 companyInfo = reactive({
@@ -196,6 +255,57 @@ function getCompanyInfo() {
companyInfo.isVerified = false;
}
}
// 切换提醒开启/关闭状态
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>
@@ -331,4 +441,137 @@ function getCompanyInfo() {
transform: scale(0.98);
}
}
// 提醒开关样式
.reminder-switch {
transform: scale(0.8);
}
// 提醒设置弹窗样式
.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;
}
}
}
// 评论与反馈弹窗样式
.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;
box-sizing: border-box;
}
.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>