首页 > 其他 > 详细

一个简单的SSM--房屋管理系统

时间：2020-09-20 20:23:36      阅读：36      评论：0      收藏：0      [点我收藏+]

一个简单的SSM--房屋管理系统

文件和数据库：

https://pan.baidu.com/s/1jIw2ppm   若已失效可以联系我

需求： 能够通过SSM实现数据的增删改

  • 一个HTML 页面就可以实现(Bootstrap)
  • 通过模态框
  • SSM框架
  • 支持批量删除

技术分享图片

技术分享图片

1. 环境准备

软件环境

  1. CentOS 8.0
  2. IDEA 2020.2
  3. JDK 11.0.7
  4. MySQL 5.6
  5. Tomcat 9.0.37
  6. Maven 3.6.3
  7. Bootstrap v3.3.7

1. 数据库

CREATE TABLE `housedeal`  (
  `hid` int(11) NOT NULL AUTO_INCREMENT,
  `hName` varchar(10) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
  `hDevelopname` varchar(10) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
  `hCity` varchar(20) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
  PRIMARY KEY (`hid`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 4 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Compact;

INSERT INTO `housedeal` VALUES (1, ‘wanke 柏翠园‘, ‘vanke‘, ‘长春‘);
INSERT INTO `housedeal` VALUES (2, ‘wanke 8090‘, ‘vanke‘, ‘长春‘);

2. 实体类

@Setter
@Getter
@ToString
public class HouseDeal implements Serializable {
    String hid;
    String hname;
    String hdevelopname;
    String hcity;
}

2. ssm环境搭建

1.pom.xml 导入相关依赖

<properties>
    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    <maven.compiler.source>11</maven.compiler.source>
    <maven.compiler.target>11</maven.compiler.target>
    <spring.version>5.2.8.RELEASE</spring.version>
  </properties>

  <dependencies>
    <!--springmvc-->
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-webmvc</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <!--spring-->
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-jdbc</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-aspects</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-test</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <!--mybatis-->
    <dependency>
      <groupId>org.mybatis</groupId>
      <artifactId>mybatis</artifactId>
      <version>3.5.5</version>
    </dependency>
    <dependency>
      <groupId>org.mybatis</groupId>
      <artifactId>mybatis-spring</artifactId>
      <version>1.3.1</version>
    </dependency>
    <!--mysql driver-->
    <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>5.1.49</version>
    </dependency>
    <!--jackson-->
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-core</artifactId>
      <version>2.11.2</version>
    </dependency>
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>2.11.2</version>
    </dependency>
    <!--connection pool-->
    <dependency>
      <groupId>com.alibaba</groupId>
      <artifactId>druid</artifactId>
      <version>1.1.12</version>
    </dependency>
    <!--servlet-->
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>javax.servlet-api</artifactId>
      <version>4.0.1</version>
      <scope>provided</scope>
    </dependency>
    <!--JSTL-->
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>jstl</artifactId>
      <version>1.2</version>
    </dependency>
    <!--lombok-->
    <dependency>
      <groupId>org.projectlombok</groupId>
      <artifactId>lombok</artifactId>
      <version>1.18.12</version>
    </dependency>
  </dependencies>
  <build>
    <resources>
      <resource>
        <directory>src/main/java</directory>
        <includes>
          <include>**/*.properties</include>
          <include>**/*.xml</include>
        </includes>
        <filtering>false</filtering>
      </resource>
    </resources>
    <plugins>
      <plugin>
        <artifactId>maven-compiler-plugin</artifactId>
        <version>3.8.0</version>
      </plugin>
    </plugins>
  </build>
</project>

2.配置SSM环境

1.mybatis-config.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE configuration
        PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
<settings>
    <!--SQL日志-->
    <setting name="logImpl" value="STDOUT_LOGGING"/>
</settings>    
</configuration>

2.spring-mvc.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
       http://www.springframework.org/schema/beans/spring-beans.xsd
       http://www.springframework.org/schema/context
       http://www.springframework.org/schema/context/spring-context.xsd
       http://www.springframework.org/schema/mvc
       http://www.springframework.org/schema/mvc/spring-mvc.xsd">
    <!--声明注解驱动-->
    <mvc:annotation-driven/>
    <!--扫描控制器、异常处理器-->
    <context:component-scan base-package="cn.ccut.**.web.*"/>
    <!--静态资源管理-->
    <mvc:default-servlet-handler/>
</beans>

3.jdbc.properties

jdbc.url=jdbc:mysql://127.0.0.1:3306/test
jdbc.username=root
jdbc.password=root

4.applicationContext.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:tx="http://www.springframework.org/schema/tx"
       xmlns:aop="http://www.springframework.org/schema/aop"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
       http://www.springframework.org/schema/beans/spring-beans.xsd
       http://www.springframework.org/schema/context
       http://www.springframework.org/schema/context/spring-context.xsd
       http://www.springframework.org/schema/tx
       http://www.springframework.org/schema/tx/spring-tx.xsd
       http://www.springframework.org/schema/aop
       http://www.springframework.org/schema/aop/spring-aop.xsd">

    <!--声明组件扫描器-->
    <context:component-scan base-package="cn.ccut.**.service" />

    <!--导入外部配置文件-->
    <context:property-placeholder location="classpath:jdbc.properties"/>
    <!--配置数据源druid-->
    <bean id="dataSource" class="com.alibaba.druid.pool.DruidDataSource" init-method="init" destroy-method="close">
        <property name="url" value="${jdbc.url}"/>
        <property name="username" value="${jdbc.username}"/>
        <property name="password" value="${jdbc.password}"/>
    </bean>

    <!--声明SqlSessionFactoryBean 注意  -->
    <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
        <property name="dataSource" ref="dataSource"/>
        <property name="typeAliasesPackage" value="cn.ccut.domain"/>
        <property name="configLocation" value="classpath:mybatis-config.xml"/>
    </bean>

    <!--声明MyBatis的扫描器-->
    <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
        <property name="sqlSessionFactoryBeanName" value="sqlSessionFactory"/>
        <property name="basePackage" value="cn.ccut.**.mapper"/>
    </bean>

    <!--配置声明式事务-->
    <bean id="tranManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
        <property name="dataSource" ref="dataSource"/>
    </bean>

    <!--配置切面-->
    <tx:advice id="myAdvice" transaction-manager="tranManager">
        <tx:attributes>
            <tx:method name="*" rollback-for="java.lang.Exception" />
            <tx:method name="get*" propagation="SUPPORTS" read-only="true"/>
        </tx:attributes>
    </tx:advice>

    <!--配置AOP-->
    <aop:config>
        <!--指定切入点-->
        <aop:pointcut id="allService" expression="execution(* *..service..*.*(..))"/>
        <!--指定切面+指定切入点-->
        <aop:advisor advice-ref="myAdvice" pointcut-ref="allService"/>
    </aop:config>
</beans>

5.web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
         http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         id="WebApp_ID" version="4.0">

    <!--springmvc的中央调度器-->
    <servlet>
        <servlet-name>dispatcherServlet</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:spring-mvc.xml</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>dispatcherServlet</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>

    <!--spring的加载监听-->
    <context-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>classpath:applicationContext.xml</param-value>
    </context-param>
    <listener>
        <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
    </listener>

    <!--字符集过滤器-->
    <filter>
        <filter-name>characterEncodingFilter</filter-name>
        <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
        <init-param>
            <param-name>encoding</param-name>
            <param-value>utf-8</param-value>
        </init-param>
        <init-param>
            <param-name>forceRequestEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>
            <param-name>forceResponseEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>characterEncodingFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>
    
    
    <welcome-file-list>
        <welcome-file>index.html</welcome-file>
    </welcome-file-list>
</web-app>

3.页面的代码

  • index.html
<html>
<head>
    <title>房屋交易系统</title>
    <meta charset="UTF-8" />
    <link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css"/>
    <script type="text/javascript" src="/static/js/jquery-1.12.4.min.js"></script>
    <script type="text/javascript" src="/static/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="/static/js/jquery.form.extend.js"></script>
<script type="text/javascript" >  
jQuery(function($){
//jQuery页码存放处

});
</script>
</head>
<body>
<!-- 增加和修改公用一个模态窗口 -->
<div class="modal fade" id="actModal" role="dialog">
    <div class="modal-dialog" role="document" style="width: 85%;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">×</span>
                </button>
                <h4 class="modal-title" id="myModalLabel1">--缓存中--</h4>
            </div>

            <div class="modal-body">

                <form id="houseDealForm" class="form-horizontal" role="form">
                    <input type="hidden" id="haid" name="hid" />
                    <div class="form-group">
                        <label for="housename" class="col-sm-2 control-label">房屋名称<span style="font-size: 15px; color: red;">*</span></label>
                        <div class="col-sm-10" style="width: 300px;">
                            <input name="hname" type="text" class="form-control" id="housename">
                        </div>
                    </div>


                    <div class="form-group">
                        <label for="development" class="col-sm-2 control-label">开发商<span style="font-size: 15px; color: red;">*</span></label>
                        <div class="col-sm-10" style="width: 300px;">
                            <input name="hdevelopname" type="text" class="form-control" id="development">
                        </div>
                    </div>


                    <div class="form-group">
                        <label for="city" class="col-sm-2 control-label">所在城市<span style="font-size: 15px; color: red;">*</span></label>
                        <div class="col-sm-10" style="width: 300px;">
                            <input name="hcity" type="text" class="form-control" id="city">
                        </div>
                    </div>

                </form>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button id="saveBtn" type="button" class="btn btn-primary">保存</button>
            </div>
        </div>
    </div>
</div>



<!--主窗体-->
<div style="margin:10px;">
    <div style="position: relative; top: -10px;">
        <div class="page-header">
            <h3 >房屋交易管理系统</h3>
        </div>
    </div>
</div>
<div style="position: relative; top: -20px; margin:10px; height: 100%;">
    <div style="width: 100%; position: absolute;top: 5px;">

        <div class="btn-toolbar" role="toolbar" style="background-color: #F7F7F7; height: 50px; position: relative;top: 5px;">
            <div class="btn-group" style="position: relative; top: 18%;">
                <button id="addBtn" type="button" class="btn btn-primary" data-toggle="modal"><span class="glyphicon glyphicon-plus"></span> 创建</button>
                <button id="editBtn" type="button" class="btn btn-default" data-toggle="modal"><span class="glyphicon glyphicon-pencil"></span> 修改</button>
                <button id="delBtn" type="button" class="btn btn-danger"><span class="glyphicon glyphicon-minus"></span> 删除</button>
            </div>
        </div>
        <div style="position: relative;top: 10px;">
            <table class="table table-hover">
                <thead>
                <tr style="color: #B3B3B3;">
                    <td><input type="checkbox" id="selectAll" /></td>
                    <td>序号</td>
                    <td>名称</td>
                    <td>开发商</td>
                    <td>所在城市</td>
                </tr>
                </thead>
                <tbody id="dataBody"></tbody>
            </table>
        </div>
    </div>
</div>

</body>
</html>

3.实战

1.查询所有

  • ajax 由于考虑到每次 都需要用到，所以封装成一个方法
  /*查询所有 */
            function load_data(){
                $.get("/house/getAll.json",function (data) {
                    var htmlArr = [];
                    $(data).each(function (i) {
                        htmlArr.push(
                            ‘<tr class="‘+(i%2==0?‘active‘:‘‘)+‘">								<td><input type="checkbox" name="hid" value="‘+this.hid+‘" /></td>								<td>‘+(i+1)+‘</td>								<td>‘+this.hname+‘</td>								<td>‘+(this.hdevelopname||‘‘)+‘</td>								<td>‘+(this.hcity||‘‘)+‘</td>							</tr>‘
                        );
                    });
                    $("#dataBody").html(htmlArr.join(‘‘))
                });
            }
            load_data();
  • controller
  @ResponseBody
    @RequestMapping("/getAll.json")
    public List<HouseDeal> getAll(){
        return houseDealService.getAll();
    }

  • mapper

     java: List<HouseDeal> getAll();
//  -----
xml:  <select id="getAll" resultType="HouseDeal">
        select * from housedeal
    </select>

2.删除

  • ajax


  // 删除操作
            $("#delBtn").click(function () {
                //获取所有选择的按钮对象,若没有选择提示让其输入 或用户点击取消该操作
                var $cks = $(":checkbox[name=hid]:checked");
                if ($cks.size() == 0) {
                    alert("请选择要删除的内容！")
                    return;
                }
                if (!confirm("确定？")) return;
    
                var ids = [];
                //遍历选择的 ，把其存进数组
                $cks.each(function () {
                    ids.push("hid=" + this.value)
                });
                // 发送post 异步请求，返回的是true 就代表删除成功，表单数据重新加载
                // 否则弹出框信息
                $.post("/house/del.do", ids.join("&"), function (data) {
                    if (data.success) {
                        load_data();
                    }
                });
            });
  • Controller
 @ResponseBody
    @RequestMapping("/del.do")
    public Map<String,Object> del(String[] hid){
        Map<String,Object> map=new HashMap<String,Object>();
        houseDealService.delete(hid);
        map.put("success",true);
         return map;
    }
  • mapper
 <insert id="insert">
insert into `housedeal` values(
  #{hid},
  #{hname},
  #{hdevelopname},
  #{hcity}
)

3.增加和修改

  • ajax 包含两个事件 1. 弹出模态框2.保存
// 打开添加模态框
            $("#addBtn").click(function () {
                $("#myModalLabel1").text("创建房屋信息");
                $("#actModal").modal(‘show‘);
                // 重置表单
                $("#houseDealForm :input").val("");
            });

    //  打开修改模态框
            $("#editBtn").click(function () {
                var $id = $("#dataBody :checkbox[name=hid]:checked:first");
                if ( $id.size() == 0 ) {
                    alert("请选择要修改的市场活动！");
                    return ;
                }
                $("#houseDealForm").initForm("/house/getOne.json?hid=" + $id.val());
                $("#myModalLabel1").text("修改房屋信息");
                $("#actModal").modal(‘show‘);

            });


  //发送请求到后端，做添加和修改的操作
            $("#saveBtn").click(function () {
                // 获取表单数据
                var data = $("#houseDealForm").formJSON();
                $.post("/house/update.do", data, function (data) {
                    if ( data.success ) {
                       alert("操作成功");
                        $("#actModal").modal(‘hide‘);
                        load_data();
                    }
                }, "json");
            });
  • Controller
//修改需要先进行查询一条记录
@ResponseBody
    @RequestMapping("/getOne.json")
    public HouseDeal getOne(String hid){
        return houseDealService.getOne(hid);

    }
    
   @ResponseBody
    @RequestMapping("/update.do")
    public Map<String,Object> update(HouseDeal houseDeal){
        Map<String,Object> map=new HashMap<String,Object>();
        houseDealService.update(houseDeal);
        map.put("success",true);
        return map;
    }
  • Service
 @Override
    public void update(HouseDeal houseDeal) {
        if(houseDeal.getHid()==null|| "".equals(houseDeal.getHid())){
            houseDeal.setHid(UUID.randomUUID().toString().replace("-",""));
            houseDealMapper.insert(houseDeal);

        }else{
            houseDealMapper.update(houseDeal);
        }
    }
  • mapper
 <insert id="insert">
insert into `housedeal` values(
  #{hid},
  #{hname},
  #{hdevelopname},
  #{hcity}
)
   </insert>

    <update id="update">
      update `housedeal` set
  `hName`=#{hname},
  `hDevelopname`=#{hdevelopname},
  `hCity`=#{hcity}
where `hid`=#{hid}
</update>

4.问题

1. 页面乱码

根据个人计算配置，有的不用配置，有需要需要配置成GBK 字符解析，自己对照下

 <meta charset="UTF-8" />

2. 记得序列化，虽然没啥影响

一个简单的SSM--房屋管理系统

原文：https://www.cnblogs.com/zhenqk/p/13701183.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
分享档案
更多>
2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)
最新文章
更多>
教程昨日排行
更多>
友情链接
汇智网   PHP教程   插件网  
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣，分享程序人生！