form的申请12中步骤详情页面

packages/cpt_form/lib/modules/apply/attachment_page.dart

@@ -1,10 +1,19 @@
 
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:plugin_platform/engine/image/image_nine_grid.dart';
 import 'package:router/ext/auto_router_extensions.dart';
+import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
+import 'package:widgets/my_button.dart';
+import 'package:widgets/my_text_view.dart';
 
 import '../../router/page/form_page_router.dart';
+import 'vm/apply_view_model.dart';
 
 @RoutePage()
 class AttachmentPage extends HookConsumerWidget {
@@ -22,11 +31,90 @@ class AttachmentPage extends HookConsumerWidget {
   @override
   Widget build(BuildContext context, WidgetRef ref) {
 
-    return Scaffold(
-      appBar: AppBar(title: Text("NoteManagementPage")),
-      body: Center(
-        child: Text("NoteManagementPage"),
-      ),
-    );
+    final viewModel = ref.watch(applyViewModelProvider.notifier);
+    final state = ref.watch(applyViewModelProvider);
+
+    useEffect(() {
+      //赋值State的值
+      Future.microtask(() {});
+      return () {
+        // 组件卸载时执行
+      };
+    }, []);
+
+    return WillPopScope(
+        child: Scaffold(
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
+            body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    margin: const EdgeInsets.symmetric(horizontal: 15),
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        MyTextView(
+                          S.current.attachments,
+                          fontSize: 17,
+                          marginTop: 30,
+                          marginBottom: 13,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //Note to Management 的文本
+                        MyTextView(
+                          state.applyDetail?['detail_data']['attachment_txt'],
+                          fontSize: 15,
+                          marginBottom: 14,
+                          isFontRegular: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //选择图片九宫格
+                        ImageNineGrid(
+                          isSelectEnable: state.enableEdit,
+                          maxImages: 10,
+                          spacing: 10,
+                          aspectRatio: 108 / 80,
+                          initialImages: const [
+                            "https://img1.baidu.com/it/u=2931243091,718249849&fm=253&fmt=auto&app=120&f=JPEG?w=569&h=427",
+                            "https://inews.gtimg.com/om_bt/OVx3YS2XJc1zbndGTkjPKW9J0W7kN8M0SIidT-3K4mb2YAA/641",
+                            "https://inews.gtimg.com/om_bt/OAVMydtx9BsJxf5i_thi4Oll9sR1px-Esmtv6UHSxoisEAA/641"
+                          ],
+                          onImagesChanged: (list) {
+
+                          },
+                        ),
+                      ],
+                    ),
+                  ),
+                ).expanded(),
+
+                //底部按钮
+                MyButton(
+                  onPressed: viewModel.gotoNextPage,
+                  text: S.current.next,
+                  textColor: Colors.white,
+                  backgroundColor: context.appColors.btnBgDefault,
+                  fontWeight: FontWeight.w500,
+                  type: ClickType.throttle,
+                  fontSize: 16,
+                  minHeight: 50,
+                  radius: 0,
+                ),
+              ],
+            )),
+        onWillPop: () async {
+          viewModel.handlePopAction();
+          return true;
+        });
   }
+
 }

packages/cpt_form/lib/modules/apply/form_payment_page.dart

@@ -1,15 +1,22 @@
-
 import 'package:cpt_form/modules/form/apply/form_apply_screen.dart';
+import 'package:cs_resources/generated/assets.dart';
 import 'package:cs_resources/generated/l10n.dart';
 import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:router/componentRouter/component_service_manager.dart';
 import 'package:router/ext/auto_router_extensions.dart';
 import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
 import 'package:widgets/my_button.dart';
+import 'package:widgets/my_load_image.dart';
+import 'package:widgets/my_text_view.dart';
+import 'package:widgets/widget_export.dart';
 import '../../router/page/form_page_router.dart';
 import 'vm/apply_view_model.dart';
+
 @RoutePage()
 class FormPaymentPage extends HookConsumerWidget {
   const FormPaymentPage({Key? key}) : super(key: key);
@@ -28,17 +35,249 @@ class FormPaymentPage extends HookConsumerWidget {
     final viewModel = ref.watch(applyViewModelProvider.notifier);
     final state = ref.watch(applyViewModelProvider);
 
+    //签名版配置
+    HandSignatureControl handSignatureControl = HandSignatureControl(
+      threshold: 3.0,
+      smoothRatio: 190 / 345,
+      velocityRange: 2.0,
+    );
+
+    useEffect(() {
+      //赋值State的值
+      Future.microtask(() {});
+
+      return () {
+        // 释放控制器资源
+      };
+    }, []);
+
     return WillPopScope(
         child: Scaffold(
-            appBar: AppBar(title: Text("FormPaymentPage")),
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
             body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
               children: [
-                Text("FormPaymentPage").expanded(),
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        //支付
+                        Row(
+                          children: [
+                            const MyAssetImage(Assets.paymentInfoDetails, width: 27, height: 27),
+                            MyTextView(
+                              S.current.payment,
+                              textColor: context.appColors.textBlack,
+                              fontSize: 17,
+                              marginLeft: 14,
+                              isFontMedium: true,
+                            ).expanded(),
+                          ],
+                        ).marginOnly(top: 15, left: 15, right: 15),
+
+                        //金额
+                        Row(
+                          mainAxisSize: MainAxisSize.max,
+                          children: [
+                            MyTextView(
+                              S.current.fee,
+                              textColor: context.appColors.textBlack,
+                              fontSize: 18,
+                              isFontRegular: true,
+                            ),
+                            const Spacer(),
+                            MyTextView(
+                              "SGD",
+                              textColor: context.appColors.textBlack,
+                              fontSize: 18,
+                              isFontRegular: true,
+                            ),
+                            MyTextView(
+                              "\$21.80",
+                              textColor: context.appColors.textPrimary,
+                              fontSize: 22,
+                              marginLeft: 8,
+                              isFontMedium: true,
+                            ),
+                          ],
+                        ).marginOnly(top: 20, left: 15, right: 15, bottom: 20),
+
+                        //分割线
+                        Divider(
+                          color: context.appColors.dividerDefault,
+                          height: 0.5,
+                        ),
+
+                        //押金
+                        Row(
+                          children: [
+                            const MyAssetImage(Assets.paymentInfoDetails, width: 27, height: 27),
+                            MyTextView(
+                              S.current.deposit,
+                              textColor: context.appColors.textBlack,
+                              fontSize: 17,
+                              marginLeft: 14,
+                              isFontMedium: true,
+                            ).expanded(),
+                          ],
+                        ).marginOnly(top: 15, left: 15, right: 15),
+
+                        //押金金额
+                        Row(
+                          children: [
+                            MyTextView(
+                              S.current.deposit_hold,
+                              textColor: context.appColors.textBlack,
+                              fontSize: 18,
+                              isFontRegular: true,
+                            ),
+                            const Spacer(),
+                            MyTextView(
+                              "SGD",
+                              textColor: context.appColors.textBlack,
+                              fontSize: 18,
+                              isFontRegular: true,
+                            ),
+                            MyTextView(
+                              "\$1000.00",
+                              textColor: context.appColors.textPrimary,
+                              fontSize: 22,
+                              marginLeft: 8,
+                              isFontMedium: true,
+                            ),
+                          ],
+                        ).marginOnly(top: 20, left: 15, right: 15, bottom: 20),
+
+                        //分割线
+                        Divider(
+                          color: context.appColors.dividerDefault,
+                          height: 0.5,
+                        ),
+
+                        //银行卡
+                        Row(
+                          children: [
+                            const MyAssetImage(Assets.paymentCardIcon, width: 27, height: 27),
+                            MyTextView(
+                              S.current.card,
+                              textColor: context.appColors.textBlack,
+                              fontSize: 17,
+                              marginLeft: 14,
+                              isFontMedium: true,
+                            ).expanded(),
+                          ],
+                        ).marginOnly(top: 14, left: 15, right: 15, bottom: 14),
+
+                        //选择支付卡
+                        _paymentInfo(context, ref),
+
+                        //签名
+                        MyTextView(
+                          S.current.signature,
+                          fontSize: 17,
+                          marginTop: 24,
+                          marginLeft: 15,
+                          marginRight: 15,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //签名的说明文本
+                        MyTextView(
+                          state.applyDetail?['detail_data']['signature_txt'],
+                          fontSize: 15,
+                          marginTop: 18,
+                          marginLeft: 15,
+                          marginRight: 15,
+                          marginBottom: 21,
+                          isFontRegular: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //签名框
+                        Center(
+                          child: GestureDetector(  //处理手势冲突，手指在签名版上的时候不滑动父布局
+                              behavior: HitTestBehavior.opaque,
+                              onVerticalDragUpdate: (_) {},
+                              child: Stack(
+                                children: [
+                                  //签名
+                                  Center(
+                                    child: Container(
+                                      width: 345,
+                                      height: 190,
+                                      color: context.appColors.imgGrayBg,
+                                      child: HandSignature(
+                                        control: handSignatureControl,
+                                        color: context.appColors.textBlack,
+                                        width: 1.0,
+                                        maxWidth: 3.5,
+                                        type: SignatureDrawType.shape,
+                                      ),
+                                    ),
+                                  ),
+
+                                  //清除签名
+                                  Align(
+                                    alignment: Alignment.bottomRight,
+                                    child: MyTextView(
+                                      S.current.clean,
+                                      fontSize: 12,
+                                      textColor: Colors.white,
+                                      cornerRadius: 10.37,
+                                      backgroundColor: context.appColors.btnBgDefault,
+                                      paddingTop: 4,
+                                      paddingBottom: 4,
+                                      paddingLeft: 11,
+                                      paddingRight: 11,
+                                      margin: 10,
+                                      onClick: () {
+                                        handSignatureControl.clear();
+                                      },
+                                    ),
+                                  ),
+                                ],
+                              )).constrained(
+                            width: 345,
+                            height: 190,
+                          ),
+                        ),
+
+                        //同意协议富文本
+                        RichText(
+                          text: TextSpan(
+                            style: TextStyle(fontSize: 15, fontWeight: FontWeight.w400, color: context.appColors.textBlack),
+                            children: <TextSpan>[
+                              TextSpan(
+                                text: S.current.signed_and_agreed_by,
+                              ),
+                              TextSpan(
+                                text: " Wu Bing Bing ",
+                                style: TextStyle(color: context.appColors.textPrimary),
+                              ),
+                              TextSpan(
+                                text: " 21 Nov 2024, 03:08 PM",
+                              ),
+                            ],
+                          ),
+                        ).marginOnly(top: 21, bottom: 21, left: 15, right: 15),
+                      ],
+                    ),
+                  ),
+                ).expanded(),
 
                 //底部按钮
                 MyButton(
-                  onPressed: viewModel.gotoNextPage,
-                  text: S.current.submit,
+                  onPressed: () {
+                    viewModel.gotoNextPage();
+                  },
+                  text: S.current.next,
                   textColor: Colors.white,
                   backgroundColor: context.appColors.btnBgDefault,
                   fontWeight: FontWeight.w500,
@@ -49,9 +288,48 @@ class FormPaymentPage extends HookConsumerWidget {
                 ),
               ],
             )),
-        onWillPop: () async{
+        onWillPop: () async {
           viewModel.handlePopAction();
           return true;
         });
   }
