当前位置: 首页 > news >正文

day22_用户模块

day22_用户模块

1查询

image-20250822093250732

sql分析

-- 定制系统
-- 查询分段记录
select au1.*,au2.username create_uname from admin_user au1 left join admin_user au2 on au1.create_uid = au2.uidwhere au1.username like CONCAT('%','a','%')
AND   au1.isvalid = 0limit 0,3-- 统计总记录数
select count(1) from admin_user au1where au1.username like CONCAT('%','a','%')
AND   au1.isvalid = 0

dao代码

<select id="listUserByCondition" resultMap="AdminUserMap">select au1.*,au2.username create_uname from admin_user au1 left join admin_user au2 on au1.create_uid = au2.uid<where><if test="inputUser.username !=null and inputUser.username != ''">au1.username like CONCAT('%',#{inputUser.username},'%')</if><if test="inputUser.isvalid !=null">AND   au1.isvalid = #{inputUser.isvalid}</if></where>limit #{startIdx},#{pageSize}</select><select id="countUserByCondition" resultType="java.lang.Integer">select count(1) from admin_user au1<where><if test="inputUser.username !=null and inputUser.username != ''">au1.username like CONCAT('%',#{inputUser.username},'%')</if><if test="inputUser.isvalid !=null">AND   au1.isvalid = #{inputUser.isvalid}</if></where></select>

查询接口

    protected void listUser(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {String username = req.getParameter("username");String isvalidStr = req.getParameter("isvalid");String pageStr = req.getParameter("page");String pageSizeStr = req.getParameter("pageSize");Integer isvalid = null;if(isvalidStr!=null&&!"".equals(isvalidStr)){isvalid = Integer.valueOf(isvalidStr);}AdminUser inputUser = new AdminUser(username, isvalid);Integer page = 1;Integer pageSize = 3;if(pageStr!=null&&!"".equals(pageStr)){page = Integer.valueOf(pageStr);}if(pageSizeStr!=null&&!"".equals(pageSizeStr)){pageSize = Integer.valueOf(pageSizeStr);}//调用serviceAdminUserService adminUserService = new AdminUserServiceImpl();//1查总记录数Integer total = adminUserService.countUserByCondition(inputUser);Integer totalPage = PageInfo.getTotalPage(total, pageSize);//2控制超页if(page>totalPage&&page!=1){page = totalPage;}//3查询分段记录List<AdminUser> adminUsers = adminUserService.listUserByCondition(inputUser, page, pageSize);//反馈数据Result result = null;if(adminUsers.size()>0){PageInfo pageInfo = new PageInfo(page,pageSize,total);result =  new Result(ReturnCode.QUERY_SUCCESS.getCode(),ReturnCode.QUERY_SUCCESS.getMsg(),adminUsers,pageInfo);}else{result =  new Result(ReturnCode.QUERY_NODATA.getCode(),ReturnCode.QUERY_NODATA.getMsg());}resp.setContentType("application/json;charset=utf-8");PrintWriter writer = resp.getWriter();writer.print(JSON.toJSONString(result));writer.close();}

查询界面

<template><el-form ref="queryFormRef" :model="queryForm" :inline="true"><el-form-item label="用户名称" prop="username"><el-input v-model="queryForm.username" style="width: 240px;" placeholder="username" clearable /></el-form-item><el-form-item label="用户状态" prop="isvalid"><el-select v-model="queryForm.isvalid" placeholder="请选择" style="width: 240px;" clearable><el-option label="离职" :value="0" /><el-option label="在职" :value="1" /><el-option label="休假" :value="2" /></el-select></el-form-item><el-form-item><el-button type="primary" @click="querySubmit">查询</el-button><el-button @click="queryReset">重置</el-button></el-form-item></el-form><el-table height="450" :data="tableData.tableList" style="width: 100%"><el-table-column prop="uid" fixed  label="编号" width="180" /><el-table-column prop="username" label="用户名" width="180" /><el-table-column prop="password" label="密码" width="180"><template #default="scope"><el-text type="info">{{ transPassword(scope.row.password) }} </el-text></template></el-table-column><el-table-column prop="isvalid" label="用户状态" width="180"><template #default="scope"><el-text v-if="scope.row.isvalid == 1"  type="success">在职</el-text><el-text v-else-if="scope.row.isvalid == 0" type="danger">离职</el-text><el-text v-else-if="scope.row.isvalid == 2" type="warning">休假</el-text></template></el-table-column><el-table-column prop="createUid" label="创建人" width="180"/><el-table-column prop="createUname" label="创建名称" width="180"/><el-table-column prop="regTime" label="注册时间" width="180"><template #default="scope"><el-tag type="primary">{{scope.row.regTime}}</el-tag></template></el-table-column><el-table-column prop="loginTime" label="最后登录时间" width="180"><template #default="scope"><el-tag type="primary">{{scope.row.loginTime}}</el-tag></template></el-table-column><el-table-column prop="headImg" label="头像地址" width="180"><template #default="scope"><img :src="scope.row.headImg"></img></template></el-table-column></el-table><el-paginationv-model:current-page="tableData.pageInfo.page"v-model:page-size="tableData.pageInfo.pageSize":total="tableData.pageInfo.total":page-sizes="[3, 6, 9]"layout="total, sizes, prev, pager, next, jumper"@size-change="handleSizeChange"@current-change="handleCurrentChange"/></template><script setup>
import { ref,reactive,onMounted } from 'vue'
import {Check,Delete,Edit,Message,Search,Star,Share} from '@element-plus/icons-vue'
import { myGet, myPost } from '@/myaxios'
import { ElMessage, ElMessageBox } from 'element-plus'/**查询功能 */
//table绑定的数据
const tableData = reactive({tableList:[],pageInfo:{page:1,pageSize:3,total:55}
})
//查询表单对象
const queryFormRef = ref()//查询表单
const queryForm = reactive({username:'',isvalid:''
})
//查询按钮
const querySubmit = ()=>{myQuery(queryForm)
}
//重置按钮
const queryReset = ()=>{//清数据queryFormRef.value.resetFields()//重新查myQuery({})
}//page改变
const handleCurrentChange = (page)=>{//改页码参数tableData.pageInfo.page = pagelet params1 = tableData.pageInfolet params2 = queryForm//查询请求myQuery({...params1,...params2})
}
//pageSize改变
const handleSizeChange = (pageSize)=>{//改页码参数tableData.pageInfo.page = 1tableData.pageInfo.pageSize = pageSizelet params1 = tableData.pageInfolet params2 = queryForm//查询请求myQuery({...params1,...params2})
}/**公共函数 */
//密码脱敏(把密码字段通过程序逻辑做部分隐藏)
const transPassword = (pwd)=>{let pwdStart = pwd.substr(0,1)let pwdEnd = pwd.substr(pwd.length-1,1)return `${pwdStart}***${pwdEnd}`;
}//查询函数
const myQuery = async (params)=>{
/*** await  异步同步等待* async  异步同步控制* 回调地狱 .then互相嵌套调用 代码结构显得杂乱* * 语法糖 简化和优化语法的语法功能*        使用了await语法之后 ajax请求代码结构更简洁*///await 主线程会等待 await的函数 执行完 主线程才会继续执行let resp = await myGet("/users/listUser",params)if(resp.data.code == 20000){tableData.tableList = resp.data.returnDatatableData.pageInfo  = resp.data.pageInfo}else if(resp.data.code == 20001){tableData.tableList = []tableData.pageInfo  = {page:1,pageSize:3,total:0}}}/**页面加载结束 加载查询数据 */
onMounted(()=>{myQuery({})
})</script><style scoped>img{width: 50px;height: 50px;}
</style>

2添加

sql分析

-- 添加语句                                                                                 
insert into admin_user (username,`password`,reg_time,isvalid,create_uid,head_img) VALUES ('test1','abc123',NOW(),1,7,'/test1')
--                         界面     默认      系统函数    默认   session后端取 界面

dao

    <insert id="insertAdminUser">insert into admin_user(username,`password`,reg_time,isvalid,create_uid,head_img)VALUES(#{username},'abc123',NOW(),1,#{createUid},#{headImg})</insert>

插入接口

    protected void insertUser(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {String username = req.getParameter("username");String headImg = req.getParameter("headImg");//把当前登录的用户编号 存入createUidAdminUser loginUser =(AdminUser) req.getSession().getAttribute("loginUser");//createUid是创建人编号AdminUser inputUser = new AdminUser(loginUser.getUid(), username, headImg);//调用serviceAdminUserService adminUserService = new AdminUserServiceImpl();Integer resNum = adminUserService.insertAdminUser(inputUser);Result result = null;if(resNum>0){result = new Result(ReturnCode.OPERATION_DATA_SUCCESS.getCode(), ReturnCode.OPERATION_DATA_SUCCESS.getMsg());}else{result = new Result(ReturnCode.OPERATION_DATA_FAILED.getCode(), ReturnCode.OPERATION_DATA_FAILED.getMsg());}resp.setContentType("application/json;charset=utf-8");PrintWriter writer = resp.getWriter();writer.print(JSON.toJSONString(result));writer.close();}

添加界面

  <el-drawer title="添加" size="30%" v-model="drawerVisable" direction="rtl"><el-form ref="insertFromRef"  :model="insertForm" label-width="70"style="max-width: 600px"><el-form-item label="用户名称" prop="username"><el-input v-model="insertForm.username" /></el-form-item><el-form-item label="头像地址" prop="headImg"><el-input v-model="insertForm.headImg" /></el-form-item><el-form-item><el-button type="primary" @click="insertSubmit">保存</el-button></el-form-item></el-form><!-- <template #footer><div style="flex: auto"><el-button @click="cancelClick">cancel</el-button><el-button type="primary" @click="confirmClick">confirm</el-button></div></template> --></el-drawer>
/**添加功能 */
//抽屉显示 隐藏 bol值
const drawerVisable = ref(false)
//添加表单对象
const insertForm = reactive({username:'',headImg:''
})//添加表单对象
const insertFromRef = ref()//添加提交
const insertSubmit = async ()=>{let resp =  await myPost('/users/insertUser',insertForm);if(resp.data.code==20010){drawerVisable.value = falseElMessage.success(resp.data.msg)//当前查询条件let params1 = tableData.pageInfolet params2 = queryForm//查询请求myQuery({...params1,...params2})//清空表单insertFromRef.value.resetFields()}else{ElMessage.error(resp.data.msg)}}//抽屉开框
const openInsert = ()=>{drawerVisable.value = true
}

3修改

这次修改直接从页面table取值 (简化做法) 减少了从后端取修改数据的接口

sql分析

update admin_user set  username = '测试用户',`password` = 'bbcccb',reg_time = '2011-11-11 11:11:11',isvalid =0,head_img ='/测试'where  uid = 5562

dao

    <update id="updateAdminUser">update admin_user setusername =  #{username},`password` = #{password},reg_time = #{regTime},isvalid =   #{isvalid}, head_img = #{headImg}where  uid = #{uid}</update>

修改接口

    protected void updateUser(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {String username = req.getParameter("username");String password = req.getParameter("password");String regTime = req.getParameter("regTime");String isvalidStr = req.getParameter("isvalid");String headImg = req.getParameter("headImg");String uidStr = req.getParameter("uid");Integer isvalid = null;Long uid = null;if(isvalidStr!=null&&!"".equals(isvalidStr)){isvalid =  Integer.valueOf(isvalidStr);}if(uidStr!=null&&!"".equals(uidStr)){uid =  Long.valueOf(uidStr);}AdminUser inputUser = new AdminUser(uid, username, password, regTime, isvalid, headImg);//调用serviceAdminUserService adminUserService = new AdminUserServiceImpl();Integer resNum = adminUserService.updateAdminUser(inputUser);Result result = null;if(resNum>0){result = new Result(ReturnCode.OPERATION_DATA_SUCCESS.getCode(), ReturnCode.OPERATION_DATA_SUCCESS.getMsg());}else{result = new Result(ReturnCode.OPERATION_DATA_FAILED.getCode(), ReturnCode.OPERATION_DATA_FAILED.getMsg());}resp.setContentType("application/json;charset=utf-8");PrintWriter writer = resp.getWriter();writer.print(JSON.toJSONString(result));writer.close();}

修改界面

<!-- table加一列 --><el-table-column fixed="right" label="操作" width="180"><template #default="scope"><el-button type="primary" @click="openUpdate(scope.row)">修改</el-button></template></el-table-column>
<!-- 修改弹出框(抽屉) --><el-drawer title="修改" size="30%" v-model="updateVisable" direction="rtl"><el-form  :model="editForm.editData" label-width="70"style="max-width: 600px"><el-form-item label="用户编号" ><el-input disabled v-model="editForm.editData.uid" /></el-form-item><el-form-item label="用户名称"><el-input v-model="editForm.editData.username" /></el-form-item><el-form-item label="用户密码"><el-input v-model="editForm.editData.password" /></el-form-item><el-form-item label="注册时间"><!-- <el-input v-model="editForm.editData.regTime" /> --><el-date-pickerv-model="editForm.editData.regTime"type="datetime"placeholder="请选择日期"value-format="YYYY-MM-DD HH:mm:ss" style="width: 100%;"/></el-form-item><el-form-item label="用户状态"><el-select v-model="editForm.editData.isvalid" placeholder="请选择" ><el-option label="离职" :value="0" /><el-option label="在职" :value="1" /><el-option label="休假" :value="2" /></el-select></el-form-item><el-form-item label="头像地址" ><el-input v-model="editForm.editData.headImg" /></el-form-item><el-form-item><el-button type="primary" @click="updateSubmit">保存</el-button></el-form-item></el-form><!-- <template #footer><div style="flex: auto"><el-button @click="cancelClick">cancel</el-button><el-button type="primary" @click="confirmClick">confirm</el-button></div></template> --></el-drawer>
/**修改功能 */
//修改抽屉显示 隐藏
const updateVisable = ref(false)
//修改表单对象
const editForm = reactive({editData:{uid:'',username:'',password:'',regTime:'',isvalid:'',headImg:'',
}})//打开修改框
const openUpdate = (currentRow)=>{updateVisable.value = true// console.log(currentRow);// console.log(JSON.parse(JSON.stringify(currentRow))  );//需要做对象复制 不能直接传引用editForm.editData = JSON.parse(JSON.stringify(currentRow))  }
//提交修改
const updateSubmit = async ()=>{let resp = await myPost("/users/updateUser", editForm.editData)if(resp.data.code==20010){updateVisable.value = falseElMessage.success(resp.data.msg)//当前查询条件let params1 = tableData.pageInfolet params2 = queryForm//查询请求myQuery({...params1,...params2})}else{ElMessage.error(resp.data.msg)}}

4删除

单条删除 table中 每条数据后放一个删除按钮 配合单条删除的接口

sql分析

delete  from admin_user where uid = 5557

dao

    <delete id="deleteAdminUser">delete  from admin_user where uid = #{uid}</delete>

删除接口

protected void deleteUser(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {String uidStr = req.getParameter("uid");Long uid = null;if(uidStr!=null&&!"".equals(uidStr)){uid =  Long.valueOf(uidStr);}AdminUserService adminUserService = new AdminUserServiceImpl();Integer resNum = adminUserService.deleteAdminUser(uid);Result result = null;if(resNum>0){result = new Result(ReturnCode.OPERATION_DATA_SUCCESS.getCode(), ReturnCode.OPERATION_DATA_SUCCESS.getMsg());}else{result = new Result(ReturnCode.OPERATION_DATA_FAILED.getCode(), ReturnCode.OPERATION_DATA_FAILED.getMsg());}resp.setContentType("application/json;charset=utf-8");PrintWriter writer = resp.getWriter();writer.print(JSON.toJSONString(result));writer.close();}

删除界面

        <el-table-column fixed="right" label="操作" width="180"><template #default="scope"><el-button type="primary" @click="openUpdate(scope.row)">修改</el-button><el-button type="primary" @click="openDelete(scope.row.uid)">删除</el-button></template></el-table-column>
/**删除功能 */
const openDelete =   (uid)=>{ElMessageBox.confirm(`确定要删除编号为[${uid}]记录么?`,'注意',{confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning',}).then(async () => {//发送请求let resp =  await myPost("/users/deleteUser",{uid:uid})if(resp.data.code==20010){ElMessage.success(resp.data.msg)//当前查询条件let params1 = tableData.pageInfolet params2 = queryForm//查询请求myQuery({...params1,...params2})}else{ElMessage.error(resp.data.msg)}     }).catch(() => {})
}

5用户授权

image-20250822165403337

1点击授权按钮 弹出授权框

用tree列出所有的权限菜单 去要查出完整的菜单列表

2用户勾选 提交给后端保存

sql分析

开框 加载数据

-- 查询所有的权限菜单select am2.*,am1.* from admin_menu am1 right join admin_menu am2 on am1.pid = am2.midwhere am2.pid = 0-- 当前用户的已有权限编号列表 通过tree组件 默认选中
-- select mid from rel_admin_user_menu where uid = 3

保存授权信息

-- 处理权限信息时的sql-- 先删除
delete from rel_admin_user_menu where uid = 3-- 再添加insert into rel_admin_user_menu(uid,mid) VALUES (3,11001),(3,11002),(3,12001),(3,13001)
http://www.hskmm.com/?act=detail&tid=19370

相关文章:

  • 2025 丹东店推荐:丽格门窗,用 20 年技术沉淀守护家的舒适
  • NOIP2025模拟赛23
  • step
  • 2025 呼和浩特店推荐:丽格门窗,用 20 年技术沉淀守护家的温度
  • 深入解析:浏览器端音视频处理新选择:Mediabunny 让 Web 媒体开发飞起来
  • 2025 宁波门窗店推荐:丽格门窗,甬城品质家居的安心之选
  • 2025 贵阳门窗店优选:丽格门窗,用 20 年匠心适配高原宜居需求
  • 2025 济南门窗店选购指南:丽格门窗凭硬实力圈粉品质家庭
  • “鹏云杯”第十二届山东省大学生网络安全技能大赛 -- Crypto -- WriteUp
  • 服务器系统时间不对?Linux系统时间修改与同步全面指南
  • 9/27
  • 2025 常熟门窗店优选:丽格门窗,20 年技术沉淀的品质之选
  • 2025上海门窗店选购选丽格!20 年系统门窗经验,徐汇宜山路店品质之选
  • 实用指南:Apache、Nginx 和 Tomcat 的区别
  • python+uniapp基于微信小程序美食点餐实用的系统
  • JavaDoc
  • parted command for linuxg
  • 如何在不绑定Apple账号的情况下备份florr.io
  • AI智能体框架怎么选?7个主流工具详细对比解析
  • 原创OI试题 - L
  • 《深入浅出WPF》:8.3.2 自定义路由事件 事件注册类型为 EventHandlerReportTimeEventArgs,但.NET 事件包装器类型为 RoutedEventHandler
  • day 6
  • 2025 自动售货机工厂推荐 配备 Bystronic 激光切割机,快速周转准时交货
  • 7.WPF 的 TextBox 和 TextBlock 控件 - 实践
  • 从中序与后序遍历序列构建二叉树的迭代解法
  • 安装 HuggingFace datasets 模块、包、库
  • 使用 SignalR 向前端推送图像
  • 隐私保护与联邦学习文献阅读
  • Java实习模拟面试|离散数学|概率论|金融英语|数据库实战|职业规划|期末冲刺|今日本科计科要闻速递:技术分享与学习指南 - 实践
  • 学术写作