조회수정 필요(hidden 속성 공부필요)

{% extends "main.html" %}

{% block contents %}

<style>

    html,

    body,

    h1,

    h2,

    h3,

    div,

    span,

    a,

    button,

    table,

    tbody,

    thead,

    input {

        margin: 0;

        padding: 0;

        box-sizing: border-box;

    }

    html {

        background-color: hsl(0, 0%, 0%);

    }

    html,

    body {

        min-height: 110%;

    }

    .clicked {

        background-color: rgb(59, 62, 147);

        /* border-radius: 20%; */

        color: rgb(232, 132, 37);

        display: flex;

        text-align: start;

        flex-direction: column;

        width: 150px;

    }

    .clicked>ul>span {

        text-align: center;

    }

    .btn btn-warning {

        margin: 0;

        padding: 0;

    }

    ol,

    ul {

        padding: 4px 4px 4px 4px;

        /* margin: auto; */

    }

    /* .btn btn-secondary btn-lg {

        zoom: 0.5;

        margin: 0;

        padding: 0;

    } */

    .wrap {

        /* background-color: chartreuse; */

        width: 1600px;

        height: 850px;

        margin: auto;

        border: 1px;

    }

    td>input {

        border: none;

    }

    th>input {

        border: none;

    }

    tr {

        cursor: pointer;

    }

    td>button {

        zoom: 0.65;

    }

    .total {

        height: 800px;

    }

    table {

        width: 1550px;

        table-layout: fixed;

    }

    .flex-row {

        display: flex;

        flex-direction: row;

        align-items: flex-start

            /* justify-content: center; */

    }

    .flex-col {

        display: flex;

        flex-direction: column;

        align-items: center;

        justify-content: center;

    }

    .list-group {

        background-color: rgb(13, 170, 233);

        color: white;

        width: 200px;

    }

    .list-group >ul{

        height: 700px;

    }

    .list-group > ul>li{

        height: 30px;

    }

       

    .add-form>td {

        background-color: rgb(173, 214, 243);

    }

    .clicked{

        background-color: azure;

        color: blue;

        width: 180px;

        height: 150px;

    }

</style>

