基础档案 模块功能分析

1、 基础档案设置 （数据字典）
    系统会事先预置一些系统级别的基础档案，如员线路类型、保险类型等；客户根据自己的需要动态增加
    将页面中常用类型选择，保存到数据库中 ， 为其它各个模块提供类别选择数据
    
2、 收派标准
    将承接的货物，按照重量和体积两个标准，双纬度定义货物的标准。以便将不同标准的货物分给不同收取和派送能力的人员
    * 取派员 取派货物能力不同，遵守一定标准
3、 班车设置
    取派员 取派货物时，遵守一定线路规则
4、 取派设置/替班
    * 取派员排班信息， 如果谁有事，替换进行取派
5、 区域设置
    * 自然区域 ，省 市 区 ， 取派覆盖区域
6、 管理分区
    * 将区域进行细分，以便于进行 安排取派员负责特定区域
7、 管理定区/调度排班
    * 将几个分区 划分为一个定区， 为定区关联 负责取派人员
8、 收派时间管理
    * 取派员 工作时间

    取派员（负责取货和送货），负责一定区域（定区），定区由多个分区组成（区域管理、分区管理），取派员有作息时间（收派时间管理），每个取派员负责不同重量级别的货物(收派标准)，遵循一定线路（班车设置 ）

实际完成功能：
1） 收派标准 管理 --- 1天
2） 取派员管理
3） 区域管理
4） 分区管理
5） 定区管理 （关联取派员、分区、客户）     ---- 1天
二、 基础设置模块 数据库建模
hibernate 进行开发，两种线路
    线路一： 传统开发模型， 数据库建模设计 ，创建数据表， 反转引擎生成PO实体类和hbm映射文件
    线路二： 领域建模 ，根据业务编写PO类，设计hbm映射文件， 通过类生成数据表

采用传统模型开发， 设计数据表 ----- 专业数据库建模工具 PowerDesigner
PD 支持三种数据模型 ： 概念数据模型（面向需求，类似E-R图） CDM 、 面向对象模型（以对象结构描述数据关系，生成java类） OOM、 物理数据模型（表结构） PDM
    * 三种模型可以转换的，物理数据模型，生成SQL脚本，完成建表

导入 基础设置 pdm ，生成数据表

myeclipse ， 根据数据表 生成实体类 和 hbm映射
三、 主页面，点击左侧 ztree代码，在右侧生成 tab选项
ztree初始化三步
    1） setting
    2） zNodes 数据
    3） 初始化树结构

        var setting = {
            data : {
                key : {
                    title : "t" // 将鼠标停留在树节点上提示内容
                },
                simpleData : {
                    enable : true // 简单数据， 树每个节点，存在 pId 指定父节点
                }
            },
            callback : {
                onClick : onClick // 绑定每个节点， 点击事件
            }
        };    

数据 ：

{ id:11, pId:0, name:"基础档案",  click:false},
{ id:111, pId:11, name:"基础档案设置", t:"基础档案设置",page:"page_base_jichudangan.action"}

点击树节点触发 onclick函数

    function onClick(event, treeId, treeNode, clickFlag) {
        if (treeNode.click != false) { // 判断节点数据 click属性 是否为false
            open(treeNode.name, treeNode.page); // 点击子节点时，调用open方法， 传递节点name属性、节点page属性
        }
    }    
    

    function open(text, url) { // text 就是name属性， url就是page属性
        if ($("#tabs").tabs('exists', text)) { // 如果当前选项卡，已经存在
            $('#tabs').tabs('select', text); // 切换到该选项卡
        } else { // 当前选项卡不存在，添加一个新选项卡
            var content = '<div style="width:100%;height:100%;overflow:hidden;">'
                    + '<iframe src="'
                    + url
                    + '" scrolling="auto" style="width:100%;height:100%;border:0;" ></iframe></div>';

            $('#tabs').tabs('add', { // 添加新选项卡
                title : text, // 标题
                content : content, // 内容
                //href : url
                closable : true
            });
        }
    }

四、 收派标准管理
点击收派标准菜单， page:"page_base_standard.action" ------ > /WEB-INF/pages/base/standard.jsp

在一个页面内部，使用Ajax功能，完成数据 CURD
    * standard.jsp 采用 layout布局，只提供 center区域， 是数据表格 （稍后讲）
    * 点击 "增加" 弹出隐藏 window ， window提供添加标准的form表单

