1.10  后台页面设计

1.10.1  后台页面概述

本系统中所有的后台页面都采用了同一个页面框架，该页面框架采用二分栏结构，分为4个区域，即页头、侧栏、页尾和内容显示区，该页面框架的总体结构与前台页面框架的结构相同。网站后台首页的运行效果如图1.51所示。

图1.51  后台首页的运行效果

1.10.2  后台页面的技术分析

本系统中，实现后台页面框架的JSP文件为AdminTemp.jsp，该页面的布局如图1.52所示。

图1.52  AdminTemp.jsp页面布局

本系统中，对后台管理员所有请求的响应都通过该框架页面进行显示。在AdminTemp.jsp文件中主要采用include动作和include指令来包含各区域所对应的JSP文件。其实现技术与前台页面的实现技术是相同的，读者可查看1.6.2节介绍的前台页面实现技术分析。

1.10.3  后台页面的实现过程

根据以上的页面概述及技术分析，需要分别创建实现各区域的JSP文件，如实现页头的top.jsp、实现内容显示区的main.jsp、实现侧栏的right.jsp、实现页尾的end.jsp等。下面主要介绍框架页面AdminTemp.jsp和main.jsp页面的实现。

在AdminTemp.jsp页面中应用include指令和动作标识来包含各区域对应的JSP文件。代码如下：

例程52  代码位置：光盘\TM\01\pages\admin\view\AdminTemp.jsp

<table>

    <tr><td colspan="2"><%@ include file="top.jsp"%></td></tr>                <!-- 包含页头文件 -->

    <tr><td colspan="2"></td></tr>

    <tr>

        <td><jsp:include page="main.jsp"/></td>                                 <!-- 包含main.jsp文件 -->

        <td><jsp:include page="right.jsp"/></td>                                    <!-- 包含侧栏文件 -->

    </tr>

    <tr><td colspan="2"></td></tr>

    <tr><td colspan="2"><%@ include file="end.jsp" %></td></tr>     <!-- 包含页尾文件 -->

</table>

在main.jsp文件中实现了内容显示区中的背景图片，并在该页面中加载要显示在内容显示区中的JSP文件。代码如下：

例程53  代码位置：光盘\TM\01\pages\admin\view\main.jsp

<%

  String mainPage=(String)request.getAttribute("mainPage");

  if(mainPage==null||mainPage.equals(""))

          mainPage="default.jsp";

%>

<table>

    <tr><td><img src="images/default_t.jpg"></td></tr>

    <tr><td background="images/default_m.jpg" valign="top"><jsp:include page="<%=mainPage%>"/></td></tr>

    <tr><td><img src="images/default_e.jpg"></td></tr>

</table>