<script>

    let idx;

    $(document).ready(() => {

       

        hideform()

    })

    function mv_click(id) {

        $(`#clicked> li`).removeClass('clicked')

        $(`#${id}`).addClass('clicked')

        $(`#add-from`).text(String(`${id}`))

        idx = String(id);

        d_list(idx);

       

    }

    function list_click(list_id) {

        if (confirm("수정하시겠습니까?")) {

            $(`#${list_id}_add`).hide();

            $(`#${list_id}_mody`).show();

        }

    }

    function hideaddfrom(id) {

        $(`#${id}_add`).show();

        $(`#${id}_mody`).hide();

    }

    // 본선선택 필수 강제조항

    function addcotnet() {

        let msn = $('input[name=msn]').val()

        let hauju = $('input[name=hauju]').val()

        let offer = $('input[name =offer]').val()

        let p_name = $('input[name=p_name]').val()

        let gangjung = $('input[name=gangjung]').val()

        let size = $('input[name=size]').val()

        let bundle = $('input[name=bundle]').val()

        let mt = $('input[name=mt]').val()

        let storage = $('input[name=storage]').val()

        let formData = new FormData()

        formData.append("mv_id_give", idx)

        formData.append("msn_give", msn)

        formData.append("hauju_give", hauju)

        formData.append("offer_give", offer)

        formData.append("p_name_give", p_name)

        formData.append("gangjung_give", gangjung)

        formData.append("size_give", size)

        formData.append("bundle_give", bundle)

        formData.append("mt_give", mt)

        formData.append("storage_give", storage)

        fetch('/d_bar/post', { method: "POST", body: formData }).then(res => res.json()).then(data => {

            alert(data["msg"])

            window.location.reload()

        })

    }

    function showAddform() {

        $('#add-form').show();

    }

    function hideform() {

        $('#add-form').hide()

    }

    function d_list() {

        let data = idx;

        console.log(data)

        let url = `/d_bar/d_detail?data=${idx}`

        // console.log(url)

        fetch(url).then(res => res.json()).then(data => {

            let rows = data['result'];

            $("#list").empty();

            rows.forEach((row) => {

                let id = row['_id']

                let msn = row['msn']

                let hauju = row['hauju']

                let p_name = row['p_name']

                let offer = row['offer']

                let gangjung = row['gangjung']

                let size = row['size']

                let bundle = row['bundle']

                let mt = row['mt']

                let storage = row['storage']

                let temp_html = ` <tr id='${id}_add' onclick="list_click('${id}')">

                                        <td>${msn}</td>

                                        <td>${hauju}</td>

                                        <td>${p_name}</td>

                                        <td>${offer}</td>

                                        <td>${gangjung}</td>

                                        <td>${size}</td>

                                        <td>${bundle}</td>

                                        <td>${mt}</td>

                                        <td>${storage}</td>

                                    </tr>

                                   

                                    <tr id='${id}_mody'  style="display:none;">

                                        <td><input type="text" name="msn" value="${msn}"></td>

                                        <td><input type="text" placeholder="화주명" name="hauju" value="${hauju}"></td>

                                        <td><input type="text" placeholder="세부품명" value="d_bar" name="p_name" value='${p_name}'></td>

                                        <td><input type="text" placeholder="제강사" name="offer" value='${gangjung}'></td>

                                        <td><input type="text" placeholder="강 종" name="gangjung" value='${gangjung}'></td>

                                        <td><input type="text" placeholder="싸이즈" name="size" value='${size}'></td>

                                        <td><input type="text" placeholder="수 량" name="bundle" value="${bundle}"></td>

                                        <td><input type="text" placeholder="톤수" name="mt" value="${mt}"></td>

                                        <td><input type="text" placeholder="창고코드" name="storage" value='${storage}'>

                                        <td>

                                        <button onclick="hideaddfrom('${id}')" class="btn btn-warning">취소</button>    

                                        <button onclick="modifycotnet('${id}')" class="btn btn-warning">수정</button>

                                        <button onclick="deletecotnet('${id}')" class="btn btn-warning">삭제</button>

                                        </td>

                                    </tr>

                                `

                $("#list").append(temp_html)

            })

        })

    }

    function modifycotnet(id) {

        let msn = $(`#${id}_mody>td>input[name=msn]`).val()

        let hauju = $(`#${id}_mody>td>input[name=hauju]`).val()

        let offer = $(`#${id}_mody>td>input[name =offer]`).val()

        let p_name = $(`#${id}_mody>td>input[name=p_name]`).val()

        let gangjung = $(`#${id}_mody>td>input[name=gangjung]`).val()

        let size = $(`#${id}_mody>td>input[name=size]`).val()

        let bundle = $(`#${id}_mody>td>input[name=bundle]`).val()

        let mt = $(`#${id}_mody>td>input[name=mt]`).val()

        let storage = $(`#${id}_mody>td>input[name=storage]`).val()

        let formData = new FormData()

        // let mv_id = idx

        // console.log(mv_id)

        formData.append("id_give", id)

        formData.append("mv_id_give" ,idx)

        formData.append("msn_give", msn)

        formData.append("hauju_give", hauju)

        formData.append("offer_give", offer)

        formData.append("p_name_give", p_name)

        formData.append("gangjung_give", gangjung)

        formData.append("size_give", size)

        formData.append("bundle_give", bundle)

        formData.append("mt_give", mt)

        formData.append("storage_give", storage)

        fetch('/d_bar/modify', { method: "POST", body: formData }).then(res => res.json()).then(data => {

            alert(data["msg"])

            window.location.reload()

        })

    }

    function deletecotnet(id) {

        if (confirm("정말삭제하나요?")) {

            let formData = new FormData()

            formData.append("id_give", id)

            fetch('/d_bar/delete', { method: "POST", body: formData }).then(res => res.json()).then(data => {

                alert(data["msg"])

                window.location.reload()

            })

        }

    }

</script>