+
+  Widget _paymentInfo(BuildContext context, WidgetRef ref) {
+    return Container(
+        height: 75,
+        padding: const EdgeInsets.symmetric(horizontal: 20),
+        color: context.appColors.backgroundDark,
+        child: Row(
+          children: [
+            const MyAssetImage(
+              Assets.paymentMasterCardIcon,
+              height: 34,
+              width: 56,
+            ),
+            MyTextView(
+              "Ending 9423",
+              marginLeft: 15,
+              marginRight: 15,
+              textColor: context.appColors.textBlack,
+              fontSize: 15,
+              isFontMedium: true,
+            ).expanded(),
+            MyTextView(
+              S.current.change,
+              textColor: Colors.white,
+              backgroundColor: context.appColors.btnBgDefault,
+              paddingRight: 16,
+              paddingLeft: 16,
+              paddingTop: 8,
+              onClick: () {
+                ComponentServiceManager().paymentService.startChooseCardPage();
+              },
+              paddingBottom: 8,
+              cornerRadius: 7,
+              fontSize: 15,
+              isFontMedium: true,
+            )
+          ],
+        ));
+  }
 }

packages/cpt_form/lib/modules/apply/form_terms_page.dart

@@ -8,6 +8,7 @@ import 'package:plugin_basic/widget/webview_page.dart';
 import 'package:router/ext/auto_router_extensions.dart';
 import '../../router/page/form_page_router.dart';
 
+//协议页面，也是详情页面的第一个页面入口，内部可以请求详情数据和选项数据
 @RoutePage()
 class FormTermsPage extends HookConsumerWidget {
   final String type;

packages/cpt_form/lib/modules/apply/guest_vehicle_page.dart

@@ -1,9 +1,22 @@
-
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:plugin_platform/engine/toast/toast_engine.dart';
 import 'package:router/ext/auto_router_extensions.dart';
+import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
+import 'package:widgets/my_button.dart';
+import 'package:widgets/my_text_field.dart';
+import 'package:widgets/my_text_view.dart';
+import 'package:widgets/shatter/form_require_text.dart';
+import 'package:widgets/shatter/picker_container.dart';
+import 'package:widgets/widget_export.dart';
 import '../../router/page/form_page_router.dart';
+import 'vm/apply_view_model.dart';
+
 @RoutePage()
 class GuestVehiclePage extends HookConsumerWidget {
   const GuestVehiclePage({Key? key}) : super(key: key);
@@ -19,11 +32,237 @@ class GuestVehiclePage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final viewModel = ref.watch(applyViewModelProvider.notifier);
+    final state = ref.watch(applyViewModelProvider);
+
+    // 使用 useState 来持久化 TextEditingController 和 FocusNode
+    final TextEditingController vehicleNumController = useTextEditingController();
+    final TextEditingController vehicleInfoController = useTextEditingController();
+    final TextEditingController guestNameController = useTextEditingController();
+    final TextEditingController guestPhoneController = useTextEditingController();
+    final FocusNode vehicleNumFocusNode = useFocusNode();
+    final FocusNode vehicleInfoFocusNode = useFocusNode();
+    final FocusNode guestNameFocusNode = useFocusNode();
+    final FocusNode guestPhoneFocusNode = useFocusNode();
+
+    useEffect(() {
+      //赋值State的值
+      Future.microtask(() {});
+
+      return () {
+        // 释放控制器资源
+        vehicleNumController.dispose();
+        vehicleInfoController.dispose();
+        guestNameController.dispose();
+        guestPhoneController.dispose();
+        vehicleNumFocusNode.dispose();
+        vehicleInfoFocusNode.dispose();
+        guestNameFocusNode.dispose();
+        guestPhoneFocusNode.dispose();
+      };
+    }, []);
+
+    return WillPopScope(
+        child: Scaffold(
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
+            body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        //下拉选 - 访问时间
+                        MyTextView(
+                          S.current.date_of_entry,
+                          fontSize: 17,
+                          marginTop: 30,
+                          marginLeft: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        PickerContainer(
+                          hint: S.current.choose_date,
+                          onClick: () {
+                            viewModel.pickDate(null, (date) {
+                              ToastEngine.show("选择的日期：$date");
+                            });
+                          },
+                        ).marginOnly(left: 15, right: 15),
+
+                        //输入框 - 车牌号
+                        FormRequireText(
+                          text: S.current.vehicle_number,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14, bottom: 16, left: 15, right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "vehicle_num",
+                          textInputType: TextInputType.text,
+                          textInputAction: TextInputAction.next,
+                          controller: vehicleNumController,
+                          focusNode: vehicleNumFocusNode,
+                          onSubmit: (formKey, value) {
+                            vehicleNumFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(vehicleInfoFocusNode);
+                          },
+                        ),
+
+                        //输入框 - 车辆信息
+                        FormRequireText(
+                          text: S.current.vehicle_make_model_colour,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14, bottom: 16, left: 15, right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "vehicle_info",
+                          textInputType: TextInputType.text,
+                          textInputAction: TextInputAction.next,
+                          controller: vehicleInfoController,
+                          focusNode: vehicleInfoFocusNode,
+                          onSubmit: (formKey, value) {
+                            vehicleInfoFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(guestNameFocusNode);
+                          },
+                        ),
+
+                        //输入框 - 访客姓名
+                        FormRequireText(
+                          text: S.current.guest_name,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14, bottom: 16, left: 15, right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "guest_name",
+                          textInputType: TextInputType.text,
+                          textInputAction: TextInputAction.next,
+                          controller: guestNameController,
+                          focusNode: guestNameFocusNode,
+                          onSubmit: (formKey, value) {
+                            guestNameFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(guestPhoneFocusNode);
+                          },
+                        ),
+
+                        //输入框 - 访客电话
+                        FormRequireText(
+                          text: S.current.guest_mobile_number,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14, bottom: 16, left: 15, right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "guest_phone",
+                          textInputType: TextInputType.phone,
+                          textInputAction: TextInputAction.done,
+                          controller: guestPhoneController,
+                          focusNode: guestPhoneFocusNode,
+                          onSubmit: (formKey, value) {
+                            guestPhoneFocusNode.unfocus();
+                          },
+                        ),
+
+                      ],
+                    ),
+                  ),
+                ).expanded(),
+
+                //底部按钮
+                MyButton(
+                  onPressed: () {
+                    vehicleNumFocusNode.unfocus();
+                    vehicleInfoFocusNode.unfocus();
+                    guestNameFocusNode.unfocus();
+                    guestPhoneFocusNode.unfocus();
+
+                    viewModel.gotoNextPage();
+                  },
+                  text: S.current.next,
+                  textColor: Colors.white,
+                  backgroundColor: context.appColors.btnBgDefault,
+                  fontWeight: FontWeight.w500,
+                  type: ClickType.throttle,
+                  fontSize: 16,
+                  minHeight: 50,
+                  radius: 0,
+                ),
+              ],
+            )),
+        onWillPop: () async {
+          viewModel.handlePopAction();
+          return true;
+        });
+  }
 
