CRM-业务主页面index.jsp

素心如月桠

已于 2022-05-20 21:37:14 修改

阅读量1.5k

点赞数 1

分类专栏： CRM 文章标签： bootstrap java 前端

于 2022-05-20 15:44:35 首次发布

本文链接：https://blog.csdn.net/m0_47010003/article/details/124882850

版权

接上一篇：CRM-登录功能回车登录和记住密码

一、要实现的页面

在这里插入图片描述

二、业务主页面代码如下

2.1 <head>内容

使用JSP普通脚本<%%>定义basePath

<%
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + request.getContextPath() + "/";
%>

request.getScheme()获取协议，request.getServerName()获取本机ip，request.getServerPort()获取端口号，request.getpageContext()获取项目路径，最后不忘记加“/”
head中添加base标签，href的值用输出脚本<%= %>获取刚刚定义的basePath字符串
添加jquery-5.3.1.js、bootstrap.min.js和bootstrap.min.css路径
link标签css文件（href=“”），script标签js文件（src=“”）
路径为…/…/…/jquery。。。，然后ctrl+r把所有…/…/…/替换为空格

在这里插入图片描述

2.2 <script>内容

在这里插入图片描述

这个window.onload是实现鼠标悬停到导航栏的li标签，有变色效果的
具体用法如图

2.3 <body>内容

在这里插入图片描述
溢出的内容可以通过滚动呈现

2.3.1 模态框div

模态框、左侧的导航栏、下拉列表、图标的代码是从bootstrap官网上复制的
要实现点击退出弹出模态框的功能
模态框的div的id为isLogout

在这里插入图片描述

2.3.2 顶部div的下拉列表

退出的li标签添加data-target=“#isLogout” data-toggle="modal"属性，实现点击弹出模态框的效果

在这里插入图片描述

2.3.1 中间div的style

中间代码的
在这里插入图片描述

三、实现功能

点击提示框的退出按钮，清除登录数据，跳转到项目首页，项目首页调用Controller层方法自动跳转到登录页面
对退出按钮添加onclick()属性，

<button type="button" class="btn btn-default" data-dismiss="modal" onclick="logout();">退出</button>
<button type="button" class="btn btn-primary" onclick="closeModal();">取消</button>

js标签里添加logout()、closeModal()方法
logout()方法实现调用controller层方法，实现数据删除，并返回到首页
closeModal()方法实现点击取消按钮，模拟这个X的点击事件

在这里插入图片描述
6. 添加id=“closeBtn”

在这里插入图片描述
7. scripte标签实现方法
(1)跳转到controller层UserController.java类调用logout()方法
(2)模拟点击事件

```java
 <script type="text/javascript">
 		//跳转到controller层UserController.java类调用logout()方法
        function logout() {
   
            window.location.href = "settings/qx/user/logout.do";
        }
		//模拟点击事件
        function closeModal() {
   
            $("#closeBtn").click();
        }
    </script>

四、 UserController

4.1 logout()方法

已经实现了1）跳转到登录页面2）验证用户名和密码是否正确、是否激活、是否过期或失效、保存user到session作用域中，如果用户选中Rememben me，就把用户名和密码保存在cookie中。
下面实现清除cookie和session作用域中的数据，返回值为“redirect:/”，重定向跳转

在这里插入图片描述

重点是删除cookie，就是新建一个和保存用户名和密码的Cookie的key值相同的Cookie对象，再把生命周期设置为0
销毁所有session就是调用invalidate()方法

4.2 logout()方法的返回值

最后返回的是 redirect:/，我们发现没有加页面路径，那为什么可以跳转到登录页面

这里是业务主页面的首页，我们在写项目首页时，
定义了一个indexController，

它的RequestMapping(“/”)就是只写了/
给Controller层的index()方法返回值是index
mvc.xml配置了视图解析器，为方法返回值index添加前缀/WEB-INF/pages，后缀.jsp
所以可以访问到index.jsp
在index.jsp中

<script type="text/javascript">
    document.location.href = "/settings/qx/user/toLogin.do";
</script>

调用UserController类的toLogin()方法，跳转到登录页面
所以可以点击退出登录按钮就直接跳转到login.jsp页面

五、 UserController完整代码

package com.lyx.settings.web.controller;


import com.lyx.commons.contants.Contants;
import com.lyx.commons.domain.ReturnObject;
import com.lyx.settings.domain.User;
import com.lyx.settings.service.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;

import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;

@Controller
public class UserController {
   
    @Autowired
    private UserService userService;

    @RequestMapping("/settings/qx/user/toLogin.do")
    public String toLogin() {
   
        return "settings/qx/user/login";
    }

    @RequestMapping("/settings/qx/user/login.do")
    public @ResponseBody Object login(String loginAct, String loginPwd, String isRemPwd, HttpServletResponse response, HttpServletRequest request) {
   
        //封装参数
        Map<String, Object> map = new HashMap<>();
        map.put("LoginAct", loginAct);
        map.put("LoginPwd", loginPwd);
        //调用service层方法
        User user = userService.queryUserByLoginActAndPwd(map);
        ReturnObject returnObject = new ReturnObject