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

1964springboot VUE 智慧社区可视化平台系统开发mysql数据库web结构java编程计算机网页源码maven项目

news 来源：原创 2024/9/29 21:18:21

一、源码特点
springboot VUE社区可视化平台系统是一套完善的完整信息管理类型系统，结合springboot框架和VUE完成本系统，对理解JSP java编程开发语言有帮助系统采用springboot框架（MVC模式开发），系统具有完整的源代码和数据库，系统主要采用B/S模式开发。

java社区可视化平台系统

前段主要技术 vue
后端主要技术 Springboot java
数据库 mysql
开发工具 IDEA JDK1.8
环境需要

1.运行环境：最好是java jdk 1.8，我们在这个平台上运行的。其他版本理论上也可以不建议。

2.IDE环境：推荐IDEA;

3.硬件环境：windows 7/8/10 1G内存以上；；

5.数据库：MySql 5.0 到 5.5 等版本均可需要高版本如mysql8.0 需要修改数据连接配置，以及maven中的mysql 驱动包；

6.是Maven项目；查看源码目录中是否包含pom.xml；

使用说明

1. 使用Navicat或者其它工具，在mysql中创建对应sql文件名称的数据库，并导入项目的sql文件数据库字符集gb2312；

2. 使用IDEA导入项目;

3. 将项目中shequ\src\main\resources 下的 application.properties 配置文件中的数据库配置改为自己的配置;
数据库支持 mysql5.0 到5.5 ，如果需要5.7 到8.0 需要二次转换升级
4.vscode 开vue项目工程
5.vue 项目启动 npm run serve
vue 版本 2.9.6
node 版本 16.14.2

二、功能介绍

(1)物业管理：对物业信息进行添加、删除、修改和查看
(2)住户管理：对住户信息进行添加、删除、修改和查看
(3)楼栋管理：对楼栋信息进行添加、删除、修改和查看
(4)访客登记管理：对访客登记信息进行添加、删除、修改和查看
(5)出入登记管理：对出入登记信息进行添加、删除、修改和查看
(6)维修反馈管理：对维修反馈信息进行添加、删除、修改和查看
(7)用户登录

数据库设计