-    return Scaffold(
-      appBar: AppBar(title: Text("GuestVehiclePage")),
-      body: Center(
-        child: Text("GuestVehiclePage"),
+  Widget _buildInputLayout(
+    BuildContext context,
+    String key, {
+    double marginTop = 0,
+    bool? showRightIcon = false, //是否展示右侧的布局
+    Widget? rightWidget, //右侧的布局
+    TextInputType textInputType = TextInputType.text,
+    String? errorText,
+    bool obscureText = false,
+    required TextEditingController controller,
+    required FocusNode focusNode,
+    bool enable = true,
+    TextInputAction textInputAction = TextInputAction.done,
+    Function? onSubmit,
+  }) {
+    return IgnoreKeyboardDismiss(
+      child: MyTextField(
+        key,
+        fillBackgroundColor: context.appColors.authFiledBG,
+        "",
+        hintStyle: TextStyle(
+          color: context.appColors.authFiledHint,
+          fontSize: 16.0,
+          fontWeight: FontWeight.w500,
+        ),
+        controller: controller,
+        focusNode: focusNode,
+        margin: EdgeInsets.only(top: marginTop, left: 15, right: 15),
+        padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 3),
+        showDivider: false,
+        height: 44,
+        enabled: enable,
+        style: TextStyle(
+          color: context.appColors.authFiledText,
+          fontSize: 16.0,
+          fontWeight: FontWeight.w500,
+        ),
+        inputType: textInputType,
+        textInputAction: textInputAction,
+        onSubmit: onSubmit,
+        cursorColor: context.appColors.authFiledText,
+        obscureText: obscureText,
+        errorText: errorText,
+        showLeftIcon: true,
+        showRightIcon: showRightIcon,
+        rightWidget: rightWidget,
       ),
     );
   }

packages/cpt_form/lib/modules/apply/large_text_box_page.dart

@@ -1,9 +1,18 @@
 
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:router/ext/auto_router_extensions.dart';
+import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
+import 'package:widgets/my_button.dart';
+import 'package:widgets/my_text_view.dart';
+import 'package:widgets/widget_export.dart';
 import '../../router/page/form_page_router.dart';
+import 'vm/apply_view_model.dart';
 @RoutePage()
 class LargeTextBoxPage extends HookConsumerWidget {
   const LargeTextBoxPage({Key? key}) : super(key: key);
@@ -19,12 +28,122 @@ class LargeTextBoxPage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final viewModel = ref.watch(applyViewModelProvider.notifier);
+    final state = ref.watch(applyViewModelProvider);
 
-    return Scaffold(
-      appBar: AppBar(title: Text("LargeTextBoxPage")),
-      body: Center(
-        child: Text("LargeTextBoxPage"),
-      ),
-    );
+    // 使用 useState 来持久化 TextEditingController 和 FocusNode
+    final textEditingController = useTextEditingController();
+    final focusNode = useFocusNode();
+
+    useEffect(() {
+      //赋值State的值
+      Future.microtask(() {});
+
+      return () {
+        // 释放控制器资源
+        textEditingController.dispose();
+        focusNode.dispose();
+      };
+    }, []);
+
+
+    return WillPopScope(
+        child: Scaffold(
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
+            body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    margin: const EdgeInsets.symmetric(horizontal: 15),
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        MyTextView(
+                          state.applyDetail?['detail_data']['large_txt'],
+                          fontSize: 17,
+                          marginTop: 30,
+                          marginBottom: 17,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //文本框
+                        IgnoreKeyboardDismiss(
+                          child: Container(
+                            height: 355,
+                            padding: const EdgeInsets.symmetric(vertical: 15, horizontal: 15),
+                            decoration: BoxDecoration(
+                              color: context.appColors.authFiledBG,
+                              borderRadius: const BorderRadius.all(Radius.circular(5)),
+                            ),
+                            child: TextField(
+                              cursorColor: context.appColors.authFiledText,
+                              cursorWidth: 1.5,
+                              autofocus: false,
+                              enabled: true,
+                              focusNode: focusNode,
+                              controller: textEditingController,
+                              decoration: InputDecoration(
+                                isDense: true,
+                                isCollapsed: true,
+                                border: InputBorder.none,
+                                hintText: S.current.type_here,
+                                hintStyle: TextStyle(
+                                  color: context.appColors.authFiledHint,
+                                  fontSize: 15.0,
+                                  fontWeight: FontWeight.w500,
+                                ),
+                              ),
+                              style: TextStyle(
+                                color: context.appColors.authFiledText,
+                                fontSize: 15.0,
+                                fontWeight: FontWeight.w500,
+                              ),
+                              textInputAction: TextInputAction.done,
+                              onSubmitted: (value) {
+                                FocusScope.of(context).unfocus();
+                              },
+                              maxLines: null,
+                              expands: true,
+                              onChanged: (text) {
+                                // 当文本改变时
+
+                              },
+                            ),
+                          ),
+                        ),
+                      ],
+                    ),
+                  ),
+                ).expanded(),
+
+                //底部按钮
+                MyButton(
+                  onPressed: (){
+                    focusNode.unfocus();
+
+                    viewModel.gotoNextPage();
+                  },
+                  text: S.current.next,
+                  textColor: Colors.white,
+                  backgroundColor: context.appColors.btnBgDefault,
+                  fontWeight: FontWeight.w500,
+                  type: ClickType.throttle,
+                  fontSize: 16,
+                  minHeight: 50,
+                  radius: 0,
+                ),
+              ],
+            )),
+        onWillPop: () async {
+          viewModel.handlePopAction();
+          return true;
+        });
   }
-}
+}

packages/cpt_form/lib/modules/apply/moving_company_page.dart

@@ -1,9 +1,20 @@
-
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:router/ext/auto_router_extensions.dart';
+import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
+import 'package:widgets/my_button.dart';
+import 'package:widgets/my_text_field.dart';
+import 'package:widgets/my_text_view.dart';
+import 'package:widgets/shatter/form_require_text.dart';
+import 'package:widgets/widget_export.dart';
 import '../../router/page/form_page_router.dart';
+import 'vm/apply_view_model.dart';
+
 @RoutePage()
 class MovingCompanyPage extends HookConsumerWidget {
   const MovingCompanyPage({Key? key}) : super(key: key);
@@ -19,11 +30,254 @@ class MovingCompanyPage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final viewModel = ref.watch(applyViewModelProvider.notifier);
+    final state = ref.watch(applyViewModelProvider);
+
+    // 使用 useState 来持久化 TextEditingController 和 FocusNode
+    final companyController = useTextEditingController();
+    final contactController = useTextEditingController();
+    final phoneController = useTextEditingController();
+    final addressController = useTextEditingController();
+
+    final companyFocusNode = useFocusNode();
+    final contactFocusNode = useFocusNode();
+    final phoneFocusNode = useFocusNode();
+    final addressFocusNode = useFocusNode();
+
+    useEffect(() {
+
+      //赋值State的值
+      Future.microtask(() {});
+
+      return () {
+        // 释放控制器资源
+        companyController.dispose();
+        contactController.dispose();
+        phoneController.dispose();
+        addressController.dispose();
+        companyFocusNode.dispose();
+        contactFocusNode.dispose();
+        phoneFocusNode.dispose();
+        addressFocusNode.dispose();
+      };
+    }, []);
+
+    return WillPopScope(
+        child: Scaffold(
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
+            body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        //输入框 - 搬家公司
+                        FormRequireText(
+                          text: S.current.moving_company,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14, bottom: 16, left: 15, right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "company",
+                          textInputType: TextInputType.text,
+                          textInputAction: TextInputAction.next,
+                          controller: companyController,
+                          focusNode: companyFocusNode,
+                          onSubmit: (formKey, value) {
+                            companyFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(contactFocusNode);
+                          },
+                        ),
+
+                        //输入框 - 联系人
+                        FormRequireText(
+                          text: S.current.person_in_charge,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14, bottom: 16, left: 15, right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "contact",
+                          textInputType: TextInputType.text,
+                          textInputAction: TextInputAction.next,
+                          controller: contactController,
+                          focusNode: contactFocusNode,
+                          onSubmit: (formKey, value) {
+                            contactFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(phoneFocusNode);
+                          },
+                        ),
+
+                        //输入框 - 联系电话
+                        FormRequireText(
+                          text: S.current.mobile_phone,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14, bottom: 16, left: 15, right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "phone",
+                          textInputType: TextInputType.phone,
+                          textInputAction: TextInputAction.next,
+                          controller: phoneController,
+                          focusNode: phoneFocusNode,
+                          onSubmit: (formKey, value) {
+                            phoneFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(addressFocusNode);
+                          },
+                        ),
+
+                        //输入框 - 公司地址
+                        MyTextView(
+                          S.current.company_address,
+                          fontSize: 17,
+                          marginTop: 14,
+                          marginBottom: 16,
+                          marginLeft: 15,
+                          marginRight: 15,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //文本框
+                        IgnoreKeyboardDismiss(
+                          child: Container(
+                            height: 160,
+                            margin: const EdgeInsets.symmetric(horizontal: 15),
+                            padding: const EdgeInsets.symmetric(vertical: 15, horizontal: 15),
+                            decoration: BoxDecoration(
+                              color: context.appColors.authFiledBG,
+                              borderRadius: const BorderRadius.all(Radius.circular(5)),
+                            ),
+                            child: TextField(
+                              cursorColor: context.appColors.authFiledText,
+                              cursorWidth: 1.5,
+                              autofocus: false,
+                              enabled: true,
+                              focusNode: addressFocusNode,
+                              controller: addressController,
+                              decoration: InputDecoration(
+                                isDense: true,
+                                isCollapsed: true,
+                                border: InputBorder.none,
+                                hintStyle: TextStyle(
+                                  color: context.appColors.authFiledHint,
+                                  fontSize: 16.0,
+                                  fontWeight: FontWeight.w500,
+                                ),
+                              ),
+                              style: TextStyle(
+                                color: context.appColors.authFiledText,
+                                fontSize: 16.0,
+                                fontWeight: FontWeight.w500,
+                              ),
+                              textInputAction: TextInputAction.done,
+                              onSubmitted: (value) {
+                                FocusScope.of(context).unfocus();
+                              },
+                              maxLines: null,
+                              expands: true,
+                              onChanged: (text) {
+                                // 当文本改变时
+                              },
+                            ),
+                          ),
+                        ),
+                      ],
+                    ),
+                  ),
+                ).expanded(),
+
+                //底部按钮
+                MyButton(
+                  onPressed: (){
+                    companyFocusNode.unfocus();
+                    contactFocusNode.unfocus();
+                    phoneFocusNode.unfocus();
+                    addressFocusNode.unfocus();
+
+                    viewModel.gotoNextPage();
+                  },
+                  text: S.current.next,
+                  textColor: Colors.white,
+                  backgroundColor: context.appColors.btnBgDefault,
+                  fontWeight: FontWeight.w500,
+                  type: ClickType.throttle,
+                  fontSize: 16,
+                  minHeight: 50,
+                  radius: 0,
+                ),
+              ],
+            )),
+        onWillPop: () async {
+          viewModel.handlePopAction();
+          return true;
+        });
+  }
 
