day54_BOS項目_06

時間 2020-05-06

標籤 day54 day bos 項目简体版

原文原文鏈接

今天內容安排：
- 一、業務受理環節分析
- 二、建立業務受理環節對應的數據表（業務通知單、工單、工做單）
- 三、實現業務受理、自動分單
- 四、數據網格datagrid的編輯功能的使用
- 五、基於數據網格datagrid的編輯功能實現工做單快速錄入功能
- 六、演示權限控制demo

一、業務受理分析

受理環節，是宅急送業務的開始，做爲服務前端，客戶經過電話、網絡等多種方式進行委託，業務受理員經過與客戶交流，獲取客戶的服務需求和具體委託信息，將服務指令輸入我司服務系統。
客戶經過打電話的方式進行物流委託，一個客戶的委託信息對應一個業務通知單。
系統經過客戶的取件地址，自動匹配到一個取派員，爲取派員產生一個任務，這個任務就是一個工單。
工做單：描述貨物和物流信息的單據。就是咱們寄快遞的時候，取派員讓咱們填寫的單子。以下圖所示：
業務受理以下圖所示：

第一步：根據提供的業務受理.pdm 文件生成建表文件 bos_qp.sql
第二步：因爲業務受理.pdm 文件中有僞表，因此咱們須要修改生成的建表文件，修改以下圖所示：javascript

第三步：咱們根據建表文件 bos_qp.sql使用 Navicat for MySQL 生成對應的表，生成的表爲： qp_noticebill(業務通知單)、qp_workbill(工單)、qp_workordermanage(工做單)，注意：因爲表的數量及表的關係增多，咱們要有意識的檢查生成的表中外鍵名是否有重複，有重複的咱們須要進行修改。
第四步：咱們使用MyEclipse中Hibernate反轉引擎插件生成對應的實體類以及對應的xxx.hbm.xml文件
　　詳細操做步驟連接： http://www.javashuo.com/article/p-mmgsbkxk-bd.html
第六步：對實體類的字段進行註釋

二、實現業務受理、自動分單

2.一、在crm中擴展提供根據手機號查詢客戶信息的方法並實現

CustomerService接口：css

package cn.itcast.crm.service;

import java.util.List;

import cn.itcast.crm.domain.Customer;

// 客戶服務接口 
public interface CustomerService {
    // 未關聯定區客戶
    public List<Customer> findnoassociationCustomers();

    // 查詢已經關聯指定定區的客戶
    public List<Customer> findhasassociationCustomers(String decidedZoneId);

    // 將未關聯定區客戶關聯到定區上
    public void assignCustomersToDecidedZone(Integer[] customerIds, String decidedZoneId);

    // 根據手機號查詢客戶信息
    public Customer findCustomerByTelephone(String telephone);
}

CustomerServiceImpl實現類：html

    public Customer findCustomerByTelephone(String telephone) {
        Session session = HibernateUtils.openSession();
        session.beginTransaction();

        String hql = "from Customer where telephone=?";
        List<Customer> customers = session.createQuery(hql).setParameter(0, telephone).list();

        session.getTransaction().commit();
        session.close();

        if (customers != null && customers.size() > 0) {
            return customers.get(0);
        }
        return null;
    }

2.二、在bos中實現業務受理、自動分單

注意：須要將crm中接口擴展的方法複製到bos的接口中
業務受理頁面：WEB-INF/pages/qupai/noticebill_add.jsp
第一步：爲手機號輸入框綁定離焦事件，發送ajax請求，提交輸入的手機號到Action中，在Action中調用crm的代理對象，訪問crm服務，根據手機號查詢客戶信息，返回json數據前端

    <td>來電號碼:</td>
    <td>
        <input type="text" class="easyui-validatebox" name="telephone" required="true"/>
        <script type="text/javascript">
            $(function() {
                $("input[name=telephone]").blur(function() {
                    // alert("曉藝微信把我刪了，想o(╥﹏╥)o");
                    // 獲取輸入框的值（手機號）
                    var telephone = this.value; 
                    // 發送ajax請求，帶上參數：手機號
                    var url = "${pageContext.request.contextPath}/noticebillAction_findCustomerByTelephone.action";
                    $.post(url, {"telephone":telephone}, function(data) {
                        alert(data);
                    }, 'json');
                });
            });
        </script>
    </td>

