信息步骤填写-添加设计方案（贷款申请业务）

在项目开发的过程中，有一个贷款申请业务，该业务需要通过4步来填写申请信息（并且这四步是在同一个页面，是否显示通过js来控制，这样会使用户体验更好）：

(1)     企业基本信息

(2)     企业资质信息

(3)     银行信息

(4)     申请业务信息

 

表设计如下：

主表(关联以下四个表)

企业基本信息表

企业资质信息表

银行信息表

申请业务信息表

 

那么上一步下一步方案就是必要的，设计方案如下：

页面按钮及隐藏域分布：

(1)    企业基本信息页面

按钮：下一步

隐藏域：

企业基本信息Id:<input type=”hidden”id=”enterpriseId” name=”enterpriseId” />

是否更新标识：<input type=”hidden” id=”updateEnterprise”name=” updateEnterprise” value=”false” />

(2)    企业资质信息页面

按钮：上一步，下一步

隐藏域：

企业资质信息Id:<input type=”hidden”id=”qualificationId” name=” qualificationId” />

是否更新标识：<input type=”hidden” id=”updateQualification”name=”updateQualification” value=”false” />

(3)    银行信息页面

按钮：上一步，下一步

隐藏域：

银行信息Id:<input type=”hidden”id=”bankId” name=” bankId” />

是否更新标识：<input type=”hidden” id=”updateBank”name=” updateBank” value=”false” />

(4)    申请业务信息页面

按钮：上一步，提交

 

1.按钮事件处理

1.1当单击(1)页面的下一步按钮时

(1)异步提交表单信息，并保存到主表，并且返回信息{success=true,enterpriseId=12,mainId=1}

(2)获取enterpriseId的值，然后保存到企业基本信息Id隐藏域，并且更新隐藏域updateEnterprise为true

 

1.2  当单击(2)页面的上一步按钮时，直接切换到(1)

当单击(2)页面的下一步按钮时

(1)    异步提交表单，并且返回信息{success=true,qualificationId =12}

(2)    获取qualificationId的值，然后保存到企业资质信息Id隐藏域，并且更新updateQualification为true

 

1.3当单击(3)页面的上一步按钮时，直接切换到(2)

   当单击(3)页面的下一步按钮时

(1)    异步提交表单，并且返回信息{success=true,bankId =12}

(2)    获取bankId的值，然后保存到银行信息Id隐藏域，并且更新updateBank为true

 

1.4当单击(4)页面的上一步按钮时，直接切换到(3)

当单击(2)页面的提交按钮时，异步提交到表单，并跳转到列表页面

 

2. 状态处理

2.1当用户在到第四步单击提交按钮之前，保存主表中的status状态为草稿，这样用户下次还可以编辑或者删除该条信息

2.2单击提交按钮之后，保存status为申请中。