feat(反馈): 添加意见反馈页面和功能
refactor(页面路由): 更新反馈页面路由路径 style(样式): 添加反馈页面样式文件 build(组件): 添加NutOverlay组件类型声明 docs(配置): 更新页面配置文件和导航标题
Showing
11 changed files
with
675 additions
and
11 deletions
| ... | @@ -19,6 +19,7 @@ declare module 'vue' { | ... | @@ -19,6 +19,7 @@ declare module 'vue' { |
| 19 | NutInput: typeof import('@nutui/nutui-taro')['Input'] | 19 | NutInput: typeof import('@nutui/nutui-taro')['Input'] |
| 20 | NutMenu: typeof import('@nutui/nutui-taro')['Menu'] | 20 | NutMenu: typeof import('@nutui/nutui-taro')['Menu'] |
| 21 | NutMenuItem: typeof import('@nutui/nutui-taro')['MenuItem'] | 21 | NutMenuItem: typeof import('@nutui/nutui-taro')['MenuItem'] |
| 22 | + NutOverlay: typeof import('@nutui/nutui-taro')['Overlay'] | ||
| 22 | NutPicker: typeof import('@nutui/nutui-taro')['Picker'] | 23 | NutPicker: typeof import('@nutui/nutui-taro')['Picker'] |
| 23 | NutPopup: typeof import('@nutui/nutui-taro')['Popup'] | 24 | NutPopup: typeof import('@nutui/nutui-taro')['Popup'] |
| 24 | NutRadio: typeof import('@nutui/nutui-taro')['Radio'] | 25 | NutRadio: typeof import('@nutui/nutui-taro')['Radio'] | ... | ... |
| 1 | /* | 1 | /* |
| 2 | * @Date: 2025-06-28 10:33:00 | 2 | * @Date: 2025-06-28 10:33:00 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-07-03 18:09:07 | 4 | + * @LastEditTime: 2025-07-03 20:40:08 |
| 5 | * @FilePath: /jgdl/src/app.config.js | 5 | * @FilePath: /jgdl/src/app.config.js |
| 6 | * @Description: 文件描述 | 6 | * @Description: 文件描述 |
| 7 | */ | 7 | */ |
| ... | @@ -24,6 +24,8 @@ export default { | ... | @@ -24,6 +24,8 @@ export default { |
| 24 | 'pages/myCar/index', | 24 | 'pages/myCar/index', |
| 25 | 'pages/myOrders/index', | 25 | 'pages/myOrders/index', |
| 26 | 'pages/myAuthCar/index', | 26 | 'pages/myAuthCar/index', |
| 27 | + 'pages/feedBack/index', | ||
| 28 | + 'pages/helpCenter/index', | ||
| 27 | ], | 29 | ], |
| 28 | subpackages: [ // 配置在tabBar中的页面不能分包写到subpackages中去 | 30 | subpackages: [ // 配置在tabBar中的页面不能分包写到subpackages中去 |
| 29 | { | 31 | { | ... | ... |
src/pages/feedBack/index.config.js
0 → 100755
| 1 | +/* | ||
| 2 | + * @Date: 2025-07-03 20:15:54 | ||
| 3 | + * @LastEditors: hookehuyr hookehuyr@gmail.com | ||
| 4 | + * @LastEditTime: 2025-07-03 20:16:13 | ||
| 5 | + * @FilePath: /jgdl/src/pages/feedBack/index.config.js | ||
| 6 | + * @Description: 文件描述 | ||
| 7 | + */ | ||
| 8 | +export default { | ||
| 9 | + navigationBarTitleText: '意见反馈', | ||
| 10 | + usingComponents: { | ||
| 11 | + }, | ||
| 12 | +} |
src/pages/feedBack/index.less
0 → 100644
| 1 | +.feedback-page { | ||
| 2 | + min-height: 100vh; | ||
| 3 | + background-color: #f5f5f5; | ||
| 4 | + display: flex; | ||
| 5 | + flex-direction: column; | ||
| 6 | +} | ||
| 7 | + | ||
| 8 | +/* 头部导航 */ | ||
| 9 | +.header { | ||
| 10 | + background-color: #f97316; | ||
| 11 | + padding: 32rpx 32rpx 24rpx; | ||
| 12 | + padding-top: calc(32rpx + env(safe-area-inset-top)); | ||
| 13 | + display: flex; | ||
| 14 | + align-items: center; | ||
| 15 | + justify-content: space-between; | ||
| 16 | +} | ||
| 17 | + | ||
| 18 | +.header-left { | ||
| 19 | + width: 48rpx; | ||
| 20 | + height: 48rpx; | ||
| 21 | + display: flex; | ||
| 22 | + align-items: center; | ||
| 23 | + justify-content: center; | ||
| 24 | +} | ||
| 25 | + | ||
| 26 | +.back-icon { | ||
| 27 | + font-size: 48rpx; | ||
| 28 | + color: white; | ||
| 29 | +} | ||
| 30 | + | ||
| 31 | +.header-title { | ||
| 32 | + font-size: 36rpx; | ||
| 33 | + font-weight: 600; | ||
| 34 | + color: white; | ||
| 35 | + flex: 1; | ||
| 36 | + text-align: center; | ||
| 37 | +} | ||
| 38 | + | ||
| 39 | +.header-right { | ||
| 40 | + width: 48rpx; | ||
| 41 | +} | ||
| 42 | + | ||
| 43 | +/* 内容区域 */ | ||
| 44 | +.content { | ||
| 45 | + flex: 1; | ||
| 46 | + padding: 32rpx; | ||
| 47 | +} | ||
| 48 | + | ||
| 49 | +/* 提示文字 */ | ||
| 50 | +.tip-text { | ||
| 51 | + font-size: 28rpx; | ||
| 52 | + color: #6b7280; | ||
| 53 | + margin-bottom: 32rpx; | ||
| 54 | + line-height: 1.5; | ||
| 55 | +} | ||
| 56 | + | ||
| 57 | +/* 反馈分类 */ | ||
| 58 | +.category-section { | ||
| 59 | + margin-bottom: 32rpx; | ||
| 60 | +} | ||
| 61 | + | ||
| 62 | +.category-grid { | ||
| 63 | + display: flex; | ||
| 64 | + justify-content: space-between; | ||
| 65 | + gap: 16rpx; | ||
| 66 | +} | ||
| 67 | + | ||
| 68 | +.category-item { | ||
| 69 | + flex: 1; | ||
| 70 | + display: flex; | ||
| 71 | + flex-direction: column; | ||
| 72 | + align-items: center; | ||
| 73 | + cursor: pointer; | ||
| 74 | +} | ||
| 75 | + | ||
| 76 | +.category-icon { | ||
| 77 | + width: 96rpx; | ||
| 78 | + height: 96rpx; | ||
| 79 | + border-radius: 50%; | ||
| 80 | + background-color: #f3f4f6; | ||
| 81 | + display: flex; | ||
| 82 | + align-items: center; | ||
| 83 | + justify-content: center; | ||
| 84 | + margin-bottom: 16rpx; | ||
| 85 | + transition: all 0.3s ease; | ||
| 86 | +} | ||
| 87 | + | ||
| 88 | +.category-icon.active { | ||
| 89 | + background-color: #fed7aa; | ||
| 90 | +} | ||
| 91 | + | ||
| 92 | +.icon-text { | ||
| 93 | + font-size: 48rpx; | ||
| 94 | +} | ||
| 95 | + | ||
| 96 | +.category-name { | ||
| 97 | + font-size: 24rpx; | ||
| 98 | + color: #6b7280; | ||
| 99 | + text-align: center; | ||
| 100 | +} | ||
| 101 | + | ||
| 102 | +.category-item.active .category-name { | ||
| 103 | + color: #f97316; | ||
| 104 | +} | ||
| 105 | + | ||
| 106 | +/* 反馈内容 */ | ||
| 107 | +.feedback-section { | ||
| 108 | + margin-bottom: 32rpx; | ||
| 109 | +} | ||
| 110 | + | ||
| 111 | +.feedback-textarea { | ||
| 112 | + width: 100%; | ||
| 113 | + height: 256rpx; | ||
| 114 | + padding: 24rpx; | ||
| 115 | + background-color: #f9fafb; | ||
| 116 | + border-radius: 16rpx; | ||
| 117 | + border: none; | ||
| 118 | + font-size: 28rpx; | ||
| 119 | + color: #374151; | ||
| 120 | + line-height: 1.5; | ||
| 121 | + resize: none; | ||
| 122 | + box-sizing: border-box; | ||
| 123 | +} | ||
| 124 | + | ||
| 125 | +.feedback-textarea:focus { | ||
| 126 | + outline: none; | ||
| 127 | + background-color: #f3f4f6; | ||
| 128 | +} | ||
| 129 | + | ||
| 130 | +.char-count { | ||
| 131 | + display: flex; | ||
| 132 | + justify-content: flex-end; | ||
| 133 | + font-size: 24rpx; | ||
| 134 | + color: #9ca3af; | ||
| 135 | + margin-top: 16rpx; | ||
| 136 | +} | ||
| 137 | + | ||
| 138 | +/* 图片上传 */ | ||
| 139 | +.image-section { | ||
| 140 | + margin-bottom: 32rpx; | ||
| 141 | +} | ||
| 142 | + | ||
| 143 | +.section-label { | ||
| 144 | + font-size: 28rpx; | ||
| 145 | + color: #6b7280; | ||
| 146 | + margin-bottom: 16rpx; | ||
| 147 | +} | ||
| 148 | + | ||
| 149 | +.image-upload-grid { | ||
| 150 | + display: flex; | ||
| 151 | + gap: 24rpx; | ||
| 152 | + align-items: center; | ||
| 153 | +} | ||
| 154 | + | ||
| 155 | +.image-item { | ||
| 156 | + position: relative; | ||
| 157 | +} | ||
| 158 | + | ||
| 159 | +.image-preview { | ||
| 160 | + position: relative; | ||
| 161 | + width: 128rpx; | ||
| 162 | + height: 128rpx; | ||
| 163 | + border-radius: 16rpx; | ||
| 164 | + overflow: hidden; | ||
| 165 | +} | ||
| 166 | + | ||
| 167 | +.preview-image { | ||
| 168 | + width: 100%; | ||
| 169 | + height: 100%; | ||
| 170 | + object-fit: cover; | ||
| 171 | +} | ||
| 172 | + | ||
| 173 | +.delete-btn { | ||
| 174 | + position: absolute; | ||
| 175 | + top: 8rpx; | ||
| 176 | + right: 8rpx; | ||
| 177 | + width: 32rpx; | ||
| 178 | + height: 32rpx; | ||
| 179 | + background-color: #ef4444; | ||
| 180 | + border-radius: 50%; | ||
| 181 | + display: flex; | ||
| 182 | + align-items: center; | ||
| 183 | + justify-content: center; | ||
| 184 | + z-index: 10; | ||
| 185 | + box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.15); | ||
| 186 | +} | ||
| 187 | + | ||
| 188 | +.delete-icon { | ||
| 189 | + font-size: 16rpx; | ||
| 190 | + color: white; | ||
| 191 | +} | ||
| 192 | + | ||
| 193 | +.upload-button { | ||
| 194 | + width: 128rpx; | ||
| 195 | + height: 128rpx; | ||
| 196 | + border: 2rpx dashed #d1d5db; | ||
| 197 | + border-radius: 16rpx; | ||
| 198 | + display: flex; | ||
| 199 | + align-items: center; | ||
| 200 | + justify-content: center; | ||
| 201 | + background-color: #f9fafb; | ||
| 202 | + transition: all 0.3s ease; | ||
| 203 | +} | ||
| 204 | + | ||
| 205 | +.upload-button:active { | ||
| 206 | + background-color: #f3f4f6; | ||
| 207 | + border-color: #f97316; | ||
| 208 | +} | ||
| 209 | + | ||
| 210 | +.upload-icon { | ||
| 211 | + font-size: 48rpx; | ||
| 212 | + color: #9ca3af; | ||
| 213 | +} | ||
| 214 | + | ||
| 215 | +.upload-tip { | ||
| 216 | + font-size: 24rpx; | ||
| 217 | + color: #9ca3af; | ||
| 218 | + margin-top: 16rpx; | ||
| 219 | + text-align: right; | ||
| 220 | +} | ||
| 221 | + | ||
| 222 | +/* 联系方式 */ | ||
| 223 | +.contact-section { | ||
| 224 | + margin-bottom: 48rpx; | ||
| 225 | +} | ||
| 226 | + | ||
| 227 | +.contact-input { | ||
| 228 | + width: 100%; | ||
| 229 | + padding: 28rpx; | ||
| 230 | + background-color: #f9fafb; | ||
| 231 | + border-radius: 16rpx; | ||
| 232 | + border: none; | ||
| 233 | + font-size: 28rpx; | ||
| 234 | + color: #374151; | ||
| 235 | + box-sizing: border-box; | ||
| 236 | + margin-top: 16rpx; | ||
| 237 | +} | ||
| 238 | + | ||
| 239 | +.contact-input:focus { | ||
| 240 | + outline: none; | ||
| 241 | + background-color: #f3f4f6; | ||
| 242 | +} | ||
| 243 | + | ||
| 244 | +/* 提交按钮 */ | ||
| 245 | +.submit-section { | ||
| 246 | + margin-bottom: 32rpx; | ||
| 247 | +} | ||
| 248 | + | ||
| 249 | +.submit-btn { | ||
| 250 | + width: 100%; | ||
| 251 | + padding: 12rpx; | ||
| 252 | + background-color: #f97316; | ||
| 253 | + color: white; | ||
| 254 | + border: none; | ||
| 255 | + border-radius: 16rpx; | ||
| 256 | + font-size: 32rpx; | ||
| 257 | + font-weight: 600; | ||
| 258 | + transition: all 0.3s ease; | ||
| 259 | +} | ||
| 260 | + | ||
| 261 | +.submit-btn.disabled { | ||
| 262 | + background-color: #fed7aa; | ||
| 263 | + color: white; | ||
| 264 | +} | ||
| 265 | + | ||
| 266 | +.submit-btn:not(.disabled):active { | ||
| 267 | + background-color: #ea580c; | ||
| 268 | +} | ||
| 269 | + | ||
| 270 | +/* 成功弹窗 */ | ||
| 271 | +.success-modal { | ||
| 272 | + position: fixed; | ||
| 273 | + top: 0; | ||
| 274 | + left: 0; | ||
| 275 | + right: 0; | ||
| 276 | + bottom: 0; | ||
| 277 | + display: flex; | ||
| 278 | + align-items: center; | ||
| 279 | + justify-content: center; | ||
| 280 | + z-index: 1000; | ||
| 281 | +} | ||
| 282 | + | ||
| 283 | +.success-content { | ||
| 284 | + background-color: white; | ||
| 285 | + border-radius: 16rpx; | ||
| 286 | + padding: 48rpx; | ||
| 287 | + width: 480rpx; | ||
| 288 | + text-align: center; | ||
| 289 | + box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.1); | ||
| 290 | +} | ||
| 291 | + | ||
| 292 | +.success-icon { | ||
| 293 | + width: 128rpx; | ||
| 294 | + height: 128rpx; | ||
| 295 | + background-color: #dcfce7; | ||
| 296 | + border-radius: 50%; | ||
| 297 | + display: flex; | ||
| 298 | + align-items: center; | ||
| 299 | + justify-content: center; | ||
| 300 | + margin: 0 auto 32rpx; | ||
| 301 | +} | ||
| 302 | + | ||
| 303 | +.check-icon { | ||
| 304 | + font-size: 64rpx; | ||
| 305 | + color: #16a34a; | ||
| 306 | + font-weight: bold; | ||
| 307 | +} | ||
| 308 | + | ||
| 309 | +.success-title { | ||
| 310 | + font-size: 36rpx; | ||
| 311 | + font-weight: 600; | ||
| 312 | + color: #111827; | ||
| 313 | + margin-bottom: 16rpx; | ||
| 314 | +} | ||
| 315 | + | ||
| 316 | +.success-desc { | ||
| 317 | + font-size: 28rpx; | ||
| 318 | + color: #6b7280; | ||
| 319 | +} |
src/pages/feedBack/index.vue
0 → 100644
| 1 | +<!-- | ||
| 2 | + * @Date: 2022-09-19 14:11:06 | ||
| 3 | + * @LastEditors: hookehuyr hookehuyr@gmail.com | ||
| 4 | + * @LastEditTime: 2025-07-03 20:25:34 | ||
| 5 | + * @FilePath: /jgdl/src/pages/feedBack/index.vue | ||
| 6 | + * @Description: 意见反馈页面 | ||
| 7 | +--> | ||
| 8 | +<template> | ||
| 9 | + <view class="feedback-page"> | ||
| 10 | + <view class="content"> | ||
| 11 | + <!-- 提示文字 --> | ||
| 12 | + <view class="tip-text"> | ||
| 13 | + 感谢您的宝贵意见,我们将不断完善产品和服务 | ||
| 14 | + </view> | ||
| 15 | + | ||
| 16 | + <!-- 反馈分类 --> | ||
| 17 | + <view class="category-section"> | ||
| 18 | + <view class="category-grid"> | ||
| 19 | + <view | ||
| 20 | + v-for="category in categories" | ||
| 21 | + :key="category.id" | ||
| 22 | + class="category-item" | ||
| 23 | + :class="{ active: selectedCategory === category.id }" | ||
| 24 | + @click="selectCategory(category.id)" | ||
| 25 | + > | ||
| 26 | + <view class="category-icon" :class="{ active: selectedCategory === category.id }"> | ||
| 27 | + <text class="icon-text">{{ category.icon }}</text> | ||
| 28 | + </view> | ||
| 29 | + <text class="category-name">{{ category.name }}</text> | ||
| 30 | + </view> | ||
| 31 | + </view> | ||
| 32 | + </view> | ||
| 33 | + | ||
| 34 | + <!-- 反馈内容 --> | ||
| 35 | + <view class="feedback-section"> | ||
| 36 | + <textarea | ||
| 37 | + v-model="feedbackText" | ||
| 38 | + placeholder="请详细描述您遇到的问题或建议..." | ||
| 39 | + class="feedback-textarea" | ||
| 40 | + maxlength="200" | ||
| 41 | + /> | ||
| 42 | + <view class="char-count"> | ||
| 43 | + {{ feedbackText.length }}/200 | ||
| 44 | + </view> | ||
| 45 | + </view> | ||
| 46 | + | ||
| 47 | + <!-- 图片上传 --> | ||
| 48 | + <view class="image-section"> | ||
| 49 | + <view class="section-label">上传图片(选填)</view> | ||
| 50 | + <view class="image-upload-grid"> | ||
| 51 | + <!-- 已上传的图片 --> | ||
| 52 | + <view | ||
| 53 | + v-for="(image, index) in uploadedImages" | ||
| 54 | + :key="index" | ||
| 55 | + class="image-item" | ||
| 56 | + > | ||
| 57 | + <view class="image-preview" @click="previewImage(image)"> | ||
| 58 | + <image :src="image" class="preview-image" mode="aspectFill" /> | ||
| 59 | + <view class="delete-btn" @click.stop="deleteImage(index)"> | ||
| 60 | + <Close class="delete-icon" /> | ||
| 61 | + </view> | ||
| 62 | + </view> | ||
| 63 | + </view> | ||
| 64 | + | ||
| 65 | + <!-- 上传按钮 --> | ||
| 66 | + <view | ||
| 67 | + v-if="uploadedImages.length < 3" | ||
| 68 | + class="upload-button" | ||
| 69 | + @click="triggerUpload" | ||
| 70 | + > | ||
| 71 | + <Plus class="upload-icon" /> | ||
| 72 | + </view> | ||
| 73 | + </view> | ||
| 74 | + <view class="upload-tip">最多上传3张</view> | ||
| 75 | + </view> | ||
| 76 | + | ||
| 77 | + <!-- 联系方式 --> | ||
| 78 | + <view class="contact-section"> | ||
| 79 | + <view class="section-label">联系方式(选填)</view> | ||
| 80 | + <nut-input | ||
| 81 | + v-model="contactInfo" | ||
| 82 | + placeholder="请留下您的手机号或微信号" | ||
| 83 | + /> | ||
| 84 | + </view> | ||
| 85 | + | ||
| 86 | + <!-- 提交按钮 --> | ||
| 87 | + <view class="submit-section"> | ||
| 88 | + <button | ||
| 89 | + class="submit-btn" | ||
| 90 | + :class="{ disabled: !canSubmit }" | ||
| 91 | + :disabled="!canSubmit" | ||
| 92 | + @click="handleSubmit" | ||
| 93 | + > | ||
| 94 | + 提交反馈 | ||
| 95 | + </button> | ||
| 96 | + </view> | ||
| 97 | + </view> | ||
| 98 | + | ||
| 99 | + <!-- 图片预览组件 --> | ||
| 100 | + <nut-image-preview | ||
| 101 | + v-model:show="previewVisible" | ||
| 102 | + :images="previewImages" | ||
| 103 | + :init-no="previewIndex" | ||
| 104 | + @close="closePreview" | ||
| 105 | + /> | ||
| 106 | + | ||
| 107 | + <!-- 成功提示弹窗 --> | ||
| 108 | + <nut-overlay v-model:visible="showSuccessModal" @click="closeSuccessModal"> | ||
| 109 | + <view class="success-modal"> | ||
| 110 | + <view class="success-content"> | ||
| 111 | + <view class="success-icon"> | ||
| 112 | + <text class="check-icon">✓</text> | ||
| 113 | + </view> | ||
| 114 | + <view class="success-title">反馈成功</view> | ||
| 115 | + <view class="success-desc">感谢您的反馈</view> | ||
| 116 | + </view> | ||
| 117 | + </view> | ||
| 118 | + </nut-overlay> | ||
| 119 | + </view> | ||
| 120 | +</template> | ||
| 121 | + | ||
| 122 | +<script setup> | ||
| 123 | +import { ref, computed } from 'vue' | ||
| 124 | +import Taro from '@tarojs/taro' | ||
| 125 | +import { Left, Plus, Close } from '@nutui/icons-vue-taro' | ||
| 126 | +import { Toast } from '@nutui/nutui-taro' | ||
| 127 | +import './index.less' | ||
| 128 | + | ||
| 129 | +// 反馈分类 | ||
| 130 | +const categories = ref([ | ||
| 131 | + { id: 'feature', name: '功能建议', icon: '💡' }, | ||
| 132 | + { id: 'ui', name: '界面设计', icon: '✖️' }, | ||
| 133 | + { id: 'vehicle', name: '车辆信息', icon: '🚲' }, | ||
| 134 | + { id: 'other', name: '其他问题', icon: '❓' } | ||
| 135 | +]) | ||
| 136 | + | ||
| 137 | +// 表单数据 | ||
| 138 | +const selectedCategory = ref(null) | ||
| 139 | +const feedbackText = ref('') | ||
| 140 | +const contactInfo = ref('') | ||
| 141 | +const uploadedImages = ref([]) | ||
| 142 | + | ||
| 143 | +// 图片预览相关 | ||
| 144 | +const previewVisible = ref(false) | ||
| 145 | +const previewImages = ref([]) | ||
| 146 | +const previewIndex = ref(0) | ||
| 147 | + | ||
| 148 | +// 成功弹窗 | ||
| 149 | +const showSuccessModal = ref(false) | ||
| 150 | + | ||
| 151 | +// 计算属性:是否可以提交 | ||
| 152 | +const canSubmit = computed(() => { | ||
| 153 | + return selectedCategory.value && feedbackText.value.trim() | ||
| 154 | +}) | ||
| 155 | + | ||
| 156 | +/** | ||
| 157 | + * 返回上一页 | ||
| 158 | + */ | ||
| 159 | +const goBack = () => { | ||
| 160 | + Taro.navigateBack() | ||
| 161 | +} | ||
| 162 | + | ||
| 163 | +/** | ||
| 164 | + * 选择反馈分类 | ||
| 165 | + */ | ||
| 166 | +const selectCategory = (categoryId) => { | ||
| 167 | + selectedCategory.value = categoryId | ||
| 168 | +} | ||
| 169 | + | ||
| 170 | +/** | ||
| 171 | + * 触发图片上传 | ||
| 172 | + */ | ||
| 173 | +const triggerUpload = () => { | ||
| 174 | + if (uploadedImages.value.length >= 3) { | ||
| 175 | + Toast.fail('最多只能上传3张图片') | ||
| 176 | + return | ||
| 177 | + } | ||
| 178 | + | ||
| 179 | + Taro.chooseImage({ | ||
| 180 | + count: 1, | ||
| 181 | + sizeType: ['compressed'], | ||
| 182 | + sourceType: ['album', 'camera'], | ||
| 183 | + success: function (res) { | ||
| 184 | + const tempFilePath = res.tempFilePaths[0] | ||
| 185 | + uploadImage(tempFilePath) | ||
| 186 | + }, | ||
| 187 | + fail: function () { | ||
| 188 | + Toast.fail('选择图片失败') | ||
| 189 | + } | ||
| 190 | + }) | ||
| 191 | +} | ||
| 192 | + | ||
| 193 | +/** | ||
| 194 | + * 上传图片到服务器 | ||
| 195 | + */ | ||
| 196 | +const uploadImage = (filePath) => { | ||
| 197 | + Taro.showLoading({ title: '上传中', mask: true }) | ||
| 198 | + | ||
| 199 | + // 模拟上传成功(实际项目中替换为真实的上传逻辑) | ||
| 200 | + setTimeout(() => { | ||
| 201 | + Taro.hideLoading() | ||
| 202 | + | ||
| 203 | + // 模拟服务器返回的图片URL | ||
| 204 | + const mockImageUrl = filePath // 在实际项目中,这里应该是服务器返回的URL | ||
| 205 | + | ||
| 206 | + // 添加到已上传图片列表 | ||
| 207 | + uploadedImages.value.push(mockImageUrl) | ||
| 208 | + | ||
| 209 | + Toast.success('上传成功') | ||
| 210 | + }, 1500) | ||
| 211 | +} | ||
| 212 | + | ||
| 213 | +/** | ||
| 214 | + * 预览图片 | ||
| 215 | + */ | ||
| 216 | +const previewImage = (imageUrl) => { | ||
| 217 | + previewImages.value = [{ src: imageUrl }] | ||
| 218 | + previewIndex.value = 0 | ||
| 219 | + previewVisible.value = true | ||
| 220 | +} | ||
| 221 | + | ||
| 222 | +/** | ||
| 223 | + * 删除图片 | ||
| 224 | + */ | ||
| 225 | +const deleteImage = (index) => { | ||
| 226 | + uploadedImages.value.splice(index, 1) | ||
| 227 | + Toast.success('删除成功') | ||
| 228 | +} | ||
| 229 | + | ||
| 230 | +/** | ||
| 231 | + * 关闭图片预览 | ||
| 232 | + */ | ||
| 233 | +const closePreview = () => { | ||
| 234 | + previewVisible.value = false | ||
| 235 | +} | ||
| 236 | + | ||
| 237 | +/** | ||
| 238 | + * 提交反馈 | ||
| 239 | + */ | ||
| 240 | +const handleSubmit = () => { | ||
| 241 | + if (!canSubmit.value) return | ||
| 242 | + | ||
| 243 | + Taro.showLoading({ title: '提交中...', mask: true }) | ||
| 244 | + | ||
| 245 | + // 构建提交数据 | ||
| 246 | + const submitData = { | ||
| 247 | + category: selectedCategory.value, | ||
| 248 | + content: feedbackText.value.trim(), | ||
| 249 | + contact: contactInfo.value.trim(), | ||
| 250 | + images: uploadedImages.value | ||
| 251 | + } | ||
| 252 | + | ||
| 253 | + // TODO: 调用实际的API接口提交数据 | ||
| 254 | + // submitFeedback(submitData) | ||
| 255 | + | ||
| 256 | + // 模拟提交 | ||
| 257 | + setTimeout(() => { | ||
| 258 | + Taro.hideLoading() | ||
| 259 | + showSuccessModal.value = true | ||
| 260 | + | ||
| 261 | + // 2秒后自动关闭并重置表单 | ||
| 262 | + setTimeout(() => { | ||
| 263 | + closeSuccessModal() | ||
| 264 | + }, 2000) | ||
| 265 | + }, 1500) | ||
| 266 | +} | ||
| 267 | + | ||
| 268 | +/** | ||
| 269 | + * 关闭成功弹窗并重置表单 | ||
| 270 | + */ | ||
| 271 | +const closeSuccessModal = () => { | ||
| 272 | + showSuccessModal.value = false | ||
| 273 | + | ||
| 274 | + // 重置表单 | ||
| 275 | + selectedCategory.value = null | ||
| 276 | + feedbackText.value = '' | ||
| 277 | + contactInfo.value = '' | ||
| 278 | + uploadedImages.value = [] | ||
| 279 | +} | ||
| 280 | +</script> | ||
| 281 | + | ||
| 282 | +<script> | ||
| 283 | +export default { | ||
| 284 | + name: 'FeedbackPage' | ||
| 285 | +} | ||
| 286 | +</script> |
src/pages/helpCenter/index.config.js
0 → 100755
| 1 | +/* | ||
| 2 | + * @Date: 2025-07-03 20:39:30 | ||
| 3 | + * @LastEditors: hookehuyr hookehuyr@gmail.com | ||
| 4 | + * @LastEditTime: 2025-07-03 20:39:50 | ||
| 5 | + * @FilePath: /jgdl/src/pages/help/index.config.js | ||
| 6 | + * @Description: 文件描述 | ||
| 7 | + */ | ||
| 8 | +export default { | ||
| 9 | + navigationBarTitleText: '帮助中心', | ||
| 10 | + usingComponents: { | ||
| 11 | + }, | ||
| 12 | +} |
src/pages/helpCenter/index.less
0 → 100644
src/pages/helpCenter/index.vue
0 → 100644
| 1 | +<!-- | ||
| 2 | + * @Date: 2022-09-19 14:11:06 | ||
| 3 | + * @LastEditors: hookehuyr hookehuyr@gmail.com | ||
| 4 | + * @LastEditTime: 2025-07-02 14:50:57 | ||
| 5 | + * @FilePath: /jgdl/src/pages/demo/index.vue | ||
| 6 | + * @Description: 文件描述 | ||
| 7 | +--> | ||
| 8 | +<template> | ||
| 9 | + <div class="red">{{ str }}</div> | ||
| 10 | +</template> | ||
| 11 | + | ||
| 12 | +<script setup> | ||
| 13 | +// import '@tarojs/taro/html.css' | ||
| 14 | +import { ref } from "vue"; | ||
| 15 | +import "./index.less"; | ||
| 16 | + | ||
| 17 | +// 定义响应式数据 | ||
| 18 | +const str = ref('Demo页面') | ||
| 19 | +</script> | ||
| 20 | + | ||
| 21 | +<script> | ||
| 22 | +export default { | ||
| 23 | + name: "demoPage", | ||
| 24 | +}; | ||
| 25 | +</script> |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2022-09-19 14:11:06 | 2 | * @Date: 2022-09-19 14:11:06 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-07-03 13:25:46 | 4 | + * @LastEditTime: 2025-07-03 20:35:32 |
| 5 | * @FilePath: /jgdl/src/pages/myAuthCar/index.vue | 5 | * @FilePath: /jgdl/src/pages/myAuthCar/index.vue |
| 6 | * @Description: 我的认证车页面 | 6 | * @Description: 我的认证车页面 |
| 7 | --> | 7 | --> |
| ... | @@ -266,7 +266,7 @@ const onItemClick = (item) => { | ... | @@ -266,7 +266,7 @@ const onItemClick = (item) => { |
| 266 | */ | 266 | */ |
| 267 | const handleSellClick = (carId) => { | 267 | const handleSellClick = (carId) => { |
| 268 | Taro.navigateTo({ | 268 | Taro.navigateTo({ |
| 269 | - url: `/pages/sell/index?id=${carId}&mode=edit` | 269 | + url: `/pages/sell/index?id=${carId}&mode=edit&type=auth` |
| 270 | }) | 270 | }) |
| 271 | } | 271 | } |
| 272 | 272 | ... | ... |
| ... | @@ -158,7 +158,7 @@ const onHelpCenter = () => { | ... | @@ -158,7 +158,7 @@ const onHelpCenter = () => { |
| 158 | */ | 158 | */ |
| 159 | const onFeedback = () => { | 159 | const onFeedback = () => { |
| 160 | Taro.navigateTo({ | 160 | Taro.navigateTo({ |
| 161 | - url: '/pages/feedback/index' | 161 | + url: '/pages/feedBack/index' |
| 162 | }) | 162 | }) |
| 163 | } | 163 | } |
| 164 | 164 | ... | ... |
| ... | @@ -224,9 +224,12 @@ | ... | @@ -224,9 +224,12 @@ |
| 224 | 224 | ||
| 225 | <!-- 底部按钮 --> | 225 | <!-- 底部按钮 --> |
| 226 | <view class="bottom-actions"> | 226 | <view class="bottom-actions"> |
| 227 | - <nut-button color="#f97316" size="large" block @click="onPublish"> | 227 | + <nut-button v-if="!isAuthMode" color="#f97316" size="large" block @click="onPublish"> |
| 228 | {{ isEditMode ? '保存修改' : '确认发布' }} | 228 | {{ isEditMode ? '保存修改' : '确认发布' }} |
| 229 | </nut-button> | 229 | </nut-button> |
| 230 | + <nut-button v-else color="#f97316" size="large" block @click="onPublish"> | ||
| 231 | + 确认发布 | ||
| 232 | + </nut-button> | ||
| 230 | </view> | 233 | </view> |
| 231 | 234 | ||
| 232 | <!-- 选择器弹窗 --> | 235 | <!-- 选择器弹窗 --> |
| ... | @@ -289,15 +292,11 @@ import './index.less' | ... | @@ -289,15 +292,11 @@ import './index.less' |
| 289 | 292 | ||
| 290 | // 获取页面参数 | 293 | // 获取页面参数 |
| 291 | const instance = Taro.getCurrentInstance() | 294 | const instance = Taro.getCurrentInstance() |
| 292 | -const { id, mode } = instance.router?.params || {} | 295 | +const { id, mode, type } = instance.router?.params || {} |
| 293 | const isEditMode = ref(mode === 'edit' && id) | 296 | const isEditMode = ref(mode === 'edit' && id) |
| 297 | +const isAuthMode = ref(type === 'auth' && id) | ||
| 294 | const carId = ref(id || '') | 298 | const carId = ref(id || '') |
| 295 | 299 | ||
| 296 | -const themeVars = ref({ | ||
| 297 | - navbarBackground: '#fb923c', | ||
| 298 | - navbarColor: '#ffffff', | ||
| 299 | -}) | ||
| 300 | - | ||
| 301 | // 文件上传相关 | 300 | // 文件上传相关 |
| 302 | // const frontFileList = ref([]) // 正面照(保留用于兼容旧代码) | 301 | // const frontFileList = ref([]) // 正面照(保留用于兼容旧代码) |
| 303 | // const leftFileList = ref([]) // 左侧照(保留用于兼容旧代码) | 302 | // const leftFileList = ref([]) // 左侧照(保留用于兼容旧代码) |
| ... | @@ -853,5 +852,10 @@ onMounted(() => { | ... | @@ -853,5 +852,10 @@ onMounted(() => { |
| 853 | wx.setNavigationBarTitle({ | 852 | wx.setNavigationBarTitle({ |
| 854 | title: isEditMode.value ? '编辑车源' : '发布车源' | 853 | title: isEditMode.value ? '编辑车源' : '发布车源' |
| 855 | }); | 854 | }); |
| 855 | + if (isAuthMode.value) { | ||
| 856 | + wx.setNavigationBarTitle({ | ||
| 857 | + title: '发布车源' | ||
| 858 | + }); | ||
| 859 | + } | ||
| 856 | }) | 860 | }) |
| 857 | </script> | 861 | </script> | ... | ... |
-
Please register or login to post a comment