CREATE TABLE `wuye` (
`wyid` int(11) NOT NULL auto_increment,
`yhm` VARCHAR(40) default NULL COMMENT '用户名',
`mm` VARCHAR(40) default NULL COMMENT '密码',
`xm` VARCHAR(40) default NULL COMMENT '姓名',
`lxdh` VARCHAR(40) default NULL COMMENT '联系电话',
`lxdz` VARCHAR(40) default NULL COMMENT '联系地址',
`qx` VARCHAR(40) default NULL COMMENT '权限',  PRIMARY KEY  (`wyid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `zhuhu` (
`zhid` int(11) NOT NULL auto_increment,
`yhm` VARCHAR(40) default NULL COMMENT '用户名',
`mm` VARCHAR(40) default NULL COMMENT '密码',
`xm` VARCHAR(40) default NULL COMMENT '姓名',
`ld` VARCHAR(40) default NULL COMMENT '楼栋',
`lxdh` VARCHAR(40) default NULL COMMENT '联系电话',
`zz` VARCHAR(40) default NULL COMMENT '住址',
`zcsj` VARCHAR(40) default NULL COMMENT '注册时间',  PRIMARY KEY  (`zhid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `loudong` (
`ldid` int(11) NOT NULL auto_increment,
`ldmc` VARCHAR(40) default NULL COMMENT '楼栋名称',  PRIMARY KEY  (`ldid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `fkdj` (
`fkdjid` int(11) NOT NULL auto_increment,
`fwsj` VARCHAR(40) default NULL COMMENT '访问时间',
`bt` VARCHAR(40) default NULL COMMENT '标题',
`djsj` VARCHAR(40) default NULL COMMENT '登记时间',
`djr` VARCHAR(40) default NULL COMMENT '登记人',
`fwzh` VARCHAR(40) default NULL COMMENT '访问住户',
`yy` VARCHAR(40) default NULL COMMENT '原由',
`zt` VARCHAR(40) default NULL COMMENT '状态',  PRIMARY KEY  (`fkdjid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `crdj` (
`crdjid` int(11) NOT NULL auto_increment,
`zh` VARCHAR(40) default NULL COMMENT '住户',
`lx` VARCHAR(40) default NULL COMMENT '类型',
`djr` VARCHAR(40) default NULL COMMENT '登记人',
`djsj` VARCHAR(40) default NULL COMMENT '登记时间',
`sm` VARCHAR(40) default NULL COMMENT '说明',  PRIMARY KEY  (`crdjid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;

后台数据库设计

   /**访客登记列表 查询fkdj**/@GetMapping("list")public Result  list(@RequestParam(value = "pageNum",defaultValue = "1") int page,@RequestParam(value = "pageSize",defaultValue = "10") int szie,@RequestParam(defaultValue = "") String fwsj,@RequestParam(defaultValue = "") String bt)  {Result res=new Result();List list=null;String sql="";try{if(fwsj!=null&&!fwsj.equals("")){sql+=" and fwsj like '%"+fwsj+"%'";//符合条件 拼接sql 访问时间}if(bt!=null&&!bt.equals("")){sql+=" and bt like '%"+bt+"%'";//符合条件 拼接sql 访问时间}list=fkdjdao.querylist(sql,page,szie);//查询fkdj表数据返回 list对象res.setCode(200);res.setMessage("查询成功");res.setData(tl.ltoj(list));list=fkdjdao.querylist(sql);res.setNum(list.size());}catch(Exception e){e.printStackTrace();;}return res;}/**访客登记列表 查询fkdj* */@GetMapping("listpage")public Result  listpage(@RequestParam(defaultValue = "") String fwsj)  {Result res=new Result();List list=null;String sql="";if(fwsj!=null&&!fwsj.equals("")){sql+=" and fwsj like '%"+fwsj+"%'";//符合条件 拼接sql 访问时间}try{list=fkdjdao.querylist(sql);//查询gly 表数据返回 list对象res.setCode(200);res.setMessage("查询成功");res.setData(tl.ltoj(list));}catch(Exception e){e.printStackTrace();;}return res;}/**访客登记添加方法 对表 fkdj  进行添加* */@PostMapping(value = "add")public Result  add(@RequestBody fkdj bean){Result res=new Result();try{if(bean.getFkdjid()!=null&&!bean.getFkdjid().equals("")){fkdjdao.update(bean);//执行 修改 fkdj 添加操作res.setMessage("操作成功");}else{fkdjdao.add(bean);//执行 添加fkdj 添加操作res.setMessage("添加成功");}}catch(Exception e){e.printStackTrace();;}res.setCode(200);//System.out.println(res);return res;}/**访客登记删除方法 对表fkdj  进行删除* */@DeleteMapping("del/{id}")public Result  del( @PathVariable String id){Result res=new Result();try{fkdjdao.delete(id);//执行 删除fkdj 方法}catch(Exception e){e.printStackTrace();;}res.setCode(200);res.setMessage("删除成功");return res;}@DeleteMapping("likai/{id}")public Result  likai( @PathVariable String id){Result res=new Result();DBO db=new DBO();try{String sql="update fkdj set zt='已离开' where fkdjid='"+id+"'";db.update(sql);}catch(Exception e){e.printStackTrace();;}finally{db.close();}res.setCode(200);res.setMessage("操作成功");return res;}

vue端设计

   <div style="margin-bottom: 20px"><el-input style="width: 240px" placeholder="请输入楼栋名称" v-model="params.ldmc"></el-input><el-button style="margin-left: 5px" type="primary" @click="load"><i class="el-icon-search"></i> 搜索</el-button></div><el-table :data="tableData" stripe><el-table-column  type="index" label="序号" width="80"  :index="indexMethod"></el-table-column><el-table-column prop="ldmc" label="楼栋名称"></el-table-column><el-table-column label="操作" width="230"><template v-slot="scope">
<!--          scope.row 就是当前行数据--><el-button type="primary" @click="$router.push('/loudongmodify?id=' + scope.row.ldid)">编辑</el-button><el-popconfirmstyle="margin-left: 5px"title="您确定删除吗？"@confirm="del(scope.row.ldid)"><el-button type="danger" slot="reference">删除</el-button></el-popconfirm><el-button style="margin-left: 5px" type="warning" @click="$router.push('/loudongdetail?id=' + scope.row.ldid)">详情</el-button></template></el-table-column></el-table><!--    分页--><div style="margin-top: 20px"><el-paginationbackground:current-page="params.pageNum":page-size="params.pageSize"layout="prev, pager, next"@current-change="handleCurrentChange":total="total"></el-pagination></div><el-dialog title="查看" :visible.sync="dialogFormVisible" width="30%"><div slot="footer" class="dialog-footer"><el-button @click="dialogFormVisible = false">取 消</el-button></div></el-dialog></div>
</template><script>
import request from "@/utils/request";
import Cookies from 'js-cookie'export default {name: 'loudonglist',data() {return {tableData: [],total: 0,form: {},dialogFormVisible: false,params: {pageNum: 1,pageSize: 10,ldmc: "",}}},created() {this.load()},methods: {indexMethod(index) {return index+1;},load() {request.get('/loudong/list', {params: this.params}).then(res => {if (res.code == '200') {this.tableData = JSON.parse(res.data)this.total = res.num}})},reset() {this.params = {pageNum: 1,pageSize: 10,ldmc: "",}this.load()},handleCurrentChange(pageNum) {// 点击分页按钮触发分页this.params.pageNum = pageNumthis.load()},del(id) {request.delete("/loudong/del/" + id).then(res => {if (res.code == '200') {this.$notify.success('删除成功')this.load()} else {this.$notify.error(res.message)}})}}
}
</script>

三、注意事项
1、管理员账号：admin密码：admin 数据库配置文件\src\main\resources\application.properties
2、开发环境为IDEA开发，数据库为mysql，使用java语言开发。
3、数据库文件名是javashequ.sql 系统名称shequ
4、地址：http://128.0.0.1:8080/login

四系统实现

需要源码其他的定制服务下方联系卡片↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 或者私信作者