오늘은 유저가 볼 수 있는 웹 앱을 만들어 볼 것이다.
우선, django를 이용해 페이지를 만들어 볼 것이다.
필요한 페이지는 총 세 페이지이다.
| Main_ShareUni | UserInfo_ShareUni | Result_ShareUni |
| - 시간대와 강의실을 선택한다 | - 유저 정보를 입력하여 강의실 예약 신청한다. | - 결과를 반환한다. (성공시 비밀번호를, 실패시 실패 문구를) |
우선, Django로 구현해보도록 한다.
일단 간단한 개념부터 파악한다.
Django는 MVC 패턴 기반 MVT 이다. 같은 개념이긴한데 Django에서는 view가 template 그리고 controller가 view로 동작되기 때문에 그렇게 불린다. view가 view가 아닌게 헷갈리기는 하지만 또 장고의 특색이라고 생각하자.
*** 해야 할 것
- 강의실을 클릭하면 강의실과 시간 정보를 가지고 페이지 이동할 수 있도록
- userInfo.html에서 데이터를 입력하여 user 테이블에 추가하도록
- 테이블 간의 조인이 가능하도록
현재 101을 누르면
이 형태로 들어간다.
127.0.0.1:8000/userinfo/101 이런식으로 들어갈 수 있도록해보자.
<a href="{% url 'shareUniApp:userInfo'
roominfo=roominfo.user_classroom roomtime=roominfo.user_reserveTime %}">
{{roominfo.user_classroom}}
</a>html에 a태그와 form 사이에서 고민을 했다. 그러나 클릭을 하면 이동을 하는 형식이랑 a href로 해주는 것이 더 좋다는 생각이 들었다. a href로 페이지 이동을 할 때에는 위처럼 {% url '가고자 하는 url 주소' url 주소에 보내는 데이터 %} 형태로 보낸다. 한가지 주의 할 점은 위 코드에서 'shareUniApp:userInfo'를 확인할 수 있는데, userInfo라는 별명만 붙이면 되는 것이 아니라 앞에 shareUniApp을 붙여줘야 한다.
#pkdp/shareUniApp/urls.py
from django.urls import path
from . import views
app_name = 'shareUniApp'
urlpatterns = [
path('', views.index, name='index'),
path('userinfo/<str:roominfo>?<str:roomtime>/',views.userInfo, name='userInfo'),
path('result/',views.result, name='result'),
]
결론적으로 url에 classroom과 reserveTime을 실어보냈다.
<!-- userinfo.html -->
<!DOCTYPE html>
<html>
<head>
<title>쉐어 유니버스티</title>
<style>
table {
width: 100%;
}
table, th, td {
border: 1px solid #bcbcbc;
</style>
</head>
<body>
사용자 입력 화면
<form action ='/result/' method="post">
{% csrf_token %}
<!-- action에는 결과가 전달될 url 입력 // -->
<p>room_classroom : <input type="text" name="classroom" value={{resultvalue}} readonly></p>
<p>room_reserveTime : <input type="text" name="reserveTime" value={{resulttime}} readonly></p>
<p>user_name : <input type="text" name="name"></p>
<p>user_department : <input type="text" name="department"></p>
<p>user_email : <input type="text" name="email"></p>
<button name ="choice" value = "11"> 예약하기</button>
</form>
</body>
</html>
'특별한 > 2019 부경 메이커톤' 카테고리의 다른 글
| 부경 메이커 톤_스마트 도어락 시스템을 활용한 공유 강의실 시스템_04 (0) | 2019.11.11 |
|---|---|
| 부경 메이커 톤_스마트 도어락 시스템을 활용한 공유 강의실 시스템_03 (0) | 2019.11.03 |
| 부경 메이커 톤_스마트 도어락 시스템을 활용한 공유 강의실 시스템_02 (0) | 2019.11.03 |
| 부경 메이커 톤_스마트 도어락 시스템을 활용한 공유 강의실 시스템 (0) | 2019.10.30 |