Flask爱家租房--房屋管理(获取房东发布的房源信息条目)
文章目錄
- 0.效果展示
- 1.重點(diǎn)總結(jié)
- 2.后端代碼
- 3.前端html
- 4.前端js
0.效果展示
1.重點(diǎn)總結(jié)
1)用戶點(diǎn)擊“我的房源”,頁(yè)面開始加載,此時(shí)myhouse.js限定只有完成實(shí)名認(rèn)證的房東才可以查詢已有的房源信息,因此myhouse.js首先調(diào)用用戶認(rèn)證的接口,根據(jù)相應(yīng)的返回值,判斷接下來(lái)應(yīng)該返回登錄頁(yè)location.href = “/login.html"還是顯示報(bào)警信息 $(”.auth-warn").show()。
2)如果調(diào)用用戶認(rèn)證的接口后,發(fā)現(xiàn)用戶已經(jīng)進(jìn)行了實(shí)名注冊(cè),此時(shí)調(diào)用后端返回房屋列表信息的接口get_user_houses();
經(jīng)過(guò)邏輯處理,將查詢到的房屋信息轉(zhuǎn)換為字典存放到列表中,并將狀態(tài)碼errno、返回信息errmsg、以及數(shù)據(jù)data一并通過(guò)jsonfiy()函數(shù)處理,將json格式的數(shù)據(jù)返回給前端myhouse.js文件。
3)接下來(lái),myhouse.js文件將前端相應(yīng)id的部分#houses-list進(jìn)行渲染,并顯示給用戶。
2.后端代碼
houses.py部分接口:
@api.route("/user/houses", methods=["GET"]) @login_required def get_user_houses():"""獲取房東發(fā)布的房源信息條目"""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="獲取數(shù)據(jù)失敗")# 將查詢到的房屋信息轉(zhuǎn)換為字典存放到列表中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>尚未進(jìn)行實(shí)名認(rèn)證,無(wú)法發(fā)布房屋信息!</h3></div><div class="house-content"><a href="/auth.html" class="btn btn-success">去實(shí)名認(rèn)證</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">發(fā)布新房源</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>價(jià)格:¥{{(house.price/100.0).toFixed(0)}}/晚</li><li>發(fā)布時(shí)間:{{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(){// 對(duì)于發(fā)布房源,只有認(rèn)證后的用戶才可以,所以先判斷用戶的實(shí)名認(rèn)證狀態(tài)$.get("/api/v1.0/users/auth", function(resp){if ("4101" == resp.errno) {// 用戶未登錄location.href = "/login.html";} else if ("0" == resp.errno) {// 未認(rèn)證的用戶,在頁(yè)面中展示 "去認(rèn)證"的按鈕if (!(resp.data.real_name && resp.data.id_card)) {$(".auth-warn").show();return;}// 已認(rèn)證的用戶,請(qǐng)求其之前發(fā)布的房源信息$.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:[]}));}});}}); }) 創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來(lái)咯,堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)總結(jié)
以上是生活随笔為你收集整理的Flask爱家租房--房屋管理(获取房东发布的房源信息条目)的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 聊聊如何从零开始自学编程
- 下一篇: axureux中后台管理信息系统通用原型