diff --git a/miniprogram/pages/opinion/opinion.json b/miniprogram/pages/opinion/opinion.json index e69de29..3bd5dd3 100644 --- a/miniprogram/pages/opinion/opinion.json +++ b/miniprogram/pages/opinion/opinion.json @@ -0,0 +1,6 @@ +{ + "component": true, + "usingComponents": { + + } +} \ No newline at end of file diff --git a/miniprogram/pages/opinion/opinion.ts b/miniprogram/pages/opinion/opinion.ts index e69de29..b29fdc2 100644 --- a/miniprogram/pages/opinion/opinion.ts +++ b/miniprogram/pages/opinion/opinion.ts @@ -0,0 +1,99 @@ +// 定义反馈数据类型 +interface FeedbackData { + type: string; + content: string; + contact: string; +} + +Page({ + data: { + // 选中的反馈类型 + selectedType: '', + + // 反馈内容 + feedbackContent: '', + contentLength: 0, + + // 联系方式 + contactInfo: '', + + // 是否可以提交(验证条件) + canSubmit: false + }, + + onLoad() { + // 初始化 + }, + + // 选择反馈类型 + selectType(e: { currentTarget: { dataset: { type: string } } }) { + const type = e.currentTarget.dataset.type; + this.setData({ + selectedType: type + }, () => { + this.checkSubmitable(); + }); + }, + + // 反馈内容变化 + onContentChange(e: { detail: { value: string } }) { + const content = e.detail.value; + this.setData({ + feedbackContent: content, + contentLength: content.length + }, () => { + this.checkSubmitable(); + }); + }, + + // 联系方式变化 + onContactChange(e: { detail: { value: string } }) { + this.setData({ + contactInfo: e.detail.value + }); + }, + + // 检查是否可以提交 + checkSubmitable() { + const { selectedType, feedbackContent } = this.data; + const canSubmit = selectedType !== '' && feedbackContent.trim().length >= 5; + this.setData({ canSubmit }); + }, + + // 提交反馈 + submitFeedback() { + const { selectedType, feedbackContent, contactInfo } = this.data; + + // 构建反馈数据 + const feedbackData: FeedbackData = { + type: selectedType, + content: feedbackContent, + contact: contactInfo + }; + + // 模拟提交到服务器 + wx.showLoading({ + title: '提交中...', + mask: true + }); + + // 模拟网络请求延迟 + setTimeout(() => { + wx.hideLoading(); + + // 显示提交成功提示 + wx.showToast({ + title: '反馈提交成功', + icon: 'success', + duration: 2000, + success: () => { + // 2秒后返回上一页 + setTimeout(() => { + wx.navigateBack(); + }, 2000); + } + }); + }, 1500); + } +}); + \ No newline at end of file diff --git a/miniprogram/pages/opinion/opinion.wxml b/miniprogram/pages/opinion/opinion.wxml index e69de29..726953a 100644 --- a/miniprogram/pages/opinion/opinion.wxml +++ b/miniprogram/pages/opinion/opinion.wxml @@ -0,0 +1,78 @@ + + + 意见反馈 + 请告诉我们您的想法,帮助我们做得更好 + + + + 反馈类型 + + + 功能建议 + + + 问题反馈 + + + 投诉举报 + + + 其他 + + + + + + + 反馈内容 + + {{contentLength}}/500 + + + + + 联系方式(选填) + + + + + + + + 我们会认真对待每一条反馈,感谢您的支持! + + \ No newline at end of file diff --git a/miniprogram/pages/opinion/opinion.wxss b/miniprogram/pages/opinion/opinion.wxss index e69de29..09f0ba8 100644 --- a/miniprogram/pages/opinion/opinion.wxss +++ b/miniprogram/pages/opinion/opinion.wxss @@ -0,0 +1,147 @@ +/* 页面容器 */ +.feedback-container { + padding: 30rpx 30rpx 60rpx; + background-color: #f5f5f5; + min-height: 100vh; + box-sizing: border-box; +} + +/* 标题样式 */ +.page-title { + font-size: 36rpx; + font-weight: bold; + color: #333; + margin-bottom: 15rpx; + text-align: center; +} + +.page-subtitle { + font-size: 26rpx; + color: #666; + text-align: center; + margin-bottom: 40rpx; +} + +/* 区块样式 */ +.section { + background-color: #fff; + border-radius: 16rpx; + padding: 30rpx; + margin-bottom: 25rpx; + box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05); +} + +.section-title { + font-size: 30rpx; + color: #333; + margin-bottom: 25rpx; + display: flex; + align-items: center; +} + +.section-title::before { + content: ''; + display: inline-block; + width: 6rpx; + height: 24rpx; + background-color: #51bdb6; + border-radius: 3rpx; + margin-right: 15rpx; +} + +/* 反馈类型选择 */ +.type-options { + display: flex; + flex-wrap: wrap; + gap: 20rpx; +} + +.type-item { + padding: 15rpx 30rpx; + background-color: #f5f5f5; + border-radius: 60rpx; + font-size: 28rpx; + color: #666; + cursor: pointer; + transition: all 0.3s ease; +} + +.type-item.selected { + background-color: #51bdb6; + color: #fff; +} + +.type-item:active { + opacity: 0.8; +} + +/* 反馈内容输入框 */ +.feedback-content { + width: 100%; + min-height: 200rpx; + font-size: 28rpx; + color: #333; + line-height: 1.6; + padding: 20rpx; + border: 1rpx solid #eee; + border-radius: 10rpx; + box-sizing: border-box; +} + +.feedback-content::placeholder { + color: #ccc; +} + +.content-count { + text-align: right; + font-size: 24rpx; + color: #999; + margin-top: 15rpx; +} + +/* 联系方式输入框 */ +.contact-input { + width: 100%; + height: 80rpx; + font-size: 28rpx; + padding: 0 20rpx; + border: 1rpx solid #eee; + border-radius: 10rpx; + box-sizing: border-box; +} + +.contact-input::placeholder { + color: #ccc; +} + +/* 提交按钮 */ +.submit-btn { + width: 100%; + height: 90rpx; + line-height: 90rpx; + font-size: 32rpx; + border-radius: 45rpx; + margin-top: 30rpx; + background-color: #ddd; + color: #999; + letter-spacing: 2rpx; +} + +.submit-btn.active { + background-color: #51bdb6; + color: #fff; +} + +.submit-btn.active:active { + background-color: #51bdb6; +} + +/* 提示文字 */ +.hint-text { + font-size: 24rpx; + color: #999; + text-align: center; + margin-top: 20rpx; + line-height: 1.5; +} + \ No newline at end of file diff --git a/miniprogram/pages/user/user.ts b/miniprogram/pages/user/user.ts index a325966..51d7419 100644 --- a/miniprogram/pages/user/user.ts +++ b/miniprogram/pages/user/user.ts @@ -167,6 +167,11 @@ Component({ wx.navigateTo({ url: `/pages/setting/setting?id=${this.data.userinfo.uid}`, }); + }, + gotoFeedback(){ + wx.navigateTo({ + url: `/pages/opinion/opinion?id=${this.data.userinfo.uid}`, + }); }