Commit @fc9bea7951e525e6c3710d855c999bc5d0a9910a

박민혁 2024-08-23

Merge branch 'master' of http://210.180.118.83/jichoi/lms_front

@fc9bea7951e525e6c3710d855c999bc5d0a9910a

435e0c8

fc9bea7

client/views/pages/main/Chapter/Chapter2_2.vue

--- client/views/pages/main/Chapter/Chapter2_2.vue

+++ client/views/pages/main/Chapter/Chapter2_2.vue


       <button class="completeBtn" @click="complete">학습 종료</button>
     </div>
     <div class="flex justify-between align-center">
-      <div class="pre-btn" @click="goToPage('Chapter2_3')">
+      <div class="pre-btn" @click="goToPrevPage">
         <img src="../../../../resources/img/left.png" alt="" />
       </div>
       <div class="content title-box">

           </div>
         </div>
       </div>
-      <div class="next-btn" @click="goToPage('Chapter2_9')">
+      <div class="next-btn" @click="goToNextPage">
         <img src="../../../../resources/img/right.png" alt="" />
       </div>
     </div>

 </template>
 
 <script>
+import axios from 'axios';
+
 export default {
   data() {
     return {

       timer: 0,
       intervalId: null,
       currentIndex: 0,
-      wdBookId: "",
-      currentWdBkIndex: 0,
+      wdBookIdList: [], // 단어 컨텐츠의 단어장 id 리스트
+      wdBookId: "", // 현재 단어장 id
+      currentWdBkIndex: 0, // 현재 단어장 인덱스
+      wdBookTypeIdState: "", // 이동할 페이지 타입 id
+      wordBookType: "", // 이동할 페이지
     };
   },
   methods: {
+    pageSetting() {
+      this.currentWdBkIndex = this.$store.getters.getCurrentWdBkIndex; // 현재 단어장 인덱스
+      this.wdBookIdList = this.$store.getters.getWdBookIdList; // 단어컨텐츠의 단어장 id 리스트
+      this.wdBookId = this.$store.getters.getWdBookIdList[this.currentWdBkIndex] // 현재 단어장 콘텐츠 인덱스에 대한 단어장 id
+
+      // this.fetchWordList();
+    },
+
     async fetchWordList() {
       console.log("현재 단어장 콘텐츠 인덱스: ", this.$store.getters.getCurrentWdBkIndex);
       this.currentWdBkIndex = this.$store.getters.getCurrentWdBkIndex;
       console.log("현재 단어장 콘텐츠 인덱스에 대한 단어장 id: ", this.$store.getters.getWdBookIdList[this.currentWdBkIndex]);
+    },
+
+    async goToPrevPage() {
+      if (this.currentWdBkIndex - 1 < 0) {
+        alert("단어장 첫번째 페이지 입니다");
+      } else {
+        this.currentWdBkIndex--;
+        this.$store.dispatch('updateCurrentWdBkIndex', this.currentWdBkIndex);
+
+        try {
+          const response = await axios.post("/wordbook/find.json", {
+            wdBookId: this.$store.getters.getWdBookIdList[this.currentWdBkIndex]
+          });
+          this.wdBookTypeIdState = response.data.wdBookTypeId;
+          console.log("이전 단어장 타입 id: ", this.wdBookTypeIdState);
+
+          switch (this.wdBookTypeIdState) {
+            case "1":
+                this.wordBookType = "Chapter2";
+                break;
+            case "2":
+                this.wordBookType = "Chapter2_3";
+                break;
+            case "3":
+                this.wordBookType = "Chapter2_2";
+                break;
+            case "4":
+                this.wordBookType = "Chapter2_9";
+                break;
+            case "5":
+                this.wordBookType = "Chapter2_4";
+                break;
+            default:
+                this.wordBookType = null;
+          }
+          
+          this.goToPage(this.wordBookType); 
+        } catch (error) {
+          console.error('단어장 정보 불러오는 중 오류 발생:', error);
+        }
+      }
+    },
+
+    async goToNextPage() {
+      if (this.currentWdBkIndex + 1 >= this.wdBookIdList.length) {
+        alert("단어장 마지막 페이지 입니다");
+      } else {
+        this.currentWdBkIndex++;
+        this.$store.dispatch('updateCurrentWdBkIndex', this.currentWdBkIndex);
+
+        try {
+          const response = await axios.post("/wordbook/find.json", {
+            wdBookId: this.$store.getters.getWdBookIdList[this.currentWdBkIndex]
+          });
+          this.wdBookTypeIdState = response.data.wdBookTypeId;
+          console.log("다음 단어장 타입 id: ", this.wdBookTypeIdState);
+
+          switch (this.wdBookTypeIdState) {
+            case "1":
+                this.wordBookType = "Chapter2";
+                break;
+            case "2":
+                this.wordBookType = "Chapter2_3";
+                break;
+            case "3":
+                this.wordBookType = "Chapter2_2";
+                break;
+            case "4":
+                this.wordBookType = "Chapter2_9";
+                break;
+            case "5":
+                this.wordBookType = "Chapter2_4";
+                break;
+            default:
+                this.wordBookType = null;
+          }
+          
+          this.goToPage(this.wordBookType); 
+        } catch (error) {
+          console.error('단어장 정보 불러오는 중 오류 발생:', error);
+        }
+      }
     },
 
     complete() {

     },
   },
   mounted() {
-    this.fetchWordList();
+    this.pageSetting();
     this.startTimer();
   },
 };

