Vue+SSM+Element-Ui实现前后端分离(3)
2024-10-21 16:25:52
前言：经过博文（1）vue搭建，（2）ssm搭建，到这里就该真真切切的实现小功能了<-_->
规划：实现登录，用户列表查询，访问日志aop;
开始先解决跨域：在目录config/index.js配置
1 'use strict'
2 // Template version: 1.3.1
3 // see http://vuejs-templates.github.io/webpack for documentation.
4
5 const path = require('path')
6
7 module.exports = {
8 dev: {
9
10 // Paths
11 assetsSubDirectory: 'static',
12 assetsPublicPath: '/',
13 /*
14 '/api' 为匹配项，target 为被请求的后台地址
15 changeOrigin设置为true,那么本地会虚拟一个服务端接收你的请求并代你发送该请求，这样就不会有跨域问题了，只适用于开发环境.如果上线的话，可以考虑nginx
16 pathRewrite 是用来重写地址，将前缀 '/api' 转为 '/'，如果本身的接口地址就有 '/api' 这种通用前缀，就可以把 pathRewrite 删掉，或者你可以自定义一个公共接口匹配地址
17 如：请求http://127.0.0.1:8080/user/queryUserList,就可以写成：/api/user/queryUserList
18 */
19 proxyTable: {
20 '/api':{
21 target:'http://127.0.0.1:8080',
22 changeOrigin:true,
23 pathRewrite:{
24 '^/api':'/'
25 }
26 }
27 },
28
29 // Various Dev Server settings
30 host: 'localhost', // can be overwritten by process.env.HOST
31 port: 6666, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
32 autoOpenBrowser: false,
33 errorOverlay: true,
34 notifyOnErrors: true,
35 poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
36
37
38 /**
39 * Source Maps
40 */
41
42 // https://webpack.js.org/configuration/devtool/#development
43 devtool: 'cheap-module-eval-source-map',
44
45 // If you have problems debugging vue-files in devtools,
46 // set this to false - it *may* help
47 // https://vue-loader.vuejs.org/en/options.html#cachebusting
48 cacheBusting: true,
49
50 cssSourceMap: true
51 },
52
53 build: {
54 // Template for index.html
55 index: path.resolve(__dirname, '../dist/index.html'),
56
57 // Paths
58 assetsRoot: path.resolve(__dirname, '../dist'),
59 assetsSubDirectory: 'static',
60 assetsPublicPath: '/',
61
62 /**
63 * Source Maps
64 */
65
66 productionSourceMap: true,
67 // https://webpack.js.org/configuration/devtool/#production
68 devtool: '#source-map',
69
70 // Gzip off by default as many popular static hosts such as
71 // Surge or Netlify already gzip all static assets for you.
72 // Before setting to `true`, make sure to:
73 // npm install --save-dev compression-webpack-plugin
74 productionGzip: false,
75 productionGzipExtensions: ['js', 'css'],
76
77 // Run the build command with an extra argument to
78 // View the bundle analyzer report after build finishes:
79 // `npm run build --report`
80 // Set to `true` or `false` to always turn it on or off
81 bundleAnalyzerReport: process.env.npm_config_report
82 }
83 }
config/index.js
日志sql脚本
1 /*
2 Navicat Premium Data Transfer
3
4 Source Server : ssm
5 Source Server Type : MySQL
6 Source Server Version : 80011
7 Source Host : localhost:3306
8 Source Schema : ssm
9
10 Target Server Type : MySQL
11 Target Server Version : 80011
12 File Encoding : 65001
13
14 Date: 05/08/2019 16:44:14
15 */
16
17 SET NAMES utf8mb4;
18 SET FOREIGN_KEY_CHECKS = 0;
19
20 -- ----------------------------
21 -- Table structure for tbsyslog
22 -- ----------------------------
23 DROP TABLE IF EXISTS `tbsyslog`;
24 CREATE TABLE `tbsyslog` (
25 `id` int(11) NOT NULL AUTO_INCREMENT,
26 `logId` varchar(32) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
27 `accessDate` datetime(0) NULL DEFAULT NULL,
28 `requestType` varchar(20) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
29 `accessInterface` varchar(100) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
30 `interfaceParams` text CHARACTER SET utf8 COLLATE utf8_general_ci NULL,
31 `accessSource` varchar(50) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
32 `accessIp` varchar(50) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
33 `executeTime` int(11) NULL DEFAULT NULL,
34 PRIMARY KEY (`id`) USING BTREE
35 ) ENGINE = InnoDB AUTO_INCREMENT = 761 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;
36
37 SET FOREIGN_KEY_CHECKS = 1;
tbSysLog.sql
前端项目结构图 后端项目结构图
一、前端
1、安装axios cnpm install axios -S
2、在config/dev.env.js里添加 BASE_URL:'"/api"' （因为这里在3里要引用，也可不配置，你在3里写死就行）
3、封装axios
1 import axios from 'axios' //引入axios
2
3 /* 创建axios实例 */
4 const service = axios.create({
5 //这个process.env.BASE_URL在config/dev.evn.js、prod.evn.js里面进行配置
6 baseURL: process.env.BASE_URL, // api的base_url
7 timeout: 5000 // 请求超时时间
8 });
9
10 /*response拦截器，进行错误处理*/
11 service.interceptors.response.use(response => {
12 return response;
13 },
14 error => {
15 // 失败处理
16 switch (error.response.status) {
17 case 400:
18 error.message = '错误请求'
19 break;
20 case 401:
21 error.message = '未授权，请重新登录'
22 break;
23 case 403:
24 error.message = '拒绝访问'
25 break;
26 case 404:
27 error.message = '请求错误,未找到该资源'
28 break;
29 case 405:
30 error.message = '请求方法未允许'
31 break;
32 case 408:
33 error.message = '请求超时'
34 break;
35 case 500:
36 error.message = '服务器端出错'
37 break;
38 case 501:
39 error.message = '网络未实现'
40 break;
41 case 502:
42 error.message = '网络错误'
43 break;
44 case 503:
45 error.message = '服务不可用'
46 break;
47 case 504:
48 error.message = '网络超时'
49 break;
50 case 505:
51 error.message = 'http版本不支持该请求'
52 break;
53 default:
54 error.message = `连接错误${error.response.status}`
55 }
56 return Promise.reject(error);
57 }
58 );
59
60 /*reuqest拦截器*/
61 service.interceptors.request.use(config => {
62 return config;
63 },
64 error => {
65 return Promise.reject(error);
66 }
67 );
68
69 export default service;
utils/request.js
4、封装一个公共的axios请求API
1 import request from '@/utils/request'
2
3 export function commonAPI(api,postData){
4 if(postData===''){
5 return request({
6 url:'/'+api,
7 method:'post'
8 })
9 }else{
10 return request({
11 url:'/'+api,
12 method:'post',
13 data:postData
14 })
15 }
16 }
api/commonAPI.js
5、封装一个日期格式转化的api
1 /**
2 * 格式为yyyy-MM-dd OR yyyy-MM-dd HH:mm:ss
3 * @param {Object} date 日期对象
4 * @param {Object} hasTime 是否有时间 true有时间，false没有时间
5 */
6 export function formatDate(date,hasTime){
7 var hasTime = hasTime;//可传第二个参数false，返回yyyy-MM-dd
8 var d = date;
9 var year = d.getFullYear();
10 var month = (d.getMonth()+1)<10 ? '0'+(d.getMonth()+1) : (d.getMonth()+1);
11 var day = d.getDate()<10 ? '0'+d.getDate() : d.getDate();
12 var hour = d.getHours()<10 ? '0'+d.getHours() : d.getHours();
13 var minute = d.getMinutes()<10 ? '0'+d.getMinutes() : d.getMinutes();
14 var second = d.getSeconds()<10 ? '0'+d.getSeconds() : d.getSeconds();
15 if(hasTime){
16 return [year, month, day].join('-') + " " + [hour, minute, second].join(':');
17 }else{
18 return [year, month, day].join('-');
19 }
20 }
utils/index.js
6、vue文件
1 <template>
2 <div class="box">
3 <div id="login" style="width: 320px;height: 300px;text-align: center;">
4 <el-form :model="loginForm" ref="loginForm" :rules="rules">
5 <el-form-item>
6 <span style="color: white;font-family: 楷体;font-size: 26px;">用 户 登 录 </span>
7 </el-form-item>
8 <el-form-item prop="userName">
9 <el-input type="text" v-model="loginForm.userName" placeholder="用户名">
10 <template slot="prepend"><i class="el-icon-user" style="font-size: 20px; color: white;"></i></template>
11 </el-input>
12 </el-form-item>
13 <el-form-item prop="password">
14 <el-input type="text" v-model="loginForm.password" placeholder="密码" show-password>
15 <template slot="prepend"><i class="el-icon-lock" style="font-size: 20px;color: white;"></i></template>
16 </el-input>
17 </el-form-item>
18 <el-form-item>
19 <el-button type="primary" size="medium" :loading="loading" style="font-size: 20px;font-family: 微软雅黑;width: 320px;"
20 @click="clickLogin">登 录</el-button>
21 </el-form-item>
22 </el-form>
23 </div>
24 </div>
25 </template>
26
27 <script>
28 import {
29 commonAPI
30 } from '@/api/commonAPI';
31 export default {
32 data() {
33 var validateUserName = (rule, value, callback) => {
34 if (value.length === 0) {
35 return callback(new Error('请输入用户名'))
36 } else {
37 callback()
38 }
39 }
40 var validatePassword = (rule, value, callback) => {
41 if (value.length === 0) {
42 callback(new Error('请输入密码'))
43 } else if (value.length < 3) {
44 callback(new Error('密码不能小于3位'))
45 } else {
46 callback()
47 }
48 }
49 return {
50 loginForm: {
51 userName: '',
52 password: ''
53 },
54 loading: false, //登陆加载效果
55 rules: {
56 userName: [{
57 required: true,
58 trigger: 'blur',
59 validator: validateUserName
60 }],
61 password: [{
62 required: true,
63 trigger: 'blur',
64 validator: validatePassword
65 }]
66 }
67 }
68 },
69 methods: {
70 clickLogin() {
71 this.$refs.loginForm.validate(valid => {
72 if (valid) {//校验成功
73 this.loading = true
74 setTimeout(() => {//为了看到登录转圈圈的加载效果，这里来一个延迟2秒发送请求
75 //封装的公共请求API
76 commonAPI('queryUser', this.loginForm).then(res => {
77 let data = res.data;
78 if (data.info.code === '0' && data.data === 'OK') {
79 this.$router.push({
80 name: 'layoutYHGL'
81 });
82 } else {
83 this.$notify({
84 title: '登录提示',
85 message: '用户名或密码错误',
86 position: 'bottom-right',
87 type: 'error'
88 });
89 this.loading = false;
90 }
91 }).catch(error=>{
92 this.loading = false;
93 this.$notify({//这里采用element ui的一个错误显示效果模板
94 title: '登录提示',
95 message: error.message,
96 position: 'bottom-right',
97 type: 'error'
98 });
99 })
100 }, 2000);
101 } else {
102 return false;
103 }
104 })
105 }
106 }
107 }
108 </script>
109
110 <style scoped="scoped">
111 .box {
112 display: flex;
113 height: 100%;
114 justify-content: center;
115 align-items: center;
116 }
117 </style>
118 <style>
119 .el-input-group__prepend {
120 padding: 0px 15px;
121 background-color: #CCCCCC;
122 border: 1 solid #72767B;
123 }
124
125 body {
126 background-color: #72767B;
127 margin: 0px;
128 }
129 </style>
login/Login.vue
1 <template>
2 <el-container>
3 <el-header style="background-color:white">
4 <el-form :inline="true" :model="formInline" class="demo-form-inline" size="mini">
5 <el-form-item label="访问时间">
6 <el-date-picker class="dateStyle" v-model="formInline.beginTime" value-format="yyyy-MM-dd HH:mm:ss" @change="dataFormat" type="datetime" placeholder="选择日期时间"></el-date-picker>
7 至 <el-date-picker class="dateStyle" v-model="formInline.endTime" value-format="yyyy-MM-dd HH:mm:ss" @change="dataFormat" type="datetime" placeholder="选择日期时间"></el-date-picker>
8 </el-form-item>
9 <el-form-item>
10 <el-button type="primary" class="btn" @click="onSubmit"><i class="el-icon-search"></i>查询</el-button>
11 </el-form-item>
12 <el-form-item>
13 <el-button type="danger" class="btn" @click="resetting"><i class="el-icon-refresh"></i>重置</el-button>
14 </el-form-item>
15 </el-form>
16 </el-header>
17 <el-main class="elMain">
18 <el-table v-loading="loading" :data="tableData" height="100%" stripe border size="mini">
19 <el-table-column align="center" label="访问时间" prop="accessDate" width="140"></el-table-column>
20 <el-table-column align="center" label="请求方式" prop="requestType" width="90"></el-table-column>
21 <el-table-column align="center" label="请求接口" prop="accessInterface" width="280"></el-table-column>
22 <el-table-column header-align="center" align="left" label="接口参数" width="90">
23 <template slot-scope="scope" v-if="scope.row.interfaceParams">
24 <el-popover v-if="scope.row.interfaceParams.length>10" placement="left-end" width="200" trigger="hover"
25 :content="scope.row.interfaceParams">
26 <span slot="reference" style="text-overflow: ellipsis;white-space:nowrap;overflow: hidden;">{{scope.row.interfaceParams}}</span>
27 </el-popover>
28 <span v-else>{{scope.row.interfaceParams}}</span>
29 </template>
30 </el-table-column>
31 <el-table-column align="center" label="访问来源" prop="accessSource" width="263"></el-table-column>
32 <el-table-column align="center" label="访问IP" prop="accessIp" width="130"></el-table-column>
33 <el-table-column align="center" label="执行时长" prop="executeTime" width="90"></el-table-column>
34 </el-table>
35 </el-main>
36 <el-footer>
37 <div style="padding: 15px 0;text-align: right;">
38 <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="formInline.pageNum"
39 :page-sizes="pageSizes" :page-size="formInline.pageSize" layout="total, sizes, prev, pager, next, jumper"
40 :total="pageTotal">
41 </el-pagination>
42 </div>
43 </el-footer>
44
45 </el-container>
46 </template>
47
48 <script>
49 import {formatDate} from '@/utils/index';
50 import {commonAPI} from '@/api/commonAPI';
51 export default {
52 data() {
53 return {
54 tableData: [],
55 loading: false,
56 formInline: {
57 pageNum: 1,
58 pageSize: 10,
59 beginTime: new Date(new Date().getTime()-3600*1000*24*7),
60 endTime: new Date()
61 },
62 pageSizes: [5, 10, 15, 20],
63 pageTotal: 0
64 }
65 },
66 created() {
67 this.formInline.beginTime=formatDate(this.formInline.beginTime,true);
68 this.formInline.endTime=formatDate(this.formInline.endTime,true);
69 this.getData();
70 },
71 methods: {
72 getData() {
73 this.loading = true,
74 commonAPI('sysLogList',this.formInline)
75 .then(res => {
76 this.loading = false;
77 this.tableData = res.data.data.rows;
78 this.pageTotal = res.data.data.total;
79 })
80 },
81 dataFormat(val){
82 console.log(val);
83 },
84 onSubmit() {//查询
85 this.getData();
86 },
87 resetting() {//重置
88 this.formInline.beginTime=formatDate(new Date(new Date().getTime()-3600*1000*24*7),true);
89 this.formInline.endTime=formatDate(new Date(),true);
90 this.getData();
91 },
92 handleSizeChange(val) {
93 //console.log(`每页 ${val} 条`);
94 this.formInline.pageSize = val;
95 this.formInline.pageNum = 1;
96 this.getData();
97 },
98 handleCurrentChange(val) {
99 //console.log(`当前页: ${val}`);
100 this.formInline.pageNum = val;
101 this.getData();
102 }
103 }
104 }
105 </script>
106
107 <style scoped>
108 .dateStyle,.btn {
109 margin-top: 18px;
110 }
111
112 .elMain {
113 height: 418px;
114 }
115 </style>
116 <style>
117 .el-main {
118 padding: 5px 10px;
119 }
120
121 .el-table th {
122 height: 45px;
123 font-size: 16px;
124 font-family: 微软雅黑;
125 font-weight: 500;
126 color: darkblue;
127 }
128
129 body {
130 margin: 0px;
131 }
132 </style>
sys/SysLogList.vue
1 <template>
2 <el-container>
3 <el-header style="background-color:white">
4 <el-form :inline="true" :model="formInline" class="demo-form-inline" size="mini">
5 <el-form-item label="用户名">
6 <el-input v-model="formInline.userName" placeholder="用户名" class="elInput"></el-input>
7 </el-form-item>
8 <el-form-item label="性别">
9 <el-select v-model="formInline.sex" class="elInput">
10 <el-option label="全部" value=""></el-option>
11 <el-option label="男" value="0"></el-option>
12 <el-option label="女" value="1"></el-option>
13 </el-select>
14 </el-form-item>
15 <el-form-item>
16 <el-button type="primary" class="btn" @click="onSubmit"><i class="el-icon-search"></i>查询</el-button>
17 </el-form-item>
18 <el-form-item>
19 <el-button type="danger" class="btn" @click="resetting"><i class="el-icon-refresh"></i>重置</el-button>
20 </el-form-item>
21 </el-form>
22 </el-header>
23 <el-main class="elMain">
24 <el-table v-loading="loading" :data="tableData" height="100%" stripe border size="mini">
25 <el-table-column align="center" label="编号" prop="uid"></el-table-column>
26 <el-table-column align="center" label="用户名" prop="userName"></el-table-column>
27 <el-table-column align="center" label="姓名" prop="uName"></el-table-column>
28 <el-table-column align="center" label="年龄" prop="age"></el-table-column>
29 <el-table-column align="center" label="性别">
30 <template slot-scope="scope">
31 <span v-if="scope.row.sex===0">男</span>
32 <span v-if="scope.row.sex===1">女</span>
33 </template>
34 </el-table-column>
35 </el-table>
36 </el-main>
37 <el-footer>
38 <div style="padding: 15px 0;text-align: right;">
39 <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="formInline.pageNum"
40 :page-sizes="pageSizes" :page-size="formInline.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="pageTotal">
41 </el-pagination>
42 </div>
43 </el-footer>
44 </el-container>
45 </template>
46
47 <script>
48 import {commonAPI} from '@/api/commonAPI'
49 export default {
50 data() {
51 return {
52 tableData: [],
53 loading: false,
54 formInline: {
55 userName: '',
56 sex: '',
57 pageNum:1,
58 pageSize:10
59 },
60 pageSizes:[5, 10, 15, 20],
61 pageTotal:0
62 }
63 },
64 created() {
65 this.getData();
66 },
67 methods: {
68 getData() {
69 this.loading = true,
70 commonAPI('queryUserList',this.formInline)
71 .then(res => {
72 this.loading = false;
73 this.tableData = res.data.data.rows;
74 this.pageTotal=res.data.data.total;
75 })
76 },
77 onSubmit() {
78 this.getData();
79 },
80 resetting() {
81 this.formInline.userName = '';
82 this.formInline.sex = '';
83 this.getData();
84 },
85 handleSizeChange(val) {
86 //console.log(`每页 ${val} 条`);
87 this.formInline.pageSize=val;
88 this.formInline.pageNum=1;
89 this.getData();
90 },
91 handleCurrentChange(val) {
92 //console.log(`当前页: ${val}`);
93 this.formInline.pageNum=val;
94 this.getData();
95 }
96 }
97 }
98 </script>
99
100 <style scoped>
101 .elInput,
102 .btn {
103 margin-top: 18px;
104 }
105 </style>
106 <style>
107 .el-main {
108 padding: 5px 10px;
109 }
110 .elMain{
111 height: 418px;
112 }
113 .el-table th {
114 height: 45px;
115 font-size: 16px;
116 font-family: 微软雅黑;
117 font-weight: 500;
118 color: darkblue;
119 }
120 </style>
user/UserList.vue
二、后端(按上面结构图，从上往下）
1 package com.wzz.aspect;
2
3 import com.wzz.common.IDUtil;
4 import com.wzz.common.StringUtil;
5 import com.wzz.controller.SysAccessLogController;
6 import com.wzz.service.ISysAccessLogService;
7 import org.aspectj.lang.JoinPoint;
8 import org.springframework.beans.factory.annotation.Autowired;
9 import org.springframework.stereotype.Component;
10
11 import javax.servlet.http.HttpServletRequest;
12 import java.util.Arrays;
13 import java.util.Date;
14 import java.util.HashMap;
15 import java.util.Map;
16
17 /**
18 * @ClassName SysAccessLogAspect
19 * @Description TODO 系统访问日志切面类
20 * @Author AZhen
21 * Version 1.0
22 **/
23 @Component
24 public class SysAccessLogAspect {
25
26 @Autowired
27 private HttpServletRequest request;
28 @Autowired
29 private ISysAccessLogService sysAccessLogService;
30 //访问时间
31 private Date accessDate;
32 //日志信息Map
33 private Map<String,Object> logMap=new HashMap<>();
34
35 private Class clazz; //访问类
36
37 public void doBefore(JoinPoint jp){
38 clazz = jp.getTarget().getClass();
39 if (clazz!= SysAccessLogController.class) {
40 //日志ID
41 logMap.put("logId", IDUtil.getUUID());
42
43 String url = request.getRequestURL().toString();
44 //请求url
45 logMap.put("accessInterface", url);
46
47 String ip = request.getRemoteAddr();
48 //请求Ip
49 logMap.put("accessIp", ip);
50
51 String requestType = request.getMethod();
52 //请求方式
53 logMap.put("requestType", requestType);
54
55 accessDate = new Date();
56 //访问时间
57 logMap.put("accessDate", accessDate);
58
59 String args = Arrays.toString(jp.getArgs());
60 //方法参数
61 logMap.put("interfaceParams", args);
62
63 String browserSystemInfo = StringUtil.getBrowserSystemInfo(request);
64 //访问浏览器系统信息
65 logMap.put("accessSource", browserSystemInfo);
66 }
67 }
68
69 public void doAfter(JoinPoint jp){
70 if (clazz!=SysAccessLogController.class){
71 long executeTime = new Date().getTime() - accessDate.getTime();
72 //执行时长
73 logMap.put("executeTime",executeTime);
74 //插入日志信息
75 sysAccessLogService.saveSysLog(logMap);
76 }
77 }
78 }
SysAccessLogAspect.java
1 package com.wzz.common;
2
3 import com.wzz.model.InfoMsg;
4 import com.wzz.model.ResponseBody;
5
6 /**
7 * @ClassName AssembleResponseMsg
8 * @Description TODO 封装ResponseBody内容
9 * @Author AZhen
10 * Version 1.0
11 **/
12 public class AssembleResponseMsg {
13
14 /**
15 * 成功返回内容
16 * @Author AZhen
17 * @Param [data]
18 * @return com.wzz.model.ResponseBody
19 **/
20 public <T>ResponseBody success(T data){
21 ResponseBody<T> resp=new ResponseBody<T>();
22 resp.setData(data);
23 InfoMsg info=new InfoMsg();
24 resp.setInfo(info);
25 return resp;
26 }
27
28 /**
29 * 失败/异常返回内容
30 * @Author AZhen
31 * @Param [status, errorCode, message]
32 * @return com.wzz.model.ResponseBody
33 **/
34 public <T>ResponseBody failure(int status,String errorCode,String message){
35 ResponseBody<T> resp=new ResponseBody<T>();
36 resp.setStatus(status);
37 InfoMsg info=new InfoMsg();
38 info.setCode(errorCode);
39 info.setMessage(message);
40 resp.setInfo(info);
41 return resp;
42 }
43 }
AssembleResponseMsg.java
1 package com.wzz.common;
2
3 import java.text.SimpleDateFormat;
4 import java.util.Date;
5
6 /**
7 * @ClassName DateUtils
8 * @Description TODO 日期工具类
9 * @Author AZhen
10 * Version 1.0
11 **/
12 public class DateUtil {
13
14 /**
15 * 返回字符串形式的当前日期
16 * @Author AZhen
17 * @Param [pattern] 模板参数 如："yyyy-MM-dd"
18 * @return java.lang.String
19 **/
20 public static String getCurrentDateStr(String pattern){
21 SimpleDateFormat format=new SimpleDateFormat(pattern);
22 String currentDateStr = format.format(new Date());
23 return currentDateStr;
24 }
25 }
DateUtil.java
1 package com.wzz.common;
2
3 import java.util.UUID;
4
5 /**
6 * 各种ID工具类
7 * @ClassName IDUtil
8 * @Description TODO
9 * @Author AZhen
10 * Version 1.0
11 **/
12 public class IDUtil {
13
14 /**
15 * 获取uuid（以去掉'-'字符）
16 * @Author AZhen
17 * @Param []
18 * @return java.lang.String
19 **/
20 public static String getUUID(){
21 return UUID.randomUUID().toString().replace("-", "");
22 }
23 }
IDUtil.java
1 package com.wzz.common;
2
3 import eu.bitwalker.useragentutils.UserAgent;
4
5 import javax.servlet.http.HttpServletRequest;
6
7 /**
8 * 字符串工具类
9 * @ClassName StringUtil
10 * @Description TODO
11 * @Author AZhen
12 * Version 1.0
13 **/
14 public class StringUtil {
15
16 /**
17 * 浏览器和系统信息
18 * @Author AZhen
19 * @Param [request]
20 * @return java.lang.String
21 **/
22 public static String getBrowserSystemInfo(HttpServletRequest request){
23 UserAgent userAgent = UserAgent.parseUserAgentString(request.getHeader("user-agent"));
24 String BSInfo = userAgent.getOperatingSystem() + "-" + userAgent.getBrowser() + "(" + userAgent.getBrowserVersion() + ")";
25 return BSInfo;
26 }
27
28 }
StringUtil.java
1 package com.wzz.controller;
2
3 import com.wzz.common.AssembleResponseMsg;
4 import com.wzz.model.ResponseBody;
5 import com.wzz.service.ISysAccessLogService;
6 import org.springframework.beans.factory.annotation.Autowired;
7 import org.springframework.web.bind.annotation.RequestBody;
8 import org.springframework.web.bind.annotation.RequestMapping;
9 import org.springframework.web.bind.annotation.RestController;
10
11 import java.util.Map;
12
13 /**
14 * 系统访问日志Controller
15 * @ClassName SysAccessLogController
16 * @Description TODO
17 * @Author AZhen
18 * Version 1.0
19 **/
20 @RestController
21 public class SysAccessLogController {
22 @Autowired
23 private ISysAccessLogService sysAccessLogService;
24
25 /**
26 * 查询系统访问日志列表
27 * @Author AZhen
28 * @Param [map]
29 * @return com.wzz.model.ResponseInfo
30 **/
31 @RequestMapping(value = "/sysLogList",produces = "application/json;charset=utf-8")
32 public ResponseBody querySysLogList(@RequestBody Map<String,Object> map){
33 Map<String, Object> resultMap = sysAccessLogService.querySysLogList(map);
34 return new AssembleResponseMsg().success(resultMap);
35 }
36 }
SysAccessLogController.java
1 package com.wzz.controller;
2
3 import com.wzz.common.AssembleResponseMsg;
4 import com.wzz.model.ResponseBody;
5 import com.wzz.service.IUserService;
6 import org.springframework.beans.factory.annotation.Autowired;
7 import org.springframework.web.bind.annotation.RequestBody;
8 import org.springframework.web.bind.annotation.RequestMapping;
9 import org.springframework.web.bind.annotation.RestController;
10
11 import java.util.Map;
12
13 /**
14 * @ClassName UserController
15 * @Description TODO 用户控制层
16 * @Author AZhen
17 * Version 1.0
18 **/
19 @RestController
20 public class UserController {
21 @Autowired
22 private IUserService userService;
23
24 @RequestMapping(value = "/queryUserList",produces = "application/json;charset=utf-8")
25 public ResponseBody queryUserList(@RequestBody Map<String,Object> map){
26 Map<String, Object> resultMap = userService.queryUserList(map);
27 return new AssembleResponseMsg().success(resultMap);
28 }
29 @RequestMapping(value = "/queryUser",produces = "application/json;charset=utf-8")
30 public ResponseBody queryUser(@RequestBody Map<String,Object> map){
31 int flag = userService.queryUser(map);
32 if (flag==1){
33 return new AssembleResponseMsg().success("OK");
34 }{
35 return new AssembleResponseMsg().failure(200,"error","用户名或密码错误");
36 }
37 }
38
39 }
UserController.java
SysAccessLogMapper.java
1 <?xml version="1.0" encoding="UTF-8" ?>
2 <!DOCTYPE mapper
3 PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
4 "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
5 <mapper namespace="com.wzz.mapper.SysAccessLogMapper">
6 <select id="querySysLogList" parameterType="map" resultType="hashMap">
7 SELECT DATE_FORMAT(t.accessDate,'%Y-%m-%d %H:%i:%s') accessDate,t.requestType,t.accessInterface,t.interfaceParams,t.accessSource,t.accessIp,t.executeTime FROM tbsyslog t where t.accessDate>=#{beginTime} and t.accessDate<=#{endTime} order by t.accessDate DESC
8 </select>
9 <insert id="saveSysLog" parameterType="map">
10 insert into tbSysLog(logId,accessDate,requestType,accessInterface,interfaceParams,accessSource,accessIp,executeTime)
11 values (#{logId},#{accessDate},#{requestType},#{accessInterface},#{interfaceParams},#{accessSource},#{accessIp},#{executeTime})
12 </insert>
13 </mapper>
SysAccessLogMapper.xml
1 package com.wzz.mapper;
2
3 import com.wzz.model.User;
4
5 import java.util.List;
6 import java.util.Map;
7
8 /**
9 * @ClassName UserMapper
10 * @Description TODO 用户持久层接口
11 * @Author AZhen
12 * Version 1.0
13 **/
14 public interface UserMapper {
15 List<User> queryUserList(Map<String, Object> map);
16
17 //查询用户
18 int queryUser(Map<String, Object> map);
19 }
UserMapper.java
1 <?xml version="1.0" encoding="UTF-8" ?>
2 <!DOCTYPE mapper
3 PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
4 "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
5 <mapper namespace="com.wzz.mapper.UserMapper">
6 <!--因为在sqlMapConfig.xml中配置了别名，所以直接写user就可以-->
7 <select id="queryUserList" parameterType="map" resultType="user">
8 select * from tbUser
9 <where>
10 <if test="userName!=null and userName!=''">
11 userName like CONCAT('%',#{userName},'%')
12 </if>
13 <if test="sex!=null and sex!=''">
14 AND sex=#{sex}
15 </if>
16 </where>
17 </select>
18 <select id="queryUser" parameterType="map" resultType="int">
19 select count(1) from tbUser where userName=#{userName} and password=#{password}
20 </select>
21 </mapper>
UserMapper.xml
1 package com.wzz.model;
2
3 import java.io.Serializable;
4
5 /**
6 * @ClassName InfoMsg
7 * @Description TODO 错误信息消息体
8 * @Author AZhen
9 * Version 1.0
10 **/
11 public class InfoMsg implements Serializable {
12 //自定义错误码 默认0表示正常执行
13 private String code="0";
14 //错误信息
15 private String message="操作成功";
16
17 public String getCode() {
18 return code;
19 }
20
21 public void setCode(String code) {
22 this.code = code;
23 }
24
25 public String getMessage() {
26 return message;
27 }
28
29 public void setMessage(String message) {
30 this.message = message;
31 }
32 }
InfoMsg.java
1 package com.wzz.model;
2
3 import com.wzz.common.DateUtil;
4
5 import java.io.Serializable;
6
7 /**
8 * @ClassName ResponseBody
9 * @Description TODO 封装响应的数据结构
10 * @Author AZhen
11 * Version 1.0
12 **/
13 public class ResponseBody<T> implements Serializable {
14 //时间
15 private String date= DateUtil.getCurrentDateStr("yyyy-MM-dd HH:mm:ss");
16 //状态码 默认200响应成功
17 private int status=200;
18 //接口返回的数据
19 private T data;
20
21 public String getDate() {
22 return date;
23 }
24
25 public void setDate(String date) {
26 this.date = date;
27 }
28
29 public int getStatus() {
30 return status;
31 }
32
33 public void setStatus(int status) {
34 this.status = status;
35 }
36
37 public T getData() {
38 return data;
39 }
40
41 public void setData(T data) {
42 this.data = data;
43 }
44
45 public InfoMsg getInfo() {
46 return info;
47 }
48
49 public void setInfo(InfoMsg info) {
50 this.info = info;
51 }
52
53 //消息内容
54 private InfoMsg info;
55
56 }
ResponseBody.java
1 package com.wzz.model;
2
3 import java.io.Serializable;
4
5 /**
6 * @ClassName User
7 * @Description TODO 用户类
8 * @Author AZhen
9 * Version 1.0
10 **/
11 public class User implements Serializable {
12 private String uid; //uid
13 private String userName; //用户名
14 private String password; //密码
15 private String uName; //姓名
16 private Integer age; //年龄
17 private Integer sex; //性别
18
19 public String getUid() {
20 return uid;
21 }
22
23 public void setUid(String uid) {
24 this.uid = uid;
25 }
26
27 public String getUserName() {
28 return userName;
29 }
30
31 public void setUserName(String userName) {
32 this.userName = userName;
33 }
34
35 public String getPassword() {
36 return password;
37 }
38
39 public void setPassword(String password) {
40 this.password = password;
41 }
42
43 public String getuName() {
44 return uName;
45 }
46
47 public void setuName(String uName) {
48 this.uName = uName;
49 }
50
51 public Integer getAge() {
52 return age;
53 }
54
55 public void setAge(Integer age) {
56 this.age = age;
57 }
58
59 public Integer getSex() {
60 return sex;
61 }
62
63 public void setSex(Integer sex) {
64 this.sex = sex;
65 }
66
67 @Override
68 public String toString() {
69 return "User{" +
70 "uid='" + uid + '\'' +
71 ", userName='" + userName + '\'' +
72 ", password='" + password + '\'' +
73 ", uName='" + uName + '\'' +
74 ", age=" + age +
75 ", sex=" + sex +
76 '}';
77 }
78 }
User.java
1 package com.wzz.service.impl;
2
3 import com.github.pagehelper.PageHelper;
4 import com.github.pagehelper.PageInfo;
5 import com.wzz.mapper.SysAccessLogMapper;
6 import com.wzz.service.ISysAccessLogService;
7 import org.springframework.beans.factory.annotation.Autowired;
8 import org.springframework.stereotype.Service;
9
10 import java.util.HashMap;
11 import java.util.List;
12 import java.util.Map;
13
14 /**
15 * 系统访问日志实现类
16 * @ClassName SysAccessLogServiceImpl
17 * @Description TODO
18 * @Author AZhen
19 * Version 1.0
20 **/
21 @Service
22 public class SysAccessLogServiceImpl implements ISysAccessLogService {
23 @Autowired
24 private SysAccessLogMapper sysAccessLogMapper;
25 @Override
26 public Map<String, Object> querySysLogList(Map<String, Object> map) {
27 int pageNum=Integer.parseInt(map.get("pageNum").toString()); //当前页
28 int pageSize=Integer.parseInt(map.get("pageSize").toString()); //每页几条
29 PageHelper.startPage(pageNum,pageSize);
30 List<Map<String, Object>> resultList = sysAccessLogMapper.querySysLogList(map);
31 PageInfo pageInfo=new PageInfo(resultList);
32 long total = pageInfo.getTotal(); //总条数
33 Map<String,Object> resultMap=new HashMap<>();
34 resultMap.put("total",total);
35 resultMap.put("rows",resultList);
36 return resultMap;
37 }
38
39 @Override
40 public int saveSysLog(Map<String, Object> map) {
41 return sysAccessLogMapper.saveSysLog(map);
42 }
43 }
SysAccessLogServiceImpl.java
1 package com.wzz.service.impl;
2
3 import com.github.pagehelper.PageHelper;
4 import com.github.pagehelper.PageInfo;
5 import com.wzz.mapper.UserMapper;
6 import com.wzz.model.User;
7 import com.wzz.service.IUserService;
8 import org.springframework.beans.factory.annotation.Autowired;
9 import org.springframework.stereotype.Service;
10
11 import java.util.HashMap;
12 import java.util.List;
13 import java.util.Map;
14
15 /**
16 * @ClassName UserServiceImpl
17 * @Description TODO 用户业务层实现类
18 * @Author AZhen
19 * Version 1.0
20 **/
21 @Service
22 public class UserServiceImpl implements IUserService {
23 @Autowired
24 private UserMapper userMapper;
25 @Override
26 public Map<String,Object> queryUserList(Map<String, Object> map) {
27 int pageNum=Integer.parseInt(map.get("pageNum").toString()); //当前页
28 int pageSize=Integer.parseInt(map.get("pageSize").toString()); //每页几条
29 PageHelper.startPage(pageNum,pageSize);
30 List<User> userList = userMapper.queryUserList(map);
31 PageInfo pageInfo=new PageInfo(userList);
32 long total = pageInfo.getTotal();
33 Map<String,Object> resultMap=new HashMap<>();
34 resultMap.put("total",total);
35 resultMap.put("rows",userList);
36 return resultMap;
37 }
38
39 @Override
40 public int queryUser(Map<String, Object> map) {
41 return userMapper.queryUser(map);
42 }
43 }
UserServiceImpl.java
1 package com.wzz.service;
2
3 import java.util.Map;
4
5 /**
6 * 系统访问日志接口
7 * @ClassName ISysAccessLogService
8 * @Description TODO
9 * @Author AZhen
10 * Version 1.0
11 **/
12 public interface ISysAccessLogService {
13
14 /**
15 * 查询系统日志列表
16 * @Author AZhen
17 * @Param [map]
18 * @return java.util.Map<java.lang.String,java.lang.Object>
19 **/
20 public Map<String,Object> querySysLogList(Map<String, Object> map);
21
22 /**
23 * 保存日志
24 * @Author AZhen
25 * @Param [map]
26 * @return int
27 **/
28 public int saveSysLog(Map<String, Object> map);
29 }
ISysAccessLogService.java
1 package com.wzz.service;
2
3 import java.util.Map;
4
5 /**
6 * @ClassName IUserService
7 * @Description TODO 用户业务层接口
8 * @Author AZhen
9 * Version 1.0
10 **/
11 public interface IUserService {
12 Map<String,Object> queryUserList(Map<String, Object> map);
13
14 int queryUser(Map<String, Object> map);
15 }
IUserService.java
三、功能小演示
至此，小功能实现结束，有不足之处，请网友指正。谢谢<-_->
最新文章
- python list dict 去重的两种方式
- [java] 可视化日历的实现（基于Calendar类 ）
- Linux小技巧1：如何关闭Root用户SSH登陆
- CSS字体属性大全
- linux epoll模型使用注意点
- viewpager实现酷炫侧滑demo
- 了解 JavaScript （5）– 翻转器（rollover)
- Grunt教程——初涉Grunt
- 剑指offer系列36----二叉搜索树的第k个节点
- GitHub的使用 —— 如何删除Repository
- Nginx集群(转)
- javascript之DOMReady
- 利用dijkstra算法规划线路
- 分布式缓存BeIT Memcached简介
- ITextSharp用来生成 PDF 的一个组件
- Vue系列之 => html-webpack-plugin的两个基本作用
- 2018.5.3 maven
- 让vue-cli脚手架搭建的项目可以处理vue文件中postcss语法
- go byte 和 string 类型之间转换
- 吴裕雄 python深度学习与实践（10）
热门文章
- python 金融大数据风控建模实战--基于机器学习
- python单机版自动化测试框架源代码(selenium+Appium+requests+unittest+Excel用例+HTMLTestRunner报告)
- centos8.5安装kvm及kvm虚拟机的端口映射问题
- 前端vue的JsPDF html2canvas 生成pdf并以文件流形式上传到后端（转载）
- Redis 突然变慢了如何排查并解决？
- Twitter Bootstrap Grid System
- 7. C语言科学计数法表示int
- es6数组去重、数组中的对象去重 && 删除数组（按条件或指定具体元素 如：id）&& 筛选去掉没有子组件的父组件
- 知识图谱demo net core + neo4j
- TypeScript 对象