瀏覽器效果截圖以下：java

第二步：建立新的NoticebillAction，提供findCustomerByTelephone()方法， 加註解、加註釋、繼承BaseAction<Noticebill>、配置struts.xml

package com.itheima.bos.web.action;

import java.io.IOException;

import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Controller;

import com.itheima.bos.domain.Noticebill;
import com.itheima.bos.web.action.base.BaseAction;

import cn.itcast.crm.domain.Customer;

/**
 * 業務通知單設置
 * @author Bruce
 *
 */
@Controller
@Scope("prototype")
public class NoticebillAction extends BaseAction<Noticebill> {

    /**
     * 調用代理對象，根據手機號查詢客戶信息
     * @return
     * @throws IOException 
     */
    public String findCustomerByTelephone() throws IOException {
        Customer customer = remoteProxy.findCustomerByTelephone(model.getTelephone());
        String[] excludes = new String[] {};
        this.writeObject2Json(customer, excludes);
        return "none"; 
        // 注意：咱們發的是ajax請求，返回的是json數據，解析的也是json數據，因此返回的是"none"
        // 若是返回的是"list"，就是說咱們查詢到的結果變成HTML頁面，我用解析json數據的方式根本解析不出來啊！
    }
}

第三步：完善頁面中ajax方法的回調函數jquery

    <td>來電號碼:</td>
    <td>
        <input type="text" class="easyui-validatebox" name="telephone" required="true"/>
        <script type="text/javascript">
            $(function() {
                $("input[name=telephone]").blur(function() {
                    // alert("曉藝微信把我刪了，想o(╥﹏╥)o");
                    // 獲取輸入框的值（手機號）
                    var telephone = this.value;
                    // 發送ajax請求，帶上參數：手機號
                    var url = "${pageContext.request.contextPath}/noticebillAction_findCustomerByTelephone.action";
                    $.post(url, {"telephone":telephone}, function(data) {
                        // alert(data);
                        if (data != null) {
                            // 查詢到客戶，能夠進行回顯
                            var customerId = data.id;
                            var customerName = data.name;
                            var customerAddress = data.address;
                            $("input[name=customerId]").val(customerId);
                            $("input[name=customerName]").val(customerName);
                            $("input[name=delegater]").val(customerName);
                            $("input[name=pickaddress]").val(customerAddress);
                        } else {
                            // 清除數據
                            var customerId = data.id;
                            var customerName = data.name;
                            var customerAddress = data.address;
                            $("input[name=customerId]").val("");
                            $("input[name=customerName]").val("");
                            $("input[name=delegater]").val("");
                            $("input[name=pickaddress]").val("");
                        }
                    }, 'json');
                });
            });
        </script>
    </td>

第四步：爲「新單」按鈕綁定保存事件web

    <script type="text/javascript">
        $(function() {
                $("body").css({
                    visibility : "visible"
            });

            // 對save按鈕綁定點擊事件
            $('#save').click(function() {
                // 對form表單進行校驗
                if ($('#noticebillForm').form('validate')) {
                    $('#noticebillForm').submit();
                }
            });
        });
    </script>

第五步：在NoticebillAction中提供add()方法，保存一個業務通知單數據，並根據取件地址嘗試自動分單，注入NoticebillService、加註解、加註釋、等等
NoticebillAction.javaajax

    /**
     * 保存業務通知單，並根據取件地址嘗試自動分單
     * @return
     */
    public String add() {
        // 從session中獲取當前登陸用戶，即業務員（業務受理員）
        User user = BOSContext.getLoginUser();
        // 設置用戶
        model.setUser(user);
        noticebillService.save(model);
        return "addUI";
    }

第六步：在crm服務中擴展方法，根據取件地址查詢定區idspring

    public String findDecidedzoneIdByPickaddress(String address) {
        Session session = HibernateUtils.openSession();
        session.beginTransaction();

        String hql = "select decidedzone_id from Customer where address=?";
        List<String> decidedzoneId = session.createQuery(hql).setParameter(0, address).list();

        session.getTransaction().commit();
        session.close();

        if (decidedzoneId != null && decidedzoneId.size() > 0) {
            return decidedzoneId.get(0);
        }
        return null;
    }

