工作20天总结

目前为止，已经正式上班了20天，收获还是很大的，自学了一些新技术，有：zTree、layui-layer、layui-table、web-service，虽然只是一些简单的应用，但是收获还是很大的，大部分代码都是copy过来的，现在的我只是代码的搬运工，但是在学习过程中，不能盲目的做搬运工，我会思考为何这样的代码会实现功能，只想做一个代码的搬运工，不是一个好的程序员。
附上一段用layui-table实现的增删改查功能的页面：
`<%@ page language=”java” import=”java.util.*” pageEncoding=”UTF-8”%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+”://”+request.getServerName()+”:”+request.getServerPort()+path+”/”;
%>

”>

<title>My JSP 'table.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">    
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" type="text/css" href="res/layui/css/layui.css">
<script type="text/javascript" src="res/js/jquery-1.8.3.min.js"></script>

<div class="demoTable">
    搜索姓名：
    <div class="layui-inline">
        <input class="layui-input" name="id" id="demoReload"
            autocomplete="off">
    </div>
    <button class="layui-btn" data-type="reload">搜索</button>
</div>

<button class="layui-btn" onclick="location='patients/add.jsp'">添加</button>

<div class="layui-btn-group demoTable">
    <button class="layui-btn" data-type="delCheckData">删除选中行数据</button>
    <!-- <button class="layui-btn" data-type="getCheckLength">获取选中数目</button>
    <button class="layui-btn" data-type="isAll">验证是否全选</button> -->
</div>

<table class="layui-hide" id="test" lay-filter="useruv"></table>

<script src="res/layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->

<script>
    //加载layui的table表格功能
    layui.use('table', function() {
        var table = layui.table;
        table.render({
            elem : '#test',
            url : 'showTable.action',
            cellMinWidth : 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            page : true,
            cols : [ [
                {
                    width : 80,
                    type  : 'checkbox'
                }
                , {
                    width : 80,
                    title : '序号',
                    type  : 'numbers'
                }
                , {
                    field : 'name',
                    width : 80,
                    title : '姓名',
                    sort : true
                }
                , {
                    field : 'sex',
                    width : 70,
                    title : '性别'
                }
                , {
                    field : 'age',
                    width : 70,
                    title : '年龄'
                }
                , {
                    field : 'bedId',
                    width : 70,
                    title : '床号'
                } //minWidth：局部定义当前单元格的最小宽度，layui 2.2.1 新增
                , {
                    field : 'hospitalNum',
                    width : 70,
                    title : '病历号'
                }
                , {
                    field : 'admissionDate',
                    width : 80,
                    title : '住院日期',
                    sort : true
                }
                , {
                    field : 'diagnose',
                    width : 70,
                    title : '诊断'
                }
                , {
                    field : 'operationDate',
                    width : 80,
                    title : '手术日期',
                    sort : true
                }
                , {
                    field : 'zgys',
                    width : 170,
                    title : '操作',
                    templet : '#barDemo'
                }
            ] ]
        });
        //监听工具条
        table.on('tool(useruv)', function(obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的DOM对象

            if (layEvent === 'detail') { //查看
                //do something
            } else if (layEvent === 'del') { //删除
                layer.confirm('真的删除行么', function(index) {
                    //obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                    layer.close(index);
                    //向服务端发送删除指令
                    $.ajax({
                        url:"patientsDel.action",
                        type:"POST",
                        data:{
                            "p.id":data.id
                        },
                        dataType:"json",
                        success:function(data){
                            table.reload('test',{});
                        },error:function(){
                            alert("error!")
                        },
                    })
                    //layer.close(index);
                    /* $.post('patientsDel.action',{
                        p.id : data.id,
                    },function(data){
                        table.reload();
                    }) */
                    //table.reload();
                });
            } else if (layEvent === 'edit') { //编辑
                //do something
                location='patientsPreUpdate.action?p.id='+data.id;
                //同步更新缓存对应的值
                /* obj.update({
                    username : '123',
                    title : 'xxx'
                }); */
            }
        });
        var $ = layui.$,
            active = {
                delCheckData : function() { //多选删除
                    var checkStatus = table.checkStatus('test'),
                        data = checkStatus.data;
                    if (null != data && data != "") {
                        var ids = "";
                        for (var index in data) {
                            ids += data[index].id+",";
                        }
                        layer.confirm('真的删除行么', function(index) {
                            layer.close(index);
                            $.post('patientsDelAll.action',{ids:ids},function(data){
                                table.reload('test',{});
                            })
                        })
                    }else{
                        layer.alert("请选中删除行!");
                    }
                },
                reload : function() { //条件查询  
                    var text = $("#demoReload").val();
                    /* $.post('patientsSearch.action', {
                        text : text
                    }, function(data) {
                        alert(data)
                        //table.reload('test', data);
                    }) */
                    table.reload('test', {//重载table表格
                        url : 'patientsSearch.action',
                        where : {
                            text : text
                        }
                    })
                }
                /* getCheckLength : function() { //获取选中数目
                    var checkStatus = table.checkStatus('test'),
                        data = checkStatus.data;
                    layer.msg('选中了：' + data.length + ' 个');
                },
                isAll : function() { //验证是否全选
                    var checkStatus = table.checkStatus('test');
                    layer.msg(checkStatus.isAll ? '全选' : '未全选')
                } */
            };
        //匹配相应的监听按钮
        $('.demoTable .layui-btn').on('click', function() {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    })
</script>
<script type="text/javascript" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

`