-    return Scaffold(
-      appBar: AppBar(title: Text("MovingCompanyPage")),
-      body: Center(
-        child: Text("MovingCompanyPage"),
+  Widget _buildInputLayout(
+    BuildContext context,
+    String key, {
+    double marginTop = 0,
+    bool? showRightIcon = false, //是否展示右侧的布局
+    Widget? rightWidget, //右侧的布局
+    TextInputType textInputType = TextInputType.text,
+    String? errorText,
+    bool obscureText = false,
+    required TextEditingController controller,
+    required FocusNode focusNode,
+    bool enable = true,
+    TextInputAction textInputAction = TextInputAction.done,
+    Function? onSubmit,
+  }) {
+    return IgnoreKeyboardDismiss(
+      child: MyTextField(
+        key,
+        fillBackgroundColor: context.appColors.authFiledBG,
+        "",
+        hintStyle: TextStyle(
+          color: context.appColors.authFiledHint,
+          fontSize: 16.0,
+          fontWeight: FontWeight.w500,
+        ),
+        controller: controller,
+        focusNode: focusNode,
+        margin: EdgeInsets.only(top: marginTop, left: 15, right: 15),
+        padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 3),
+        showDivider: false,
+        height: 44,
+        enabled: enable,
+        style: TextStyle(
+          color: context.appColors.authFiledText,
+          fontSize: 16.0,
+          fontWeight: FontWeight.w500,
+        ),
+        inputType: textInputType,
+        textInputAction: textInputAction,
+        onSubmit: onSubmit,
+        cursorColor: context.appColors.authFiledText,
+        obscureText: obscureText,
+        errorText: errorText,
+        showLeftIcon: true,
+        showRightIcon: showRightIcon,
+        rightWidget: rightWidget,
       ),
     );
   }

packages/cpt_form/lib/modules/apply/moving_date_page.dart

@@ -1,9 +1,19 @@
 
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:plugin_platform/engine/toast/toast_engine.dart';
 import 'package:router/ext/auto_router_extensions.dart';
+import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
+import 'package:widgets/my_button.dart';
+import 'package:widgets/my_text_view.dart';
+import 'package:widgets/shatter/picker_container.dart';
 import '../../router/page/form_page_router.dart';
+import 'vm/apply_view_model.dart';
 @RoutePage()
 class MovingDatePage extends HookConsumerWidget {
   const MovingDatePage({Key? key}) : super(key: key);
@@ -19,12 +29,117 @@ class MovingDatePage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final viewModel = ref.watch(applyViewModelProvider.notifier);
+    final state = ref.watch(applyViewModelProvider);
 
-    return Scaffold(
-      appBar: AppBar(title: Text("MovingDatePage")),
-      body: Center(
-        child: Text("MovingDatePage"),
-      ),
-    );
+    useEffect(() {
+      //赋值State的值
+      Future.microtask(() {});
+
+      return () {
+        // 组件卸载时执行
+      };
+    }, []);
+
+    return WillPopScope(
+        child: Scaffold(
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
+            body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+
+                        //下拉选 - 开始时间
+                        MyTextView(
+                          S.current.start_date_caps,
+                          fontSize: 17,
+                          marginTop: 30,
+                          marginLeft: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        PickerContainer(
+                          hint: S.current.choose_date,
+                          onClick: (){
+                            viewModel.pickDate(null,(date){
+                              ToastEngine.show("选择的日期：$date");
+                            });
+                          },
+                        ).marginOnly(left: 15, right: 15),
+
+                        //下拉选 - 结束时间
+                        MyTextView(
+                          S.current.end_date_caps,
+                          fontSize: 17,
+                          marginTop: 14,
+                          marginLeft: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        PickerContainer(
+                          hint: S.current.choose_date,
+                          onClick: (){
+                            viewModel.pickDate(null,(date){
+                              ToastEngine.show("选择的日期：$date");
+                            });
+                          },
+                        ).marginOnly(left: 15, right: 15),
+
+                        //下拉选 - 到达时间
+                        MyTextView(
+                          S.current.time_of_arrival,
+                          fontSize: 17,
+                          marginTop: 14,
+                          marginLeft: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        PickerContainer(
+                          hint: S.current.choose_date,
+                          onClick: (){
+                            viewModel.pickDate(null,(date){
+                              ToastEngine.show("选择的日期：$date");
+                            });
+                          },
+                        ).marginOnly(left: 15, right: 15),
+
+                      ],
+                    ),
+                  ),
+                ).expanded(),
+
+                //底部按钮
+                MyButton(
+                  onPressed: viewModel.gotoNextPage,
+                  text: S.current.next,
+                  textColor: Colors.white,
+                  backgroundColor: context.appColors.btnBgDefault,
+                  fontWeight: FontWeight.w500,
+                  type: ClickType.throttle,
+                  fontSize: 16,
+                  minHeight: 50,
+                  radius: 0,
+                ),
+              ],
+            )),
+        onWillPop: () async {
+          viewModel.handlePopAction();
+          return true;
+        });
   }
 }

packages/cpt_form/lib/modules/apply/note_management_page.dart

@@ -1,14 +1,18 @@
-
 import 'package:cs_resources/generated/l10n.dart';
 import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:router/ext/auto_router_extensions.dart';
 import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
 import 'package:widgets/my_button.dart';
+import 'package:widgets/my_text_view.dart';
+import 'package:widgets/widget_export.dart';
 import '../../router/page/form_page_router.dart';
 import 'vm/apply_view_model.dart';
