<template>
    <div class="content-wrap" v-if="istrue">
        <div class="content title-box">
            <p class="title mt25 title-bg">
                정답 : {{ dataList.prblmDtlExpln }}
            </p>
            <div class="flex align-center mb30">
                <p class="subtitle2 mr20">{{ dataList.prblmCmmt }}</p>
            </div>
        </div>
    </div>
</template>

<script>
import axios from "axios";
export default {
    data() {
        return {
            istrue: false,

            dataList: [],

            prblmId: null,

            stdId: 1,
        };
    },
    created() {
        this.prblmId = this.$store.getters.currentLearningId;
        this.stdId = this.$store.getters.getStdId;
        console.log(this.prblmId.prblm_id)
        console.log(this.stdId)
    },
    methods: {
        selectDetailPreviewNote() {
            const vm = this;

            axios({
                url: "problemLog/selectDetailPreviewNote.json",
                method: "post",
                headers: {
                    "Content-Type": "application/json; charset=UTF-8",
                },
                data: {
                    prblmId: vm.$store.getters.currentLearningId.prblm_id,
                    stdId: vm.$store.getters.getStdId,
                },
            })
                .then(function (res) {
                    console.log("problemList - response : ", res.data);
                    vm.dataList = res.data[0];
                    vm.istrue = true;
                    console.log(vm.istrue);
                })
                .catch(function (error) {
                    console.log("problemList - error : ", error);
                });
        },
    },
    watch: {},
    computed: {},
    mounted() {
        console.log("Footer mounted");
        this.selectDetailPreviewNote();
    },
};
</script>
<style scoped>
.content-wrap>.title-box {
    margin-left: 65px;
    height: 100%;
    padding-bottom: 1vh;
}
</style>