<div class="flex-row">

    <div class="list-group">

        <ul id="clicked">

            {% for d_list in d_lists %}

            <li id="{{d_list._id}}" class="list-group" onclick="mv_click(`${id}` )">

                {{d_list.date}} {{d_list.mv_name}}

            </li>

            <hr />

            {% endfor %}

        </ul>

    </div>

    <div class="wrap">

        <table class="table" style="border: 8px blue;">

            <thead class="table-primary">

                <tr>

                    <!-- <th>모선명</th> -->

                    <th scope="col">MSN</th>

                    <th scope="col">화주명</th>

                    <th scope="col">품명</th>

                    <th scope="col">제강사</th>

                    <th scope="col">강종</th>

                    <th scope="col">싸이즈</th>

                    <th scope="col">총수량(B/D)</th>

                    <th scope="col">총중량(M/T)</th>

                    <th scope="col">창고코드</th>

                </tr>

            </thead>

            <tbody class="table table-striped table" id=list class="add-form">

                <tr class="add-form" id="add-form" style="background-color: aqua;">

                    <td><input type="text" placeholder="MSN" name="msn"></td>

                    <td><input type="text" placeholder="화주명" name="hauju"></td>

                    <td><input type="text" placeholder="세부품명" value="d_bar" name="p_name"></td>

                    <td><input type="text" placeholder="제강사" name="offer"></td>

                    <td><input type="text" placeholder="강 종" name="gangjung"></td>

                    <td><input type="text" placeholder="싸이즈" name="size"></td>

                    <td><input type="text" placeholder="수 량" name="bundle"></td>

                    <td><input type="text" placeholder="톤수" name="mt"></td>

                    <td><input type="text" placeholder="창고코드" name="storage"></td>

                    <td><button onclick="addcotnet()" class="btn btn-warning " style="padding: 20px;">저장</button></td>

                </tr>

            </tbody>

        </table>

        <div class="add-btn">

            <td><button onclick="showAddform()" class="btn btn-primary btn-lg">추가</button></td>

            <td><button onclick="hideform()" class="btn btn-secondary btn-lg">취소</button></td>

        </div>

    </div>

    {% endblock %}

</div>

 

 

from main import *

from flask import Blueprint

from bson.objectid import ObjectId

bp = Blueprint("d_bar", __name__, url_prefix='/d_bar')

@bp.route('/d_list')

def d_list():

    d_lists = list(db.mv.find({"cago_name": "철근"}))

    return render_template("d_list.html",d_lists=d_lists,title="철근상세")

@bp.route('/d_detail',methods=['GET'])

def d_detail():

    data = request.args.get('data')

    print(data)

    d_details = list(db.d_list.find({'mv_id':data}))

    for d_detail in d_details:

        d_detail["_id"] = str(d_detail['_id'])

    return jsonify({"result": d_details})

@bp.route('/post', methods=["POST"])

def post_todo():

    mv_id_receive = request.form["mv_id_give"]

    msn_receive = request.form["msn_give"]

    hauju_receive = request.form["hauju_give"]

    p_name_receive = request.form["p_name_give"]

    offer_receive = request.form["offer_give"]

    gangjung_receive = request.form["gangjung_give"]

    size_receive = request.form["size_give"]

    bundle_receive = request.form["bundle_give"]

    mt_receive = request.form["mt_give"]

    storage_receive = request.form["storage_give"]

    doc = {

        "mv_id":mv_id_receive,

        "msn":msn_receive,

        "hauju":hauju_receive,

        "p_name":p_name_receive,

        "offer":offer_receive,

        "gangjung":gangjung_receive,

        "size":size_receive,

        "bundle":bundle_receive,

        "mt":mt_receive,

        "storage":storage_receive,

    }

    db.d_list.insert_one(doc)

    return jsonify({"msg": "저장 완료!"})

@bp.route('/modify', methods=["POST"])

def modify_todo():

    id_receive = request.form["id_give"]

    mv_id_receive = redirect.form["mv_id_give"]

    msn_receive = request.form["msn_give"]

    hauju_receive = request.form["hauju_give"]

    p_name_receive = request.form["p_name_give"]

    offer_receive = request.form["offer_give"]

    gangjung_receive = request.form["gangjung_give"]

    size_receive = request.form["size_give"]

    bundle_receive = request.form["bundle_give"]

    mt_receive = request.form["mt_give"]

    storage_receive = request.form["storage_give"]

    id_receive = ObjectId(id_receive)

    db.d_list.update_one({'_id':id_receive},{'$set':{"msn":msn_receive,

                            "mv_id":mv_id_receive,

                            "hauju":hauju_receive,

                            "p_name":p_name_receive,

                            "offer":offer_receive,

                            "gangjung":gangjung_receive,

                            "size":size_receive,

                            "bundle":bundle_receive,

                            "mt":mt_receive,

                            "storage":storage_receive}})

    return jsonify({"msg":"수정완료"})

@bp.route("/delete",methods=["POST"])

def delet_todo():

    id_receive = request.form["id_give"]

    id_receive = ObjectId(id_receive)

    db.d_list.delete_one({'_id':id_receive})

    return jsonify({"msg":"삭제완료"})

# @bp.route('/d_detail/<idx>',method=["GET"])

# def d_datail(idx):

#     contents =list(db.d_bar_list.find({"mv_list":{idx}},{"_id":False}))

#     print(contents)

#     return jsonify({"result":"조회완료"})