+
 @RoutePage()
 class NoteManagementPage extends HookConsumerWidget {
   const NoteManagementPage({Key? key}) : super(key: key);
@@ -27,16 +31,114 @@ class NoteManagementPage extends HookConsumerWidget {
     final viewModel = ref.watch(applyViewModelProvider.notifier);
     final state = ref.watch(applyViewModelProvider);
 
+    // 使用 useState 来持久化 TextEditingController 和 FocusNode
+    final textEditingController = useTextEditingController();
+    final focusNode = useFocusNode();
+
+    useEffect(() {
+      //赋值State的值
+      Future.microtask(() {});
+
+      return () {
+        // 释放控制器资源
+        textEditingController.dispose();
+        focusNode.dispose();
+      };
+    }, []);
+
+
     return WillPopScope(
         child: Scaffold(
-            appBar: AppBar(title: Text("NoteManagementPage")),
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
             body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
               children: [
-                Text("NoteManagementPage").expanded(),
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    margin: const EdgeInsets.symmetric(horizontal: 15),
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        MyTextView(
+                          S.current.notes_to_management,
+                          fontSize: 17,
+                          marginTop: 30,
+                          marginBottom: 13,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //Note to Management 的文本
+                        MyTextView(
+                          state.applyDetail?['detail_data']['note_management_txt'],
+                          fontSize: 15,
+                          marginBottom: 18,
+                          isFontRegular: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //文本框
+                        IgnoreKeyboardDismiss(
+                          child: Container(
+                            height: 190,
+                            padding: const EdgeInsets.symmetric(vertical: 15, horizontal: 15),
+                            decoration: BoxDecoration(
+                              color: context.appColors.authFiledBG,
+                              borderRadius: const BorderRadius.all(Radius.circular(5)),
+                            ),
+                            child: TextField(
+                              cursorColor: context.appColors.authFiledText,
+                              cursorWidth: 1.5,
+                              autofocus: false,
+                              enabled: true,
+                              focusNode: focusNode,
+                              controller: textEditingController,
+                              decoration: InputDecoration(
+                                isDense: true,
+                                isCollapsed: true,
+                                border: InputBorder.none,
+                                hintText: S.current.type_here,
+                                hintStyle: TextStyle(
+                                  color: context.appColors.authFiledHint,
+                                  fontSize: 15.0,
+                                  fontWeight: FontWeight.w500,
+                                ),
+                              ),
+                              style: TextStyle(
+                                color: context.appColors.authFiledText,
+                                fontSize: 15.0,
+                                fontWeight: FontWeight.w500,
+                              ),
+                              textInputAction: TextInputAction.done,
+                              onSubmitted: (value) {
+                                FocusScope.of(context).unfocus();
+                              },
+                              maxLines: null,
+                              expands: true,
+                              onChanged: (text) {
+                                // 当文本改变时
+
+                              },
+                            ),
+                          ),
+                        ),
+                      ],
+                    ),
+                  ),
+                ).expanded(),
 
                 //底部按钮
                 MyButton(
-                  onPressed: viewModel.gotoNextPage,
+                  onPressed: (){
+                    focusNode.unfocus();
+
+                    viewModel.gotoNextPage();
+                  },
                   text: S.current.next,
                   textColor: Colors.white,
                   backgroundColor: context.appColors.btnBgDefault,
@@ -48,7 +150,7 @@ class NoteManagementPage extends HookConsumerWidget {
                 ),
               ],
             )),
-        onWillPop: () async{
+        onWillPop: () async {
           viewModel.handlePopAction();
           return true;
         });

packages/cpt_form/lib/modules/apply/renovation_company_page.dart

@@ -1,9 +1,20 @@
-
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:router/ext/auto_router_extensions.dart';
+import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
+import 'package:widgets/my_button.dart';
+import 'package:widgets/my_text_field.dart';
+import 'package:widgets/my_text_view.dart';
+import 'package:widgets/shatter/form_require_text.dart';
+import 'package:widgets/widget_export.dart';
 import '../../router/page/form_page_router.dart';
+import 'vm/apply_view_model.dart';
+
 @RoutePage()
 class RenovationCompanyPage extends HookConsumerWidget {
   const RenovationCompanyPage({Key? key}) : super(key: key);
@@ -19,11 +30,253 @@ class RenovationCompanyPage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final viewModel = ref.watch(applyViewModelProvider.notifier);
+    final state = ref.watch(applyViewModelProvider);
+
+    // 使用 useState 来持久化 TextEditingController 和 FocusNode
+    final companyController = useTextEditingController();
+    final contactController = useTextEditingController();
+    final phoneController = useTextEditingController();
+    final addressController = useTextEditingController();
+
+    final companyFocusNode = useFocusNode();
+    final contactFocusNode = useFocusNode();
+    final phoneFocusNode = useFocusNode();
+    final addressFocusNode = useFocusNode();
+
+    useEffect(() {
+      //赋值State的值
+      Future.microtask(() {});
+
+      return () {
+        // 释放控制器资源
+        companyController.dispose();
+        contactController.dispose();
+        phoneController.dispose();
+        addressController.dispose();
+        companyFocusNode.dispose();
+        contactFocusNode.dispose();
+        phoneFocusNode.dispose();
+        addressFocusNode.dispose();
+      };
+    }, []);
+
+    return WillPopScope(
+        child: Scaffold(
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
+            body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        //输入框 - 装修公司
+                        FormRequireText(
+                          text: S.current.renovation_company,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14, bottom: 16, left: 15, right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "company",
+                          textInputType: TextInputType.text,
+                          textInputAction: TextInputAction.next,
+                          controller: companyController,
+                          focusNode: companyFocusNode,
+                          onSubmit: (formKey, value) {
+                            companyFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(contactFocusNode);
+                          },
+                        ),
+
+                        //输入框 - 联系人
+                        FormRequireText(
+                          text: S.current.person_in_charge,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14, bottom: 16, left: 15, right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "contact",
+                          textInputType: TextInputType.text,
+                          textInputAction: TextInputAction.next,
+                          controller: contactController,
+                          focusNode: contactFocusNode,
+                          onSubmit: (formKey, value) {
+                            contactFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(phoneFocusNode);
+                          },
+                        ),
+
+                        //输入框 - 联系电话
+                        FormRequireText(
+                          text: S.current.mobile_phone,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14, bottom: 16, left: 15, right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "phone",
+                          textInputType: TextInputType.phone,
+                          textInputAction: TextInputAction.next,
+                          controller: phoneController,
+                          focusNode: phoneFocusNode,
+                          onSubmit: (formKey, value) {
+                            phoneFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(addressFocusNode);
+                          },
+                        ),
+
+                        //输入框 - 公司地址
+                        MyTextView(
+                          S.current.company_address,
+                          fontSize: 17,
+                          marginTop: 14,
+                          marginBottom: 16,
+                          marginLeft: 15,
+                          marginRight: 15,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //文本框
+                        IgnoreKeyboardDismiss(
+                          child: Container(
+                            height: 160,
+                            margin: const EdgeInsets.symmetric(horizontal: 15),
+                            padding: const EdgeInsets.symmetric(vertical: 15, horizontal: 15),
+                            decoration: BoxDecoration(
+                              color: context.appColors.authFiledBG,
+                              borderRadius: const BorderRadius.all(Radius.circular(5)),
+                            ),
+                            child: TextField(
+                              cursorColor: context.appColors.authFiledText,
+                              cursorWidth: 1.5,
+                              autofocus: false,
+                              enabled: true,
+                              focusNode: addressFocusNode,
+                              controller: addressController,
+                              decoration: InputDecoration(
+                                isDense: true,
+                                isCollapsed: true,
+                                border: InputBorder.none,
+                                hintStyle: TextStyle(
+                                  color: context.appColors.authFiledHint,
+                                  fontSize: 16.0,
+                                  fontWeight: FontWeight.w500,
+                                ),
+                              ),
+                              style: TextStyle(
+                                color: context.appColors.authFiledText,
+                                fontSize: 16.0,
+                                fontWeight: FontWeight.w500,
+                              ),
+                              textInputAction: TextInputAction.done,
+                              onSubmitted: (value) {
+                                FocusScope.of(context).unfocus();
+                              },
+                              maxLines: null,
+                              expands: true,
+                              onChanged: (text) {
+                                // 当文本改变时
+                              },
+                            ),
+                          ),
+                        ),
+                      ],
+                    ),
+                  ),
+                ).expanded(),
+
+                //底部按钮
+                MyButton(
+                  onPressed: () {
+                    companyFocusNode.unfocus();
+                    contactFocusNode.unfocus();
+                    phoneFocusNode.unfocus();
+                    addressFocusNode.unfocus();
+
+                    viewModel.gotoNextPage();
+                  },
+                  text: S.current.next,
+                  textColor: Colors.white,
+                  backgroundColor: context.appColors.btnBgDefault,
+                  fontWeight: FontWeight.w500,
+                  type: ClickType.throttle,
+                  fontSize: 16,
+                  minHeight: 50,
+                  radius: 0,
+                ),
+              ],
+            )),
+        onWillPop: () async {
+          viewModel.handlePopAction();
+          return true;
+        });
+  }
 
