• 尚好房 05_二手房管理

    尚好房：二手房管理

    一、功能介绍

    1、数据字典

    [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-QHFrCEuq-1661870815221)(images/05/img_001.png)]

    2、小区管理

    [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0RqXuRme-1661870815225)(images/05/img_002.png)]

    3、房源管理

    [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-e4vWU4ry-1661870815226)(images/05/img_003.png)]

    二、数字字典模块

    1、搭建service-house

    1.1 创建工程

    在service工程中创建子工程，命名为service-house，并且使用插件将其转换成javaweb工程

    1.2 修改pom.xml
    

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">  
  <parent> 
    <artifactId>serviceartifactId>  
    <groupId>com.atguigugroupId>  
    <version>1.0version> 
  parent>  
  <modelVersion>4.0.0modelVersion>  
  <artifactId>service-houseartifactId>
  <packaging>warpackaging>
  <properties> 
    <maven.compiler.source>8maven.compiler.source>  
    <maven.compiler.target>8maven.compiler.target> 
  properties>

  <build>
    <plugins>
      <plugin>
        <groupId>org.eclipse.jettygroupId>
        <artifactId>jetty-maven-pluginartifactId>
        <version>9.4.15.v20190215version>
        <configuration>
          <webAppConfig>
            
            <contextPath>/contextPath>
          webAppConfig>
          <httpConnector>
            
            <port>7002port>
          httpConnector>
        configuration>
      plugin>
    plugins>
  build>
project>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    1.3 创建目录结构
    1. 创建com.atguigu.mapper包
    2. 创建com.atguigu.service.impl包
    3. 在resources目录中创建mappers目录
    1.4 配置文件

    1. 在resources目录中创建spring目录

    2. 将service-acl的resources/spring目录中的配置文件拷贝过来

    3. 修改spring-register.xml文件，只是修改应用名称与端口

      
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:dubbo="http://code.alibabatech.com/schema/dubbo"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
       http://www.springframework.org/schema/beans/spring-beans.xsd
       http://code.alibabatech.com/schema/dubbo
       http://code.alibabatech.com/schema/dubbo/dubbo.xsd">
    
    <dubbo:annotation package="com.atguigu"/>
    
    <dubbo:registry address="zookeeper://127.0.0.1:2181"/>
    
    <dubbo:application name="service-house"/>
    
    <dubbo:protocol name="dubbo" port="20882"/>
beans>

      • 1
      • 2
      • 3
      • 4
      • 5
      • 6
      • 7
      • 8
      • 9
      • 10
      • 11
      • 12
      • 13
      • 14
      • 15
      • 16
      • 17
      • 18
      • 19
      • 20
      • 21

    4. 拷贝日志配置文件和jdbc.properties文件到resources目录中

    1.5 配置web.xml
    
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xmlns="http://java.sun.com/xml/ns/javaee"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	version="2.5">
	
	<context-param>
		<param-name>contextConfigLocationparam-name>
		<param-value>classpath:spring/spring-*.xmlparam-value>
	context-param>
	<listener>
		<listener-class>org.springframework.web.context.ContextLoaderListenerlistener-class>
	listener>
web-app>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14

    2、前端实现方案

    数据字典我们使用zTree渲染，在线文档：http://www.treejs.cn/v3/demo.php#_108

    [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-sYP2Zmil-1661870815227)(images/05/img_004.png)]

    点击父节点发送请求获取子节点列表，响应数据类似:

    [{ id:'0131', name:'n1.3.n1', isParent:true},{ id:'0132', name:'n1.3.n2', isParent:false},{ id:'0133', name:'n1.3.n3', isParent:true},{ id:'0134', name:'n1.3.n4', isParent:false}]

    • 1

    我们通过观察可以看到，每个子节点的数据包括:

    1. id: 子节点的主键值
    2. name:子节点名称
    3. isParent:表示子节点是否还有子节点

    3、搭建服务提供者

    3.1 持久层
    3.1.1 DictMapper接口

    在service-house项目中的com.atguigu.mapper包中创建DictMapper接口

    package com.atguigu.mapper;
import com.atguigu.entity.Dict;
import java.util.List;
/**
 * 包名:com.atguigu.mapper
 *
 * @author Leevi
 * 日期2022-03-25  21:52
 */
public interface DictMapper {
    /**
     * 根据父节点id查询子节点列表
     * @param parentId
     * @return
     */
    List<Dict> findListByParentId(Long parentId);
    /**
     * 判断是否是父节点
     * @param id
     * @return
     */
    Integer countIsParent(Long id);
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    3.1.2 DictMapper.xml映射配置文件

    在service-house工程的resources/mappers目录中创建DictMapper.xml文件

    
DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.atguigu.mapper.DictMapper">
    
    <sql id="columns">
       select id,parent_id,name,dict_code,create_time,update_time,is_deleted
    sql>
    <select id="findListByParentId" resultType="Dict">
        <include refid="columns">include>
        from hse_dict
        where
        parent_id=#{parentId}
        and
        is_deleted=0
    select>
    <select id="countIsParent" resultType="int">
        select count(0) from hse_dict where parent_id=#{id}
    select>
mapper>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    3.1 创建接口

    在service-api工程中创建DictService接口

    package com.atguigu.service;
import java.util.List;
import java.util.Map;
public interface DictService {
    List<Map<String,Object>> findZnodes(Long id);
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    3.2 创建接口实现类

    在service-house工程中的com.atguigu.service.impl包中创建DictService接口的实现类

    @Override
    public List<Map<String, Object>> findZnodes(Long id) {
        //1. 调用持久层方法，根据父节点id查询List
        List<Dict> dictList = dictMapper.findListByParentId(id);

        /*List> znodes = new ArrayList<>();
        //2. 将dictList转成List
        for (Dict dict : dictList) {
            Map znode = new HashMap();
            znode.put("id",dict.getId());
            znode.put("name",dict.getName());
            znode.put("isParent",dictMapper.countIsParent(dict.getId()) > 0);

            //将znode添加到znodes中
            znodes.add(znode);
        }*/

        //使用Stream流
        List<Map<String, Object>> znodes = dictList.stream()
                .map(dict -> {
                    Map<String, Object> znode = new HashMap<>();
                    //往znode中存放id
                    znode.put("id", dict.getId());
                    //往znode中存放name
                    znode.put("name", dict.getName());
                    //往znode中存放isParent
                    znode.put("isParent", dictMapper.countIsParent(dict.getId()) > 0);
                    return znode;
                })
                .collect(Collectors.toList());
        return znodes;
    }

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32

    4、搭建服务消费者

    4.1 表现层

    在web-admin中创建DictController类

    package com.atguigu.controller;

import com.alibaba.dubbo.config.annotation.Reference;
import com.atguigu.base.BaseController;
import com.atguigu.entity.Dict;
import com.atguigu.result.Result;
import com.atguigu.service.DictService;
import org.springframework.web.bind.annotation.*;

import java.util.List;
import java.util.Map;

/**
 * 包名:com.atguigu.controller
 *
 * @author Leevi
 * 日期2022-03-25  22:03
 */
@RestController
@RequestMapping("/dict")
public class DictController extends BaseController {
    @Reference
    private DictService dictService;
    @GetMapping("/findZnodes")
    public Result findZNodes(@RequestParam(value = "id",defaultValue = "0") Long id){
        List<Map<String, Object>> zNodes = dictService.findZnodes(id);
        return Result.ok(zNodes);
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29

    在spring-mvc.xml中配置view-controller访问数字字典的首页

    
<mvc:view-controller path="/dict" view-name="dict/index"/>

    • 1
    • 2
    4.2 前端页面
    4.2.2 拷贝ztree

    将资料中的zTree_v3文件夹拷贝到static/js/plugins目录中

    4.2.1 创建dict的首页

    在templates目录中创建dict目录，在dict目录中创建index.html，zTree依赖jquery，head文件已引用

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="common/head :: head">head>

<link rel="stylesheet" th:href="@{/static/js/plugins/zTree_v3/zTreeStyle.css}" type="text/css">
<script type="text/javascript" th:src="@{/static/js/plugins/zTree_v3/jquery.ztree.core.js}">script>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="ibox float-e-margins">
        <div class="ibox-content" style="width: 98%;">

            <div class="zTreeDemoBackground left">
                <ul id="treeDemo" class="ztree">ul>
            div>
        div>
    div>
div>
<script th:inline="javascript">
    // 文档地址:http://www.treejs.cn/v3/demo.php#_108
    var setting = {
        async: {
            enable: true,
            url: "/dict/findZnodes",
            type: "get",
            autoParam: ["id"],
            dataFilter: filter
        }
    };

    function filter(treeId, parentNode, childNodes) {
        childNodes = childNodes.data
        if (!childNodes) return null;
        for (var i = 0, l = childNodes.length; i < l; i++) {
            childNodes[i].name = childNodes[i].name.replace(/\.n/g, '.');
        }
        return childNodes;
    }
    $.fn.zTree.init($("#treeDemo"), setting);
script>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    4.2.2 修改frame中的首页

    修改frame/index.html，设置访问数字字典

    <li>
   <a href="#">
      <i class="fa fa-home">i>
      <span class="nav-label">权限管理span>
      <span class="fa arrow">span>
   a>
   <ul class="nav nav-second-level">
      <li>
         <a class="J_menuItem" href="/admin" data-index="0">用户管理a>
      li>
      <li>
         <a class="J_menuItem" href="/role">角色列表a>
      li>
      
   ul>
li>
<li>
   <a href="#">
      <i class="fa fa-home">i>
      <span class="nav-label">二手房管理span>
      <span class="fa arrow">span>
   a>
   <ul class="nav nav-second-level">
      <li>
         <a class="J_menuItem" href="/dict" data-index="0">数据字典a>
      li>
   ul>
li>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    4.3 测试

    启动服务消费者和服务提供者，并在地址栏输入: http://localhost:8000，然后点击左侧菜单中的数字字典

    [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-8OhTBe93-1661870815228)(images/05/img_005.png)]

    三、小区管理模块

    1、分页显示小区列表功能

    1.1 服务提供者
    1.1.1 初始化加载区域列表
    1.1.1.1 持久层

    ① DictMapper接口

    /**
     * 根据父节点的dictCode查询子节点列表
     * @param parentDictCode
     * @return
     */
List<Dict> findDictListByParentDictCode(String parentDictCode);

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6

    ② DictMapper.xml映射配置文件

