hookehuyr

feat: 新增计划书提交结果页并实现跳转功能

新增功能:
- 创建计划书提交结果页面 (pages/plan-submit-result/)
  - 使用 NavHeader 组件作为页面头部
  - 显示提交成功/失败状态(图标 + 文案)
  - 成功时显示固定提示文案
  - 失败时显示接口返回的错误信息
  - 底部"返回首页"按钮固定在页面底部
  - 通过路由参数传递 success 和 message 参数

修改内容:
- 首页实现计划书提交跳转
  - SchemeA 和 SchemeB 提交后跳转到结果页面
  - 暂时模拟成功状态(待后续接入真实API)
- 注册新页面路由到 app.config.js
- 更新 CHANGELOG 记录变更

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
1 +## [2026-01-31] - 实现计划书提交跳转功能
2 +
3 +### 新增
4 +- 创建计划书提交结果页面 (`pages/plan-submit-result/`)
5 + - 使用 NavHeader 组件作为页面头部
6 + - 显示提交成功/失败状态(图标 + 文案)
7 + - 根据结果显示不同的提示信息
8 + - 成功:固定文案"您的计划书申请已成功提交,为您制定专属保险方案正在规划中,请耐心等待!"
9 + - 失败:显示接口返回的错误信息
10 + - 底部"返回首页"按钮,点击跳转到首页
11 + - 通过路由参数传递 `success``message` 参数
12 +
13 +### 修改
14 +- 首页 (`pages/index/index.vue`)
15 + - 修改 `handlePlanSubmit` 函数,实现简单的带参跳转
16 + - SchemeA 和 SchemeB 提交后跳转到结果页面
17 + - 暂时模拟成功状态(待后续接入真实API)
18 +
19 +---
20 +
21 +**详细信息**
22 +- **影响文件**: src/pages/plan-submit-result/index.vue, src/pages/plan-submit-result/index.config.js, src/pages/index/index.vue, src/app.config.js
23 +- **技术栈**: Vue 3, Taro 4, Composition API
24 +- **测试状态**: 未测试
25 +- **备注**:
26 + - 页面已注册到 app.config.js
27 + - 使用 TailwindCSS 进行样式设计
28 + - 支持成功/失败两种状态展示
29 + - 后续需要接入真实API替换模拟跳转
30 +
31 +---
32 +
1 ## [2026-01-31] - 提取分组列表页面 Composable 33 ## [2026-01-31] - 提取分组列表页面 Composable
2 34
3 ### 重构 35 ### 重构
......
...@@ -20,6 +20,7 @@ const pages = [ ...@@ -20,6 +20,7 @@ const pages = [
20 'pages/signing/index', 20 'pages/signing/index',
21 'pages/mine/index', 21 'pages/mine/index',
22 'pages/plan/index', 22 'pages/plan/index',
23 + 'pages/plan-submit-result/index',
23 'pages/favorites/index', 24 'pages/favorites/index',
24 'pages/avatar/index', 25 'pages/avatar/index',
25 'pages/feedback/index', 26 'pages/feedback/index',
......
...@@ -207,12 +207,21 @@ const openPlanPopup = (scheme) => { ...@@ -207,12 +207,21 @@ const openPlanPopup = (scheme) => {
207 showPlanPopup.value = true; 207 showPlanPopup.value = true;
208 }; 208 };
209 209
210 +/**
211 + * 处理计划书提交
212 + * @description 模拟提交计划书,跳转到结果页面
213 + * @param {Object} formData - 表单数据
214 + */
210 const handlePlanSubmit = (formData) => { 215 const handlePlanSubmit = (formData) => {
211 console.log(`方案${currentScheme.value}提交:`, formData); 216 console.log(`方案${currentScheme.value}提交:`, formData);
217 +
218 + // 关闭弹窗
212 showPlanPopup.value = false; 219 showPlanPopup.value = false;
213 - Taro.showToast({ 220 +
214 - title: '提交成功', 221 + // 模拟提交成功,跳转到结果页面
215 - icon: 'success' 222 + // TODO: 后续接入真实API
223 + go('/pages/plan-submit-result/index', {
224 + success: 'true'
216 }); 225 });
217 }; 226 };
218 227
......
1 +/*
2 + * @Date: 2026-01-30 15:21:50
3 + * @LastEditors: hookehuyr hookehuyr@gmail.com
4 + * @LastEditTime: 2026-01-31 16:37:22
5 + * @FilePath: /manulife-weapp/src/pages/material-list/index.config.js
6 + * @Description: 资料列表页面配置
7 + */
1 export default { 8 export default {
2 navigationBarTitleText: '资料列表', 9 navigationBarTitleText: '资料列表',
3 enablePullDownRefresh: true, 10 enablePullDownRefresh: true,
......
1 +export default {
2 + navigationBarTitleText: '提交结果',
3 + navigationBarBackgroundColor: '#1E3A8A',
4 + navigationBarTextStyle: 'white',
5 + navigationStyle: 'custom'
6 +}
1 +<!--
2 + * @Date: 2026-01-31
3 + * @Description: 计划书提交结果页
4 +-->
5 +<template>
6 + <div class="min-h-screen bg-[#F9FAFB] pb-[calc(160rpx+env(safe-area-inset-bottom))]">
7 + <!-- Navigation Header -->
8 + <NavHeader title="提交结果" />
9 +
10 + <!-- 结果内容 -->
11 + <div class="flex flex-col items-center px-[32rpx] pt-[120rpx]">
12 + <!-- 图标和状态 -->
13 + <div class="flex flex-col items-center mb-[60rpx]">
14 + <!-- 成功图标 -->
15 + <div v-if="isSuccess" class="w-[160rpx] h-[160rpx] rounded-full bg-green-100 flex items-center justify-center mb-[32rpx]">
16 + <div class="w-[100rpx] h-[100rpx] rounded-full bg-green-500 flex items-center justify-center">
17 + <text class="text-white text-[60rpx] font-bold">✓</text>
18 + </div>
19 + </div>
20 +
21 + <!-- 失败图标 -->
22 + <div v-else class="w-[160rpx] h-[160rpx] rounded-full bg-red-100 flex items-center justify-center mb-[32rpx]">
23 + <div class="w-[100rpx] h-[100rpx] rounded-full bg-red-500 flex items-center justify-center">
24 + <text class="text-white text-[60rpx] font-bold">✕</text>
25 + </div>
26 + </div>
27 +
28 + <!-- 状态文案 -->
29 + <text class="text-[#1F2937] text-[40rpx] font-bold">
30 + {{ isSuccess ? '提交成功' : '提交失败' }}
31 + </text>
32 + </div>
33 +
34 + <!-- 提示语 -->
35 + <div class="w-full bg-white rounded-[24rpx] p-[40rpx] shadow-sm text-center">
36 + <text class="text-[#6B7280] text-[28rpx] leading-[1.6] whitespace-pre-wrap">
37 + {{ message }}
38 + </text>
39 + </div>
40 + </div>
41 +
42 + <!-- 返回首页按钮 - 固定在底部 -->
43 + <div class="fixed bottom-0 left-0 right-0 bg-white px-[32rpx] py-[24rpx] pb-[calc(24rpx+env(safe-area-inset-bottom))]">
44 + <nut-button
45 + type="primary"
46 + block
47 + class="!h-[88rpx]"
48 + @click="goHome"
49 + >
50 + 返回首页
51 + </nut-button>
52 + </div>
53 + </div>
54 +</template>
55 +
56 +<script setup>
57 +import { ref, computed } from 'vue'
58 +import { useLoad } from '@tarojs/taro'
59 +import NavHeader from '@/components/NavHeader.vue'
60 +import { useGo } from '@/hooks/useGo'
61 +
62 +const go = useGo()
63 +
64 +// 接收页面参数
65 +const success = ref(true)
66 +const errorMessage = ref('')
67 +
68 +// 是否成功
69 +const isSuccess = computed(() => success.value)
70 +
71 +// 提示信息
72 +const message = computed(() => {
73 + if (isSuccess.value) {
74 + return '您的计划书申请已成功提交,\n为您制定专属保险方案正在规划中,\n请耐心等待!'
75 + } else {
76 + return errorMessage.value || '提交失败,请稍后重试'
77 + }
78 +})
79 +
80 +useLoad((options) => {
81 + console.log('页面参数:', options)
82 +
83 + // 从路由参数中获取成功/失败状态
84 + if (options.success !== undefined) {
85 + success.value = options.success === 'true'
86 + }
87 +
88 + // 失败时获取错误信息
89 + if (!success.value && options.message) {
90 + errorMessage.value = decodeURIComponent(options.message)
91 + }
92 +})
93 +
94 +// 返回首页
95 +const goHome = () => {
96 + go('/pages/index/index')
97 +}
98 +</script>
99 +
100 +<style lang="less" scoped>
101 +/* NutUI 按钮样式覆盖 */
102 +:deep(.nut-button) {
103 + border-radius: 9999rpx;
104 + font-size: 32rpx;
105 + font-weight: 500;
106 +}
107 +</style>