版权声明:本文为博主原创文章,未经博主允许不得转载。
完全的实例,主要涉及EasyUi DataGrid和tabs两大功能,其中涉及多种知识点:根据页面地址获取参数,datagrid内部传参和列显示,tabs选项卡的添加和初始化,格式化列,字符的截取以及循环,按钮的多条件禁用启用,json字符串的拼接及解析,ajax等功能细节。
如需详细的EasyUi DataGrid请参考推荐文章
前端JS:
- <script type="text/javascript">
- $(function(){
- var url = window.location;//获取上一jsp页面的传值
- function getUrlParam(url,name){
- var pattern = new RegExp("[?&]" + name +"\=([^&]+)","g");//name的值
- var matcher = pattern.exec(url);
- var items = null;
- if(matcher != null){
- try{
- items = decodeURIComponent(decodeURIComponent(matcher[1]));
- }catch(e){
- try{
- items = decodeURIComponent(matcher[1]);
- }catch(e){
- items = matcher[1];
- }
- }
- }
- return items;
- }
- var batch_name = getUrlParam(url,'name');
- $("#batch_name").val(batch_name);
- //加载订单库存信息
- $("#dgStock").datagrid({
- url:"/portal/listGskOrderDetailAction.do",
- loadMsg:'加载中...',
- singleSelect:true,
- queryParams: {
- type: 'stock',
- batch_name: batch_name
- },
- columns:[[
- {field:'goods_opcode',title:'品种',width:80},
- {field:'goods_name',title:'名称',width:155},
- {field:'qty',title:'订单',width:50},
- {field:'stock_qty',title:'库存',width:50}
- ]]
- });
- //查询选项卡
- $.ajax({
- method : 'post',
- url : '/portal/listGskOrderDetailAction.do',
- data:{
- type: 'order',
- batch_name: batch_name
- },
- async : false,
- dataType : 'json',
- success : function(data) {
- if(data){
- $.each(data,function(index,item){
- //添加选项卡
- addTabs(item.orderno,item.client,index);
- });
- }else{
- $.messager.alert('提示',"订单信息加载失败!");
- }
- },
- error : function() {
- $.messager.alert('异常','订单信息加载异常!');
- }
- });
- function addTabs(orderno,client,index){
- $("#tt").tabs('add',{
- title:orderno+":"+client,
- //content:'<table id="dg'+index+'" ><input id="in'+index+'" type="hidden" value="'+orderno+'"/></table>',
- content:'<table id="dg'+orderno+'" ></table>',//添加表格用于<span style="font-family: Arial, Helvetica, sans-serif;">datagrid</span><span style="font-family: Arial, Helvetica, sans-serif;">实时加载</span>
- scrollIncrement:300,
- fit: true,
- closable:false
- });
- }
- var valid=true;//是否可以发送订单(按钮状态)
- //初始化点击事件
- $('#tt').tabs({
- border:false,
- onSelect:function(title,index){
- var orderno = title.split(":")[0];
- $("#title_tb").val(title);
- //加载该选项卡订单信息
- $("#dg"+orderno).datagrid({
- url:"/portal/listGskOrderDetailAction.do",
- loadMsg:'加载中...',
- singleSelect:true,
- toolbar: [{//在页面创建的话会出现问题(关闭选项卡后菜单也会关闭)
- text: '创建销售订单(TO_GSK)订单',
- handler: function(){createSaleOrders();}
- }],
- fit: true,
- queryParams: {
- type: 'info',
- orderno: orderno,
- batch_name: batch_name
- },
- columns:[[
- {field:'szedct',title:'类型',width:50,
- formatter: function(value,row,index){//格式化列
- if (value=='SO'){
- return '销售';
- }
- if (value=='SC'){
- return '退货';
- }
- if (value=='SZ'){
- return '赠样';
- }
- }
- },
- {field:'field1',title:'GSK文件_客户名称',width:150},
- {field:'szdate',title:'日期',width:80},
- {field:'szvr01',title:'客户订单号',width:80},
- {field:'szlitm',title:'GSK的SKU号',width:100},
- {field:'szdsc1',title:'GSK的SKU描述',width:200},
- {field:'szuorg',title:'数量',width:60},
- {field:'szlotn',title:'批号',width:60},
- {field:'client_opcode',title:'客户码',width:100},
- {field:'goods_ids',title:'商品码集合',width:200,hidden: true},
- {field:'goods_opcode',title:'商品码',width:200,
- formatter: function(value,row,index){
- //多个商品码
- var ids = row.goods_ids;
- if(ids != ''){
- var array = ids.split(",");//后台数据(以,分割成数组)
- var str="";
- for (i in array){//循环取出数据,添加单选按钮并默认
- if(array[i] == value){
- str += "<input type='radio' name='"+row.id+"' οnclick='checkStock("+row.szuorg+","+array[i]+","+row.id+","+row.client_id+",\""+row.szvr01+"\");' value='"+array[i]+"' checked='checked' />"+array[i];
- }else{
- str += "<input type='radio' name='"+row.id+"' οnclick='checkStock("+row.szuorg+","+array[i]+","+row.id+","+row.client_id+",\""+row.szvr01+"\");' value='"+array[i]+"' />"+array[i];
- }
- }
- return str;
- }else{//给按钮状态赋值
- valid=false;
- return value;
- }
- }
- },
- {field:'sale_valid',title:'销售关系',width:60,
- formatter: function(value,row,index){
- //判断关系并添加ID为多商品码查询用
- if (value=='0'){
- valid=false;
- return '<span id="sale_valid'+row.id+'"><img src="/portal/images/X5.gif" alt="" /><input name="sale_vlid" type="hidden" value="0" /></span>';
- }
- if (value=='1'){
- return '<span id="sale_valid'+row.id+'"><img src="/portal/images/X3.gif" alt="" /><input name="sale_vlid" type="hidden" value="1" /></span>';
- }
- }
- },
- {field:'goods_stock',title:'库存',width:60,
- formatter: function(value,row,index){
- var szuorg = row.szuorg;
- //判断库存信息并添加ID为多商品码查询用
- if(value>=szuorg){
- return "<span id='stock"+row.id+"'><font color='black'>"+value+"</font></span>";
- }else{
- valid=false;
- return "<span id='stock"+row.id+"'><font color='red' >"+value+"</font></span>";
- }
- //取其他列进行判断
- /* var rows = $('#dg'+indexMain).datagrid('getRows');
- var total = 0;
- for (var i = 0; i < rows.length; i++) {
- total = rows[i]['szuorg'];
- if(value>=total){
- return "<font color='black'>"+value+"</font>";
- }else{
- valid=false;
- return "<font color='red' >"+value+"</font>";
- }
- } */
- }
- }
- ]],onLoadSuccess : function(){
- if(valid){//禁用启用按钮
- $("#tba").linkbutton("enable");//enable
- }else{
- $("#tba").linkbutton("disable");
- }
- }
- });
- }
- });
- });
- //单选按钮检查库存和关系
- function checkStock(szuorg,opcode,id,client,order){
- $.ajax({
- url:"/portal/listGskOrderStockDetailAction.do",
- type:'post',
- data:{goods_opcode:opcode,client_id:client},
- dataType:"json",
- success:function(data){
- var s = parseInt(data.stack);
- if(s >= szuorg){
- $("#stock"+id).html("<font color='black' name='stock_color'>"+data.stack+"</font>");
- }else{
- $("#stock"+id).html("<font color='red' name='stock_color'>"+data.stack+"</font>");
- }
- if(data.sale_valid > 0){
- $("#sale_valid"+id).html("<img src='/portal/images/X3.gif' /><input name='sale_valid' type='hidden' value='1' />");
- }else{
- $("#sale_valid"+id).html("<img src='/portal/images/X5.gif' /><input name='sale_valid' type='hidden' value='0' />");
- }
- //检查库存和关系是否启用按钮
- checkError();
- },
- error:function(){
- alert("操作失败,请重试!");
- }
- });
- }
- function checkError(){
- var plan = true;
- $("input[name='sale_valid']").each(function(index,item){//验证关系
- if($(this).val()!=1){
- plan = false;
- }
- });
- $("font[name='stock_color']").each(function(index,item){//验证库存
- var color = ($(this).attr("color"));
- if(color == "red"){
- plan = false;
- }
- });
- if(plan){
- $("#tba").linkbutton("enable");
- }else{
- $("#tba").linkbutton("disable");
- }
- }
- function createSaleOrders(){
- var title = $("#title_tb").val();
- var orderno = title.split(":")[0];//以:分割的第1个参数
- if(confirm('将 , '+title+' 订单发送给GSK确认!')){
- var values='[';
- var checked = $("input:checked");//检查单选框并拼接为json格式
- if(checked.length<1){
- values='';
- }else{
- for(var i=0;i<checked.length;i++){
- values+='{code:"'+checked[i].value+'",id:"'+checked[i].name+'"},';
- }
- values=values.substring(0,values.length-1);
- values+=']';
- }
- var batch_name = $("#batch_name").val();
- $.ajax({
- method : 'post',
- url : '/portal/createGskOrderAction.do',
- data:{
- goods: values,
- orderno: orderno,
- batch_name : batch_name
- },
- //async : false,
- dataType : 'json',
- success : function(data) {
- if(data){
- $.messager.alert('提示',"创建销售订单成功!");
- $('#tt').tabs('close',title);
- $("#tba_span").css("display",true);
- }else{
- $.messager.alert('提示',"创建销售订单失败!");
- }
- },
- error : function() {
- $.messager.alert('异常','创建销售订单异常!');
- }
- });
- }
- }
- </script>
JSP:
- <body >
- <div id="cc" class="easyui-layout" data-options="fit:true">
- <input type="hidden" id="batch_name" />
- <input type="hidden" id="title_tb" />
- <div data-options="region:'west',title:'订单商品库存',split:true" style="width:350px;">
- <table id="dgStock"></table>
- </div>
- <div data-options="region:'center',title:'订单详细'" style="padding:5px;background:#eee;">
- <div id="tt" class="easyui-tabs" fit="true"></div>
- </div>
- </div>
- </body>
STRUTS:
- <span style="white-space:pre"> </span> <action path="/listGskOrderAction" scope="request" type="portal.sysweb.gsk2.action.ListGskOrderAction" validate="false">
- <forward name="" path="" />
- </action>
- <action path="/listGskOrderDetailAction" scope="request" type="portal.sysweb.gsk2.action.ListGskOrderDetailAction" validate="false">
- <forward name="" path="" />
- </action>
- <action path="/listGskOrderStockDetailAction" scope="request" type="portal.sysweb.gsk2.action.ListGskOrderStockDetailAction" validate="false">
- <forward name="" path="" />
- </action>
- <action path="/createGskOrderAction" scope="request" type="portal.sysweb.gsk2.action.CreateGskOrderAction" validate="false">
- <forward name="" path="" />
- </action>
Action:
- public class ListGskOrderAction extends Action {
- @Override
- public ActionForward execute(ActionMapping mapping, ActionForm form,HttpServletRequest request, HttpServletResponse response)
- throws Exception {
- ActionForm_UserInfo userInfo = (ActionForm_UserInfo) request
- .getSession().getAttribute("UserInfo");
- int page = Integer.parseInt(request.getParameter("page"));
- int rows = Integer.parseInt(request.getParameter("rows"));
- Gsk2Dao dao = new Gsk2Dao();
- Pagination pagination = dao.listUploadGskOrder(page,rows,userInfo.getUserid(),userInfo.getCompany_id());
- JSONObject json = new JSONObject();
- json.put("total", pagination.getMaxElements());
- json.put("rows", pagination.getPaginationList());
- json = JSONObject.fromObject(json);
- response.setCharacterEncoding("utf-8");
- response.getWriter().write(json.toString());
- response.getWriter().flush();
- response.getWriter().close();
- return null;
- }
- }
- public class ListGskOrderDetailAction extends Action{
- @Override
- public ActionForward execute(ActionMapping mapping, ActionForm form,HttpServletRequest request, HttpServletResponse response)
- throws Exception {
- ActionForm_UserInfo userInfo = (ActionForm_UserInfo) request
- .getSession().getAttribute("UserInfo");
- List<Hashtable> list = null;
- Gsk2Dao dao = new Gsk2Dao();
- String batch_name = request.getParameter("batch_name");
- String type = request.getParameter("type");
- if("1".equals(request.getParameter("update_flag")))
- new InterfaceFactory().dealUploadGSKInterface(null,null,batch_name,null);
- if(type.equals("stock"))
- list = dao.listGskOrderCheckStock(batch_name);
- if(type.equals("order"))
- list = dao.listUploadGskOrderDetail(userInfo.getUserid(), userInfo.getCompany_id(),batch_name);
- if(type.equals("info")){
- String orderno = request.getParameter("orderno");
- list = dao.listUploadGskOrderInfo(userInfo.getUserid(), userInfo.getCompany_id(),batch_name,orderno);
- }
- JSONArray arr = JSONArray.fromObject(list);
- response.setCharacterEncoding("utf-8");
- response.getWriter().write(arr.toString());
- response.getWriter().flush();
- response.getWriter().close();
- return null;
- }
- }
- public class ListGskOrderStockDetailAction extends Action{
- @Override
- public ActionForward execute(ActionMapping mapping, ActionForm form,
- HttpServletRequest request, HttpServletResponse response)
- throws Exception {
- String goods_opcode = request.getParameter("goods_opcode");
- String client_id = request.getParameter("client_id");
- Gsk2Dao dao = new Gsk2Dao();
- ActionForm_UserInfo actionForm_UserInfo = (ActionForm_UserInfo) request
- .getSession().getAttribute("UserInfo");
- String company_id = actionForm_UserInfo.getCompany_id();
- //String stack = dao.queryGoodsStackByCompanyId(goods_opcode,company_id);
- String stack = dao.queryGoodsStackByCompanyId(goods_opcode);
- int sale_valid = dao.queryGoodsCompanyRefByCompanyId(client_id, company_id, goods_opcode);
- StringBuffer strb = new StringBuffer();
- strb.append("{")
- .append("\"stack\":").append("\""+stack+"\"")
- .append(",\"sale_valid\":").append("\""+sale_valid+"\"")
- .append("}");
- response.getWriter().write(strb.toString());
- response.getWriter().flush();
- response.getWriter().close();
- return null;
- }
- }
- public class CreateGskOrderAction extends Action {
- @Override
- public ActionForward execute(ActionMapping mapping, ActionForm form,HttpServletRequest request, HttpServletResponse response)
- throws Exception {
- ActionForm_UserInfo actionForm_UserInfo = (ActionForm_UserInfo) request
- .getSession().getAttribute("UserInfo");
- String msg = "false";
- Gsk2Dao dao = new Gsk2Dao();
- try {
- String order_no = request.getParameter("orderno");
- String batch_name = request.getParameter("batch_name");
- String jsonStr = request.getParameter("goods");
- if(null != jsonStr && !"".equals(jsonStr)){
- JSONArray jsonArray = JSONArray.fromObject(jsonStr);
- for(int i=0;i<jsonArray.size(); i++){
- JSONObject jsonJ = jsonArray.getJSONObject(i);
- String goods_opcode = jsonJ.getString("code");
- int id = jsonJ.getInt("id");
- int goods_id = dao.queryGoodsIdByCode(goods_opcode);
- boolean flag = dao.updateGskOrderCodeAndGoodIdById(goods_id, goods_opcode, id);
- }
- }
- dao.createGskOrder(order_no, batch_name);
- msg="true";
- } catch (Exception ex1) {
- ex1.printStackTrace();
- }
- response.setCharacterEncoding("utf-8");
- response.getWriter().write(msg.toString());
- response.getWriter().flush();
- response.getWriter().close();
- return null;
- }
- }
Dao:
- public List listUploadGskOrderInfo(String user_id, String sys_provide_id,
- String batch_name,String orderid) {
- String sql = " select * " + " from v_gsk_order t "
- + " where t.USER_ID = '" + user_id + "' "
- + " and t.COMPANY_ID = '" + sys_provide_id + "' "
- + " and t.EXEC_FLAG = 'UPLOAD' " + " and t.BATCH_NAME = '"
- + batch_name + "' and t.SZVR01 = '"+orderid+"' order by t.SZVR01,t.SZEDCT,t.ID";
- //System.out.println("listUploadGskOrderInfo:"+sql);
- List list = null;
- try {
- DataManage db = new DataManage();
- list = db.executeQuerys(sql);
- } catch (Exception ex) {
- ex.printStackTrace();
- }
- return list;
- }
- public boolean updateGskOrderCodeAndGoodIdById(int goods_id,String goods_opcode,int id){
- String strSql = "update gsk_order gor set "
- + "gor.szlitm='"+goods_opcode+"',gor.goods_id='"+goods_id+"',gor.goods_opcode='"+goods_opcode+"'"
- + " where gor.id='"+id+"'";
- try {
- DataManage db = new DataManage();
- System.out.println("updateGskOrderCodeAndGoodIdById:"+strSql);
- db.exeUpdate(strSql);
- return true;
- } catch (Exception ex) {
- ex.printStackTrace();
- }
- return false;
- }
- public int queryGoodsCompanyRefByCompanyId(String client_id,String company_id,String goods_opcode){
- String sql = "select count(*) from goods_company_ref gcr "
- + "where gcr.client_id = "+client_id+" "
- + "and gcr.provide_id = "+company_id+" "
- + "and gcr.goods_id = (select cg.goods_id "
- + "from com_goods cg "
- + "where cg.goods_opcode = '"+goods_opcode+"' "
- + "and cg.org_id =1001) ";
- int num = 0;
- DataManage db = null;
- Connection conn = null;
- Statement stmt = null;
- ResultSet rs = null;
- try {
- db = new DataManage();
- //System.out.println("queryGoodsCompanyRefByCompanyId:"+sql);
- conn = db.getConnection();
- conn.setAutoCommit(false);
- stmt = conn.createStatement();
- rs = stmt.executeQuery(sql);
- if (rs.next()) {
- num = rs.getInt(1);
- }
- } catch (Exception e) {
- e.printStackTrace();
- }finally{
- try {
- conn.close();
- } catch (SQLException e) {
- // TODO Auto-generated catch block
- e.printStackTrace();
- }
- }
- return num;
- }