    <select id="findDictListByParentDictCode" resultType="Dict">
    <include refid="columns">include>
    from hse_dict
    where parent_id=(select id from hse_dict where dict_code=#{parentDictCode} and is_deleted=0)
    and is_deleted=0
select>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    1.1.1.2 业务层

    ① service-api项目中的DictService接口

    /**
     * 根据dictCode查询dict集合
     * @param parentDictCode
     * @return
     */
List<Dict> findDictListByParentDictCode(String parentDictCode);
/**
     * 根据父节点的id查询其所有的子节点
     * @param parentId
     * @return
     */
List<Dict> findDictListByParentId(Long parentId);

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12

    ② service-house项目中的DictServiceImpl实现类

    @Override
public List<Dict> findDictListByParentDictCode(String parentDictCode) {
    return dictMapper.findDictListByParentDictCode(parentDictCode);
}
@Override
public List<Dict> findDictListByParentId(Long parentId) {
    return dictMapper.findListByParentId(parentId);
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    1.1.2 按条件分页加载小区列表
    1.1.2.1 持久层

    ① 在service-house的com.atguigu.mapper包中创建CommunityMapper接口

    public interface CommunityMapper extends BaseMapper<Community> {
}

    • 1
    • 2

    ② 在service-house的resources/mappers目录中创建CommunityMapper.xml映射配置文件

    
DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.atguigu.mapper.CommunityMapper">
    <sql id="columns">
        select id,name,description,province_id,city_id,area_id,plate_id,address,longitude,latitude,
               build_years,property_price,property_company,developer,build_num,house_num,average_price,
               create_time,update_time,is_deleted,
          
         (select name from hse_dict where id = hc.area_id) areaName,
         (select name from hse_dict where id = hc.plate_id) plateName
    sql>

    <sql id="findPageWhere">
        <where>
            <if test="name != null and name != ''">
                and name like "%"#{name}"%"
            if>
            <if test="areaId != null and areaId != ''">
                and area_id=#{areaId}
            if>
            <if test="plateId != null and plateId != ''">
                and plate_id=#{plateId}
            if>
            and is_deleted = 0
        where>
    sql>

    <select id="getById" resultType="Community">
        <include refid="columns">include>
        from hse_community hc
        where
        is_deleted=0 and id = #{id}
    select>
    
    <select id="findPage" resultType="Community">
        <include refid="columns">include>
        from hse_community hc
        <include refid="findPageWhere">include>
        order by id desc
    select>
mapper>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    1.1.2.2 业务层

    ① 在service-api项目中创建CommunityService接口

    public interface CommunityService extends BaseService<Community> {
}

    • 1
    • 2

    ② 在service-house项目的com.atguigu.service.impl包中创建CommunityServiceImpl实现类

    @Service(interfaceClass = CommunityService.class)
public class CommunityServiceImpl extends BaseServiceImpl<Community> implements CommunityService {
    @Autowired
    private CommunityMapper communityMapper;
    @Override
    protected BaseMapper<Community> getEntityMapper() {
        return communityMapper;
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    1.2 服务消费者
    1.2.1 DictController

    web-admin项目中的DictController，新增代码

    /**
     * 根据父节点的id获取子节点数据列表
     * @param parentId
     * @return
     */
@RequestMapping("/findDictListByParentId/{parentId}")
public Result findDictListByParentId(@PathVariable("parentId") Long parentId) {
    List<Dict> dictList = dictService.findDIctListByParentId(parentId);
    return Result.ok(dictList);
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10

    测试:

    访问:http://localhost:8000/dict/findListByParentId/1

    1.2.2 CommunityController

    在web-admin项目中创建CommunityController类

    package com.atguigu.controller;
import com.alibaba.dubbo.config.annotation.Reference;
import com.atguigu.base.BaseController;
import com.atguigu.entity.Community;
import com.atguigu.entity.Dict;
import com.atguigu.service.CommunityService;
import com.atguigu.service.DictService;
import com.github.pagehelper.PageInfo;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import java.util.List;
import java.util.Map;

/**
 * 包名:com.atguigu.controller
 *
 * @author Leevi
 * 日期2022-03-26  19:12
 */
@Controller
@RequestMapping("/community")
public class CommunityController extends BaseController {
    @Reference
    private CommunityService communityService;
    @Reference
    private DictService dictService;
    private final static String PAGE_INDEX = "community/index";
    @RequestMapping
    public String index(@RequestParam Map<String,Object> filters, Model model){
        //处理pageNum和pageSize为空的情况
        if (filters.get("pageNum") == null || "".equals(filters.get("pageNum"))) {
            filters.put("pageNum",1);
        }
        if (filters.get("pageSize") == null || "".equals(filters.get("pageSize"))) {
            filters.put("pageSize",10);
        }
        //查询"beijing"的所有区域
        List<Dict> areaList = dictService.findDictListByParentDictCode("beijing");
        PageInfo<Community> pageInfo = communityService.findPage(filters);
        //将分页数据存储到请求域
        model.addAttribute("page",pageInfo);
        //将搜索条件存储到请求域
        
        //处理filters中没有areaId和plateId的情况
        if (!filters.containsKey("areaId")){
            filters.put("areaId",0);
        }
        if (!filters.containsKey("plateId")){
            filters.put("plateId",0);
        }
        model.addAttribute("filters",filters);
        //将areaList存储到请求域
        model.addAttribute("areaList",areaList);
        return PAGE_INDEX;
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    2.3 前端页面
    2.3.1 创建小区首页

    在templates目录中创建community目录，在community目录中创建index.html

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/extras/spring-security">

<head th:include="common/head :: head">head>

<body class="gray-bg">
<form id="ec" th:action="@{/community}" method="post">
    <div class="wrapper wrapper-content animated fadeInRight">

        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-content">
                        <table class="table form-table margin-bottom10">
                            <tr>
                                <td>
                                    <input type="text" name="name" th:value="${#maps.containsKey(filters, 'name')} ? ${filters.name} : ''" placeholder="小区名称" class="input-sm form-control"/>
                                td>
                                <td>
                                    <select name="areaId" id="areaId" class="form-control">
                                        <option value="">-请选择区域-option>
                                        <option th:each="item,it : ${areaList}" th:text="${item.name}" th:value="${item.id}" th:selected="${item.id } eq  ${filters.areaId }">-选择区域-option>
                                    select>
                                td>
                                <td>
                                    <select name="plateId" id="plateId" class="form-control">
                                        <option value="">-请选择-option>
                                    select>
                                td>
                            tr>
                        table>
                        <div>
                            <button type="submit" class="btn btn-sm btn-primary"> 搜索button>
                            <button type="button" class="btn btn-sm btn-primary create" sec:authorize="hasAuthority('community.create')"> 新增button>
                            <button type="button" id="loading-example-btn" onclick="javascript:window.location.reload();" class="btn btn-white btn-sm">刷新button>
                        div>
                        <table class="table table-striped table-bordered table-hover dataTables-example">
                            <thead>
                            <tr>
                                <th>序号th>
                                <th>小区名称th>
                                <th>区域th>
                                <th>板块th>
                                <th>详细地址th>
                                <th>建筑年代th>
                                <th>创建时间th>
                                <th>操作 th>
                            tr>
                            thead>
                            <tbody>
                            <tr class="gradeX" th:each="item,it: ${page.list}">
                                <td class="text-center" th:text="${it.count}">11td>
                                <td th:text="${item.name}">22td>
                                <td th:text="${item.areaName}">33td>
                                <td th:text="${item.plateName}">22td>
                                <td th:text="${item.address}">22td>
                                <td th:text="${item.buildYears}">22td>
                                <td th:text="${#dates.format(item.createTime,'yyyy-MM-dd HH:mm:ss')}" >33td>
                                <td class="text-center">
                                   <a class="edit" th:attr="data-id=${item.id}">修改a>
                                   <a class="delete" th:attr="data-id=${item.id}">删除a>
                                td>
                            tr>
                            tbody>
                        table>

                        <div class="row" th:include="common/pagination :: pagination">div>

                    div>
                div>
            div>
        div>
    div>
form>
<script th:inline="javascript">
    $(function(){		
        //点击区域获取该区域的所有版块
        $("#areaId").bind("change",function() {
            var areaId = $("#areaId").val();
            if(areaId == '') return
            $("#plateId").empty();
            $.get("/dict/findDictListByParentId/" + areaId,function(response) {
                $("").appendTo("#plateId");
                var res = JSON.parse(response)
                $.each(res.data, function(i,item) {
                    var plateId = [[${filters.plateId}]];
                    if(item.id == plateId) {
                        $("").val(item.id).text(item.name).attr('selected', 'true').appendTo("#plateId");
                    } else {
                        $("").val(item.id).text(item.name).appendTo("#plateId");
                    }
                });
            });
        });
        // 触发 select 元素的 change 事件：
        $("#areaId").trigger("change");
    });
script>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    2.3.2 修改框架首页

    frame/index.html页面添加导航

    <li>
    <a class="J_menuItem" href="/community" data-index="0">小区管理a>
li>

    • 1
    • 2
    • 3

    2、新增小区功能

    2.1 访问新增页面功能
    2.1.1 CommunityController

    在web-admin项目中的CommunityController中新增

    private final static String PAGE_CREATE = "community/create";
@RequestMapping("/create")
public String create(Model model){
    List<Dict> areaList = dictService.findDictListByParentDictCode("beijing");
    model.addAttribute("areaList",areaList);
    return PAGE_CREATE;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    2.1.2 index.html

    修改web-admin项目中的templates/community/index.html页面，给新增绑定点击事件

    $(".create").on("click",function () {
    opt.openWin('/community/create','新增',630,430)
});

    • 1
    • 2
    • 3
    2.1.3 create.html页面

    在web-admin项目中的templates/community目录中创建create.html页面

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="common/head :: head">head>
<script type="text/javascript">
    $(function () {
        //根据区域id获取板块列表
        $("#areaId").bind("change", function () {
            var areaId = $("#areaId").val();
            $("#plateId").empty();
            $.get("/dict/findDictListByParentId/" + areaId, function (response) {
                var res = JSON.parse(response)
                $.each(res.data, function (i, item) {
                    $("").val(item.id).text(item.name).appendTo("#plateId");
                });
            });
        });
    });
script>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="ibox float-e-margins">
        <div class="ibox-content" style="width: 98%;">
            <form id="ec" action="/community/save" method="post" class="form-horizontal">
                <div class="form-group">
                    <label class="col-sm-2 control-label">小区名称：label>
                    <div class="col-sm-10">
                        <input type="text" name="name" id="name" class="form-control"/>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">描述：label>
                    <div class="col-sm-10">
                        <input type="text" name="description" id="description" class="form-control"/>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">区域：label>
                    <div class="col-sm-10">
                        <select name="areaId" id="areaId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${areaList}" th:text="${item.name}" th:value="${item.id}">
                                -选择区域-
                            option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">板块：label>
                    <div class="col-sm-10">
                        <select name="plateId" id="plateId" class="form-control">
                            <option value="">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">详细地址：label>
                    <div class="col-sm-10">
                        <input type="text" name="address" id="address" class="form-control"/>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">建筑年代：label>
                    <div class="col-sm-10">
                        <input type="text" name="buildYears" id="buildYears" class="form-control"/>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">物业价格(元/平)：label>
                    <div class="col-sm-10">
                        <input type="text" name="propertyPrice" id="propertyPrice" class="form-control"/>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">物业公司：label>
                    <div class="col-sm-10">
                        <input type="text" name="propertyCompany" id="propertyCompany" class="form-control"/>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">开发商：label>
                    <div class="col-sm-10">
                        <input type="text" name="developer" id="developer" class="form-control"/>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">楼栋数：label>
                    <div class="col-sm-10">
                        <input type="text" name="buildNum" id="buildNum" class="form-control"/>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">房屋数：label>
                    <div class="col-sm-10">
                        <input type="text" name="houseNum" id="houseNum" class="form-control"/>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">均价(万元/平)：label>
                    <div class="col-sm-10">
                        <input type="text" name="averagePrice" id="averagePrice" class="form-control"/>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <div class="col-sm-4 col-sm-offset-2 text-right">
                        <button class="btn btn-primary" type="submit">确定button>
                        <button class="btn btn-white" type="button" onclick="javascript:opt.closeWin();" value="取消">取消
                        button>
                    div>
                div>
            form>
        div>
    div>
div>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    2.2 保存新增小区功能
    2.2.1 CommunityMapper.xml映射配置文件

    在service-house项目中的resources/mappers/CommunityMapper.xml中新增

    <insert id="insert">
    insert into hse_community
    (id ,name ,description ,province_id ,city_id ,area_id ,plate_id ,address ,longitude ,latitude ,
    build_years ,property_price ,property_company ,developer ,build_num ,house_num ,average_price)
    values (#{id} ,#{name} ,#{description} ,#{provinceId} ,#{cityId} ,#{areaId} ,#{plateId} ,#{address} ,#{longitude} ,
    #{latitude} ,#{buildYears} ,#{propertyPrice} ,#{propertyCompany} ,#{developer} ,#{buildNum} ,#{houseNum} ,#{averagePrice})
insert>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    2.2.2 CommunityController

    在web-admin项目中的CommunityController中新增

    @PostMapping("/save")
public String save(Community community,Model model){
    communityService.insert(community);
    return successPage(model,"添加小区成功");
}

    • 1
    • 2
    • 3
    • 4
    • 5

    3、修改小区功能

    3.1 访问修改页面功能
    3.1.1 CommunityMapper.xml
    <select id="getById" resultType="Community">
    <include refid="columns">include>
    from hse_community where id=#{id} and is_deleted=0
select>

    • 1
    • 2
    • 3
    • 4
    3.1.2 CommunityController

    在web-admin项目中的CommunityController中新增

    private final static String PAGE_EDIT = "community/edit";
@RequestMapping("/edit/{id}")
public String edit(@PathVariable("id") Long id, Model model){
    //查询小区信息
    Community community = communityService.getById(id);
    model.addAttribute("community",community);
    //查询beijing所有的区域
    List<Dict> areaList = dictService.findDictListByParentDictCode("beijing");
    model.addAttribute("areaList",areaList);
    return PAGE_EDIT;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    3.1.3 index.html

    修改web-admin项目中的templates/community/index.html页面，给修改绑定点击事件

    $(".edit").on("click",function () {
    var id = $(this).attr("data-id");
    opt.openWin('/community/edit/' + id,'修改',580,430);
});

    • 1
    • 2
    • 3
    • 4
    3.1.4 edit.html

    在web-admin项目中的templates/community目录中创建edit.html页面

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="common/head :: head">head>
<script type="text/javascript">
    $(function(){
        $("#areaId").bind("change",function() {
            var areaId = $("#areaId").val();
            if(areaId == '') return
            $("#plateId").empty();
            $.get("/dict/findDictListByParentId/" + areaId,function(response) {
                var res = JSON.parse(response)
                $.each(res.data, function(i,item) {
                    var plateId = [[${community.plateId}]];
                    if(item.id == plateId) {
                        $("").val(item.id).text(item.name).attr('selected', 'true').appendTo("#plateId");
                    } else {
                        $("").val(item.id).text(item.name).appendTo("#plateId");
                    }
                });
            });
        });
        // 触发 select 元素的 change 事件：
        $("#areaId").trigger("change");
    });
script>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="ibox float-e-margins">
        <div class="ibox-content" style="width: 98%;">
            <form id="ec" th:action="@{/community/update}" method="post" class="form-horizontal">
                <input type="hidden" name="id" th:value="${community.id}">
                <div class="form-group">
                    <label class="col-sm-2 control-label">小区名称：label>
                    <div class="col-sm-10">
                        <input type="text" name="name" id="name" th:value="${community.name}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">描述：label>
                    <div class="col-sm-10">
                        <input type="text" name="description" id="description" th:value="${community.description}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">区域：label>
                    <div class="col-sm-10">
                        <select name="areaId" id="areaId" class="form-control">
                            <option value="">-选择区域-option>
                            <option th:each="item,it : ${areaList}" th:text="${item.name}" th:value="${item.id}" th:selected="${item.id} eq ${community.areaId}">-选择区域-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">板块：label>
                    <div class="col-sm-10">
                        <select name="plateId" id="plateId" class="form-control">
                            <option value="">-选择板块-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">详细地址：label>
                    <div class="col-sm-10">
                        <input type="text" name="address" id="address" th:value="${community.address}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">建筑年代：label>
                    <div class="col-sm-10">
                        <input type="text" name="buildYears" id="buildYears" th:value="${community.buildYears}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">物业价格(元/平)：label>
                    <div class="col-sm-10">
                        <input type="text" name="propertyPrice" id="propertyPrice" th:value="${community.propertyPrice}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">物业公司：label>
                    <div class="col-sm-10">
                        <input type="text" name="propertyCompany" id="propertyCompany" th:value="${community.propertyCompany}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">开发商：label>
                    <div class="col-sm-10">
                        <input type="text" name="developer" id="developer" th:value="${community.developer}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">楼栋数：label>
                    <div class="col-sm-10">
                        <input type="text" name="buildNum" id="buildNum" th:value="${community.buildNum}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">房屋数：label>
                    <div class="col-sm-10">
                        <input type="text" name="houseNum" id="houseNum" th:value="${community.houseNum}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">均价(万元/平)：label>
                    <div class="col-sm-10">
                        <input type="text" name="averagePrice" id="averagePrice" th:value="${community.averagePrice}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group posf">
                    <div class="col-sm-4 col-sm-offset-2 text-right">
                        <button class="btn btn-primary" type="submit">确定button>
                        <button class="btn btn-white" type="button" onclick="javascript:opt.closeWin();" value="取消">取消button>
                    div>
                div>
            form>
        div>
    div>
div>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    • 128
    • 129
    • 130
    • 131
    • 132
    3.2 保存修改功能
    3.2.1 CommunityMapper.xml映射配置文件

    在service-house项目中的resources/mappers/CommunityMapper.xml中新增

    <update id="update">
    update hse_community set
    <if test="name != null">
        name = #{name} ,
    if>
    <if test="description != null">
        description = #{description} ,
    if>
    <if test="provinceId != null">
        province_id = #{provinceId} ,
    if>
    <if test="cityId != null">
        city_id = #{cityId} ,
    if>
    <if test="areaId != null">
        area_id = #{areaId} ,
    if>
    <if test="plateId != null">
        plate_id = #{plateId} ,
    if>
    <if test="address != null">
        address = #{address} ,
    if>
    <if test="longitude != null">
        longitude = #{longitude} ,
    if>
    <if test="latitude != null">
        latitude = #{latitude} ,
    if>
    <if test="buildYears != null">
        build_years = #{buildYears} ,
    if>
    <if test="propertyPrice != null">
        property_price = #{propertyPrice} ,
    if>
    <if test="propertyCompany != null">
        property_company = #{propertyCompany} ,
    if>
    <if test="developer != null">
        developer = #{developer} ,
    if>
    <if test="buildNum != null">
        build_num = #{buildNum} ,
    if>
    <if test="houseNum != null">
        house_num = #{houseNum} ,
    if>
    <if test="averagePrice != null">
        average_price = #{averagePrice} ,
    if>
    update_time =  now()
    where
    id = #{id}
update>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    3.2.2 CommunityController

    在web-admin项目中的CommunityController中新增

    @PostMapping("/update")
public String update(Community community,Model model){
    communityService.update(community);
    return successPage(model,"修改小区信息成功");
}

    • 1
    • 2
    • 3
    • 4
    • 5

    4、删除小区功能

    4.1 CommunityMapper.xml映射配置文件
    <update id="delete">
    update hse_community set
    update_time = now() ,
    is_deleted = 1
    where
    id = #{id}
update>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    4.2 CommunityController

    在web-admin项目中的CommunityController中新增

    private final static String LIST_ACTION = "redirect:/community";
@RequestMapping("/delete/{id}")
public String delete(@PathVariable("id") Long id){
    communityService.delete(id);
    return LIST_ACTION;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    4.2 index.html

    修改web-admin项目中的templates/community/index.html页面，给删除绑定点击事件

    $(".delete").on("click",function(){
    var id = $(this).attr("data-id");
    opt.confirm('/community/delete/'+id);
});

    • 1
    • 2
    • 3
    • 4

    四、房源管理模块

    1、分页显示房源列表功能

    1.1 加载所有小区

    因为查询房源信息的条件中有根据小区查询，所以需要查询所有小区

    1.1.1 持久层
    1.1.1.1 CommunityMapper接口

    在service-house项目中的com.atguigu.mapper.CommunityMapper接口中新增

    List<Community> findAll();

    • 1
    1.1.1.2 CommunityMapper.xml映射配置文件

    在service-house项目中的resources/mapper/CommunityMapper.xml文件中新增

    
<select id="findAll" resultType="Community">
    select id,name
    from hse_community
    where
    is_deleted = 0
    order by id desc
select>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    1.1.2 业务层
    1.1.2.1 CommunityService接口

    在service-api项目中的com.atguigu.service.CommunityService接口中新增

    List<Community> findAll();

    • 1
    1.1.2.2 CommunityServiceImpl实现类

    在service-house项目中的com.atguigu.service.impl.CommunityServiceImpl实现类中新增

    @Override
public List<Community> findAll() {
    return communityMapper.findAll();
}

    • 1
    • 2
    • 3
    • 4
    1.2 按条件分页加载房源
    1.2.1 持久层
    1.2.1.1 HouseMapper接口

    在service-house项目的com.atguigu.mapper包中新建HouseMapper接口

    public interface HouseMapper extends BaseMapper<House> {
}

    • 1
    • 2
    1.1.1.2 HouseMapper.xml映射配置文件

    在service-house项目的resources/mappers目录中新建HouseMapper.xml映射配置文件

    
DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.atguigu.mapper.HouseMapper">
    <sql id="columns">
        select id,community_id,name,description,total_price,unit_price,build_area,inside_area,
               house_type_id,floor_id,build_structure_id,direction_id,decoration_id,house_use_id,
               elevator_ratio,listing_date,last_trade_date,status,create_time,update_time,is_deleted
    sql>
    
    <select id="getById" resultType="House">
        <include refid="columns">include>
        from hse_house hh
        where id=#{id} and is_deleted=0
    select>

    <sql id="findPageWhere">
        <where>
            <if test="communityId != null and communityId != ''">
                and community_id = #{communityId}
            if>
            <if test="name != null and name != ''">
                and name like CONCAT('%',#{name},'%')
            if>
            <if test="houseTypeId != null and houseTypeId != ''">
                and house_type_id = #{houseTypeId}
            if>
            <if test="floorId != null and floorId != ''">
                and floor_id = #{floorId}
            if>
            <if test="buildStructureId != null and buildStructureId != ''">
                and build_structure_id = #{buildStructureId}
            if>
            <if test="directionId != null and directionId != ''">
                and direction_id = #{directionId}
            if>
            <if test="decorationId != null and decorationId != ''">
                and decoration_id = #{decorationId}
            if>
            <if test="houseUseId != null and houseUseId != ''">
                and house_use_id = #{houseUseId}
            if>
            and is_deleted = 0
        where>
    sql>

    <select id="findPage" resultType="House">
        <include refid="columns" />
        from hse_house hh
        <include refid="findPageWhere"/>
        order by id desc
    select>
mapper>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    1.2.2 业务层
    1.2.2.1 HouseService接口

    在service-api项目中的com.atguigu.service包中新建HouseService接口

    public interface HouseService extends BaseService<House> {
}

    • 1
    • 2
    1.2.2.2 HouseServiceImpl实现类

    在service-house项目中的com.atguigu.service.impl包中新建HouseServiceImpl实现类

    @Service(interfaceClass = HouseService.class)
public class HouseServiceImpl extends BaseServiceImpl<House> implements HouseService {
    @Autowired
    private HouseMapper houseMapper;
    @Override
    protected BaseMapper<House> getEntityMapper() {
        return houseMapper;
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    1.2.3 表现层

    在model项目中的com.atguigu.en包下创建一个枚举类

    public enum DictCode {
    HOUSETYPE("houseType"),FLOOR("floor"),BUILDSTRUCTURE("buildStructure"),
    DECORATION("decoration"),DIRECTION("direction"),HOUSEUSE("houseUse");
    private String message;

    DictCode(String message) {
        this.message = message;
    }
    public String getMessage() {
        return message;
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12

    在web-admin项目的com.atguigu.controller包中新建HouseController

    @Controller
@RequestMapping("/house")
public class HouseController {
    private static final String PAGE_INDEX = "house/index";
    @Reference
    private HouseService houseService;

    @Reference
    private CommunityService communityService;

    @Reference
    private DictService dictService;
    @RequestMapping
    public String index(@RequestParam Map<String,Object> filters, Model model){
        //处理pageNum和pageSize为空的情况
        if (!filters.containsKey("pageNum")) {
            filters.put("pageNum",1);
        }
        if (!filters.containsKey("pageSize")) {
            filters.put("pageSize",10);
        }
        //1. 分页搜索房源列表信息
        PageInfo<House> pageInfo = houseService.findPage(filters);

        //2. 将房源分页信息存储到请求域
        model.addAttribute("page",pageInfo);

        //3. 将搜索条件存储到请求域
        model.addAttribute("filters",filters);

        //4. 查询所有小区、以及字典里的各种列表存储到请求域
        saveAllDictToRequestScope(model);

        return PAGE_INDEX;
    }

    /**
     * 查询所有小区以及字典里的各种列表存储到请求域
     * @param model
     */
    private void saveAllDictToRequestScope(Model model) {
        //2. 查询所有小区
        List<Community> communityList = communityService.findAll();
        //3. 查询各种初始化列表:户型列表、楼层列表、装修情况列表....
        List<Dict> houseTypeList = dictService.findDictListByParentDictCode(DictCode.HOUSETYPE.getMessage());
        List<Dict> floorList = dictService.findDictListByParentDictCode(DictCode.FLOOR.getMessage());
        List<Dict> buildStructureList = dictService.findDictListByParentDictCode(DictCode.BUILDSTRUCTURE.getMessage());
        List<Dict> directionList = dictService.findDictListByParentDictCode(DictCode.DIRECTION.getMessage());
        List<Dict> decorationList = dictService.findDictListByParentDictCode(DictCode.DECORATION.getMessage());
        List<Dict> houseUseList = dictService.findDictListByParentDictCode(DictCode.HOUSEUSE.getMessage());
        //5. 将所有小区存储到请求域
        model.addAttribute("communityList",communityList);
        //6. 将各种列表存储到请求域
        model.addAttribute("houseTypeList",houseTypeList);
        model.addAttribute("floorList",floorList);
        model.addAttribute("buildStructureList",buildStructureList);
        model.addAttribute("directionList",directionList);
        model.addAttribute("decorationList",decorationList);
        model.addAttribute("houseUseList",houseUseList);
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    1.2.4 前端页面

    在web-admin项目的templates目录中创建house目录，在house目录中新建index.html页面

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/extras/spring-security">

<head th:include="common/head :: head">head>

<body class="gray-bg">
<form id="ec" th:action="@{/house}" method="post">
    <div class="wrapper wrapper-content animated fadeInRight">

        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-content">
                        <table class="table form-table margin-bottom10">
                            <tr>
                                <td>
                                    <input type="text" name="name" th:value="${#maps.containsKey(filters, 'name')} ? ${filters.name} : ''" placeholder="房源名称" class="input-sm form-control"/>
                                td>
                                <td>
                                    <select name="communityId" id="communityId" class="form-control">
                                        <option value="">-请选择小区-option>
                                        <option th:each="item,it : ${communityList}" th:text="${item.name}" th:value="${item.id}" th:selected="${#maps.containsKey(filters, 'communityId')} ? ${item.id} eq ${filters.communityId} : false">-选择小区-option>
                                    select>
                                td>
                                <td>
                                    <select name="houseTypeId" id="houseTypeId" class="form-control">
                                        <option value="">-请选择户型-option>
                                        <option th:each="item,it : ${houseTypeList}" th:text="${item.name}" th:value="${item.id}" th:selected="${#maps.containsKey(filters, 'houseTypeId')} ? ${item.id} eq ${filters.houseTypeId} : false">-请选择-option>
                                    select>
                                td>
                            tr>
                            <tr>
                                <td>
                                    <select name="floorId" id="floorId" class="form-control">
                                        <option value="">-请选择楼层-option>
                                        <option th:each="item,it : ${floorList}" th:text="${item.name}" th:value="${item.id}" th:selected="${#maps.containsKey(filters, 'floorId')} ? ${item.id} eq ${filters.floorId} : false">-请选择-option>
                                    select>
                                td>
                                <td>
                                    <select name="buildStructureId" id="buildStructureId" class="form-control">
                                        <option value="">-请选择建筑结构-option>
                                        <option th:each="item,it : ${buildStructureList}" th:text="${item.name}" th:value="${item.id}" th:selected="${#maps.containsKey(filters, 'buildStructureId')} ? ${item.id} eq ${filters.buildStructureId} : false">-请选择-option>
                                    select>
                                td>
                                <td>
                                    <select name="directionId" id="directionId" class="form-control">
                                        <option value="">-请朝向-option>
                                        <option th:each="item,it : ${directionList}" th:text="${item.name}" th:value="${item.id}" th:selected="${#maps.containsKey(filters, 'directionId')} ? ${item.id} eq ${filters.directionId} : false">-请选择-option>
                                    select>
                                td>
                            tr>
                            <tr>
                                <td>
                                    <select name="decorationId" id="decorationId" class="form-control">
                                        <option value="">-请选择装修情况-option>
                                        <option th:each="item,it : ${decorationList}" th:text="${item.name}" th:value="${item.id}" th:selected="${#maps.containsKey(filters, 'decorationId')} ? ${item.id} eq ${filters.decorationId} : false">-请选择-option>
                                    select>
                                td>
                                <td>
                                    <select name="houseUseId" id="houseUseId" class="form-control">
                                        <option value="">-请选择房屋用途-option>
                                        <option th:each="item,it : ${houseUseList}" th:text="${item.name}" th:value="${item.id}" th:selected="${#maps.containsKey(filters, 'houseUseId')} ? ${item.id} eq ${filters.houseUseId} : false">-请选择-option>
                                    select>
                                td>
                                <td>

                                td>
                            tr>
                        table>
                        <div>
                            <button type="submit" class="btn btn-sm btn-primary"> 搜索button>
                            <button type="button" class="btn btn-sm btn-primary create"> 新增button>
                            <button type="button" id="loading-example-btn" onclick="javascript:window.location.reload();" class="btn btn-white btn-sm">刷新button>
                        div>
                        <table class="table table-striped table-bordered table-hover dataTables-example">
                            <thead>
                            <tr>
                                <th>序号th>
                                <th>房源名称th>
                                <th>总价：万元th>
                                <th>单价：元/平米th>
                                <th>建筑面积th>
                                <th>套内面积th>
                                <th>挂牌日期th>
                                <th>上次交易日期th>
                                <th>状态th>
                                <th width="160">操作 th>
                            tr>
                            thead>
                            <tbody>
                            <tr class="gradeX" th:each="item,it: ${page.list}">
                                <td class="text-center" th:text="${it.count}">11td>
                                <td th:text="${item.name}">22td>
                                <td th:text="${item.totalPrice}">22td>
                                <td th:text="${item.unitPrice}">22td>
                                <td th:text="${item.buildArea}">22td>
                                <td th:text="${item.insideArea}">22td>
                                <td th:text="${item.listingDateString}">22td>
                                <td th:text="${item.lastTradeDateString}">22td>
                                <td th:text="${item.status == 1 ? '已发布' : '未发布'}">22td>
                                <td class="text-center">
                                    <a class="edit" th:attr="data-id=${item.id}">修改a>
                                    <a class="delete" th:attr="data-id=${item.id}">删除a>
                                td>
                            tr>
                            tbody>
                        table>

                        <div class="row" th:include="common/pagination :: pagination">div>

                    div>
                div>
            div>
        div>
    div>
form>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119

    2、新增房源功能

    2.1 进入新增房源界面
    2.1.1 表现层

    在web-admin项目中的com.atguigu.controller.HouseController中新增

    private static final String PAGE_CREATE = "house/create";
@RequestMapping("/create")
public String create(Model model){
    //查询房屋初始化信息存储到model中
    saveAllDictToRequestScope(model);
    return PAGE_CREATE;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    2.1.2 index.html

    在web-admin项目中的templates/house/index.html中给新增绑定点击事件

    <script th:inline="javascript">
    $(function () {
        $(".create").on("click", function () {
            opt.openWin('/house/create', '新增', 630, 430)
        });
    });
script>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    2.1.3 create.html

    在web-admin项目中的templates/house中新建create.html页面

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="common/head :: head">head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="ibox float-e-margins">
        <div class="ibox-content" style="width: 98%;">
            <form id="ec" th:action="@{/house/save}" method="post" class="form-horizontal">
                <div class="form-group">
                    <label class="col-sm-2 control-label">小区：label>
                    <div class="col-sm-10">
                        <select name="communityId" id="communityId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${communityList}" th:text="${item.name}" th:value="${item.id}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">房源名称：label>
                    <div class="col-sm-10">
                        <input type="text" name="name" id="name" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">描述：label>
                    <div class="col-sm-10">
                        <input type="text" name="description" id="description" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">总价：万元：label>
                    <div class="col-sm-10">
                        <input type="text" name="totalPrice" id="totalPrice" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">单位价格：label>
                    <div class="col-sm-10">
                        <input type="text" name="unitPrice" id="unitPrice" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">建筑面积：label>
                    <div class="col-sm-10">
                        <input type="text" name="buildArea" id="buildArea" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">套内面积：label>
                    <div class="col-sm-10">
                        <input type="text" name="insideArea" id="insideArea" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">户型：label>
                    <div class="col-sm-10">
                        <select name="houseTypeId" id="houseTypeId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${houseTypeList}" th:text="${item.name}" th:value="${item.id}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">楼层：label>
                    <div class="col-sm-10">
                        <select name="floorId" id="floorId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${floorList}" th:text="${item.name}" th:value="${item.id}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">建筑结构：label>
                    <div class="col-sm-10">
                        <select name="buildStructureId" id="buildStructureId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${buildStructureList}" th:text="${item.name}" th:value="${item.id}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">朝向：label>
                    <div class="col-sm-10">
                        <select name="directionId" id="directionId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${directionList}" th:text="${item.name}" th:value="${item.id}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">装修情况：label>
                    <div class="col-sm-10">
                        <select name="decorationId" id="decorationId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${decorationList}" th:text="${item.name}" th:value="${item.id}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">房屋用途：label>
                    <div class="col-sm-10">
                        <select name="houseUseId" id="houseUseId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${houseUseList}" th:text="${item.name}" th:value="${item.id}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">电梯比例：label>
                    <div class="col-sm-10">
                        <input type="text" name="elevatorRatio" id="elevatorRatio" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">挂牌日期：label>
                    <div class="col-sm-10">
                        <input name="listingDateString" class="form-control layer-date" placeholder="YYYY-MM-DD" onclick="laydate({istime: true, format: 'YYYY-MM-DD'})">
                        <label class="laydate-icon">label>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">上次交易日期：label>
                    <div class="col-sm-10">
                        <input name="lastTradeDateString" class="form-control layer-date" placeholder="YYYY-MM-DD" onclick="laydate({istime: true, format: 'YYYY-MM-DD'})">
                        <label class="laydate-icon">label>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <div class="col-sm-4 col-sm-offset-2 text-right">
                        <button class="btn btn-primary" type="submit">确定button>
                        <button class="btn btn-white" type="button" onclick="javascript:opt.closeWin();" value="取消">取消button>
                    div>
                div>
            form>
        div>
    div>
div>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    • 128
    • 129
    • 130
    • 131
    • 132
    • 133
    • 134
    • 135
    • 136
    • 137
    • 138
    • 139
    • 140
    • 141
    • 142
    • 143
    • 144
    • 145
    • 146
    • 147
    • 148
    • 149
    • 150
    • 151
    • 152
    • 153
    • 154
    • 155
    2.2 保存新增
    2.2.1 持久层

    在service-house项目的resources/mappers/HouseMapper.xml文件中新增

    <insert id="insert" useGeneratedKeys="true" keyProperty="id">
    insert into hse_house (
    id ,
    community_id ,
    name ,
    description ,
    total_price ,
    unit_price ,
    build_area ,
    inside_area ,
    house_type_id ,
    floor_id ,
    build_structure_id ,
    direction_id ,
    decoration_id ,
    house_use_id ,
    elevator_ratio ,
    listing_date ,
    last_trade_date ,
    status
    ) values (
    #{id} ,
    #{communityId} ,
    #{name} ,
    #{description} ,
    #{totalPrice} ,
    #{unitPrice} ,
    #{buildArea} ,
    #{insideArea} ,
    #{houseTypeId} ,
    #{floorId} ,
    #{buildStructureId} ,
    #{directionId} ,
    #{decorationId} ,
    #{houseUseId} ,
    #{elevatorRatio} ,
    #{listingDate} ,
    #{lastTradeDate} ,
    #{status}
    )
insert>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    2.2.2 表现层

    在model项目中新建com.atguigu.en包，在该包中创建HouseStatus枚举类

    public enum HouseStatus {
    PUBLISHED(1,"已发布"), UNPUBLISHED(0,"未发布");
    public int code;
    public String message;

    HouseStatus(int code, String message) {
        this.code = code;
        this.message = message;
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10

    在web-admin项目中的HouseController中新增

    @PostMapping("/save")
public String save(House house,Model model){
    //未发布
    house.setStatus(HouseStatus.UNPUBLISHED.getCode());
    houseService.insert(house);
    return successPage(model,"添加房源信息成功");
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7

    3、修改房源功能

    3.1 进入修改房源页面
    3.1.1 持久层

    在service-house项目中的resources/mappers/HouseMapper.xml中新增

    <select id="getById" resultType="House">
    <include refid="columns">include>
    from hse_house
    where id=#{id} and is_deleted=0
select>

    • 1
    • 2
    • 3
    • 4
    • 5
    3.1.2 表现层

    在web-admin项目中的HouseController中新增

    private static final String PAGE_EDIT = "house/edit";
@RequestMapping("/edit/{id}")
public String edit(@PathVariable("id") Long id,Model model){
    House house = houseService.getById(id);
    model.addAttribute("house",house);

    saveAllDictToRequestScope(model);

    return PAGE_EDIT;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    3.1.3 index.html

    在web-admin项目中的templates/house/index.html中给修改绑定点击事件

    $(".edit").on("click", function () {
    var id = $(this).attr("data-id");
    opt.openWin('/house/edit/' + id, '修改', 630, 430);
});

    • 1
    • 2
    • 3
    • 4
    3.1.4 edit.html

    在web-admin项目中的templates/house中新建edit.html页面

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="common/head :: head">head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="ibox float-e-margins">
        <div class="ibox-content" style="width: 98%;">
            <form id="ec" th:action="@{/house/update}" method="post" class="form-horizontal">
                <input type="hidden" name="id" th:value="${house.id}">
                <div class="form-group">
                    <label class="col-sm-2 control-label">小区：label>
                    <div class="col-sm-10">
                        <select name="communityId" id="communityId" class="form-control">
                            <option value="">-选择小区-option>
                            <option th:each="item,it : ${communityList}" th:text="${item.name}" th:value="${item.id}" th:selected="${item.id} eq ${house.communityId}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">房源名称：label>
                    <div class="col-sm-10">
                        <input type="text" name="name" id="name" th:value="${house.name}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">描述：label>
                    <div class="col-sm-10">
                        <input type="text" name="description" id="description" th:value="${house.description}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">总价：万元：label>
                    <div class="col-sm-10">
                        <input type="text" name="totalPrice" id="totalPrice" th:value="${house.totalPrice}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">单位价格：label>
                    <div class="col-sm-10">
                        <input type="text" name="unitPrice" id="unitPrice" th:value="${house.unitPrice}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">建筑面积：label>
                    <div class="col-sm-10">
                        <input type="text" name="buildArea" id="buildArea" th:value="${house.buildArea}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">套内面积：label>
                    <div class="col-sm-10">
                        <input type="text" name="insideArea" id="insideArea" th:value="${house.insideArea}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">户型：label>
                    <div class="col-sm-10">
                        <select name="houseTypeId" id="houseTypeId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${houseTypeList}" th:text="${item.name}" th:value="${item.id}" th:selected="${item.id} eq ${house.houseTypeId}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">楼层：label>
                    <div class="col-sm-10">
                        <select name="floorId" id="floorId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${floorList}" th:text="${item.name}" th:value="${item.id}" th:selected="${item.id} eq ${house.floorId}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">建筑结构：label>
                    <div class="col-sm-10">
                        <select name="buildStructureId" id="buildStructureId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${buildStructureList}" th:text="${item.name}" th:value="${item.id}" th:selected="${item.id} eq ${house.buildStructureId}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">朝向：label>
                    <div class="col-sm-10">
                        <select name="directionId" id="directionId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${directionList}" th:text="${item.name}" th:value="${item.id}" th:selected="${item.id} eq ${house.directionId}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">装修情况：label>
                    <div class="col-sm-10">
                        <select name="decorationId" id="decorationId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${decorationList}" th:text="${item.name}" th:value="${item.id}" th:selected="${item.id} eq ${house.decorationId}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">房屋用途：label>
                    <div class="col-sm-10">
                        <select name="houseUseId" id="houseUseId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${houseUseList}" th:text="${item.name}" th:value="${item.id}" th:selected="${item.id} eq ${house.houseUseId}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">电梯比例：label>
                    <div class="col-sm-10">
                        <input type="text" name="elevatorRatio" id="elevatorRatio" th:value="${house.elevatorRatio}" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">挂牌日期：label>
                    <div class="col-sm-10">
                        <input name="listingDateString" th:value="${house.listingDateString}" class="form-control layer-date" placeholder="YYYY-MM-DD" onclick="laydate({istime: true, format: 'YYYY-MM-DD'})">
                        <label class="laydate-icon">label>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">上次交易日期：label>
                    <div class="col-sm-10">
                        <input name="lastTradeDateString" th:value="${house.lastTradeDateString}" class="form-control layer-date" placeholder="YYYY-MM-DD" onclick="laydate({istime: true, format: 'YYYY-MM-DD'})">
                        <label class="laydate-icon">label>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group posf">
                    <div class="col-sm-4 col-sm-offset-2 text-right">
                        <button class="btn btn-primary" type="submit">确定button>
                        <button class="btn btn-white" type="button" onclick="javascript:opt.closeWin();" value="取消">取消button>
                    div>
                div>
            form>
        div>
    div>
div>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    • 128
    • 129
    • 130
    • 131
    • 132
    • 133
    • 134
    • 135
    • 136
    • 137
    • 138
    • 139
    • 140
    • 141
    • 142
    • 143
    • 144
    • 145
    • 146
    • 147
    • 148
    • 149
    • 150
    • 151
    • 152
    • 153
    • 154
    • 155
    • 156
    3.2 保存修改
    3.2.1 持久层

    在service-house项目的resources/mappers/HouseMapper.xml文件中新增

    <update id="update" >
    update hse_house set
    <if test="communityId != null">
        community_id = #{communityId} ,
    if>
    <if test="name != null">
        name = #{name} ,
    if>
    <if test="description != null">
        description = #{description} ,
    if>
    <if test="totalPrice != null">
        total_price = #{totalPrice} ,
    if>
    <if test="unitPrice != null">
        unit_price = #{unitPrice} ,
    if>
    <if test="buildArea != null">
        build_area = #{buildArea} ,
    if>
    <if test="insideArea != null">
        inside_area = #{insideArea} ,
    if>
    <if test="houseTypeId != null">
        house_type_id = #{houseTypeId} ,
    if>
    <if test="floorId != null">
        floor_id = #{floorId} ,
    if>
    <if test="buildStructureId != null">
        build_structure_id = #{buildStructureId} ,
    if>
    <if test="directionId != null">
        direction_id = #{directionId} ,
    if>
    <if test="decorationId != null">
        decoration_id = #{decorationId} ,
    if>
    <if test="houseUseId != null">
        house_use_id = #{houseUseId} ,
    if>
    <if test="elevatorRatio != null">
        elevator_ratio = #{elevatorRatio} ,
    if>
    <if test="listingDate != null">
        listing_date = #{listingDate} ,
    if>
    <if test="lastTradeDate != null">
        last_trade_date = #{lastTradeDate} ,
    if>
    <if test="status != null">
        status = #{status} ,
    if>
    update_time =  now()
    where
    id = #{id}
update>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    3.2.2 表现层

    在web-admin项目中的HouseController中新增

    @PostMapping("/update")
public String update(House house,Model model){
    houseService.update(house);

    return successPage(model,"修改房源信息成功");
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6

    4、删除房源功能

    4.1 持久层

    在service-house项目中的resources/mappers/HouseMapper.xml中新增

    <update id="delete">
    update hse_house set is_deleted=1 where id=#{id}
update>

    • 1
    • 2
    • 3
    4.2 表现层

    在web-admin项目中的HouseController中新增

    private static final String LIST_ACTION = "redirect:/house";
@RequestMapping("/delete/{id}")
public String delete(@PathVariable("id") Long id){
    houseService.delete(id);
    return LIST_ACTION;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    4.3 index.html

    在web-admin项目中的templates/house/index.html中给删除绑定点击事件

    $(".delete").on("click", function () {
    var id = $(this).attr("data-id");
    opt.confirm('/house/delete/' + id);
});

    • 1
    • 2
    • 3
    • 4

    5、发布房源

    5.1 业务层
    5.1.1 HouseService接口

    在service-api项目的HouseService接口中新增

    void publish(Long id, Integer status);

    • 1
    5.1.2 HouseServiceImpl实现类

    在service-house项目的HouseServiceImpl实现类中新增

    @Override
public void publish(Long id, Integer status) {
    //要发布房源其实就是修改房源的status的值
    House house = new House();
    //设置房源的status
    house.setStatus(status);
    //设置房源的id
    house.setId(id);
    houseMapper.update(house);
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    5.2 表现层

    在web-admin项目中的HouseController中新增

    @GetMapping("/publish/{id}/{status}")
public String publish(@PathVariable("id") Long id,@PathVariable("status") Integer status){
    houseService.publish(id,status);
    return LIST_ACTION;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    5.3 前端页面
    5.3.1 index.html
    5.3.1.1 新增发布和取消发布按钮
    <a class="publish" th:if="${item.status} eq '0'" th:attr="data-id=${item.id},data-status=1">发布a>
<a class="publish" th:if="${item.status} eq '1'" th:attr="data-id=${item.id},data-status=0">取消发布a>

    • 1
    • 2
    5.3.1.2 绑定点击事件
    //给发布和取消发布按钮绑定点击事件
$(".publish").on("click",function () {
    //获取房源id
    var id = $(this).attr("data-id");
    //获取data-status的值,如果点击的是发布那么该值就是1，如果点击的是取消发布那么该值就是0
    var status = $(this).attr("data-status");
    //弹出确认框，点击确定就能发送请求
    opt.confirm("/house/publish/" + id + "/" + status, "确定该操作吗？");
});

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9

    6、房源详情

    6.1 效果

    [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-oSSJGIa9-1661870815231)(images/05/img_006.png)]

    需要查询的内容:

    1. 房源详情
    2. 小区详情(之前已经编写好)
    3. 房源图片列表和房产图片列表
    4. 经纪人列表
    5. 房东列表
    6.2 查询房源图片列表和房产图片列表
    6.2.1 持久层
    6.2.1.1 HouseImageMapper接口

    在service-house项目中的com.atguigu.mapper包下创建HouseImageMapper接口

    public interface HouseImageMapper extends BaseMapper<HouseImage> {
    List<HouseImage> findHouseImageList(@Param("houseId") Long houseId, @Param("type") Integer type);
}

    • 1
    • 2
    • 3
    6.2.1.2 HouseImageMapper.xml映射配置文件

    在service-house项目中的resources/mappers目录中创建HouseImageMapper.xml映射配置文件

    
DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.atguigu.mapper.HouseImageMapper">
    <sql id="columns">
       select id,house_id,image_name,image_url,type,create_time,update_time,is_deleted
    sql>
    <select id="findHouseImageList" resultType="HouseImage">
        <include refid="columns">include>
        from hse_house_image
        where house_id=#{houseId} and type=#{type} and is_deleted=0
    select>
mapper>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    6.2.2 业务层
    6.2.2.1 HouseImageService接口

    在service-api项目中创建com.atguigu.service.HouseImageService接口

    public interface HouseImageService extends BaseService<HouseImage> {
    List<HouseImage> findHouseImageList(Long houseId,Integer type);
}

    • 1
    • 2
    • 3
    6.2.2.2 HouseImageServiceImpl实现类

    在service-house项目中创建com.atguigu.service.impl.HouseImageServiceImpl实现类

    @Service(interfaceClass = HouseImageService.class)
public class HouseImageServiceImpl extends BaseServiceImpl<HouseImage> implements HouseImageService {
    @Autowired
    private HouseImageMapper houseImageMapper;
    @Override
    protected BaseMapper<HouseImage> getEntityMapper() {
        return houseImageMapper;
    }
    @Override
    public List<HouseImage> findHouseImageList(Long houseId, Integer type) {
        return houseImageMapper.findHouseImageList(houseId,type);
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    6.3 查询房源经纪人列表
    6.3.1 持久层
    6.3.1.1 HouseBrokerMapper接口

    在service-house项目中的com.atguigu.mapper包下创建HouseBrokerMapper接口

    public interface HouseBrokerMapper extends BaseMapper<HouseBroker> {
    List<HouseBroker> findHouseBrokerListByHouseId(Long houseId);
}

    • 1
    • 2
    • 3
    6.3.1.2 HouseBrokerMapper.xml映射配置文件

    在service-house项目中的resources/mappers目录中创建HouseBrokerMapper.xml映射配置文件

    <mapper namespace="com.atguigu.mapper.HouseBrokerMapper">
    
    <sql id="columns">
        select id,house_id,broker_id,broker_name,broker_head_url,create_time,update_time,is_deleted
    sql>
    <select id="findHouseBrokerListByHouseId" resultType="HouseBroker">
        <include refid="columns">include>
        from hse_house_broker
        where house_id=#{houseId} and is_deleted=0
    select>
mapper>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    6.3.2 业务层
    6.3.2.1 HouseBrokerService接口

    在service-api项目中创建com.atguigu.service.HouseBrokerService接口

    public interface HouseBrokerService extends BaseService<HouseBroker> {
    List<HouseBroker> findHouseBrokerListByHouseId(Long houseId);
}

    • 1
    • 2
    • 3
    6.3.2.2 HouseBrokerServiceImpl实现类

    在service-house项目中创建com.atguigu.service.impl.HouseBrokerServiceImpl实现类

    @Service(interfaceClass = HouseBrokerService.class)
public class HouseBrokerServiceImpl extends BaseServiceImpl<HouseBroker> implements HouseBrokerService {
    @Autowired
    private HouseBrokerMapper houseBrokerMapper;
    @Override
    protected BaseMapper<HouseBroker> getEntityMapper() {
        return houseBrokerMapper;
    }

    @Override
    public List<HouseBroker> findHouseBrokerListByHouseId(Long houseId) {
        return houseBrokerMapper.findHouseBrokerListByHouseId(houseId);
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    6.4 查询房东列表
    6.4.1 持久层
    6.4.1.1 HouseUserMapper接口

    在service-house项目中的com.atguigu.mapper包下创建HouseUserMapper接口

    public interface HouseUserMapper extends BaseMapper<HouseUser> {
    List<HouseUser> findHouseUserListByHouseId(Long houseId);
}

    • 1
    • 2
    • 3
    6.4.1.2 HouseUserMapper.xml映射配置文件

    在service-house项目中的resources/mappers目录中创建HouseUserMapper.xml映射配置文件

    
DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.atguigu.mapper.HouseUserMapper">
    
    <sql id="columns">
       select id,house_id,name,phone,sex,id_no,create_time,update_time,is_deleted
    sql>
    <select id="findHouseUserListByHouseId" resultType="HouseUser">
        <include refid="columns">include>
        from hse_house_user where house_id=#{houseId} and is_deleted=0
    select>
mapper>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    6.4.2 业务层
    6.4.2.1 HouseUserService接口

    在service-api项目中创建com.atguigu.service.HouseUserService接口

    public interface HouseUserService extends BaseService<HouseUser> {
    List<HouseUser> findHouseUserListByHouseId(Long houseId);
}

    • 1
    • 2
    • 3
    6.4.2.2 HouseUserServiceImpl实现类

    在service-house项目中创建com.atguigu.service.impl.HouseUserServiceImpl实现类

    @Service(interfaceClass = HouseUserService.class)
public class HouseUserServiceImpl extends BaseServiceImpl<HouseUser> implements HouseUserService {
    @Autowired
    private HouseUserMapper houseUserMapper;
    @Override
    protected BaseMapper<HouseUser> getEntityMapper() {
        return houseUserMapper;
    }

    @Override
    public List<HouseUser> findHouseUserListByHouseId(Long houseId) {
        return houseUserMapper.findHouseUserListByHouseId(houseId);
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    6.5 查询房源详情

    修改service-house项目中的resources/mappers/HouseMapper.xml文件

    <select id="getById" resultType="House">
    <include refid="columns">include>,
    (select name from hse_dict where id=hh.house_type_id ) houseTypeName,
    (select name from hse_dict where id=hh.floor_id ) floorName,
    (select name from hse_dict where id=hh.build_structure_id ) buildStructureName,
    (select name from hse_dict where id=hh.direction_id ) directionName,
    (select name from hse_dict where id=hh.decoration_id ) decorationName,
    (select name from hse_dict where id=hh.house_use_id ) houseUseName
    from hse_house hh
    where id=#{id} and is_deleted=0
select>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    6.6 表现层

    在web-admin项目的HouseController中新增

    private static final String PAGE_SHOW = "house/show";
@GetMapping("/{houseId}")
public String detail(@PathVariable("houseId") Long houseId,Model model){
    //1. 根据id查询房源详情
    House house = houseService.getById(houseId);
    //2. 根据小区id查询小区详情
    Community community = communityService.getById(house.getCommunityId());
    //3. 根据房源id查询房源的房源图片列表
    List<HouseImage> houseImage1List = houseImageService.findHouseImageList(houseId, 1);
    //4. 根据房源id查询房源的房产图片列表
    List<HouseImage> houseImage2List = houseImageService.findHouseImageList(houseId, 2);
    //5. 根据房源id查询房源的经纪人列表
    List<HouseBroker> houseBrokerList = houseBrokerService.findHouseBrokerListByHouseId(houseId);
    //6. 根据房源id查询房源的房东列表
    List<HouseUser> houseUserList = houseUserService.findHouseUserListByHouseId(houseId);

    //将上述查询到的内容存储到请求域
    model.addAttribute("house",house);
    model.addAttribute("community",community);
    model.addAttribute("houseImage1List",houseImage1List);
    model.addAttribute("houseImage2List",houseImage2List);
    model.addAttribute("houseBrokerList",houseBrokerList);
    model.addAttribute("houseUserList",houseUserList);

    return PAGE_SHOW;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    6.7 前端页面
    6.7.1 index.html

    ① 添加详情按钮

    <a class="detail" th:attr="data-id=${item.id}">详情a>

    • 1

    ② 绑定点击事件

    $(".detail").on("click",function () {
    var id = $(this).attr("data-id");
    window.location = "/house/" + id;
});

    • 1
    • 2
    • 3
    • 4
    6.7.2 show.html

    在web-admin项目的templates/house目录中新增show.html文件

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
<head th:include="common/head :: head">head>
<body class="gray-bg">
<div class="row">
    <div class="col-sm-12">
        <div class="wrapper wrapper-content animated fadeInUp">
            <div class="ibox">
                <div class="ibox-content">
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="m-b-md">
                                <a th:href="@{/house/{id}(id=${house.id})}" class="btn btn-white btn-xs pull-right">刷新a>
                                <a href="/house" class="btn btn-white btn-xs pull-right">返回a>
                                <h2 th:text="${house.name}">金色城市h2>
                            div>
                            <dl class="dl-horizontal">
                                <dt>状态：dt>
                                <dd><span class="label label-primary" th:text="${house.status == 1 ? '已发布' : '未发布'}">进行中span>
                                dd>
                            dl>
                        div>
                    div>

                    <div class="row">
                        <div class="col-sm-5">
                            <dl class="dl-horizontal">
                                <dt>总价：dt><dd th:text="${house.totalPrice} + '万元'">dd>
                                <dt>单位价格：dt><dd th:text="${house.unitPrice} + '元/平米'">dd>
                                <dt>建筑面积：dt><dd th:text="${house.buildArea} + '平米'">dd>
                                <dt>套内面积：dt><dd th:text="${house.insideArea} + '平米'">dd>
                                <dt>房屋户型：dt><dd th:text="${house.houseTypeName}">dd>
                                <dt>所在楼层：dt><dd th:text="${house.floorName}">dd>
                                <dt>建筑结构：dt><dd th:text="${house.buildStructureName}">dd>
                                <dt>房屋朝向：dt><dd th:text="${house.directionName}">dd>
                                <dt>装修情况：dt><dd th:text="${house.decorationName}">dd>
                                <dt>装修情况：dt><dd th:text="${house.houseUseName}">dd>
                                <dt>梯户比例：dt><dd th:text="${house.elevatorRatio}">dd>
                                <dt>挂牌时间：dt><dd th:text="${house.listingDateString}">dd>
                                <dt>上次交易：dt><dd th:text="${house.lastTradeDateString}">dd>
                            dl>
                        div>
                        <div class="col-sm-7" id="cluster_info">
                            <dl class="dl-horizontal">
                                <dt>小区名称：dt><dd th:text="${community.name}">dd>
                                <dt>小区均价：dt><dd th:text="${community.averagePrice}+'元/平米'">已上传房本照片dd>
                                <dt>区域：dt><dd th:text="${community.areaName}">商品房dd>
                                <dt>板块：dt><dd th:text="${community.plateName}">dd>
                                <dt>详细地址：dt><dd th:text="${community.address}">dd>
                                <dt>建筑年代：dt><dd th:text="${community.buildYears}">满五年dd>
                                <dt>物业价格：dt><dd th:text="${community.propertyPrice}+'元/平米'">共有dd>
                                <dt>物业公司：dt><dd th:text="${community.propertyCompany}">有抵押 19万元 中国银行四川分行 业主自还dd>
                                <dt>开发商：dt><dd th:text="${community.developer}">已上传房本照片dd>
                                <dt>楼栋数：dt><dd th:text="${community.buildNum}">已上传房本照片dd>
                                <dt>房屋数：dt><dd th:text="${community.houseNum}">已上传房本照片dd>
                            dl>
                        div>
                    div>

                    <div class="row">
                        <div class="col-sm-12">
                            <div class="ibox float-e-margins">
                                <div class="ibox-title">
                                    <h3>房源图片信息h3>
                                    <a class="btn btn-xs btn-primary" id="upload1">上传房源图片a>
                                div>
                                <div class="ibox-content">
                                    <a th:each="item,it : ${houseImage1List}" class="fancybox" >
                                        <img alt="image" th:src="${item.imageUrl}"/>
                                        <a th:attr="data-id=${item.id}" class="deleteImages">删除a>
                                    a>
                                div>
                            div>
                        div>
                    div>
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="ibox float-e-margins">
                                <div class="ibox-title">
                                    <h3>房产图片信息h3>
                                    <a class="btn btn-xs btn-primary" id="upload2">上传房产图片a>
                                div>
                                <div class="ibox-content">
                                    <a th:each="item,it : ${houseImage2List}" class="fancybox" >
                                        <img alt="image" th:src="${item.imageUrl}"/>
                                        <a th:attr="data-id=${item.id}" class="deleteImages">删除a>
                                    a>
                                div>
                            div>
                        div>
                    div>

                    <div class="row">
                        <div class="panel blank-panel">
                            <div class="pull-left" style="margin-top: 10px;">
                                <a class="btn btn-xs btn-white"><h3>经纪人信息h3>a>
                                <a class="btn btn-xs btn-primary createBroker">添加a>
                            div>
                            <table class="table table-striped table-bordered table-hover dataTables-example">
                                <thead>
                                <tr>
                                    <th>序号th>
                                    <th>经纪人头像th>
                                    <th>经纪人姓名th>
                                    <th>创建时间th>
                                    <th>操作 th>
                                tr>
                                thead>
                                <tbody>
                                <tr class="gradeX" th:each="item,it : ${houseBrokerList}">
                                    <td class="text-center" th:text="${it.count}">11td>
                                    <td>
                                        <img th:src="${item.brokerHeadUrl}" style="width: 60px; height: 60px;">
                                    td>
                                    <td th:text="${item.brokerName}">33td>
                                    <td th:text="${#dates.format(item.createTime,'yyyy-MM-dd HH:mm:ss')}" >33td>
                                    <td class="text-center">
                                        <a class="editBroker" th:attr="data-id=${item.id}">修改a>
                                        <a class="deleteBroker" th:attr="data-id=${item.id}">删除a>
                                    td>
                                tr>
                                tbody>
                            table>
                        div>
                    div>

                    <div class="row">
                        <div class="panel blank-panel">
                            <div class="pull-left" style="margin-top: 10px;">
                                <a class="btn btn-xs btn-white"><h3>房东信息h3>a>
                                <a class="btn btn-xs btn-primary createUser">添加a>
                            div>
                            <table class="table table-striped table-bordered table-hover dataTables-example">
                                <thead>
                                <tr>
                                    <th>序号th>
                                    <th>姓名th>
                                    <th>手机号th>
                                    <th>性别th>
                                    <th>身份证号码th>
                                    <th>创建时间th>
                                    <th>操作 th>
                                tr>
                                thead>
                                <tbody>
                                <tr class="gradeX" th:each="item,it : ${houseUserList}">
                                    <td class="text-center" th:text="${it.count}">11td>
                                    <td th:text="${item.name}">33td>
                                    <td th:text="${item.phone}">33td>
                                    <td th:text="${item.sex == 1 ? '男' : '女'}">33td>
                                    <td th:text="${item.idNo}">33td>
                                    <td th:text="${#dates.format(item.createTime,'yyyy-MM-dd HH:mm:ss')}" >33td>
                                    <td class="text-center">
                                        <a class="editUser" th:attr="data-id=${item.id}">修改a>
                                        <a class="deleteUser" th:attr="data-id=${item.id}">删除a>
                                    td>
                                tr>
                                tbody>
                            table>
                        div>
                    div>

                div>
            div>
        div>
    div>
div>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    • 128
    • 129
    • 130
    • 131
    • 132
    • 133
    • 134
    • 135
    • 136
    • 137
    • 138
    • 139
    • 140
    • 141
    • 142
    • 143
    • 144
    • 145
    • 146
    • 147
    • 148
    • 149
    • 150
    • 151
    • 152
    • 153
    • 154
    • 155
    • 156
    • 157
    • 158
    • 159
    • 160
    • 161
    • 162
    • 163
    • 164
    • 165
    • 166
    • 167
    • 168
    • 169
    • 170

    五、房源经纪人管理模块(自己扩展练习)

    1、新增经纪人功能

    1.1 查询所有用户
    1.1.1 持久层
    1.1.1.1 AdminMapper接口

    在service-acl项目的AdminMapper接口中新增

    List<Admin> findAll();

    • 1
    1.1.1.2 AdminMapper.xml映射配置文件

    在service-acl项目的AdminMapper.xml映射配置文件中新增

    <select id="findAll" resultType="admin">
    <include refid="columns">include>
    from acl_admin
    where is_deleted = 0
select>

    • 1
    • 2
    • 3
    • 4
    • 5
    1.1.2 业务层
    1.1.2.1 AdminService接口

    在service-api项目的AdminService接口中新增

    List<Admin> findAll();

    • 1
    1.1.2.2 AdminServiceImpl实现类

    在service-acl项目的AdminServiceImpl实现类中新增

    @Override
public List<Admin> findAll() {
    return adminMapper.findAll();
}

    • 1
    • 2
    • 3
    • 4
    1.2 进入新增经纪人页面
    1.2.1 表现层

    在web-admin项目中的com.atguigu.controller包中创建HouseBrokerController类

    @Controller
@RequestMapping("/houseBroker")
public class HouseBrokerController extends BaseController {
    @Reference
    private AdminService adminService;
    @Reference
    private HouseBrokerService houseBrokerService;
    private static final String PAGE_CREATE = "houseBroker/create";
    @RequestMapping("/create")
    public String create(Model model, HouseBroker houseBroker){
        //查询管理员列表
        saveAdminListToModel(model);
        model.addAttribute("houseBroker",houseBroker);
        return PAGE_CREATE;
    }
    private void saveAdminListToModel(Model model) {
        List<Admin> adminList = adminService.findAll();
        model.addAttribute("adminList",adminList);
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    1.2.2 前端页面

    在show.html页面给新增经纪人绑定点击事件

    <script type="text/javascript">
    $(function(){
        $(".createBroker").on("click",function () {
            opt.openWin('/houseBroker/create?houseId=[[${house.id}]]','新增经纪人',630,300)
        });
    });
script>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7

    在web-admin项目的templates目录中创建houseBroker目录，在目录中创建create.html页面

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="common/head :: head">head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="ibox float-e-margins">
        <div class="ibox-content" style="width: 98%;">
            <form id="ec" action="/houseBroker/save" method="post" class="form-horizontal">
                <input type="hidden" name="houseId" th:value="${houseBroker.houseId}"/>
                <div class="form-group">
                    <label class="col-sm-2 control-label">经纪人：label>
                    <div class="col-sm-10">
                        <select name="brokerId" id="brokerId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${adminList}" th:text="${item.name}" th:value="${item.id}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <div class="col-sm-4 col-sm-offset-2 text-right">
                        <button class="btn btn-primary" type="submit">确定button>
                        <button class="btn btn-white" type="button" onclick="javascript:opt.closeWin();" value="取消">取消button>
                    div>
                div>
            form>
        div>
    div>
div>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    1.3 保存新增
    1.3.1 持久层

    在service-house项目中的resources/mappers/HouseBrokerMapper.xml中新增

    <insert id="insert" useGeneratedKeys="true" keyProperty="id">
    insert into hse_house_broker (
    id ,
    house_id ,
    broker_id ,
    broker_name ,
    broker_head_url
    ) values (
    #{id} ,
    #{houseId} ,
    #{brokerId} ,
    #{brokerName} ,
    #{brokerHeadUrl}
    )
insert>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    1.3.2 表现层

    在web-admin项目的HouseBrokerController中新增

    @PostMapping("/save")
public String save(HouseBroker houseBroker,Model model){
    Admin admin = adminService.getById(houseBroker.getBrokerId());
    houseBroker.setBrokerName(admin.getName());
    houseBroker.setBrokerHeadUrl(admin.getHeadUrl());

    houseBrokerService.insert(houseBroker);

    return successPage(model,"添加经纪人成功");
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10

    2、修改经纪人功能

    2.1 进入修改经纪人页面
    2.1.1 持久层

    在service-house的resources/mappers/HouseBrokerMapper.xml中新增

    <select id="getById" resultType="HouseBroker">
    <include refid="columns">include>
    from hse_house_broker where id=#{id} and is_deleted=0
select>

    • 1
    • 2
    • 3
    • 4
    2.1.2 表现层

    在web-admin项目的HouseBrokerController中新增

    private static final String PAGE_EDIT = "houseBroker/edit";
@RequestMapping("/edit/{id}")
public String edit(@PathVariable("id") Long id,Model model){
    HouseBroker houseBroker = houseBrokerService.getById(id);
    saveAdminListToModel(model);
    model.addAttribute("houseBroker",houseBroker);

    return PAGE_EDIT;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    2.1.3 前端页面

    ① 在show.html中给经纪人的修改按钮绑定点击事件

    $(".editBroker").on("click",function () {
    var id = $(this).attr("data-id");
    opt.openWin('/houseBroker/edit/' + id,'修改经纪人',630,300);
});

    • 1
    • 2
    • 3
    • 4

    ② 在web-admin项目中的templates/houseBroker目录中创建edit.html

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="common/head :: head">head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="ibox float-e-margins">
        <div class="ibox-content" style="width: 98%;">
            <form id="ec" th:action="@{/houseBroker/update}" method="post" class="form-horizontal">
                <input type="hidden" name="id" th:value="${houseBroker.id}">
                <div class="form-group">
                    <label class="col-sm-2 control-label">经纪人：label>
                    <div class="col-sm-10">
                        <select name="brokerId" id="brokerId" class="form-control">
                            <option value="">-请选择-option>
                            <option th:each="item,it : ${adminList}" th:text="${item.name}" th:value="${item.id}" th:selected="${item.id} eq ${houseBroker.brokerId}">-请选择-option>
                        select>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group posf">
                    <div class="col-sm-4 col-sm-offset-2 text-right">
                        <button class="btn btn-primary" type="submit">确定button>
                        <button class="btn btn-white" type="button" onclick="javascript:opt.closeWin();" value="取消">取消button>
                    div>
                div>
            form>
        div>
    div>
div>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    2.2 保存修改
    2.2.1 持久层

    在service-acl项目的HouseBrokerMapper.xml映射配置文件中新增

    <update id="update" >
    update hse_house_broker set
    <if test="houseId != null and houseId != ''">
        house_id = #{houseId} ,
    if>
    <if test="brokerId != null and brokerId != ''">
        broker_id = #{brokerId} ,
    if>
    <if test="brokerName != null and brokerName != ''">
        broker_name = #{brokerName} ,
    if>
    <if test="brokerHeadUrl != null and brokerHeadUrl != ''">
        broker_head_url = #{brokerHeadUrl} ,
    if>
    update_time =  now()
    where
    id = #{id}
update>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    2.2.2 表现层

    在web-admin项目的HouseBrokerController中新增

    @PostMapping("/update")
public String update(Model model, HouseBroker houseBroker){
    //根据id查询经纪人信息
    HouseBroker originHouseBroker = houseBrokerService.getById(houseBroker.getBrokerId());
    //更新originHouseBroker的信息
    Admin admin = adminService.getById(houseBroker.getBrokerId());
    originHouseBroker.setBrokerName(admin.getName());
    originHouseBroker.setBrokerHeadUrl(admin.getHeadUrl());
    //修改经纪人信息
    houseBrokerService.update(originHouseBroker);
    return successPage(model,"修改经纪人成功");
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12

    3、删除经纪人功能

    3.1 持久层

    在service-acl项目的HouseBrokerMapper.xml映射配置文件中新增

    <update id="delete">
    update hse_house_broker set
    update_time = now() ,
    is_deleted = 1
    where
    id = #{id}
update>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    3.2 表现层

    在web-admin项目的HouseBrokerController中新增

    private static final String SHOW_ACTION = "redirect:/house/";
@RequestMapping("/delete/{houseId}/{id}")
public String delete(@PathVariable("houseId") Long houseId,@PathVariable("id") Long id){
    houseBrokerService.delete(id);

    return SHOW_ACTION + houseId;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    3.3 前端页面

    在web-admin项目的templates/house/show.html中给房东删除按钮绑定点击事件

    $(".deleteBroker").on("click",function(){
    var id = $(this).attr("data-id");
    opt.confirm('/houseBroker/delete/[[${house.id}]]/'+id);
});

    • 1
    • 2
    • 3
    • 4

    六、房东管理模块(自己扩展练习)

    1、新增房东功能

    1.1 进入房东新增页面
    1.1.1表现层

    在web-admin项目中的com.atguigu.controller包中创建HouseUserController类

    @Controller
@RequestMapping("/houseUser")
public class HouseUserController extends BaseController {
    @Reference
    private HouseUserService houseUserService;
    private static final String PAGE_CREATE = "houseUser/create";
    @GetMapping("/create")
    public String create(HouseUser houseUser,Model model){
        model.addAttribute("houseUser",houseUser);
        return PAGE_CREATE;
    }
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    1.1.2 前端页面

    ① 在show.html页面给房东添加按钮绑定点击事件

    $(".createUser").on("click",function () {
    opt.openWin('/houseUser/create?houseId=[[${house.id}]]','新增房东',630,430)
});

    • 1
    • 2
    • 3

    ② 在templates目录中创建houseUser目录，并在该目录中创建create.html

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="common/head :: head">head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="ibox float-e-margins">
        <div class="ibox-content" style="width: 98%;">
            <form id="ec" action="/houseUser/save" method="post" class="form-horizontal">
                <input type="hidden" name="houseId" th:value="${houseUser.houseId}"/>
                <div class="form-group">
                    <label class="col-sm-2 control-label">房东姓名：label>
                    <div class="col-sm-10">
                        <input type="text" name="name" id="name" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">手机：label>
                    <div class="col-sm-10">
                        <input type="text" name="phone" id="phone" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">性别label>
                    <div class="col-sm-10">
                        <div class="radio">
                            <label><input type="radio" checked="checked" value="1" name="sex">男label>
                        div>
                        <div class="radio">
                            <label> <input type="radio" value="2" name="sex">女label>
                        div>
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">身份证号：label>
                    <div class="col-sm-10">
                        <input type="text" name="idNo" id="idNo" class="form-control" />
                    div>
                div>
                <div class="hr-line-dashed">div>
                <div class="form-group">
                    <div class="col-sm-4 col-sm-offset-2 text-right">
                        <button class="btn btn-primary" type="submit">确定button>
                        <button class="btn btn-white" type="button" onclick="javascript:opt.closeWin();" value="取消">取消button>
                    div>
                div>
            form>
        div>
    div>
div>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    1.2 保存新增
    1.2.1 持久层

    在service-acl项目的HouseUserMapper.xml映射配置文件中新增

    <insert id="insert" useGeneratedKeys="true" keyProperty="id">
    insert into hse_house_user (
    id ,
    house_id ,
    name ,
    phone ,
    sex ,
    id_no
    ) values (
    #{id} ,
    #{houseId} ,
    #{name} ,
    #{phone} ,
    #{sex} ,
    #{idNo}
    )
insert>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    1.2.2 表现层

    在web-admin项目中的HouseUserController中新增

    @PostMapping("/save")
public String save(HouseUser houseUser, Model model){
    houseUserService.insert(houseUser);

    return successPage(model,"新增房东信息成功");
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6

    2、修改房东功能

    2.1 进入修改房东页面
    2.1.1 持久层

    在service-house项目的resources/mappers/HouseUserMapper.xml中新增

    <select id="getById" resultType="HouseUser">
    <include refid="columns">include>
    from hse_house_user where id=#{id} and is_deleted=0
select>

    • 1
    • 2
    • 3
    • 4
    2.1.2 表现层

    在web-admin项目的HouseUserController中新增

    private static final String PAGE_EDIT = "houseUser/edit";
@GetMapping("/edit/{id}")
public String edit(@PathVariable("id") Long id,Model model){
    HouseUser houseUser = houseUserService.getById(id);
    model.addAttribute("houseUser",houseUser);

    return PAGE_EDIT;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    2.1.3 前端页面

    ① 在show.html中给房东的修改按钮绑定点击事件

    $(".editUser").on("click",function () {
    var id = $(this).attr("data-id");
    opt.openWin('/houseUser/edit/' + id,'修改房东',630,430);
});

    • 1
    • 2
    • 3
    • 4

    ② 在web-admin项目中的templates/houseUser目录中创建edit.html

    DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="common/head :: head">head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
  <div class="ibox float-e-margins">
    <div class="ibox-content" style="width: 98%;">
      <form id="ec" th:action="@{/houseUser/update}" method="post" class="form-horizontal">
        <input type="hidden" name="id" th:value="${houseUser.id}"/>
        <div class="form-group">
          <label class="col-sm-2 control-label">房东姓名：label>
          <div class="col-sm-10">
            <input type="text" name="name" id="name" th:value="${houseUser.name}" class="form-control" />
          div>
        div>
        <div class="hr-line-dashed">div>
        <div class="form-group">
          <label class="col-sm-2 control-label">手机：label>
          <div class="col-sm-10">
            <input type="text" name="phone" id="phone" th:value="${houseUser.phone}" class="form-control" />
          div>
        div>
        <div class="hr-line-dashed">div>
        <div class="form-group">
          <label class="col-sm-2 control-label">性别label>
          <div class="col-sm-10">
            <div class="col-sm-10">
              <div class="radio">
                <label><input type="radio" th:checked="${houseUser.sex} eq 1" value="1" name="sex">男label>
              div>
              <div class="radio">
                <label> <input type="radio" th:checked="${houseUser.sex} eq 2" value="2" name="sex">女label>
              div>
            div>
          div>
        div>
        <div class="hr-line-dashed">div>
        <div class="form-group">
          <label class="col-sm-2 control-label">身份证号：label>
          <div class="col-sm-10">
            <input type="text" name="idNo" id="idNo" th:value="${houseUser.idNo}" class="form-control" />
          div>
        div>
        <div class="hr-line-dashed">div>
        <div class="form-group posf">
          <div class="col-sm-4 col-sm-offset-2 text-right">
            <button class="btn btn-primary" type="submit">确定button>
            <button class="btn btn-white" type="button" onclick="javascript:opt.closeWin();" value="取消">取消button>
          div>
        div>
      form>
    div>
  div>
div>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    2.2 保存修改
    2.2.1 持久层

    在service-acl项目的HouseUserMapper.xml映射配置文件中新增

    <update id="update" >
    update hse_house_user set
    <if test="houseId != null and houseId != ''">
        house_id = #{houseId} ,
    if>
    <if test="name != null and name != ''">
        name = #{name} ,
    if>
    <if test="phone != null and phone != ''">
        phone = #{phone} ,
    if>
    <if test="sex != null and sex != ''">
        sex = #{sex} ,
    if>
    <if test="idNo != null and idNo != ''">
        id_no = #{idNo} ,
    if>
    update_time =  now()
    where
    id = #{id}
update>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    2.2.2 表现层

    在web-admin项目的HouseUserController中新增

    @PostMapping("/update/{id}")
public String update(@PathVariable("id") Long id, HouseUser houseUser,Model model){
    houseUser.setId(id);
    houseUserService.update(houseUser);

    return successPage(model,"修改房东信息成功");
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7

    3、删除房东功能

    3.1 持久层

    在service-acl项目的HouseUserMapper.xml映射配置文件中新增

    <update id="delete">
    update hse_house_user set
    update_time = now() ,
    is_deleted = 1
    where
    id = #{id}
update>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    3.2 表现层

    在web-admin项目的HouseUserController中新增

    private static final String SHOW_ACTION = "redirect:/house/";
@GetMapping("/delete/{houseId}/{id}")
public String delete(@PathVariable("houseId") Long houseId,@PathVariable("id") Long id){
    houseUserService.delete(id);

    return SHOW_ACTION + houseId;
}

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    3.3 前端页面

    在web-admin项目的templates/house/show.html中给房东删除按钮绑定点击事件

    $(".deleteUser").on("click",function(){
    var id = $(this).attr("data-id");
    opt.confirm('/houseUser/delete/[[${house.id}]]/'+id);
});

    • 1
    • 2
    • 3
    • 4
  • 相关阅读:
    【opencv】教程代码 —TrackingMotion 角点检测
    2022年最新《Java八股文面试宝典》全网独一份！（效率最高、知识最新、包含各个技术栈）
    HHDESK资源管理批量修改
    解决Adobe Premiere Pro CC 2018打开无反应，并出现.crash的文件问题
    数仓建模—ID Mapping(上)
    js逆向tips-某思录登录
    JUC-ReentrantLock锁基础篇
    C++入门（2）-类与对象
    报错：为什么数组明明有内容但打印的length是0
    AWTK MODBUS Client channel 模型
  • 原文地址：https://blog.csdn.net/lbw18/article/details/126614327