第七步：在NoticebillService中提供save方法
NoticebillServiceImpl.javasql

package com.itheima.bos.service.impl;

import java.sql.Timestamp;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;

import com.itheima.bos.crm.CustomerService;
import com.itheima.bos.dao.IDecidedzoneDao;
import com.itheima.bos.dao.INoticebillDao;
import com.itheima.bos.dao.IWorkbillDao;
import com.itheima.bos.domain.Decidedzone;
import com.itheima.bos.domain.Noticebill;
import com.itheima.bos.domain.Staff;
import com.itheima.bos.domain.Workbill;
import com.itheima.bos.service.INoticebillService;

@Service
@Transactional
public class NoticebillServiceImpl implements INoticebillService {

    // 注入業務通知單dao
    @Autowired
    private INoticebillDao noticebillDao;

    // 注入遠程訪問的代理對象
    @Autowired
    private CustomerService remoteProxy;

    // 注入定區dao
    @Autowired
    private IDecidedzoneDao decidedzoneDao;

    // 注入工單dao
    @Autowired
    private IWorkbillDao workbillDao;

    /**
     * 保存業務通知單，並根據取件地址嘗試自動分單
     */
    public void save(Noticebill model) {
        // 先保存業務通知單（多個業務通知單屬於一個取派員）
        noticebillDao.save(model);  // 持久化對象

        // 獲取取件地址
        String pickaddress = model.getPickaddress();
        // 根據取件地址查找定區id
        String decidedzoneId = remoteProxy.findDecidedzoneIdByPickaddress(pickaddress);
        if (decidedzoneId != null) {
            // 查詢到定區id，能夠進行自動分單
            Decidedzone decidedzone = decidedzoneDao.findById(decidedzoneId); // 持久化對象
            // 獲取取派員
            Staff staff = decidedzone.getStaff();
            // 設置業務通知單關聯匹配到的取派員
            model.setStaff(staff);
            // 設置分單類型爲「自動分單」
            model.setOrdertype("自動分單");

            // 爲取派員建立一個工單並設置值
            Workbill workbill = new Workbill();
            workbill.setNoticebill(model); // 工單關聯業務通知單
            workbill.setStaff(staff); // 工單關聯取派員
            workbill.setType("新單");
            workbill.setPickstate("未取件");
            workbill.setBuildtime(new Timestamp(System.currentTimeMillis()));
            workbill.setAttachbilltimes(0);
            workbill.setRemark(model.getRemark());

            // 保存工單
            workbillDao.save(workbill);

            // 調用短信平臺服務，給取派員發送短信
            // ......
        } else {
            // 沒有查詢到定區id，設置分單類型爲「人工分單」（進入調度環節）
            model.setOrdertype("人工分單");
            // 調度
            // ......
        }
    }
}

三、數據網格datagrid 的編輯功能的使用

列（Column）屬性：數據網格（DataGrid）的列（Column）是一個數組對象，它的每一個元素也是一個數組。元素數組的元素是一個配置對象，它定義了每一個列的字段。
- 數據網格的編輯功能是以列爲單位的。
- 即：經過數據網格的列屬性editor開啓指定列的編輯功能。以下圖所示：
數據網格的方法：
- 插入一行：insertRow
- 刪除一行：deleteRow
- 開啓編輯狀態：beginEdit
- 結束編輯狀態：endEdit
- 得到選中行的索引：getRowIndex
- 得到選中的第一行：getSelected
- 得到選中的全部行：getSelections
數據網格的事件：
- 結束編輯狀態時觸發：onAfterEdit

