Flask爱家租房--房屋管理(获取房东发布的房源信息条目)
文章目录
- 0.效果展示
- 1.重点总结
- 2.后端代码
- 3.前端html
- 4.前端js
0.效果展示
1.重点总结
1)用户点击“我的房源”,页面开始加载,此时myhouse.js限定只有完成实名认证的房东才可以查询已有的房源信息,因此myhouse.js首先调用用户认证的接口,根据相应的返回值,判断接下来应该返回登录页location.href = “/login.html"还是显示报警信息 $(”.auth-warn").show()。
2)如果调用用户认证的接口后,发现用户已经进行了实名注册,此时调用后端返回房屋列表信息的接口get_user_houses();
经过逻辑处理,将查询到的房屋信息转换为字典存放到列表中,并将状态码errno、返回信息errmsg、以及数据data一并通过jsonfiy()函数处理,将json格式的数据返回给前端myhouse.js文件。
3)接下来,myhouse.js文件将前端相应id的部分#houses-list进行渲染,并显示给用户。
2.后端代码
houses.py部分接口:
@api.route("/user/houses", methods=["GET"])
@login_required
def get_user_houses():"""获取房东发布的房源信息条目"""user_id = g.user_idtry:# House.query.filter_by(user_id=user_id)user = User.query.get(user_id)houses = user.housesexcept Exception as e:current_app.logger.error(e)return jsonify(errno=RET.DBERR, errmsg="获取数据失败")# 将查询到的房屋信息转换为字典存放到列表中houses_list = []if houses:for house in houses:houses_list.append(house.to_basic_dict())return jsonify(errno=RET.OK, errmsg="OK", data={"houses": houses_list})
3.前端html
myhouse.html
<!DOCTYPE html>
<html>
<head> <meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"><title>爱家-我的房源</title><link href="/static/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet"><link href="/static/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet"><link href="/static/css/reset.css" rel="stylesheet"><link href="/static/plugins/bootstrap-datepicker/css/bootstrap-datepicker.min.css" rel="stylesheet"><link href="/static/css/ihome/main.css" rel="stylesheet"><link href="/static/css/ihome/myhouse.css" rel="stylesheet">
</head>
<body><div class="container"><div class="top-bar"><div class="nav-bar"><h3 class="page-title">我的房源</h3><a class="nav-btn fl" href="/my.html"><span><i class="fa fa-angle-left fa-2x"></i></span></a></div></div><div class="houses-con"><ul class="houses-list auth-warn"><li><div class="house-title"><h3>尚未进行实名认证,无法发布房屋信息!</h3></div><div class="house-content"><a href="/auth.html" class="btn btn-success">去实名认证</a></div></li></ul><ul id="houses-list" class="houses-list"></ul><script id="houses-list-tmpl" type="text/html"><li><div class="new-house"><a href="/newhouse.html">发布新房源</a></div></li>{{each houses as house}}<li><a href="/detail.html?id={{house.house_id}}"><div class="house-title"><h3>房屋ID:{{house.house_id}} —— {{house.title}}</h3></div><div class="house-content"><img src="{{house.img_url}}"><div class="house-text"><ul><li>位于:{{house.area_name}}</li><li>价格:¥{{(house.price/100.0).toFixed(0)}}/晚</li><li>发布时间:{{house.ctime}}</li></ul></div></div></a></li>{{/each}}</script></div><div class="footer"><p><span><i class="fa fa-copyright"></i></span>爱家租房 享受家的温馨</p></div> </div><script src="/static/js/jquery.min.js"></script><script src="/static/plugins/bootstrap/js/bootstrap.min.js"></script><script src="/static/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js"></script><script src="/static/plugins/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js"></script><script src="/static/js/template.js"></script><script src="/static/js/ihome/myhouse.js"></script>
</body>
</html>
4.前端js
myhouse.js:
$(document).ready(function(){// 对于发布房源,只有认证后的用户才可以,所以先判断用户的实名认证状态$.get("/api/v1.0/users/auth", function(resp){if ("4101" == resp.errno) {// 用户未登录location.href = "/login.html";} else if ("0" == resp.errno) {// 未认证的用户,在页面中展示 "去认证"的按钮if (!(resp.data.real_name && resp.data.id_card)) {$(".auth-warn").show();return;}// 已认证的用户,请求其之前发布的房源信息$.get("/api/v1.0/user/houses", function(resp){if ("0" == resp.errno) {$("#houses-list").html(template("houses-list-tmpl", {houses:resp.data.houses}));} else {$("#houses-list").html(template("houses-list-tmpl", {houses:[]}));}});}});
})
Flask爱家租房--房屋管理(获取房东发布的房源信息条目)相关推荐
- Flask爱家租房--房屋管理(获取房屋详情)
文章目录 0.效果展示 1.思路总结 2.后端接口 3.前端js 4.前端html 0.效果展示 1.思路总结 1)房屋详情页面开始加载时,detail.js首先通过定义的函数(重点:document ...
- Flask爱家租房--房屋管理(获取主页幻灯片展示的房屋基本信息)
文章目录 0.效果展示 1.重点总结 2.后端代码 3.前端js 4.前端html 0.效果展示 1.重点总结 1)当用户访问首页时,开始加载页面信息,此时index.js文件首先调用后端接口chec ...
- Flask爱家租房--房屋管理(搜索房屋列表)
文章目录 0.效果展示 1.后端接口 2.前端js 3.前端html 0.效果展示 1.后端接口 house.py部分接口: # GET /api/v1.0/houses?sd=2017-12-01& ...
- flask爱家租房项目开发(十)
本文代码文档下载地址:https://download.csdn.net/download/geek_xiong/11576968 目录 房屋管理 发布的房屋信息管理 后端代码编写 前端代码编写 我的 ...
- Flask爱家租房--订单(房东接单、拒单)
文章目录 0.效果展示 1.效果展示 2.后端接口 3.前端js 4.前端html 0.效果展示 1.效果展示 1)当房东点击"客户订单",js向后端接口get_user_orde ...
- Flask爱家租房--发布新房源(保存房屋基本信息)
0.页面展示效果 1.后端代码 @api.route("/houses/info", methods=["POST"]) @login_required def ...
- Flask爱家租房--发布新房源(保存房屋图片)
0.页面展示效果 1)首先房东填写房屋信息: 2)当房东填写发布的房源信息之后,隐藏(hide)刚才填写信息的界面,同时显示(show)上传房屋图片的界面. 1.后端代码 @api.route(&qu ...
- Flsak爱家租房--订单(获取用户订单、用户评论)
文章目录 0.页面效果 1.思路总结 2.后端代码 3.前端js 4.前端html 0.页面效果 1.思路总结 1)用户点击"我的订单",js向后端获取数据,并加载在前端的模板中: ...
- flask爱家租房项目开发(一)
目录 需求文档 创建工程目录以及flask配置 配置日志信息 数据库设计与迁移 静态文件的配置,使浏览器可以正常访问文件 csrf 防护机制 需求文档 需求功能 1. 主页 1.1 最多5个房 ...
最新文章
- SAP HUM 没有搬到Storage Type 923的HU能用HU02拆包?
- 【Netty】反应器 Reactor 模式 ( 单反应器 Reactor 单线程 | 单反应器 Reactor 多线程 )
- gin获取Get + Post 混合
- 大数据之路- Hadoop环境搭建(Linux)
- HttpURLConnection 发送post请求。并将结果以JSONObject对象返回的轮子
- 装备保障性验证知识图谱构建方法研究-学习笔记
- ejb的maven_针对新手的Java EE7和Maven项目-第3部分-定义ejb服务和jpa实体模块
- selenium基础入门
- 《深入理解 Spring Cloud 与微服务构建》第四章 Dubbo
- Bootstrap学习(一):Bootstrap简介
- 在码云上如何创建仓库
- 边缘计算与嵌入式系统
- Ubuntu20.04 安装CUDA驱动和一些系统配置
- java redis令牌桶_Redis令牌桶算法在限速中的应用
- 台式计算机用什么电源线,台式电脑电源线接法图解(3分钟学会接电脑电源线)...
- 《疯狂动物城》 —浪潮分布式存储让动画渲染更高效
- 好看简约加速器官网源码
- 1419. Minimum Number of Frogs Croaking
- 为什么大型高难度工程的首选支模架是盘扣架?
- unity 打安卓包 华为手机图片被压扁
热门文章
- Linux strtol将十六进制转化为十进制
- 区块链中的密码学,使用ABE结合区块链
- 将IPFS 配置服务器,电脑连接远程服务器,环境配置
- 一个DEMO让你彻底理解线程池
- 银行各类理财收益渐涨 各类宝钱景尚不明朗
- 解决:redis.clients.jedis.exceptions.JedisDataExceptionERR This instance has cluster support disabled
- 解决:Failed to execute goal org.apache.maven.plugins:maven-deploy-plugin:2.8.2:deploy (default-deploy)
- 解决:bash: vim: command not found、docker 容器不识别 vi / vim 、docker 容器中安装 vim
- IDEA 错误:找不到或无法加载主类
- 【Android开发】NDK开发(1)-Hello World!