struts2 <s:form> 标签， 在Ajax开发中 根本没用 ！！！！！

1、 添加收派标准
    form 以 ajax方式提交

方式一 ：使用jquery 方式（ajax方式提交form）    

    $("#save").click(function(){
        $.post("standard_add.action", $("#standardForm").serialize(), function(data){
            // 提交后处理...
        });
    }); // 点击保存按钮

方式二： 使用easy ui 提供form 控件 （以ajax方式提交form ）

    $("#save").click(function(){
            $("#standardForm").form('submit',{
                url : '${pageContext.request.contextPath}/standard_add.action', // 提交到哪？
                success : function(data){
                    // 成功后 执行回调函数
                    alert("添加成功");
                }
            });
    });

    // 自动进行 form校验
添加标准
    1） StandardAction extends BaseAction implements ModelDriven<Standard>
    2)  StandardService 接口 ----  StandardServiceImpl extends BaseService implements StandardService  实现类
    3） 在BaseService 中注入 standardDAO
    4） 在BaseAction 中注入 standardService
配置 ： struts.xml --> applicationContext-action.xml -- > applicationContext-service.xml --> applicationContext-dao.xml
ajax操作，返回结果，定义BaseAction  

    // Ajax执行后返回内容
    protected Object result = "success";
    
    public Object getResult() {
        return result;
    }

后续处理
                success : function(data){
                    data = eval("("+data+")");
                    // 成功后 执行回调函数
                    if(data == "success"){
                        $.messager.alert("信息","添加成功" ,"info");
                        $('#addStandardWindow').window("close"); // 关闭窗口
                        $('#standardForm').get(0).reset();// get(0) 将jquery对象转换为 dom对象
                    }
                }

2、 收派标准 数据表格使用 ---- 使用 easy ui 提供 datagrid 制作的
    类似数据表格： ext 、 flex 、jqgrid(jquery插件)、 easyui datagrid
    思想： ajax方式获取json 格式数据，绑定到一个table上，显示为表格 <tr> 数据项

使用ajax数据表格 ，比在服务器通过循环遍历 生成 tr元素，效率更好 ！！！
方式一： 针对HTML数据直接进行 datagrid样式修饰

    <table class="easyui-datagrid">
        <thead>
            <tr>
                <!-- 每个th必须要有 field属性 -->
                <th data-options="field:'id'">编号</th>
                <th data-options="field:'name'">商品名称</th>
                <th data-options="field:'price'">商品价格</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1</td>
                <td>笔记本</td>
                <td>5000</td>
            </tr>
            <tr>
                <td>2</td>
                <td>手机</td>
                <td>1999</td>
            </tr>
        </tbody>
    </table>

方式二： 绑定json数据显示

    <table class="easyui-datagrid" data-options="url:'data.json'">
        <thead>
            <tr>
                <!-- 每个th必须要有 field属性 -->
                <th data-options="field:'id'">编号</th>
                <th data-options="field:'name'">商品名称</th>
                <th data-options="field:'price'">商品价格</th>
            </tr>
        </thead>
    </table>
    
    data.json
    {
        "rows" : [
            {"id":"1","name":"洗衣粉","price":"10"},
            {"id":"2","name":"手电筒","price":"2"},
            {"id":"3","name":"盆","price":"3"}
        ]
    }

方式三： 使用js代码定义 表头

    $("#gridTable").datagrid({
            // 数据来源
            url : 'data.json',
            // 表头
            columns : [[
                {
                    field : 'id' , // 绑定json中内容
                    title : '编号' , // 显示内容
                    width : 200
                },// 一个{} 代表一个th
                {
                    field : 'name',
                    title : '商品名称',
                    width : 200
                },
                {
                    field : 'price',
                    title : '商品价格',
                    width : 100
                }
            ]] // 定义多行表头
    });
        
    <table id="gridTable"></table>

