基于javaweb+jsp的共享单车管理系统(JavaWeb JSP MySQL Servlet SSM SpringBoot Layui Ajax)

本文链接：https://blog.youkuaiyun.com/m0_70404025/article/details/124520523

JavaWeb JavaBean JSP MVC MySQL Tomcat JavaScript Layui Ajax

基础JSP+Servlet或JSP+SSM(Spring、SpringMVC、MyBatis)框架或JSP+SSM+Maven(pom.xml)框架或SpringBoot…均可修改

开发工具：eclipse/idea/myeclipse/sts等均可配置运行

适用

课程设计，大作业，毕业设计，项目练习，学习演示等

        <where>
            <if test="searchColumn != null and searchColumn != '' and keyword != null and keyword != ''">
                ${searchColumn} LIKE CONCAT('%',#{keyword},'%')  AND
            </if>
            1=1
        </where>
        ORDER BY id ASC
        <if test="startIndex != null and pageSize != null">
            LIMIT #{startIndex},#{pageSize};
        </if>
    </select>
    <!--数量-->
    <select id="getAllCount" parameterType="java.util.Map" resultType="Integer">
        SELECT COUNT(*) FROM `t_che`
        <where>
            <if test="searchColumn != null and searchColumn != '' and keyword != null and keyword != ''">
                ${searchColumn} LIKE CONCAT('%',#{keyword},'%')  AND

                        },
                        {
                            field: 'xiuRen',
                            title: '维修人员',
                        },
                        {
                            field: 'xiuPhone',
                            title: '联系方式',
                        },
                        {
                            field: 'xiuStatus',
                            title: '状态',
                            templet: vo => vo.xiuStatus ? vo.xiuStatus : "",
                        },
                        {
                            field: 'xiuText',
                            title: '备注',
                        },
                    {
                        align: 'center',
                        fixed: 'right',
                        title: '操作',
                        width: 130,
                        templet: vo => {
                            let flag = ${loginUser.userType == '管理员'};

        params.put("searchColumn", searchColumn);//要查询的列
        params.put("keyword", keyword);//查询的关键字
        response.getWriter().println(com.alibaba.fastjson.JSONObject.toJSONString(xiuService.list(params).get("list")));
    }
}
package com.demo.controller;

import com.demo.util.Util;
import com.demo.service.UserService;
import com.demo.vo.User;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import java.io.Serializable;
import java.util.Arrays;

</body>
</html>
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>共享单车管理系统</title>
    <link rel="stylesheet" href="js/layui/css/layui.css">
    <script src="js/jquery.js"></script>
    <script src="js/layer.js"></script>
</head>


    /**
     * 为防止页面传进来的内容因为编码不同等原因造成乱码，这里作统一的转换
     *
     * @param parameterName
     * @return
     */
    public static String decode(javax.servlet.http.HttpServletRequest request, String parameterName) {
        String str;
        if ((str = request.getParameter(parameterName)) == null) {
            return null;
        }
        try {

    layui.use('table', function () {
        let table = layui.table;
        table.render({
            elem: '#myData',
            id: 'myTable',
            url: 'userList',
            parseData: function (res) { //res：即为原始返回的数据
                let result = this.page.curr ? res.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr) : res.slice(0, this.limit);
                return {
                    "code": 0, //解析接口状态
                    "msg": '', //解析提示文本
                    "count": res.length, //解析数据长度（集合个数）
                    "data": result //解析数据列表
                };
            },
            page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'], //自定义分页布局
                groups: 1, //只显示 1 个连续页码
                first: false, //不显示首页
                last: false, //不显示尾页
            },
            toolbar: '#myToolbar', //开启头部工具栏，并为其绑定左侧模板
            defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
                title: '提示',
                layEvent: 'LAYTABLE_TIPS',
                icon: 'layui-icon-tips'
            }],

                <if test ='cheRen != null'>`che_ren` = #{cheRen},</if>
                <if test ='chePhone != null'>`che_phone` = #{chePhone},</if>
                <if test ='cheType != null'>`che_type` = #{cheType},</if>
                <if test ='cheWei != null'>`che_wei` = #{cheWei},</if>
                <if test ='cheStatus != null'>`che_status` = #{cheStatus},</if>
                <if test ='cheText != null'>`che_text` = #{cheText}</if>
        </set>
        WHERE `id` = #{id}
    </update>

    <!--获取-->
    <select id="findById" resultMap="BaseResultMap">
        SELECT <include refid="Base_Column_List" /> FROM `t_che` WHERE `id` = #{id}
    </select>

    <!--列表-->
    <select id="findAllSplit" parameterType="java.util.Map" resultMap="BaseResultMap">
        SELECT <include refid="Base_Column_List" /> FROM `t_che`
        <where>
            <if test="searchColumn != null and searchColumn != '' and keyword != null and keyword != ''">
                ${searchColumn} LIKE CONCAT('%',#{keyword},'%')  AND
            </if>
            1=1
        </where>
        ORDER BY id ASC
        <if test="startIndex != null and pageSize != null">

                    fixed: false, //不固定
                    maxmin: true,
                    content: 'userEditPre?id=' + data.id
                });
                obj.update({});//同步更新缓存对应的值
            } else if (layEvent === 'info') { //详情
                layer.open({
                    type: 2,
                    area: ['800px', '650px'],
                    fixed: false, //不固定
                    maxmin: true,
                    content: 'userGet?id=' + data.id
                });
                obj.update({});//同步更新缓存对应的值
            } else if (layEvent === 'LAYTABLE_TIPS') {
                layer.alert('Hi，头部工具栏扩展的右侧图标。');
            }
        });
        //头工具栏事件
        table.on('toolbar(myTable)', function (obj) {

</script>
<script>
    function arrayBufferToBase64(buffer) {
        let binary = '';
        let bytes = new Uint8Array(buffer);
        let len = bytes.byteLength;
        for (let i = 0; i < len; i++) {
            binary += String.fromCharCode(bytes[i]);
        }
        return window.btoa(binary);
    }

    layui.use('table', function () {
        let table = layui.table;
        table.render({
            elem: '#myData',
            id: 'myTable',
            url: 'noticeList',
            parseData: function (res) { //res：即为原始返回的数据
                let result = this.page.curr ? res.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr) : res.slice(0, this.limit);
                return {
                    "code": 0, //解析接口状态
                    "msg": '', //解析提示文本
                    "count": res.length, //解析数据长度（集合个数）
                    "data": result //解析数据列表

                    area: ['800px', '550px'],
                    fixed: false, //不固定
                    maxmin: true,
                    content: 'xiu_add.jsp'
                });
            } else {
                //layer.alert('这是工具栏右侧自定义的一个图标按钮');
            }
        });
        //搜索
        let $ = layui.$, active = {
            reload: function () {
                let url = 'xiuList?keyword=' + $('#search_keyword').val() + '&searchColumn=' + $('#searchColumn').val();
                //执行重载
                table.reload('myTable', {
                    url: url,
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                });
            }
        };
        $('.searchTable .layui-btn').on('click', function () {
            let type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });

运行环境

Java≥6、Tomcat≥7.0、MySQL≥5.5

开发工具

eclipse/idea/myeclipse/sts等均可配置运行

技术框架

JavaWeb JavaBean JSP MVC MySQL Tomcat JavaScript Layui Ajax

基础JSP+Servlet或JSP+SSM(Spring、SpringMVC、MyBatis)框架或JSP+SSM+Maven(pom.xml)框架或SpringBoot…均可修改

适用

课程设计，大作业，毕业设计，项目练习，学习演示等

功能说明

20220319004015

20220319004016

20220319004017

20220319004018

20220319004019

20220319004020

20220319004021

20220319004022

20220319004023

20220319004024

20220319004025

20220319004026

document