435e0c8

fc9bea7

client/views/pages/main/Chapter/Chapter2_3.vue

--- client/views/pages/main/Chapter/Chapter2_3.vue

+++ client/views/pages/main/Chapter/Chapter2_3.vue


 
                 <div class="imgGroup box23">
                     <div class="con">
-                        <img :src="currentCon.imgSrc" alt="" />
+                        <img :src="currentCon.imgSrc" alt="" style="height: 150px;"/>
                         <p class="title3">
                             <em class="yellow">{{ currentCon.titleEm }}</em
                             >{{ currentCon.title }}

 
                     // fileResponse.data.list에서 fileRpath 값을 추출하여 imgSrc에 설정
                     const fileRpath = fileResponse.data.list.length > 0 ? fileResponse.data.list[0].fileRpath : null;
-                    const imgSrc = fileRpath ? `http://http://165.229.169.113:8081/${fileRpath}` : '';
+                    const imgSrc = fileRpath ? `http://165.229.169.113:9080/${fileRpath}` : '';
 
                     return {
                         imgSrc1: `client/resources/img/img53_${6 + index}_35s.png`,

435e0c8

fc9bea7

client/views/pages/main/Chapter/Chapter2_4.vue

--- client/views/pages/main/Chapter/Chapter2_4.vue

+++ client/views/pages/main/Chapter/Chapter2_4.vue


       <button class="completeBtn" @click="complete">학습 종료</button>
     </div>
     <div class="flex justify-between align-center">
-      <div class="pre-btn" @click="goToPage('Chapter2_9')">
+      <div class="pre-btn" @click="goToPrevPage">
         <img src="../../../../resources/img/left.png" alt="" />
       </div>
       <div class="content title-box">

           ></audio>
         </div>
       </div>
-      <div class="next-btn" @click="goToPage('Chapter2_8')">
+      <div class="next-btn" @click="goToNextPage">
         <img src="../../../../resources/img/right.png" alt="" />
       </div>
     </div>

 </template>
 <script>
 import SvgIcon from "@jamescoyle/vue-icon";
+import axios from "axios";
+
 export default {
   data() {
     return {

         },
       ],
       selectedIndex: 0,
+
+      wdBookIdList: [], // 단어 컨텐츠의 단어장 id 리스트
+      wdBookId: "", // 현재 단어장 id
+      currentWdBkIndex: 0, // 현재 단어장 인덱스
+      wdBookTypeIdState: "", // 이동할 페이지 타입 id
+      wordBookType: "", // 이동할 페이지
     };
   },
   methods: {
+    pageSetting() {
+      this.currentWdBkIndex = this.$store.getters.getCurrentWdBkIndex; // 현재 단어장 인덱스
+      this.wdBookIdList = this.$store.getters.getWdBookIdList; // 단어컨텐츠의 단어장 id 리스트
+      this.wdBookId = this.$store.getters.getWdBookIdList[this.currentWdBkIndex] // 현재 단어장 콘텐츠 인덱스에 대한 단어장 id
+
+      // this.fetchWordList();
+    },
+    
+    async fetchWordList() {
+
+    },
+
+    async goToPrevPage() {
+      if (this.currentWdBkIndex - 1 < 0) {
+        alert("단어장 첫번째 페이지 입니다");
+      } else {
+        this.currentWdBkIndex--;
+        this.$store.dispatch('updateCurrentWdBkIndex', this.currentWdBkIndex);
+
+        try {
+          const response = await axios.post("/wordbook/find.json", {
+            wdBookId: this.$store.getters.getWdBookIdList[this.currentWdBkIndex]
+          });
+          this.wdBookTypeIdState = response.data.wdBookTypeId;
+          console.log("이전 단어장 타입 id: ", this.wdBookTypeIdState);
+
+          switch (this.wdBookTypeIdState) {
+            case "1":
+                this.wordBookType = "Chapter2";
+                break;
+            case "2":
+                this.wordBookType = "Chapter2_3";
+                break;
+            case "3":
+                this.wordBookType = "Chapter2_2";
+                break;
+            case "4":
+                this.wordBookType = "Chapter2_9";
+                break;
+            case "5":
+                this.wordBookType = "Chapter2_4";
+                break;
+            default:
+                this.wordBookType = null;
+          }
+          
+          this.goToPage(this.wordBookType); 
+        } catch (error) {
+          console.error('단어장 정보 불러오는 중 오류 발생:', error);
+        }
+      }
+    },
+
+    async goToNextPage() {
+      if (this.currentWdBkIndex + 1 >= this.wdBookIdList.length) {
+        alert("단어장 마지막 페이지 입니다");
+      } else {
+        this.currentWdBkIndex++;
+        this.$store.dispatch('updateCurrentWdBkIndex', this.currentWdBkIndex);
+
+        try {
+          const response = await axios.post("/wordbook/find.json", {
+            wdBookId: this.$store.getters.getWdBookIdList[this.currentWdBkIndex]
+          });
+          this.wdBookTypeIdState = response.data.wdBookTypeId;
+          console.log("다음 단어장 타입 id: ", this.wdBookTypeIdState);
+
+          switch (this.wdBookTypeIdState) {
+            case "1":
+                this.wordBookType = "Chapter2";
+                break;
+            case "2":
+                this.wordBookType = "Chapter2_3";
+                break;
+            case "3":
+                this.wordBookType = "Chapter2_2";
+                break;
+            case "4":
+                this.wordBookType = "Chapter2_9";
+                break;
+            case "5":
+                this.wordBookType = "Chapter2_4";
+                break;
+            default:
+                this.wordBookType = null;
+          }
+          
+          this.goToPage(this.wordBookType); 
+        } catch (error) {
+          console.error('단어장 정보 불러오는 중 오류 발생:', error);
+        }
+      }
+    },
+
     complete() {
       const { unit_id, book_id } = this.$route.query;
       this.$router.push({ name: 'Dashboard', query: { value: 2, unit_id, book_id } });

   components: {
     SvgIcon,
   },
+  mounted() {
+    this.pageSetting();
+  },
 };
 </script>
 

435e0c8

fc9bea7

client/views/pages/main/Chapter/Chapter2_9.vue

--- client/views/pages/main/Chapter/Chapter2_9.vue

+++ client/views/pages/main/Chapter/Chapter2_9.vue


       <button class="completeBtn" @click="complete">학습 종료</button>
     </div>
     <div class="flex justify-between align-center">
-      <div class="pre-btn" @click="goToPage('Chapter2_2')">
+      <div class="pre-btn" @click="goToPrevPage">
         <img src="../../../../resources/img/left.png" alt="" />
       </div>
       <div class="content title-box">

           </div>
         </div>
       </div>
-      <div class="next-btn" @click="goToPage('Chapter2_4')">
+      <div class="next-btn" @click="goToNextPage">
         <img src="../../../../resources/img/right.png" alt="" />
       </div>
     </div>

 </template>
 
 <script>
+import axios from 'axios';
+
 export default {
   data() {
     return {
       draggedElementId: null, // 드래그한 요소의 ID를 저장
+
+      wdBookIdList: [], // 단어 컨텐츠의 단어장 id 리스트
+      wdBookId: "", // 현재 단어장 id
+      currentWdBkIndex: 0, // 현재 단어장 인덱스
+      wdBookTypeIdState: "", // 이동할 페이지 타입 id
+      wordBookType: "", // 이동할 페이지
     };
   },
   methods: {
+    pageSetting() {
+      this.currentWdBkIndex = this.$store.getters.getCurrentWdBkIndex; // 현재 단어장 인덱스
+      this.wdBookIdList = this.$store.getters.getWdBookIdList; // 단어컨텐츠의 단어장 id 리스트
+      this.wdBookId = this.$store.getters.getWdBookIdList[this.currentWdBkIndex] // 현재 단어장 콘텐츠 인덱스에 대한 단어장 id
+
+      // this.fetchWordList();
+    },
+    
+    async fetchWordList() {
+
+    },
+
+    async goToPrevPage() {
+      if (this.currentWdBkIndex - 1 < 0) {
+        alert("단어장 첫번째 페이지 입니다");
+      } else {
+        this.currentWdBkIndex--;
+        this.$store.dispatch('updateCurrentWdBkIndex', this.currentWdBkIndex);
+
+        try {
+          const response = await axios.post("/wordbook/find.json", {
+            wdBookId: this.$store.getters.getWdBookIdList[this.currentWdBkIndex]
+          });
+          this.wdBookTypeIdState = response.data.wdBookTypeId;
+          console.log("이전 단어장 타입 id: ", this.wdBookTypeIdState);
+
+          switch (this.wdBookTypeIdState) {
+            case "1":
+                this.wordBookType = "Chapter2";
+                break;
+            case "2":
+                this.wordBookType = "Chapter2_3";
+                break;
+            case "3":
+                this.wordBookType = "Chapter2_2";
+                break;
+            case "4":
+                this.wordBookType = "Chapter2_9";
+                break;
+            case "5":
+                this.wordBookType = "Chapter2_4";
+                break;
+            default:
+                this.wordBookType = null;
+          }
+          
+          this.goToPage(this.wordBookType); 
+        } catch (error) {
+          console.error('단어장 정보 불러오는 중 오류 발생:', error);
+        }
+      }
+    },
+
+    async goToNextPage() {
+      if (this.currentWdBkIndex + 1 >= this.wdBookIdList.length) {
+        alert("단어장 마지막 페이지 입니다");
+      } else {
+        this.currentWdBkIndex++;
+        this.$store.dispatch('updateCurrentWdBkIndex', this.currentWdBkIndex);
+
+        try {
+          const response = await axios.post("/wordbook/find.json", {
+            wdBookId: this.$store.getters.getWdBookIdList[this.currentWdBkIndex]
+          });
+          this.wdBookTypeIdState = response.data.wdBookTypeId;
+          console.log("다음 단어장 타입 id: ", this.wdBookTypeIdState);
+
+          switch (this.wdBookTypeIdState) {
+            case "1":
+                this.wordBookType = "Chapter2";
+                break;
+            case "2":
+                this.wordBookType = "Chapter2_3";
+                break;
+            case "3":
+                this.wordBookType = "Chapter2_2";
+                break;
+            case "4":
+                this.wordBookType = "Chapter2_9";
+                break;
+            case "5":
+                this.wordBookType = "Chapter2_4";
+                break;
+            default:
+                this.wordBookType = null;
+          }
+          
+          this.goToPage(this.wordBookType); 
+        } catch (error) {
+          console.error('단어장 정보 불러오는 중 오류 발생:', error);
+        }
+      }
+    },
+
     complete() {
       const { unit_id, book_id } = this.$route.query;
       this.$router.push({ name: 'Dashboard', query: { value: 2, unit_id, book_id } });

     },
   },
   mounted() {
+    this.pageSetting();
     // 드래그 가능한 영역에 드래그 오버 및 드롭 이벤트를 추가합니다
     document.querySelectorAll(".dropzone").forEach((button) => {
       button.addEventListener("dragover", this.handleDragOver);

Add a comment

Open 0
Closed 0

List

...	...	@@ -18,7 +18,7 @@
18	18	<button class="completeBtn" @click="complete">학습 종료</button>
19	19	</div>
20	20	<div class="flex justify-between align-center">
21		- <div class="pre-btn" @click="goToPage('Chapter2_3')">
	21	+ <div class="pre-btn" @click="goToPrevPage">
22	22	<img src="../../../../resources/img/left.png" alt="" />
23	23	</div>
24	24	<div class="content title-box">
...	...	@@ -60,7 +60,7 @@
60	60	</div>
61	61	</div>
62	62	</div>
63		- <div class="next-btn" @click="goToPage('Chapter2_9')">
	63	+ <div class="next-btn" @click="goToNextPage">
64	64	<img src="../../../../resources/img/right.png" alt="" />
65	65	</div>
66	66	</div>
...	...	@@ -68,6 +68,8 @@
68	68	</template>
69	69
70	70	<script>
	71	+import axios from 'axios';
	72	+
71	73	export default {
72	74	data() {
73	75	return {
...	...	@@ -104,15 +106,108 @@
104	106	timer: 0,
105	107	intervalId: null,
106	108	currentIndex: 0,
107		- wdBookId: "",
108		- currentWdBkIndex: 0,
	109	+ wdBookIdList: [], // 단어 컨텐츠의 단어장 id 리스트
	110	+ wdBookId: "", // 현재 단어장 id
	111	+ currentWdBkIndex: 0, // 현재 단어장 인덱스
	112	+ wdBookTypeIdState: "", // 이동할 페이지 타입 id
	113	+ wordBookType: "", // 이동할 페이지
109	114	};
110	115	},
111	116	methods: {
	117	+ pageSetting() {
	118	+ this.currentWdBkIndex = this.$store.getters.getCurrentWdBkIndex; // 현재 단어장 인덱스
	119	+ this.wdBookIdList = this.$store.getters.getWdBookIdList; // 단어컨텐츠의 단어장 id 리스트
	120	+ this.wdBookId = this.$store.getters.getWdBookIdList[this.currentWdBkIndex] // 현재 단어장 콘텐츠 인덱스에 대한 단어장 id
	121	+
	122	+ // this.fetchWordList();
	123	+ },
	124	+
112	125	async fetchWordList() {
113	126	console.log("현재 단어장 콘텐츠 인덱스: ", this.$store.getters.getCurrentWdBkIndex);
114	127	this.currentWdBkIndex = this.$store.getters.getCurrentWdBkIndex;
115	128	console.log("현재 단어장 콘텐츠 인덱스에 대한 단어장 id: ", this.$store.getters.getWdBookIdList[this.currentWdBkIndex]);
	129	+ },
	130	+
	131	+ async goToPrevPage() {
	132	+ if (this.currentWdBkIndex - 1 < 0) {
	133	+ alert("단어장 첫번째 페이지 입니다");
	134	+ } else {
	135	+ this.currentWdBkIndex--;
	136	+ this.$store.dispatch('updateCurrentWdBkIndex', this.currentWdBkIndex);
	137	+
	138	+ try {
	139	+ const response = await axios.post("/wordbook/find.json", {
	140	+ wdBookId: this.$store.getters.getWdBookIdList[this.currentWdBkIndex]
	141	+ });
	142	+ this.wdBookTypeIdState = response.data.wdBookTypeId;
	143	+ console.log("이전 단어장 타입 id: ", this.wdBookTypeIdState);
	144	+
	145	+ switch (this.wdBookTypeIdState) {
	146	+ case "1":
	147	+ this.wordBookType = "Chapter2";
	148	+ break;
	149	+ case "2":
	150	+ this.wordBookType = "Chapter2_3";
	151	+ break;
	152	+ case "3":
	153	+ this.wordBookType = "Chapter2_2";
	154	+ break;
	155	+ case "4":
	156	+ this.wordBookType = "Chapter2_9";
	157	+ break;
	158	+ case "5":
	159	+ this.wordBookType = "Chapter2_4";
	160	+ break;
	161	+ default:
	162	+ this.wordBookType = null;
	163	+ }
	164	+
	165	+ this.goToPage(this.wordBookType);
	166	+ } catch (error) {
	167	+ console.error('단어장 정보 불러오는 중 오류 발생:', error);
	168	+ }
	169	+ }
	170	+ },
	171	+
	172	+ async goToNextPage() {
	173	+ if (this.currentWdBkIndex + 1 >= this.wdBookIdList.length) {
	174	+ alert("단어장 마지막 페이지 입니다");
	175	+ } else {
	176	+ this.currentWdBkIndex++;
	177	+ this.$store.dispatch('updateCurrentWdBkIndex', this.currentWdBkIndex);
	178	+
	179	+ try {
	180	+ const response = await axios.post("/wordbook/find.json", {
	181	+ wdBookId: this.$store.getters.getWdBookIdList[this.currentWdBkIndex]
	182	+ });
	183	+ this.wdBookTypeIdState = response.data.wdBookTypeId;
	184	+ console.log("다음 단어장 타입 id: ", this.wdBookTypeIdState);
	185	+
	186	+ switch (this.wdBookTypeIdState) {
	187	+ case "1":
	188	+ this.wordBookType = "Chapter2";
	189	+ break;
	190	+ case "2":
	191	+ this.wordBookType = "Chapter2_3";
	192	+ break;
	193	+ case "3":
	194	+ this.wordBookType = "Chapter2_2";
	195	+ break;
	196	+ case "4":
	197	+ this.wordBookType = "Chapter2_9";
	198	+ break;
	199	+ case "5":
	200	+ this.wordBookType = "Chapter2_4";
	201	+ break;
	202	+ default:
	203	+ this.wordBookType = null;
	204	+ }
	205	+
	206	+ this.goToPage(this.wordBookType);
	207	+ } catch (error) {
	208	+ console.error('단어장 정보 불러오는 중 오류 발생:', error);
	209	+ }
	210	+ }
116	211	},
117	212
118	213	complete() {
...	...	@@ -165,7 +260,7 @@
165	260	},
166	261	},
167	262	mounted() {
168		- this.fetchWordList();
	263	+ this.pageSetting();
169	264	this.startTimer();
170	265	},
171	266	};

...	...	@@ -29,7 +29,7 @@
29	29
30	30	<div class="imgGroup box23">
31	31	<div class="con">
32		- <img :src="currentCon.imgSrc" alt="" />
	32	+ <img :src="currentCon.imgSrc" alt="" style="height: 150px;"/>
33	33	<p class="title3">
34	34	<em class="yellow">{{ currentCon.titleEm }}</em
35	35	>{{ currentCon.title }}
...	...	@@ -223,7 +223,7 @@
223	223
224	224	// fileResponse.data.list에서 fileRpath 값을 추출하여 imgSrc에 설정
225	225	const fileRpath = fileResponse.data.list.length > 0 ? fileResponse.data.list[0].fileRpath : null;
226		- const imgSrc = fileRpath ? `http://http://165.229.169.113:8081/${fileRpath}` : '';
	226	+ const imgSrc = fileRpath ? `http://165.229.169.113:9080/${fileRpath}` : '';
227	227
228	228	return {
229	229	imgSrc1: `client/resources/img/img53_${6 + index}_35s.png`,

...	...	@@ -18,7 +18,7 @@
18	18	<button class="completeBtn" @click="complete">학습 종료</button>
19	19	</div>
20	20	<div class="flex justify-between align-center">
21		- <div class="pre-btn" @click="goToPage('Chapter2_2')">
	21	+ <div class="pre-btn" @click="goToPrevPage">
22	22	<img src="../../../../resources/img/left.png" alt="" />
23	23	</div>
24	24	<div class="content title-box">
...	...	@@ -164,7 +164,7 @@
164	164	</div>
165	165	</div>
166	166	</div>
167		- <div class="next-btn" @click="goToPage('Chapter2_4')">
	167	+ <div class="next-btn" @click="goToNextPage">
168	168	<img src="../../../../resources/img/right.png" alt="" />
169	169	</div>
170	170	</div>
...	...	@@ -172,13 +172,115 @@
172	172	</template>
173	173
174	174	<script>
	175	+import axios from 'axios';
	176	+
175	177	export default {
176	178	data() {
177	179	return {
178	180	draggedElementId: null, // 드래그한 요소의 ID를 저장
	181	+
	182	+ wdBookIdList: [], // 단어 컨텐츠의 단어장 id 리스트
	183	+ wdBookId: "", // 현재 단어장 id
	184	+ currentWdBkIndex: 0, // 현재 단어장 인덱스
	185	+ wdBookTypeIdState: "", // 이동할 페이지 타입 id
	186	+ wordBookType: "", // 이동할 페이지
179	187	};
180	188	},
181	189	methods: {
	190	+ pageSetting() {
	191	+ this.currentWdBkIndex = this.$store.getters.getCurrentWdBkIndex; // 현재 단어장 인덱스
	192	+ this.wdBookIdList = this.$store.getters.getWdBookIdList; // 단어컨텐츠의 단어장 id 리스트
	193	+ this.wdBookId = this.$store.getters.getWdBookIdList[this.currentWdBkIndex] // 현재 단어장 콘텐츠 인덱스에 대한 단어장 id
	194	+
	195	+ // this.fetchWordList();
	196	+ },
	197	+
	198	+ async fetchWordList() {
	199	+
	200	+ },
	201	+
	202	+ async goToPrevPage() {
	203	+ if (this.currentWdBkIndex - 1 < 0) {
	204	+ alert("단어장 첫번째 페이지 입니다");
	205	+ } else {
	206	+ this.currentWdBkIndex--;
	207	+ this.$store.dispatch('updateCurrentWdBkIndex', this.currentWdBkIndex);
	208	+
	209	+ try {
	210	+ const response = await axios.post("/wordbook/find.json", {
	211	+ wdBookId: this.$store.getters.getWdBookIdList[this.currentWdBkIndex]
	212	+ });
	213	+ this.wdBookTypeIdState = response.data.wdBookTypeId;
	214	+ console.log("이전 단어장 타입 id: ", this.wdBookTypeIdState);
	215	+
	216	+ switch (this.wdBookTypeIdState) {
	217	+ case "1":
	218	+ this.wordBookType = "Chapter2";
	219	+ break;
	220	+ case "2":
	221	+ this.wordBookType = "Chapter2_3";
	222	+ break;
	223	+ case "3":
	224	+ this.wordBookType = "Chapter2_2";
	225	+ break;
	226	+ case "4":
	227	+ this.wordBookType = "Chapter2_9";
	228	+ break;
	229	+ case "5":
	230	+ this.wordBookType = "Chapter2_4";
	231	+ break;
	232	+ default:
	233	+ this.wordBookType = null;
	234	+ }
	235	+
	236	+ this.goToPage(this.wordBookType);
	237	+ } catch (error) {
	238	+ console.error('단어장 정보 불러오는 중 오류 발생:', error);
	239	+ }
	240	+ }
	241	+ },
	242	+
	243	+ async goToNextPage() {
	244	+ if (this.currentWdBkIndex + 1 >= this.wdBookIdList.length) {
	245	+ alert("단어장 마지막 페이지 입니다");
	246	+ } else {
	247	+ this.currentWdBkIndex++;
	248	+ this.$store.dispatch('updateCurrentWdBkIndex', this.currentWdBkIndex);
	249	+
	250	+ try {
	251	+ const response = await axios.post("/wordbook/find.json", {
	252	+ wdBookId: this.$store.getters.getWdBookIdList[this.currentWdBkIndex]
	253	+ });
	254	+ this.wdBookTypeIdState = response.data.wdBookTypeId;
	255	+ console.log("다음 단어장 타입 id: ", this.wdBookTypeIdState);
	256	+
	257	+ switch (this.wdBookTypeIdState) {
	258	+ case "1":
	259	+ this.wordBookType = "Chapter2";
	260	+ break;
	261	+ case "2":
	262	+ this.wordBookType = "Chapter2_3";
	263	+ break;
	264	+ case "3":
	265	+ this.wordBookType = "Chapter2_2";
	266	+ break;
	267	+ case "4":
	268	+ this.wordBookType = "Chapter2_9";
	269	+ break;
	270	+ case "5":
	271	+ this.wordBookType = "Chapter2_4";
	272	+ break;
	273	+ default:
	274	+ this.wordBookType = null;
	275	+ }
	276	+
	277	+ this.goToPage(this.wordBookType);
	278	+ } catch (error) {
	279	+ console.error('단어장 정보 불러오는 중 오류 발생:', error);
	280	+ }
	281	+ }
	282	+ },
	283	+
182	284	complete() {
183	285	const { unit_id, book_id } = this.$route.query;
184	286	this.$router.push({ name: 'Dashboard', query: { value: 2, unit_id, book_id } });
...	...	@@ -220,6 +322,7 @@
220	322	},
221	323	},
222	324	mounted() {
	325	+ this.pageSetting();
223	326	// 드래그 가능한 영역에 드래그 오버 및 드롭 이벤트를 추가합니다
224	327	document.querySelectorAll(".dropzone").forEach((button) => {
225	328	button.addEventListener("dragover", this.handleDragOver);

Delete comment