zoukankan      html  css  js  c++  java
  • layUi

    通用实体

    package com.aaa.util;
    
    /**
     * @Author: 0808
     * @Date: 2020/7/13 0013 10:39
     * @Version 1.0
     * 常量类
     */
    public class MyConstants {
       /**保存操作*/
        public static final String SAVE_OPERATION="save";
        /**修改操作*/
        public static final String UPDATE_OPERATION="update";
        /**加密算法*/
        public static final String ALGORITHM_NAME="MD5";
        /**加密次数*/
        public static final   int HASH_ITERATIONS=1000;
        /** 操作成功信息 */
        public static final String OPERATION_SUCCESS_MESSAGE="操作成功";
        /** 操作成功代码 */
        public static final int OPERATION_SUCCESS_CODE=0;
        /** 操作失败信息 */
        public static final String OPERATION_FAIL_MESSAGE="操作失败";
        /** 操作失败代码 */
        public static final int OPERATION_FAIL_CODE=1;
        /** 柴油(大型加油站)阈值第一条数据 */
        public static final int DIESELOIL_BIG=0;
        /** 柴油(中型加油站)阈值第二条数据 */
        public static final int DIESELOIL_BETWEEN=1;
        /** 柴油(小型加油站)阈值第三条数据 */
        public static final int DIESELOIL_SMALL=2;
        /** 汽油(大型加油站)阈值第四条数据 */
        public static final int GASOLINEOIL_BIG=3;
        /** 汽油(中型加油站)阈值第五条数据 */
        public static final int GASOLINEOIL_BETWEEN=4;
        /** 汽油(小型加油站)阈值第六条数据 */
        public static final int GASOLINEOIL_SMALL=5;
        /** 变量为0的值 */
        public static final int INTVALUE_ZERO=0;
    }

    状态码

    package com.cws.db_car.entity;
    
    import lombok.Data;
    
    import java.util.List;
    
    /**
     * @Author: 0808
     * @Date: 2020/7/10 0010 16:10
     * @Version 1.0
     */
    @Data
    public class LayUiTable {
        private int code;
        private String msg;
        private Integer count;
        private List<?> data;
    }

    查询&&模糊&&分页

        /**
         * 查询所有汽车和模糊查询分页
         * @param page
         * @param limit
         * @param searchTypename
         * @return
         */
        @RequestMapping("/listCar")
        @ResponseBody
        public LayUiTable listCar(Integer page, Integer limit , String searchTypename) {
            LayUiTable table = new LayUiTable();
            //多条件查询所需要的集合
            Map<String ,Object> condition= new HashMap(16);
            Wrapper wrapper = new EntityWrapper();
            //添加模糊查询的条件
            if (null != searchTypename && !"".equals(searchTypename)) {
                condition.put("typename", searchTypename);
            }
            int i = tCarService.selectCount(wrapper);
    
            if(i>0){
                //获取当前的系统毫秒数
                Page<TCarVo> pageInfo = new Page(page, limit);
                List<TCarVo> tCarVoList = tCarService.selectList(pageInfo, condition);
                //从分页结果中提取list集合
                table.setCode(MyConstants.OPERATION_SUCCESS_CODE);
                table.setMsg(MyConstants.OPERATION_SUCCESS_MESSAGE);
                table.setData(tCarVoList);
                table.setCount(i);
            }
            return table;
    
        }

    /**
    * 修改用户信息
    *
    * @param
    * @return
    */
    @RequestMapping("/updateInfo")
    @ResponseBody
    public boolean updateUserInfo(TCar tCar) {
    return tCarService.updateById(tCar);
    }

    /**
    * 添加用户信息
    *
    * @param
    * @return
    */
    @RequestMapping("/savaInfo")
    @ResponseBody
    public boolean savaInfo(TCar tCar) {
    return tCarService.insert(tCar);
    }


    /**
    * 批量删除
    *
    * @param
    * @return
    */
    @RequestMapping("/deleteCar")
    @ResponseBody
    public boolean deleteCar(@RequestBody List<TCar> tCarList) {
    List list = new ArrayList();
    for (int i = 0; i < tCarList.size(); i++) {
    list.add(tCarList.get(i).getCarid());
    }
    //System.out.println(list+"=======================");
    return tCarService.deleteBatchIds(list);

    }
     

     前台页面

    <!DOCTYPE html>
    <html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>查询所有列车</title>
        <link rel="stylesheet" th:href="@{/layui/css/layui.css}">
        <script th:src="@{/layui/layui.js}"></script>
    </head>
    <body>
    <script type="text/html" 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="delete"
           hasPermission="system:user:remove">删除</a>
        <!--<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete"  >删除</a>-->
    </script>
    <!--=============================条件查询==================================-->
    <div class="layui-card" style="padding-top: 30px">
        <form class="layui-form">
            <div class="layui-inline">
                <label class="layui-form-label">汽车类型</label>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="searchTypename" name="searchTypename" placeholder="汽车类型"
                           width="80px">
                </div>
            </div>
            <div class="layui-inline">
                <button class="layui-btn" lay-submit="search_submits" lay-filter="search_filter">查询</button>
                <button id="search_reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </form>
    </div>
    <div class="layui-fluid">
    
        <div class="layui-card">
            <table id="demo" lay-filter="userTable"></table>
        </div>
    </div>
    <!--===========================================更新用户信息==============================================================-->
    <form class="layui-form" action="" id="update_user_form" style="display: none" lay-filter="update_user_form">
        <!--隐藏输入框,保存主键-->
        <input type="hidden" name="carid">
    
        <div class="layui-form-item">
            <label class="layui-form-label">汽车编号</label>
            <div class="layui-input-inline">
                <input type="text" name="carno" required lay-verify="required" placeholder="汽车编号" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
    
        <div class="layui-form-item">
            <label class="layui-form-label">汽车类型</label>
            <div class="layui-input-block"  >
                <select name="cartype">
                    <option th:each="list:${tCartypeList}" th:value="${list.typeid}" th:text="${list.typename}"></option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">汽车库存</label>
            <div class="layui-input-inline">
                <input type="text" name="carstatus" required lay-verify="required" placeholder="汽车库存" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">描述</label>
            <div class="layui-input-inline">
                <input type="text" name="remark" required lay-verify="required" placeholder="描述" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">汽车价格</label>
            <div class="layui-input-inline">
                <input type="text" name="caretel" required lay-verify="required" placeholder="汽车价格" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="formUpdateUser">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
    <!--===========================================添加用户信息==============================================================-->
    <form class="layui-form" action="" id="save_user_form" style="display: none" lay-filter="save_user_form">
        <!--隐藏输入框,保存主键-->
        <input type="hidden" name="carid">
    
        <div class="layui-form-item">
            <label class="layui-form-label">汽车编号</label>
            <div class="layui-input-inline">
                <input type="text" name="carno" id="carno" required lay-verify="required" placeholder="汽车编号" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
    
        <div class="layui-form-item">
            <label class="layui-form-label">汽车类型</label>
            <div class="layui-input-block"  >
                <select name="cartype">
                    <option th:each="list:${tCartypeList}" th:value="${list.typeid}" th:text="${list.typename}"></option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">汽车库存</label>
            <div class="layui-input-inline">
                <input type="text" name="carstatus" required lay-verify="required" placeholder="汽车库存" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">描述</label>
            <div class="layui-input-inline">
                <input type="text" name="remark" required lay-verify="required" placeholder="描述" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">汽车价格</label>
            <div class="layui-input-inline">
                <input type="text" name="caretel" required lay-verify="required" placeholder="汽车价格" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
    
    <script type="text/html" id="toolbarDemo">
        <div class="layui-btn-container">
            <button class="layui-btn layui-btn-sm" lay-event="addUser">添加</button>
            <button class="layui-btn layui-btn-danger layui-btn-sm" lay-event="deleteBatch">删除</button>
        </div>
    </script>
    <script>
        layui.use(['layer', 'form', 'table', 'jquery'], function () {
            var table = layui.table;
            var form = layui.form;
            var $ = layui.jquery;
    
            //第一个实例
            var myTable = table.render({
                elem: '#demo'
                , id: 'tableReload'//重载数据表格
                , height: 420
                , url: '/tCar/listCar' //数据接口
                , page: true //开启分页
                , limit: 5//默认一页显示5条数据
                , limits: [5, 10, 15, 20, 50, 100]//默认一页显示5条数据
                , toolbar: '#toolbarDemo'//此处的id是html代码段
                , cols: [
                    [ //表头
                        {field: 'carid', title: '复选框编号', sort: true, fixed: 'left', checkbox: true}
    
                        , {field: 'carno', title: '汽车编号',  sort: true,  '7%',}
                        , {field: 'typename', title: '汽车类型',  '9%',
                        templet: function (d) {
                            return d.tcartype.typename;
                        }
                    }
                        , {field: 'carstatus', title: '汽车库存',  '7%',}
                        , {field: 'remark', title: '描述'}
                        , {field: 'caretel', title: '汽车价格'}
                        , {title: '操作',  235, toolbar: '#barDemo'}
                    ]
                ]
            });
            //监听头工具栏事件
            table.on('toolbar(userTable)', function (obj) {
                var checkStatus = table.checkStatus(obj.config.id)
                    , data = checkStatus.data; //获取选中的数据
                switch (obj.event) {
                    case 'addUser':
                        layer.open({
                            title: '添加员工',
                            type: 1,
                            content: $('#save_user_form'),
                            area: ['700px', '530px']
                        });
                        break;
                    case 'update':
                        if (data.length === 0) {
                            layer.msg('请选择一行');
                        } else if (data.length > 1) {
                            layer.msg('只能同时编辑一个');
                        } else {
                            layer.alert('编辑 [id]:' + checkStatus.data[0].id);
                        }
                        break;
                    case 'deleteBatch':
                        if (data.length === 0) {
                            layer.msg('请选择一行');
                        } else {
                            //对于删除或者是其他敏感操作,一定要让用户确认。
                            layer.confirm('确定要删除吗?', function () {
                                //请求后台批量删除接口
                                $.ajax({
                                    url: '/tCar/deleteCar',
                                    dataType: 'json',
                                    contentType: "application/json;charset=UTF-8",
                                    type: 'POST',
                                    data: JSON.stringify(data),//将js对象转成json串传入到后台
                                    success: function (result) {
                                        layer.closeAll();//关闭对话框
                                        layer.msg("删除成功");
                                        myTable.reload();//重新加载表格数据
                                    }
                                })
    
                            })
    
                        }
                        break;
                }
                ;
            });
    
            //监听保存用户表单的提交
            form.on('submit(formDemo)', function (data) {
                $.ajax({
                    url: '/tCar/savaInfo',
                    dataType: 'json',
                    type: 'POST',
                    data: data.field,
                    success: function (result) {
                        layer.closeAll();//关闭对话框
                        layer.msg("添加成功");
                        myTable.reload();//重新加载表格数据
                    }
                })
                return false;
            });
            //监听修改用户表单的提交
            form.on('submit(formUpdateUser)', function (data) {
                $.ajax({
                    url: '/tCar/updateInfo',
                    dataType: 'json',
                    type: 'POST',
                    data: data.field,
                    success: function (result) {
                        layer.closeAll();//关闭对话框
                        layer.msg("修改成功");
                        myTable.reload();//重新加载表格数据
                    }
                })
                return false;
            });
            //登录名校验
            $("#carno").blur(function () {
                var node = this;
                console.log(node)
                $.ajax({
                    type: "POST",
                    url: "/tCar/checkCarno",
                    async: false, //改为同步请求
                    data: {carno: node.value},
                    dataType: 'json',
                    success: function (data) {
                        if (data.code == 0) {
                        } else {
                            node.focus();
                            layer.msg(data.msg, {icon: 5});
                        }
                    }
                });
            });
    
            // 获取选中复选框项
            function selectCheckeds(name) {
                var checkeds = "";
                // 保存用户
                if (name != null) {
                    $('input:checkbox[name="' + name + '"]:checked').each(function (i) {
                        if (0 == i) {
                            checkeds = $(this).val();
                        } else {
                            checkeds += ("," + $(this).val());
                        }
                    });
                    //修改用户
                } else {
                    $('.role_check:checked').each(function (i) {
                        if (0 == i) {
                            checkeds = $(this).val();
                        } else {
                            checkeds += ("," + $(this).val());
                        }
                    });
                }
    
                return checkeds;
            }
    
            //监听查询表单的提交事件
            form.on('submit(search_filter)', function (data) {
                var formData = data.field;
                //数据表格重载
                table.reload('tableReload', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    , where: {//这里传参  向后台
                        searchTypename: formData.searchTypename,
                    }
                });
                return false;//false:阻止表单跳转  true:表单跳转
            });
            //监听重置密码表单的提交事件
            form.on('submit(formResetPassword-flter)', function (data) {
                $.ajax({
                    url: '/user/resetPassword',
                    dataType: 'json',
                    type: 'POST',
                    data: data.field,
                    success: function (result) {
                        layer.closeAll();//关闭对话框
                        layer.msg(result.msg);
                    }
                })
                return false;
            });
            //监听行工具事件
            table.on('tool(userTable)', function (obj) { //注:tool 是工具条事件名,userTable 是 table 原始容器的属性 lay-filter="对应的值"
                var data = obj.data //获得当前行数据
                var layEvent = obj.event; //获得 lay-event 对应的值
                if (layEvent === 'detail') {
                    layer.msg('查看操作');
                } else if (layEvent === 'delete') {
                    layer.confirm('真的删除行么', function (index) {
                        /*  obj.del(); //删除对应行(tr)的DOM结构
                          layer.close(index);*/
                        //向服务端发送删除指令
                        //console.log(data);
                        $.ajax({
                            url: '/user/deleteUser',
                            dataType: 'json',
                            type: 'POST',
                            data: {userId: data.userId},
                            success: function (result) {
                                layer.closeAll();//关闭对话框
                                layer.msg(result.msg);
                                myTable.reload();//重新加载表格数据
                            }
                        })
                    });
                }  else if (layEvent === 'resetPassword') {
                    form.val('reset_password_form', {
                        "userId": data.userId});
                    layer.open({
                        title: '重置密码',
                        type: 1,
                        content: $('#reset_password_form'),
                        area: ['400px', '150px']
                    });
                } else if (layEvent === 'edit') {
    
                    //将修改前的数据赋值给修改表单
                    form.val('update_user_form', {
                        "carid": data.carid
                        , "carno": data.carno // "name": "value"
                        , "cartype": data.cartype
                        , "carstatus": data.carstatus
                        , "remark": data.remark
                        , "caretel": data.caretel
    
                    });
                    //设置checkbox回显
                    $.ajax({
                        url: '/tCar/updateInfo',
                        dataType: 'json',
                        type: 'POST',
                        data: {carid: data.carid},
                        success: function (result) {
                            console.log(result.data)
                            form.val('update_user_form', result.data);
                        }
                    });
                    layer.open({
                        title: '编辑用户',
                        type: 1,
                        content: $('#update_user_form'),
                        area: ['500px', '480px']
                    });
                }
            });
    
        });
    </script>
    </body>
    </html>
  • 相关阅读:
    php date 时间差
    array_merge 和 + 号的的区别
    apache 添加https后导致http无法访问
    php 获取url
    TP5 事务处理
    LeetCode 每日一题 (盛最多水的容器)
    LeetCode 每日一题 (字符串转换整数 (atoi))
    LeetCode 每日一题(5. 最长回文子串)
    LeetCode 每日一题 (3 无重复字符的最长子串)
    LeetCode 每日一题 (两数相加)
  • 原文地址:https://www.cnblogs.com/cwshuo/p/13562624.html
Copyright © 2011-2022 走看看