-    return Scaffold(
-      appBar: AppBar(title: Text("RenovationCompanyPage")),
-      body: Center(
-        child: Text("RenovationCompanyPage"),
+  Widget _buildInputLayout(
+    BuildContext context,
+    String key, {
+    double marginTop = 0,
+    bool? showRightIcon = false, //是否展示右侧的布局
+    Widget? rightWidget, //右侧的布局
+    TextInputType textInputType = TextInputType.text,
+    String? errorText,
+    bool obscureText = false,
+    required TextEditingController controller,
+    required FocusNode focusNode,
+    bool enable = true,
+    TextInputAction textInputAction = TextInputAction.done,
+    Function? onSubmit,
+  }) {
+    return IgnoreKeyboardDismiss(
+      child: MyTextField(
+        key,
+        fillBackgroundColor: context.appColors.authFiledBG,
+        "",
+        hintStyle: TextStyle(
+          color: context.appColors.authFiledHint,
+          fontSize: 16.0,
+          fontWeight: FontWeight.w500,
+        ),
+        controller: controller,
+        focusNode: focusNode,
+        margin: EdgeInsets.only(top: marginTop, left: 15, right: 15),
+        padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 3),
+        showDivider: false,
+        height: 44,
+        enabled: enable,
+        style: TextStyle(
+          color: context.appColors.authFiledText,
+          fontSize: 16.0,
+          fontWeight: FontWeight.w500,
+        ),
+        inputType: textInputType,
+        textInputAction: textInputAction,
+        onSubmit: onSubmit,
+        cursorColor: context.appColors.authFiledText,
+        obscureText: obscureText,
+        errorText: errorText,
+        showLeftIcon: true,
+        showRightIcon: showRightIcon,
+        rightWidget: rightWidget,
       ),
     );
   }

packages/cpt_form/lib/modules/apply/renovation_date_page.dart

@@ -1,9 +1,19 @@
 
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:plugin_platform/engine/toast/toast_engine.dart';
 import 'package:router/ext/auto_router_extensions.dart';
+import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
+import 'package:widgets/my_button.dart';
+import 'package:widgets/my_text_view.dart';
+import 'package:widgets/shatter/picker_container.dart';
 import '../../router/page/form_page_router.dart';
+import 'vm/apply_view_model.dart';
 @RoutePage()
 class RenovationDatePage extends HookConsumerWidget {
   const RenovationDatePage({Key? key}) : super(key: key);
@@ -19,12 +29,137 @@ class RenovationDatePage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final viewModel = ref.watch(applyViewModelProvider.notifier);
+    final state = ref.watch(applyViewModelProvider);
 
-    return Scaffold(
-      appBar: AppBar(title: Text("RenovationDatePage")),
-      body: Center(
-        child: Text("RenovationDatePage"),
-      ),
-    );
+    useEffect(() {
+      //赋值State的值
+      Future.microtask(() {});
+
+      return () {
+        // 组件卸载时执行
+      };
+    }, []);
+
+    return WillPopScope(
+        child: Scaffold(
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
+            body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+
+                        //下拉选 - 开始时间
+                        MyTextView(
+                          S.current.renovation_start_date,
+                          fontSize: 17,
+                          marginTop: 30,
+                          marginLeft: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        PickerContainer(
+                          hint: S.current.choose_date,
+                          onClick: (){
+                            viewModel.pickDate(null,(date){
+                              ToastEngine.show("选择的日期：$date");
+                            });
+                          },
+                        ).marginOnly(left: 15, right: 15),
+
+                        //下拉选 - 结束时间
+                        MyTextView(
+                          S.current.renovation_end_date,
+                          fontSize: 17,
+                          marginTop: 14,
+                          marginLeft: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        PickerContainer(
+                          hint: S.current.choose_date,
+                          onClick: (){
+                            viewModel.pickDate(null,(date){
+                              ToastEngine.show("选择的日期：$date");
+                            });
+                          },
+                        ).marginOnly(left: 15, right: 15),
+
+                        //下拉选 - 施工时间开始时间
+                        MyTextView(
+                          S.current.hacking_start_date,
+                          fontSize: 17,
+                          marginTop: 14,
+                          marginLeft: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        PickerContainer(
+                          hint: S.current.choose_date,
+                          onClick: (){
+                            viewModel.pickDate(null,(date){
+                              ToastEngine.show("选择的日期：$date");
+                            });
+                          },
+                        ).marginOnly(left: 15, right: 15),
+
+                        //下拉选 - 施工时间结束时间
+                        MyTextView(
+                          S.current.hacking_end_date,
+                          fontSize: 17,
+                          marginTop: 14,
+                          marginLeft: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        PickerContainer(
+                          hint: S.current.choose_date,
+                          onClick: (){
+                            viewModel.pickDate(null,(date){
+                              ToastEngine.show("选择的日期：$date");
+                            });
+                          },
+                        ).marginOnly(left: 15, right: 15),
+
+                      ],
+                    ),
+                  ),
+                ).expanded(),
+
+                //底部按钮
+                MyButton(
+                  onPressed: viewModel.gotoNextPage,
+                  text: S.current.next,
+                  textColor: Colors.white,
+                  backgroundColor: context.appColors.btnBgDefault,
+                  fontWeight: FontWeight.w500,
+                  type: ClickType.throttle,
+                  fontSize: 16,
+                  minHeight: 50,
+                  radius: 0,
+                ),
+              ],
+            )),
+        onWillPop: () async {
+          viewModel.handlePopAction();
+          return true;
+        });
   }
 }

packages/cpt_form/lib/modules/apply/signature_page.dart

@@ -1,8 +1,17 @@
 
+import 'package:cpt_form/modules/apply/vm/apply_view_model.dart';
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:router/ext/auto_router_extensions.dart';
+import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
+import 'package:widgets/my_button.dart';
+import 'package:widgets/my_text_view.dart';
+import 'package:widgets/widget_export.dart';
 import '../../router/page/form_page_router.dart';
 
 @RoutePage()
@@ -20,12 +29,145 @@ class SignaturePage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final viewModel = ref.watch(applyViewModelProvider.notifier);
+    final state = ref.watch(applyViewModelProvider);
 
-    return Scaffold(
-      appBar: AppBar(title: Text("SignaturePage")),
-      body: Center(
-        child: Text("SignaturePage"),
-      ),
+    //签名版配置
+    HandSignatureControl handSignatureControl = HandSignatureControl(
+      threshold: 3.0,
+      smoothRatio: 190 / 345,
+      velocityRange: 2.0,
     );
+
+    useEffect(() {
+      //赋值State的值
+      Future.microtask(() {});
+
+      return () {
+        // 组件卸载时执行
+        handSignatureControl.dispose();
+      };
+    }, []);
+
+    return WillPopScope(
+        child: Scaffold(
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
+            body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    margin: const EdgeInsets.symmetric(horizontal: 15),
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        MyTextView(
+                          S.current.signature,
+                          fontSize: 17,
+                          marginTop: 30,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //签名的说明文本
+                        MyTextView(
+                          state.applyDetail?['detail_data']['signature_txt'],
+                          fontSize: 15,
+                          marginTop: 26,
+                          marginBottom: 21,
+                          isFontRegular: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        //签名框
+                        Stack(
+                          children: [
+                            //签名
+                            Center(
+                              child: Container(
+                                width: 345,
+                                height: 190,
+                                color: context.appColors.imgGrayBg,
+                                child: HandSignature(
+                                  control: handSignatureControl,
+                                  color: context.appColors.textBlack,
+                                  width: 1.0,
+                                  maxWidth: 3.5,
+                                  type: SignatureDrawType.shape,
+                                ),
+                              ),
+                            ),
+
+                            //清除签名
+                            Align(
+                              alignment: Alignment.bottomRight,
+                              child: MyTextView(
+                                S.current.clean,
+                                fontSize: 12,
+                                textColor: Colors.white,
+                                cornerRadius: 10.37,
+                                backgroundColor: context.appColors.btnBgDefault,
+                                paddingTop: 4,
+                                paddingBottom: 4,
+                                paddingLeft: 11,
+                                paddingRight: 11,
+                                margin: 10,
+                                onClick: () {
+                                  handSignatureControl.clear();
+                                },
+                              ),
+                            ),
+                          ],
+                        ).constrained(
+                          width: 345,
+                          height: 190,
+                        ),
+
+                        RichText(
+                          text: TextSpan(
+                            style: TextStyle(fontSize: 15, fontWeight:  FontWeight.w400, color: context.appColors.textBlack),
+                            children: <TextSpan>[
+                              TextSpan(
+                                text: S.current.signed_and_agreed_by,
+                              ),
+                              TextSpan(
+                                text: " Wu Bing Bing ",
+                                style: TextStyle(color: context.appColors.textPrimary),
+                              ),
+                              TextSpan(
+                                text: " 21 Nov 2024, 03:08 PM",
+                              ),
+                            ],
+                          ),
+                        ).marginOnly(top: 21,bottom: 21),
+
+                      ],
+                    ),
+                  ),
+                ).expanded(),
+
+                //底部按钮
+                MyButton(
+                  onPressed: viewModel.gotoNextPage,
+                  text: S.current.submit,
+                  textColor: Colors.white,
+                  backgroundColor: context.appColors.btnBgDefault,
+                  fontWeight: FontWeight.w500,
+                  type: ClickType.throttle,
+                  fontSize: 16,
+                  minHeight: 50,
+                  radius: 0,
+                ),
+              ],
+            )),
+        onWillPop: () async {
+          viewModel.handlePopAction();
+          return true;
+        });
   }
 }

packages/cpt_form/lib/modules/apply/type_of_application_page.dart

@@ -6,7 +6,10 @@ import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:router/ext/auto_router_extensions.dart';
 import 'package:shared/utils/log_utils.dart';
 import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
 import 'package:widgets/my_button.dart';
+import 'package:widgets/shatter/picker_container.dart';
+import 'package:widgets/my_text_view.dart';
 import '../../router/page/form_page_router.dart';
 import 'vm/apply_view_model.dart';
 
