File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
2024-11-19
2024-11-19
<template>
<div class="title-box flex justify-between mb40">
<p class="title">평가</p>
<select name="" id="" v-model="selectedBook" @change="fetchUnits">
<option value="" disabled selected>교재를 선택하세요</option>
<option v-for="book in books" :key="book.book_id" :value="book.book_id">
{{ book.book_nm }}
</option>
</select>
</div>
<div class="content-t">
<label for="" class="title2">단원</label>
<div class="unit-pagination flex mt10 mb20" style="gap: 10px;">
<button v-for="(unit, index) in units" :key="index"
:class="{ 'selected-btn': selectedUnit === unit.unitId }" @click="selectUnit(unit.unitId)">
{{ unit.unitName }}
</button>
</div>
<div class="search-wrap flex justify-end mb20">
<select id="evalType" class="mr10 data-wrap">
<option value="">전체</option>
<option value="중간평가">중간</option>
<option value="최종평가">최종</option>
</select>
<button type="button" title="위원회 검색" @click="fetchData">
<img src="../../../resources/img/look_t.png" alt="">
</button>
</div>
<div class="table-wrap">
<table>
<thead>
<td>No.</td>
<td>중간/최종</td>
<td>문항 갯수</td>
<td>보기</td>
</thead>
<tbody>
<tr v-for="(post, index) in posts" :key="post.evalId">
<td>{{ index + 1 }}</td>
<td>{{ post.evalType }}</td>
<td>{{ post.problemCount }}</td>
<td><button type="button" title="보기" class="new-btn"
@click="goToPage('ExamDetail', post.evalId)">
보기
</button></td>
</tr>
<!-- <tr :class="{ 'hidden-tr': !isRowVisible }" class="show-tr">
<td colspan="7">
<div>
<table>
<colgroup>
<col style="width: 10%;">
<col style="width: 70%;">
<col style="width: 20%;">
</colgroup>
<thead>
<td>No.</td>
<td>문제</td>
<td></td>
</thead>
<tbody>
<tr>
<td>1</td>
<td>1</td>
<td><button type="button" title="수정" class="new-btn" @click="goToPage('ExamDetail')">
수정
</button></td>
</tr>
</tbody>
</table>
</div>
</td>
</tr> -->
</tbody>
</table>
<div class="flex justify-end ">
<button type="button" title="등록" class="new-btn" @click="goToPage('ExamInsert')">
등록
</button>
</div>
</div>
</div>
</template>
<script>
import SvgIcon from '@jamescoyle/vue-icon';
import { mdiMagnify, mdiWindowClose } from '@mdi/js';
import axios from 'axios';
export default {
data() {
return {
mdiMagnify: mdiMagnify,
mdiWindowClose: mdiWindowClose,
showModal: false,
searchOpen: false,
isRowVisible: false,
books: [],
units: [],
selectedBook: "",
currentPage: 1,
pageSize: 10,
totalPosts: 0,
posts: [],
selectedUnit: null,
selectedEval: null,
}
},
methods: {
toggleRow() {
this.isRowVisible = !this.isRowVisible;
},
goToPage(page, evalId) {
this.$router.push({ name: page, query: { unit_id: this.selectedUnit, eval_id: evalId } });
},
showConfirm(type) {
let message = '';
if (type === 'cancel') {
message = '삭제하시겠습니까?';
} else if (type === 'reset') {
message = '초기화하시겠습니까?';
} else if (type === 'save') {
message = '등록하시겠습니까?';
}
if (confirm(message)) {
this.goBack();
}
},
selectUnit(unitId) {
this.selectedUnit = unitId;
this.fetchData();
},
closeModal() {
this.showModal = false;
},
buttonSearch() {
this.searchOpen = true;
},
closeBtn() {
this.searchOpen = false;
},
// 평가 정보 가져오기
fetchData() {
const evalType = document.getElementById('evalType').value;
const keyword = '';
const idx = (this.currentPage - 1) * this.pageSize;
let option = null;
let searchKeyword = null;
if (evalType !== '') {
option = 'eval_type';
searchKeyword = evalType;
} else if (keyword !== '') {
option = 'keyword';
searchKeyword = keyword;
}
axios({
url: "/evaluation/evaluationUnitList.json",
method: "post",
headers: {
"Content-Type": "application/json; charset=UTF-8",
},
data: {
"option": option,
"keyword": searchKeyword,
"pageSize": this.pageSize,
"startIndex": idx,
"unitId": this.selectedUnit
},
})
.then(response => {
this.posts = response.data;
})
.catch(error => {
console.error("fetchData - error: ", error);
alert("검색 중 오류가 발생했습니다.");
});
},
fetchBooks() {
axios({
url: "/book/findAll.json",
method: "post",
headers: {
"Content-Type": "application/json; charset=UTF-8",
},
})
.then(response => {
console.log(response.data)
this.books = response.data;
})
.catch(error => {
console.error("fetchBooks - error: ", error);
alert("교재 목록을 불러오는 중 오류가 발생했습니다.");
});
},
fetchUnits() {
if (!this.selectedBook) return;
axios({
url: "/unit/unitList.json",
method: "post",
headers: {
"Content-Type": "application/json; charset=UTF-8",
},
data: {
"bookId": this.selectedBook
},
})
.then(response => {
console.log(response.data)
this.units = response.data;
})
.catch(error => {
console.error("fetchUnits - error: ", error);
alert("단원 목록을 불러오는 중 오류가 발생했습니다.");
});
},
},
watch: {
},
computed: {
},
components: {
SvgIcon
},
mounted() {
this.selectedUnit = this.$route.query.unit_id || '';
this.selectedBook = this.$route.query.book_id || '';
this.fetchBooks();
this.fetchUnits();
if(this.selectedUnit){
this.fetchData();
}
}
}
</script>