Skip to content

Commit

Permalink
Merge pull request #73 from Ewha-Ohsori/feat/#72
Browse files Browse the repository at this point in the history 
Feat: 메인페이지 검색 기능 + 대륙별 필터링 기능
  • Loading branch information
@arky02
arky02 authored Dec 2, 2024
2 parents 5a0ff11 + d60d231 commit 81eebb2
Show file tree
Hide file tree
Showing 3 changed files with 88 additions and 47 deletions.
55 changes: 12 additions & 43 deletions app.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,33 +14,23 @@

# 홈화면
@application.route("/")
def hello():
page = request.args.get("page", 1, type=int)
# @application.route("/<continent>")
def get_data(continent=None):
page = request.args.get('page', 1, type=int)
query = request.args.get('query' , None)
continent = request.args.get('continent' , None)
start_index = ITEM_COUNT_PER_PAGE * (page - 1)
end_index = ITEM_COUNT_PER_PAGE * page

data = DB.get_items()
total_item_count = len(data)
if total_item_count <= ITEM_COUNT_PER_PAGE:
data = dict(list(data.items())[:total_item_count])
if query is not None:
data = DB.get_items_by_query(query)
elif continent is not None:
# continent가 있을 경우 해당 대륙의 데이터만 가져오기
data = DB.get_items_by_continent(continent)
else:
data = dict(list(data.items())[start_index:end_index])

return render_template(
"index.html",
datas = data.items(),
limit = ITEM_COUNT_PER_PAGE, # 한 페이지에 상품 개수
page = page, # 현재 페이지 인덱스
page_count = int(math.ceil(total_item_count/ITEM_COUNT_PER_PAGE)), # 페이지 개수
total = total_item_count) # 총 상품 개수
# 모든 데이터를 가져오기
data = DB.get_items()

@application.route("/<continent>/")
def view_items_by_continent(continent):
page = request.args.get("page", 1, type=int)
start_index = ITEM_COUNT_PER_PAGE * (page - 1)
end_index = ITEM_COUNT_PER_PAGE * page

data = DB.get_items_by_continent(continent)
total_item_count = len(data)
if total_item_count <= ITEM_COUNT_PER_PAGE:
data = dict(list(data.items())[:total_item_count])
Expand All @@ -55,27 +45,6 @@ def view_items_by_continent(continent):
page_count = int(math.ceil(total_item_count/ITEM_COUNT_PER_PAGE)), # 페이지 개수
total = total_item_count) # 총 상품 개수

@application.route("/search", methods=['GET'])
def search_items():
query = request.args.get('query')
page = request.args.get("page", 1, type=int)
start_index = ITEM_COUNT_PER_PAGE * (page - 1)
end_index = ITEM_COUNT_PER_PAGE * page

data = DB.get_items_by_query(query)
total_item_count = len(data)
if total_item_count <= ITEM_COUNT_PER_PAGE:
data = dict(list(data.items())[:total_item_count])
else:
data = dict(list(data.items())[start_index:end_index])

return render_template(
"index.html",
datas = data.items(),
limit = ITEM_COUNT_PER_PAGE, # 한 페이지에 상품 개수
page = page, # 현재 페이지 인덱스
page_count = int(math.ceil(total_item_count/ITEM_COUNT_PER_PAGE)), # 페이지 개수
total = total_item_count) # 총 상품 개수

@application.route("/login")
def login():
Expand Down
28 changes: 28 additions & 0 deletions static/index.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -130,3 +130,31 @@
font-weight: 600;
font-size: 15px;
}

.select-buttons {
display: flex;
gap: 10px;
}

.select-btn {
padding: 8px 20px;
border-radius: 20px;
background-color: #f4f4f4;
color: #888;
cursor: pointer;
outline: none;
border: 1px solid #f4f4f4;
}

.select-btn:hover {
color: var(--ewhagreen);
border: 1px solid var(--ewhagreen);
background-color: #00462a5e;
}

.select-btn.active {
border: 1px solid var(--ewhagreen);
background-color: var(--ewhagreen);
color: white;
font-weight: 600;
}
52 changes: 48 additions & 4 deletions templates/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,10 +19,16 @@
<main>
<img class="map" src="../static/images/temp-map.svg" />
<div class="home_container">
<form class="home_form">
<form
class="home_form"
action="{{ url_for('get_data',query=request.args.get('query', ''), page=1) }}"
method="get"
>
<input
class="search_bar"
type="text"
name="query"
value="{{ request.args.get('query', '') }}"
placeholder="어떤 상품을 찾으시나요?"
/>
<button class="serach_btn" type="submit">
Expand All @@ -33,10 +39,46 @@
<h2>상품 전체 조회</h2>
<!-- <div class="whole_items"></div> -->
<div class="pagenation_container">
<!-- 개발 및 삭제 예정 -->

{% if total > 0 %}
<p class="item_count">상품 전체 {{total}}개</p>
<div class="select-buttons" style="margin: 15px 0px">
<a
href="{{ url_for('get_data', continent='아시아') }}"
class="continent-btn select-btn {{ 'active' if request.args.get('continent') == '아시아' else '' }}"
>
아시아
</a>
<a
href="{{ url_for('get_data', continent='유럽') }}"
class="continent-btn select-btn {{ 'active' if request.args.get('continent') == '유럽' else '' }}"
>
유럽
</a>
<a
href="{{ url_for('get_data', continent='북아메리카') }}"
class="continent-btn select-btn {{ 'active' if request.args.get('continent') == '북아메리카' else '' }}"
>
북아메리카
</a>
<a
href="{{ url_for('get_data', continent='남아메리카') }}"
class="continent-btn select-btn {{ 'active' if request.args.get('continent') == '남아메리카' else '' }}"
>
남아메리카
</a>
<a
href="{{ url_for('get_data', continent='오세아니아') }}"
class="continent-btn select-btn {{ 'active' if request.args.get('continent') == '오세아니아' else '' }}"
>
오세아니아
</a>
<a
href="{{ url_for('get_data', continent='아프리카') }}"
class="continent-btn select-btn {{ 'active' if request.args.get('continent') == '아프리카' else '' }}"
>
아프리카
</a>
</div>
<div class="whole_items">
{% for key, value in datas %}
<a href="{{ url_for('view_item_detail', name=key) }}">
Expand Down Expand Up @@ -64,7 +106,9 @@ <h2>상품 전체 조회</h2>
<ul>
<li>
{% for i in range(page_count)%}
<a href="{{url_for('hello', page=i+1)}}" color="black"
<a
href="{{url_for('get_data', continent=request.args.get('continent', ''), query=request.args.get('query', ''), page=i+1)}}"
color="black"
>{{i+1}}</a
>
{% endfor %}
Expand Down

0 comments on commit 81eebb2

Please sign in to comment.