@@ -30,10 +33,27 @@ class TypeOfApplicationPage extends HookConsumerWidget {
 
     return WillPopScope(
         child: Scaffold(
-            appBar: AppBar(title: Text("TypeOfApplicationPage")),
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
             body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
               children: [
-                Text("TypeOfApplicationPage").expanded(),
+                MyTextView(
+                  S.current.type_of_application,
+                  fontSize: 17,
+                  marginTop: 30,
+                  marginLeft: 15,
+                  marginBottom: 16,
+                  isFontMedium: true,
+                  textColor: context.appColors.textBlack,
+                ),
+
+                PickerContainer(
+                  hint: S.current.choose_an_option,
+                  onClick: viewModel.pickOption,
+                ).marginOnly(left: 15, right: 15),
+
+                const Spacer(),
 
                 //底部按钮
                 MyButton(
@@ -49,7 +69,7 @@ class TypeOfApplicationPage extends HookConsumerWidget {
                 ),
               ],
             )),
-        onWillPop: () async{
+        onWillPop: () async {
           viewModel.handlePopAction();
           return true;
         });

packages/cpt_form/lib/modules/apply/vehicle_info_page.dart

@@ -1,8 +1,20 @@
 
+import 'package:cpt_form/modules/apply/vm/apply_view_model.dart';
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:cs_resources/theme/app_colors_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:router/ext/auto_router_extensions.dart';
+import 'package:widgets/ext/ex_widget.dart';
+import 'package:widgets/my_appbar.dart';
+import 'package:widgets/my_button.dart';
+import 'package:widgets/my_text_field.dart';
+import 'package:widgets/my_text_view.dart';
+import 'package:widgets/shatter/form_require_text.dart';
+import 'package:widgets/shatter/picker_container.dart';
+import 'package:widgets/widget_export.dart';
 import '../../router/page/form_page_router.dart';
 
 @RoutePage()
@@ -20,12 +32,233 @@ class VehicleInfoPage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final viewModel = ref.watch(applyViewModelProvider.notifier);
+    final state = ref.watch(applyViewModelProvider);
 
-    return Scaffold(
-      appBar: AppBar(title: Text("VehicleInfoPage")),
-      body: Center(
-        child: Text("VehicleInfoPage"),
+    // 使用 useState 来持久化 TextEditingController 和 FocusNode
+    final TextEditingController vehicleNumController = useTextEditingController();
+    final TextEditingController iuNumController = useTextEditingController();
+    final TextEditingController vehicleInfoController = useTextEditingController();
+    final FocusNode vehicleNumFocusNode = useFocusNode();
+    final FocusNode iuNumFocusNode = useFocusNode();
+    final FocusNode vehicleInfoFocusNode = useFocusNode();
+
+
+    useEffect(() {
+
+      //赋值State的值
+      Future.microtask(() {});
+
+      return () {
+        // 释放控制器资源
+        vehicleNumController.dispose();
+        iuNumController.dispose();
+        vehicleInfoController.dispose();
+        vehicleNumFocusNode.dispose();
+        iuNumFocusNode.dispose();
+        vehicleInfoFocusNode.dispose();
+      };
+    }, []);
+
+
+    return WillPopScope(
+        child: Scaffold(
+            appBar: MyAppBar.appBar(context, state.applyDetail?['title']),
+            backgroundColor: context.appColors.whiteBG,
+            body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SingleChildScrollView(
+                  scrollDirection: Axis.vertical,
+                  physics: const BouncingScrollPhysics(),
+                  child: Container(
+                    width: double.infinity,
+                    child: Column(
+                      mainAxisSize: MainAxisSize.max,
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+
+                        //下拉选 - Type类型
+                        MyTextView(
+                          S.current.type_of_application,
+                          fontSize: 17,
+                          marginTop: 30,
+                          marginLeft: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        PickerContainer(
+                          hint: S.current.choose_an_option,
+                          onClick: viewModel.pickOption,
+                        ).marginOnly(left: 15, right: 15),
+
+                        //下拉选 - 所有权状态
+                        MyTextView(
+                          S.current.ownership_status,
+                          fontSize: 17,
+                          marginTop: 14,
+                          marginLeft: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        PickerContainer(
+                          hint: S.current.choose_an_option,
+                          onClick: viewModel.pickOption,
+                        ).marginOnly(left: 15, right: 15),
+
+
+                        //输入框 - 车牌号
+                        FormRequireText(
+                          text: S.current.vehicle_number,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14,bottom: 16,left: 15,right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "vehicle_num",
+                          textInputType: TextInputType.text,
+                          textInputAction: TextInputAction.next,
+                          controller: vehicleNumController,
+                          focusNode: vehicleNumFocusNode,
+                          onSubmit: (formKey, value) {
+                            vehicleNumFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(iuNumFocusNode);
+                          },
+                        ),
+
+                        //输入框 - IU 号
+                        MyTextView(
+                          S.current.iu_number,
+                          fontSize: 17,
+                          marginTop: 14,
+                          marginLeft: 15,
+                          marginRight: 15,
+                          marginBottom: 16,
+                          isFontMedium: true,
+                          textColor: context.appColors.textBlack,
+                        ),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "iu_num",
+                          textInputType: TextInputType.text,
+                          textInputAction: TextInputAction.next,
+                          controller: iuNumController,
+                          focusNode: iuNumFocusNode,
+                          onSubmit: (formKey, value) {
+                            iuNumFocusNode.unfocus();
+                            FocusScope.of(context).requestFocus(vehicleInfoFocusNode);
+                          },
+                        ),
+
+                        //输入框 - 车辆信息
+                        FormRequireText(
+                          text: S.current.vehicle_make_model_colour,
+                          textColor: context.appColors.textBlack,
+                          fontSize: 17,
+                          fontWeight: FontWeight.w500,
+                        ).marginOnly(top: 14,bottom: 16,left: 15,right: 15),
+
+                        // 表单
+                        _buildInputLayout(
+                          context,
+                          "vehicle_info",
+                          textInputType: TextInputType.text,
+                          textInputAction: TextInputAction.done,
+                          controller: vehicleInfoController,
+                          focusNode: vehicleInfoFocusNode,
+                          onSubmit: (formKey, value) {
+                            vehicleInfoFocusNode.unfocus();
+                          },
+                        ),
+
+                      ],
+                    ),
+                  ),
+                ).expanded(),
+
+                //底部按钮
+                MyButton(
+                  onPressed: (){
+                    vehicleNumFocusNode.unfocus();
+                    iuNumFocusNode.unfocus();
+                    vehicleInfoFocusNode.unfocus();
+
+                    viewModel.gotoNextPage();
+                  },
+                  text: S.current.next,
+                  textColor: Colors.white,
+                  backgroundColor: context.appColors.btnBgDefault,
+                  fontWeight: FontWeight.w500,
+                  type: ClickType.throttle,
+                  fontSize: 16,
+                  minHeight: 50,
+                  radius: 0,
+                ),
+              ],
+            )),
+        onWillPop: () async {
+          viewModel.handlePopAction();
+          return true;
+        });
+  }
+
+  Widget _buildInputLayout(
+      BuildContext context,
+      String key, {
+        double marginTop = 0,
+        bool? showRightIcon = false, //是否展示右侧的布局
+        Widget? rightWidget, //右侧的布局
+        TextInputType textInputType = TextInputType.text,
+        String? errorText,
+        bool obscureText = false,
+        required TextEditingController controller,
+        required FocusNode focusNode,
+        bool enable = true,
+        TextInputAction textInputAction = TextInputAction.done,
+        Function? onSubmit,
+      }) {
+    return IgnoreKeyboardDismiss(
+      child: MyTextField(
+        key,
+        fillBackgroundColor: context.appColors.authFiledBG,
+        "",
+        hintStyle: TextStyle(
+          color: context.appColors.authFiledHint,
+          fontSize: 16.0,
+          fontWeight: FontWeight.w500,
+        ),
+        controller: controller,
+        focusNode: focusNode,
+        margin: EdgeInsets.only(top: marginTop,left: 15,right: 15),
+        padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 3),
+        showDivider: false,
+        height: 44,
+        enabled: enable,
+        style: TextStyle(
+          color: context.appColors.authFiledText,
+          fontSize: 16.0,
+          fontWeight: FontWeight.w500,
+        ),
+        inputType: textInputType,
+        textInputAction: textInputAction,
+        onSubmit: onSubmit,
+        cursorColor: context.appColors.authFiledText,
+        obscureText: obscureText,
+        errorText: errorText,
+        showLeftIcon: true,
+        showRightIcon: showRightIcon,
+        rightWidget: rightWidget,
       ),
     );
   }
+
 }

packages/cpt_form/lib/modules/apply/vm/apply_state.dart

