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
<template>
<div class="title-box flex justify-between mb40">
<p class="title">반 관리</p>
</div>
<div class="wrap mb30">
<div class="flex justify-between mb30 align-center">
<label for="" class="title1">학습 현황</label>
<div class="look-btn flex align-center">
<p>자세히 보기 </p>
<svg-icon type="mdi" :path="mdilArrowRight" class=" ml10"></svg-icon>
</div>
</div>
<div class="table-wrap">
<table>
<thead>
<td>No.</td>
<td>제목</td>
<td>내용</td>
<td>작성자</td>
<td>등록일</td>
</thead>
<tbody>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="flex justify-between" style="gap: 30px;">
<div class="wrap mb30">
<div class="flex justify-between mb30 align-center">
<label for="" class="title1">학생 목록</label>
<div class="look-btn align-center flex">
<p>자세히 보기 </p>
<svg-icon type="mdi" :path="mdilArrowRight" class=" ml10"></svg-icon>
</div>
</div>
<div class="table-wrap">
<table>
<thead>
<td>No.</td>
<td>이름</td>
<td>학년</td>
<td>반</td>
</thead>
<tbody>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="wrap mb30">
<div class="flex justify-between mb30 align-center">
<label for="" class="title1">책 </label>
<div class="align-center flex look-btn"><p>자세히 보기 </p><svg-icon type="mdi" :path="mdilArrowRight" class=" ml10"></svg-icon></div>
</div>
<div class=" flex " style="gap: 50px;">
<div class="textbook">
<div class="box " style="gap: 10px;">
</div>
<div class="text ">
<p class="title1" style="color: #fff;">A 교재</p>
<div class="btnGroup mt15 flex align-center justify-end" style="gap: 10px;">
<button>수정</button><p>|</p>
<button @click="showConfirm('delete')">삭제</button>
</div>
</div>
</div>
<div class="textbook">
<div class="box " style="gap: 10px;">
</div>
<div class="text ">
<p class="title1" style="color: #fff;">A 교재</p>
<div class="btnGroup mt15 flex align-center justify-end" style="gap: 10px;">
<button>수정</button><p>|</p>
<button @click="showConfirm('delete')">삭제</button>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import SvgIcon from '@jamescoyle/vue-icon';
import { mdiMagnify, } from '@mdi/js';
import { mdilArrowRight } from '@mdi/light-js';
import ProgressBar from '../../component/ProgressBar.vue';
export default {
data() {
return {
mdiMagnify: mdiMagnify,
mdilArrowRight: mdilArrowRight,
timer: "00:00",
progress: 20,
// 교사 홈페이지에서 쿼리 파라미터로부터 전달받은 선택된 반의 아이디
selectedClassId : this.$route.query.sclsId
}
},
methods: {
goToPage(page) {
this.$router.push({ name: page });
},
increaseProgress() {
if (this.progress < 100) {
this.progress += 10;
}
},
showConfirm(type) {
let message = '';
if (type === 'cancel') {
message = '삭제하시겠습니까?';
} else if (type === 'reset') {
message = '초기화하시겠습니까?';
} else if (type === 'save') {
message = '등록하시겠습니까?';
}
if (confirm(message)) {
this.goBack();
}
},
},
watch: {
},
computed: {
},
components: {
SvgIcon,
ProgressBar
},
mounted() {
console.log('Main2 mounted');
//console.log(`반 페이지 sclsId(반 아이디) 확인 : ${this.selectedClassId}`);
}
}
</script>