10월 13일

즐거운 yil.. ㅅㅣ간..

뭘 했나?

이름 검색을 하면 count를 해서 데이터 베이스에 저장하고 count가 많은 순서대로 3명까지 출력하여 순위를 보여준다.

가 내가 할 기능.

첫 번째로 이름을 검색 할 때 count를 1씩 올려준다.
js

function search() {
    let txt = $("#searchtxt").val()

    $.ajax({
        type:"PUT",
        url: "/search/" + txt,
        data:{},
        success: function (inc){
            console.log(inc)
        }
    })
    $.ajax({
        type: "GET",
        url: "/search?txt=" + txt,
        data: {},
        success: function (response) {
            $("#flush").empty();
            console.log(response.name, txt);
            console.log(response.introduce);
            if (!response) {
                 alert ("올바른 값을 넣어주세요")
            }
            else {
                 let tempHtml = `<div class="card hotboxs">
                        <img class="card-img-top card-rows" height="200" src="${response['pic']}" alt="Card image cap">
                        <div class="card-body">
                            <h5 class="card-title">${response['name']}</h5>
                             <p class="arrow_box">${response['introduce']}</p>
                            <p class="card-text">${response['url']}</p>
                            <div class="d-flex justify-content-center">
                            <a href="${response['url']}" class="btn btn-warning st">바로가기</a>
                            <button type="button" data-toggle="modal" data-target="#${response['name']}"  class="btn btn-warning st">리뷰달기</button>
                        </div>
                        </div>
                    </div>
                    <button onclick="window.location.href = '/'" type="button" class="btn btn-primary ">메인으로</button>`
                $("#flush").append(tempHtml);

                 var countt = response.countt + 1;

                console.log(response.countt);
            }
        }, error: function onError (){
            alert ("올바른 값을 넣어주세요");
        }
    });
}

app.py

#카운트
@app.route('/search/<txt>', methods=['PUT'])
def addcount(txt):
    db.userInfo.update_one({'name': txt}, {'$inc': {'countt': 1}})
    article = db.userInfo.find_one({'name': txt}, {'_id': False})
    return (article)

처음에 너무 어렵게 생각해서 put에다 get을 상속 시키려 했었다. 근데 그것은 너무 멀리 돌아가는 길이었고..
고민하던 중 수강생님중 한분이 get과 put에 극명한 차이는없다(?)(무조건 가져오는건 GET써야햐고 수정하는건 무조건 PUT이야!가 아니었다.)라고 말씀 해 주셔서 위와 같은 코드가 나오게 되었다. 그러면서 궁금한거. 파이썬 app.route끼리는 상속이 될까? 였다. (일단 내가 시도했는데 방법을 몰라서 실패 ㅎㅎ)

count를 성공 했으면 이제 뿌려줄 차례인데
document.ready함수 안에 호출하려 했는데. 왜. 안될까.? 왜????????ㅠㅠ.ㅠㅠ.ㅠ.ㅠ.ㅠㅠ.ㅠㅠㅠ 이것저것 해보다 결국
js

$(document).ready(function () {

        $.ajax({
        type: "GET",
        url: '/order',
        data: {},
        success: function (order) {
            $("#rank").empty();
            let Olist = order["orderlist"];
            console.log(Olist)
            for (let i = 0; i < 3; i++) {
    let tempHtml = ` <tr>
                      <td>${i + 1} . </td>
                      <td>${Olist[i]['name']}</td>
                      <td>님</td>
                      </tr> `;
    $("#orderrank").append(tempHtml);
            }
        }, error: function () {
            alert("오류")
        }
    });

    getCards();
    showLocation();
});

document.ready함수 안에 쓰기로 했다. 시간이 길어지니 이 이상 하기 싫더라 ㅎㅎ
app.py

@app.route('/order', methods=['GET'])
def order():
    orderlist = list(db.userInfo.find({}, {'_id': False}).sort([("countt", -1)]))
    return jsonify({"orderlist": orderlist})

타임어택 테스트가 app.py를 구현하는데 매ㅐㅐㅐ우 마ㅏㅏㅏㅏㅏ니 도움이 되었다.
검색도 해봤는데 몇개 더 있더라.
sort() : 정렬
limit() : 데이터 갯수 제한
skip() : 시작부분을 설정

다음에 너네 써 볼게...