@@ -1,14 +1,18 @@
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:flutter/material.dart';
+
 class ApplyState {
-  //详情页面的索引，不参与Copy
+
+  //详情页面的索引，为了记录详情页面组的当前跳转索引，不参与状态所以不用参与Copy方法
   int detailPageIndex;
 
-  //表单类型
+  //表单类型（列表的Form类型）
   String? formType;
 
   //是否可编辑
   bool enableEdit;
 
-  //表单对应的详情数据
+  //详情数据
   Map<String, dynamic>? applyDetail;
 
   ApplyState({

packages/cpt_form/lib/modules/apply/vm/apply_view_model.dart

@@ -1,8 +1,14 @@
+import 'dart:ui';
+
+import 'package:cs_resources/generated/l10n.dart';
+import 'package:flutter/cupertino.dart';
 import 'package:riverpod_annotation/riverpod_annotation.dart';
 import 'package:shared/utils/log_utils.dart';
+import 'package:widgets/picker/date_picker_util.dart';
 import '../../form/form_page.dart';
 import '../../form/form_types.dart';
 import 'apply_state.dart';
+import 'package:widgets/picker/option_pick_util.dart';
 
 part 'apply_view_model.g.dart';
 
@@ -36,4 +42,26 @@ class ApplyViewModel extends _$ApplyViewModel {
   void handlePopAction() {
     state.detailPageIndex--;
   }
+
+  //选择一个选项
+  void pickOption() {
+    OptionPickerUtil.showCupertinoOptionPicker(
+      items: ["选项1", "选项2", "选项3"],
+      initialSelectIndex: 0,
+      onPickerChanged: (_, index) {},
+    );
+  }
+
+  //选择一个日期,并回调出去
+  void pickDate(DateTime? selectedDate, void Function(DateTime) dateCallback) {
+    DatePickerUtil.showCupertinoDatePicker(
+      selectedDateTime: selectedDate ?? DateTime.now(),
+      mode: CupertinoDatePickerMode.date,
+      onDateTimeChanged: (date) {
+        dateCallback.call(date);
+      },
+      title: S.current.choose_date,
+    );
+  }
+
 }

packages/cpt_form/lib/modules/form/form_types.dart

@@ -133,6 +133,7 @@ class FormTypes {
       ],
       'detail_data': {
         'note_management_txt': S.current.access_card_desc,
+        'signature_txt': S.current.signature_access_card,
       }
     },
     //Access Card-Tenant
@@ -148,6 +149,7 @@ class FormTypes {
       'detail_data': {
         'attachment_txt': S.current.access_card_tenant_letter,
         'note_management_txt': S.current.access_card_desc,
+        'signature_txt': S.current.signature_access_card,
       }
     },
     //Car Park Cancellation
@@ -161,6 +163,7 @@ class FormTypes {
       ],
       'detail_data': {
         'note_management_txt': '${S.current.car_cancel_txt}\n\n${S.current.car_cancel_txt_1}\n${S.current.car_cancel_txt_2}',
+        'signature_txt': S.current.signature_vehicle,
       }
     },
     //Moving In
@@ -175,6 +178,7 @@ class FormTypes {
       ],
       'detail_data': {
         'note_management_txt': S.current.moving_in_msg,
+        'signature_txt': S.current.signature_moving,
       }
     },
     //Moving Out
@@ -189,6 +193,7 @@ class FormTypes {
       ],
       'detail_data': {
         'note_management_txt': S.current.moving_in_msg,
+        'signature_txt': S.current.signature_moving,
       }
     },
     //Overnight Parking
@@ -202,6 +207,7 @@ class FormTypes {
       ],
       'detail_data': {
         'note_management_txt': S.current.overnight_parking_msg,
+        'signature_txt': S.current.signature_vehicle,
       }
     },
     //Registration of 2nd Vehicle
@@ -217,6 +223,7 @@ class FormTypes {
       'detail_data': {
         'attachment_txt': '${S.current.label_txt}\n\n${S.current.label_txt_1}\n\n${S.current.label_txt_2}\n\n${S.current.label_txt_3}',
         'note_management_txt': S.current.moving_in_msg,
+        'signature_txt': S.current.signature_vehicle,
       }
     },
     //Renovation
@@ -235,6 +242,7 @@ class FormTypes {
         'large_txt': S.current.list_of_renovation_works,
         'attachment_txt': S.current.renovation_attachments,
         'note_management_txt': S.current.renovation_note,
+        'signature_txt': S.current.signature_renovation,
       }
     },
     //Re-Registration of 1st Vehicle-Owner
@@ -250,6 +258,7 @@ class FormTypes {
       'detail_data': {
         'attachment_txt': '${S.current.label_txt}\n\n${S.current.label_txt_1}\n\n${S.current.label_txt_2}\n\n${S.current.label_txt_3}',
         'note_management_txt': S.current.moving_in_msg,
+        'signature_txt': S.current.signature_vehicle,
       }
     },
     //Re-Registration of 1st Vehicle-Owner
@@ -265,6 +274,7 @@ class FormTypes {
       'detail_data': {
         'attachment_txt': '${S.current.label_txt}\n\n${S.current.label_txt_1}\n\n${S.current.label_txt_2}\n\n${S.current.label_txt_3}',
         'note_management_txt': S.current.moving_in_msg,
+        'signature_txt': S.current.signature_vehicle,
       }
     },
     //Re-Registration of Bicycles
@@ -280,6 +290,7 @@ class FormTypes {
       'detail_data': {
         'attachment_txt': S.current.bicycle_desc,
         'note_management_txt': S.current.bicycle_note,
+        'signature_txt': S.current.signature_bicycle,
       }
     },
     //Vehicle Label Replacement
@@ -295,6 +306,7 @@ class FormTypes {
       'detail_data': {
         'attachment_txt': '${S.current.label_txt}\n\n${S.current.label_txt_1}\n\n${S.current.label_txt_2}\n\n${S.current.label_txt_3}',
         'note_management_txt': S.current.label_replace_note,
+        'signature_txt': S.current.signature_vehicle,
       }
     },
   };

packages/cs_resources/lib/generated/assets.dart

@@ -140,6 +140,7 @@ class Assets {
   static const String noticeBoardDocumentsIcon = 'assets/notice_board/documents_icon.png';
   static const String noticeBoardEventIcon = 'assets/notice_board/event_icon.png';
   static const String paymentAmericanExpressIcon = 'assets/payment/american_express_icon.webp';
+  static const String paymentCardIcon = 'assets/payment/card_icon.webp';
   static const String paymentCardName = 'assets/payment/card_name.webp';
   static const String paymentCardNumber = 'assets/payment/card_number.webp';
   static const String paymentCondoIcon = 'assets/payment/condo_icon.webp';

packages/cs_resources/lib/generated/intl/messages_zh_CN.dart

@@ -83,6 +83,7 @@ class MessageLookup extends MessageLookupByLibrary {
         "change": MessageLookupByLibrary.simpleMessage("更换"),
         "change_mobile_phone": MessageLookupByLibrary.simpleMessage("修改手机号码"),
         "characters": m2,
+        "choose_an_option": MessageLookupByLibrary.simpleMessage("选择一个选项"),
         "choose_category": MessageLookupByLibrary.simpleMessage("选择类型"),
         "community": MessageLookupByLibrary.simpleMessage("社区"),
         "company_address": MessageLookupByLibrary.simpleMessage("公司地址"),
@@ -274,6 +275,8 @@ class MessageLookup extends MessageLookupByLibrary {
         "sign_up_verify_txt":
             MessageLookupByLibrary.simpleMessage("我们已经向您发送了短信验证码，请在下面输入"),
         "signature": MessageLookupByLibrary.simpleMessage("签名"),
+        "signature_vehicle": MessageLookupByLibrary.simpleMessage(
+            "I,the resident,herein confirm that we have read and will fully abide by the rules & regulations governing car parking of Parc Life. We  further undertake to display the car park label, prominently on the top left(passenger side) portion of the front windscreen of our vehicle at all times whilst in Parc Life."),
         "signed_and_agreed_by": MessageLookupByLibrary.simpleMessage("签字并同意"),
         "start_date_caps": MessageLookupByLibrary.simpleMessage("开始时间"),
         "status": MessageLookupByLibrary.simpleMessage("状态"),

packages/cs_resources/lib/generated/intl/messages_zh_HK.dart

@@ -83,6 +83,7 @@ class MessageLookup extends MessageLookupByLibrary {
         "change": MessageLookupByLibrary.simpleMessage("更换"),
         "change_mobile_phone": MessageLookupByLibrary.simpleMessage("修改手机号码"),
         "characters": m2,
+        "choose_an_option": MessageLookupByLibrary.simpleMessage("选择一个选项"),
         "choose_category": MessageLookupByLibrary.simpleMessage("选择类型"),
         "community": MessageLookupByLibrary.simpleMessage("社区"),
         "company_address": MessageLookupByLibrary.simpleMessage("公司地址"),

packages/cs_resources/lib/theme/app_colors_theme.dart

@@ -174,7 +174,7 @@ class AppColorsTheme extends ThemeExtension<AppColorsTheme> {
       tabTextUnSelectedPrimary: Colors.white,
       imgGrayBg: _darkBlackItem,
       textDarkGray999: Colors.white,
-      whiteBG: _darkBlackItem,
+      whiteBG: _darkBlackBg,
       whiteSecondBG: _darkBlackItemLight,
       redDefault: _darkBlackItem,
       dividerDefault: _darkBlackItemDivider,