基于Flask开发的前后端分离租房项目(七)

十三、房屋列表搜索模块

13.1在houses.py中编写获取房屋列表的后端逻辑:

 

  

 

 

   

13.2在index.html和index.js中编写搜索房源的前端逻辑:

13.2.1首先在index.html中绑定搜索按钮的点击事件:

13.2.2需要注意的是,我们在前面已经实现了城区信息的获取,

          而开始日期和结束日期则依赖于前端的日期模块:

        

13.2.3然后在index.js中实现前端逻辑:

13.2.4接着在search.html中编写前端显示模板(跟之前一样使用art-template):

13.2.5在search.js中编写前端逻辑:

13.2.5.1首先定义全局变量:

        

13.2.5.2接着编写更新房源列表信息函数:

13.2.5.3在页面加载完成后首先获取url中的参数:

13.2.5.4接着向后端发送请求获取城区信息:

13.2.5.5接着展示房源信息,以及绑定屏幕滚动事件,

            当用户滚动到屏幕底部将会加载下一页的房源信息:

十四、订单模块

14.1在orders.py中完成订单模块的后端逻辑编写:

14.1.1首先编写保存订单的后端逻辑:

  

14.1.2该后端的触发顺序是用户先在房屋详情页面点击预订,

          跳转到预订页面,接着设置好入住的起始时间和结束时间后点击预定按钮,

          前端就向后端发送请求保存订单数据

14.1.3预订的前端逻辑是在booking.html和booking.js中实现的:

  

    

    

猜你喜欢

转载自blog.csdn.net/qq_40652101/article/details/90368641
今日推荐