示例代碼以下：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>datagrid_edit---數據網格的編輯功能</title>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/js/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/js/easyui/themes/icon.css">
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/easyui/locale/easyui-lang-zh_CN.js"></script>
</head>
<body>
    <h3>方式三：經過js代碼，使用插件提供的API動態建立datagrid，大量使用</h3>
    <table id="grid"></table>
    <script type="text/javascript">
        $(function() {
            // 全局的行索引
            var index;
            $("#grid").datagrid({
                columns:[[ // 定義標題行全部的列，是一個二維數組
                    {field:'id',title:'編號',checkbox:true}, // 是否複選框
                    {field:'name',title:'姓名',editor:{ // 指定當前列具備編輯功能
                        type:'validatebox',
                        options:{
                        }
                    }},
                    {field:'age',title:'年齡',editor:{ // 指定當前列具備編輯功能
                        type:'validatebox',
                        options:{
                        }
                    }}
                ]],
                url:'/bos19/json/data.json', // 指定URL地址，datagrid控件會自動發送ajax請求獲取數據
                onAfterEdit:function(rowIndex,rowData,changes) { // 數據網格的事件：當前行結束編輯狀態時觸發
                    alert("更新後的姓名爲：" + rowData.name);
                },
                toolbar:[ // 工具欄按鈕
                    {text:'保存',iconCls:'icon-save',handler:function() {
                        // 結束當前行的編輯狀態
                         $("#grid").datagrid("endEdit",index);
                    }},
                    {text:'添加',iconCls:'icon-add',handler:function() {
                        // 動態添加一行
                        $("#grid").datagrid("insertRow",{
                            index:0, // 在索引爲0的位置插入，即在第一行插入
                            row:{}   // 空的json表示空行
                        });
                        // 讓第一行開啓編輯狀態
                        index = 0;
                        $("#grid").datagrid("beginEdit",index);
                    }},
                    {text:'刪除',iconCls:'icon-remove',handler:function() {
                        // 得到當前選中的行
                        var row = $("#grid").datagrid("getSelected");
                        // 獲取當前選中的行的索引
                        index = $("#grid").datagrid("getRowIndex",row);
                        // 刪除當前行
                        $("#grid").datagrid("deleteRow",index);
                    }},
                    {text:'修改',iconCls:'icon-edit',handler:function() {
                        // 得到當前選中的全部行
                        // $("#grid").datagrid("getSelections");
                        // 得到當前選中的行
                        var row = $("#grid").datagrid("getSelected");
                        // 獲取當前選中的行的索引
                        index = $("#grid").datagrid("getRowIndex",row);
                        // 開啓當前選中行的編輯狀態
                        $("#grid").datagrid("beginEdit",index);
                    }}
                ],
                singleSelect:true,    // 是否能夠單選
                pagination:true,    // 分頁條
                pageList:[3,5,7]     // 自定義分頁條中的下拉框選項
            });
        });
    </script>
</body>
</html>

示例動圖以下：

四、基於數據網格datagrid 的編輯功能實現工做單快速錄入功能

第一步：在quickworkorder.jsp頁面中增長髮送ajax請求，提交當前結束編輯行的數據到服務器，完成保存操做的代碼，以下：
位置：/bos19/WebContent/WEB-INF/pages/qupai/quickworkorder.jsp

    // 發送ajax請求，提交當前結束編輯行的數據到服務器，完成保存操做
    var url = "${pageContext.request.contextPath}/workordermanageAction_add.action";
    $.post(url,rowData,function(data) {
        if (data == 1) {
            // 工做單信息錄入成功
            $.messager.alert("提示信息","工做單信息錄入成功！","warning");
        } else {
            // 工做單信息錄入失敗
            $.messager.alert("提示信息","工做單信息錄入失敗！","warning");
        }
    });

第二步：建立新的WorkordermanageAction，提供add()方法，加註解、加註釋、繼承BaseAction<Workordermanage>、配置struts.xml、等等

package com.itheima.bos.web.action;

import java.io.IOException;

import org.apache.struts2.ServletActionContext;
import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Controller;

import com.itheima.bos.domain.Workordermanage;
import com.itheima.bos.web.action.base.BaseAction;

/**
 * 工做單設置
 * @author Bruce
 *
 */
@Controller
@Scope("prototype")
public class WorkordermanageAction extends BaseAction<Workordermanage> {

    public String add() throws IOException {
        String flag = "1";
        try {
            // 工做單信息錄入成功
            workordermanageService.save(model);
        } catch (Exception e) {
            // 工做單信息錄入失敗
            flag = "0";
        }
        // 響應給瀏覽器一個狀態碼，這種手法經常使用
        ServletActionContext.getResponse().setContentType("text/html;charset=UTF-8");
        ServletActionContext.getResponse().getWriter().print(flag);
        return "none";    }}

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。