File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<div class="side">
<router-link to="/">
<div class="logo mb25"><img src="../../resources/img/logo2.png" alt=""></div>
</router-link>
<div class="profile mb30">
<div class="flex align-start">
<img src="../../resources/img/img16_s.png" alt="">
<div class="ml25" >
<p class="name mb10">{{ studentInfo.studentName }}</p>
<p class="mb5">{{ studentInfo.institutionName }} {{ studentInfo.grade }}학년 {{ studentInfo.className }}</p>
<progress-bar :progress="progress"></progress-bar>
<span @click="increaseProgress">오늘의 공부</span>
<span class="brown ml10">{{ progress }}%</span>
</div>
</div>
<hr>
<p class="title2 mb25">최근 학습 히스토리</p>
<ul class="flex justify-between ml30 mb30">
<li v-for="historyItem in studentInfo.history" :key="historyItem.unitId">
{{ historyItem.bookName }} {{ historyItem.unitName }}
</li>
</ul>
</div>
<div class="ask mb30">
<p class="title1 mb15">선생님께 질문 있어요~</p>
<div class="memo mb15"><textarea name="" id="" placeholder="궁금한 것을 적어보세요."></textarea></div>
<div class="flex justify-end"><button>질문하기</button></div>
</div>
<!-- <div class="btn-wrap flex justify-between">
<button class="login-btn" @click="handleClick" >
<img src="../../resources/img/btn07_s.png" alt="">
<p>{{ buttonText }}</p>
</button>
<button class="login-btn" type="submit" ><img src="../../resources/img/btn07_s.png" alt=""> <p >오늘 할 다른 공부</p></button>
</div> -->
</div>
</template>
<script>
import ProgressBar from '../component/ProgressBar.vue';
import axios from 'axios';
export default {
data () {
return {
buttonText: '오답노트',
progress: 20,
studentInfo: {
studentName: '',
institutionName: '',
grade: '',
className: '',
studentQuestion: '',
history: []
},
userId: '1' // userId 임시 설정
}
},
methods: {
// 학생 정보를 가져오는 메서드
fetchStudentInfo() {
axios.post('/studentInfo/getInfo.json', { userId: this.userId })
.then(response => {
console.log(response.data);
this.studentInfo = response.data;
})
.catch(error => {
console.error('학생 정보 가져오기 실패:', error);
});
},
handleClick() {
this.toggleText();
this.goToPage('PreviewNote');
},
handleClick() {
this.toggleTextAndNavigate();
},
toggleTextAndNavigate() {
if (this.buttonText === '오답노트') {
this.buttonText = '학습 코스';
this.goToPage('PreviewNote');
// 버튼 텍스트가 '학습 코스'일 때 이동할 경로
} else {
this.buttonText = '오답노트';
this.goToPage('Dashboard');
// 버튼 텍스트가 '오답노트'일 때 이동할 경로
}
},
goToPage(page) {
this.$router.push({ name: page });
},
increaseProgress() {
if (this.progress < 100) {
this.progress += 10;
}
}
},
watch: {
},
computed: {
},
components: {
ProgressBar
},
mounted() {
console.log('Side mounted');
this.fetchStudentInfo();
}
}
</script>