定义工具栏 ： toolbar属性
    1）HTML 方式定义

    <div id="tb">  
      <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">按钮一</a>  
      <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help',plain:true">按钮二</a>
    </div>
    

    <table class="easyui-datagrid" data-options="url:'data.json',toolbar:'#tb'">

    2） JS 方式定义

      toolbar : [
                {
                    iconCls: 'icon-edit',
                    id : 'button-view',    
                    text : '查询',
                    handler : function(){
                        alert("点击了按钮一");
                    }
                }, // 一个{} 就是一个按钮
                {
                    iconCls: 'icon-ok',
                    id : 'button-ok',    
                    text : '确认',
                    handler : function(){
                        alert("点击了按钮二");
                    }
                }
            ]

3、 使用datagrid 实现分页查询功能
    datagrid 进行分页查询，加载json数据显示，需要响应数据标准格式 ：

    {
        "total" : "100" ,
        "rows" : [
            {}, {},{} // 这里每个大括号代表一条数据
        ]        
    }

简化为： 这里[] 就是rows属性值

    [
        {},{},{}
    ]

分页查询分析

    请求： page 当前页码， rows 每页多少条， 条件
    响应： total 总记录数， rows 结果数据
请求Bean设计

    public class PageRequestBean {
        // page 当前页码， rows 每页多少条， 条件
        private int page ; // 当前页码
        private int rows ; // 每页多少条
        
        // 设计成员，代表任何条件查询
        private DetachedCriteria detachedCriteria;
    }

响应Bean设计

    @SuppressWarnings("all")
    public class PageResponseBean {
        // 响应： total 总记录数， rows 结果数据
        private long total;
        private List rows ;
    }

将 datagrid 的 url : "${pageContext.request.contextPath}/standard_pageQuery.action",配置struts.xml 指定返回数据

                <param name="includeProperties">
                    total,
                    rows\[\d+\]\.id,
                    rows\[\d+\]\.name,
                    rows\[\d+\]\.minweight,
                    rows\[\d+\]\.maxweight,
                    rows\[\d+\]\.user\.username,
                    rows\[\d+\]\.updatetime,
                    rows\[\d+\]\.user\.station
                </param>

    异常： could not initialize proxy - no Session
解决延迟抓取问题， OpenSessionInViewFilter

  <filter>
      <filter-name>OpenSessionFilter</filter-name>
      <filter-class>org.springframework.orm.hibernate3.support.OpenSessionInViewFilter</filter-class>
  </filter>
  <filter-mapping>
      <filter-name>OpenSessionFilter</filter-name>
      <url-pattern>/*</url-pattern>
  </filter-mapping>

4、 关于datagrid 的数据内容回显问题

    {
        field : 'user.username',
        title : '操作人',
        width : 120,
        align : 'center',
        // 自定义显示规则
        formatter : function(value,rowData, rowIndex){// value当前属性对应值，rowData 该行数据对象， rowIndex 行索引
            if(rowData.user != null){
                return rowData.user.username;
            }
        }
    }

5、 取派标准删除功能
    定义列信息

        {
            field : 'id',
            checkbox : true,
        }

    将id显示为checkbox ，进行勾选
    
getSelected none 返回第一个选中的行记录或null。
getSelections none 返回所有选定的行,当没有记录被选中,我将返回空数组。 
删除功能时，将deltag 设置为 1
============= 删除后、添加后， $("#grid").datagrid('reload'); 重新加载数据
查询时， detachedCriteria.add(Restrictions.eq("deltag", "0"));// 查询未删除
6、 取派标准修改功能
    使用ajax单页完成增删改查， 数据就是页面中， 修改时，无需进行页面跳转，直接将数据显示在form中
修改功能和添加功能 使用同一个form
    问题： 使用同一个form如何区分是 添加还是修改 ？
    在form中添加 隐藏id域，如果id域有值，进行修改，没有值，进行添加
1） 双击表格中数据，弹出窗口，在form中回显数据

    $('#grid').datagrid( {
            onDblClickRow : doDblClickRow
    });

双击函数有参数吗？

    function doDblClickRow(rowIndex, rowData){
    }

回显数据问题

 // numberbox数据回显
        $('#minweight').numberbox('setValue',rowData.minweight);
        $('#maxweight').numberbox('setValue',rowData.maxweight); 

2） 修改操作和添加操作 使用同一个Action方法，在业务层 进行判断，进行添加或者修改 ！！！
提交修改完成后， $('#standardForm').get(0).reset(); 无法清除隐藏域信息的，必须手动清除 $('#standard_id').val('');
<