Commit @1ec532241e1a080ddb1c4f9dff85d4ba09843ec3

PsHooN7979 2024-08-22

240822 박세훈 Chapter3관련 Dashboard, AppStore 수정

@1ec532241e1a080ddb1c4f9dff85d4ba09843ec3

79ed365

1ec5322

client/views/pages/AppStore.js

--- client/views/pages/AppStore.js

+++ client/views/pages/AppStore.js


         schdlId: null,
         bookId: null,
         unitId: null,
-        learningId: null,
+        LearningId: null,
+        currentLearningIds: [], // Stores multiple learning_ids (prblm_id)
+        currentLabel: null,
+        currentProblemIndex: 0,
     },
     getters: {
         isLoggedIn(state) {

         getLearningId(state) {
             return state.learningId;
         },
+        currentLearningId(state) {
+            return state.currentLearningIds[state.currentProblemIndex];
+        },
+        currentLabel: state => state.currentLabel,
+        currentProblemIndex: state => state.currentProblemIndex
     },
     mutations: {
         setToken(state, token) {

         setLearningId(state, learningId) {
             state.learningId = learningId;
         },
+        setLearningData(state, payload) {
+            state.currentLearningIds = payload.learning_id; // Array of IDs
+            state.currentLabel = payload.label;
+            state.currentProblemIndex = 0; // Reset to the first problem
+        },
+        incrementProblemIndex(state) {
+            if (state.currentProblemIndex < state.currentLearningIds.length - 1) {
+                state.currentProblemIndex++;
+            }
+        },
+        decrementProblemIndex(state) {
+            if (state.currentProblemIndex > 0) {
+                state.currentProblemIndex--;
+            }
+        }
     },
     actions: {
         login({ commit }, token) {

         updateLearningId({ commit }, learningId) {
             commit("setLearningId", learningId);
         },
+        updateLearningData({ commit }, payload) {
+            commit('setLearningData', payload);
+        },
+        goToNextProblem({ commit }) {
+            commit('incrementProblemIndex');
+        },
+        goToPreviousProblem({ commit }) {
+            commit('decrementProblemIndex');
+        }
     },
 });

79ed365

1ec5322

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

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

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


             timer: "00",
             selectedButton: null, // 선택한 버튼
             prblm_id: [],
+            unit_id: null,
         };
     },
     methods: {

         handleSubmit() {
             console.log("선택된 번호 : ", this.selectedButton);
         },
-        storeProblemId() {
-            this.prblm_id = this.$store.getters.getLearningId
-            console.log("prblm_id", this.prblm_id)
-        }
     },
     watch: {},
     computed: {
-        // learningId() {
-        //     this.$store.getters.getLearningId
-        // },
+        learningId() {
+            return this.$store.getters.getLearningId
+        },
+    },
+    created() {
+        this.prblm_id = this.learningId
     },
     components: {},
-    mounted() {
-        this.storeProblemId();
-    },
+    mounted() { },
 };
 </script>
 <style scoped>

79ed365

1ec5322

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

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

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


       <span class="subtitle">my name is dd</span>
     </div>
     <div class="flex justify-between align-center">
-      <div class="pre-btn" @click="goToPage('Chapter3')"><img src="../../../../resources/img/left.png" alt="" /></div>
+      <div class="pre-btn" @click="g[oToPage('Chapter3'), previousProblem]"><img
+          src="../../../../resources/img/left.png" alt="" /></div>
       <div class="content title-box">
         <p class="title mt25 title-bg">step3.</p>
         <div class="flex align-center mb30">

         </div>
         <button class="submit-button" @click="handleSubmit()">제출하기</button>
       </div>
-      <div class="next-btn" @click="goToPage('Chapter3_2')"><img src="../../../../resources/img/right.png" alt="" /></div>
+      <div class="next-btn" @click="[goToPage('Chapter3_2'), nextProblem()]"><img
+          src="../../../../resources/img/right.png" alt="" />
+      </div>
     </div>
   </div>
 </template>

   },
   methods: {
     goToPage(page) {
-      this.$router.push({ name: page });
+      // this.$router.push({ name: page });
     },
     startTimer() {
       if (this.intervalId) {

     handleSubmit() {
       console.log("선택된 번호 : ", this.selectedButton);
     },
+    nextProblem() {
+      this.$store.dispatch('goToNextProblem')
+      console.log('Current Problem Index:', this.currentProblemIndex);
+    },
+    previousProblem() {
+      this.$store.dispatch('goToPreviousProblem');
+    }
   },
   watch: {},
-  computed: {},
+  computed: {
+    currentLearningId() {
+      return this.$store.getters.currentLearningId;
+    },
+    currentLabel() {
+      return this.$store.getters.currentLabel;
+    },
+    currentProblemIndex() {
+      return this.$store.getters.currentProblemIndex;
+    }
+  },
+  created() {
+    console.log('Current Learning ID:', this.currentLearningId);
+    console.log('Current Label:', this.currentLabel);
+    console.log('Current Problem Index:', this.currentProblemIndex);
+
+    // Fetch or process the current problem based on `currentLearningId`
+  },
   components: {},
-  mounted() {},
+  mounted() { },
 };
 </script>
 <style scoped>
 .imgGroup {
   width: fit-content;
 }
+
 .imgGroup button {
   position: relative;
 }

79ed365

1ec5322

client/views/pages/main/Dashboard.vue

--- client/views/pages/main/Dashboard.vue

+++ client/views/pages/main/Dashboard.vue


                     </div>
                 </div>
                 <div class="lcon flex justify-between mb5">
-                    <div class="race-btn" @click="[goToPage('Chapter3'), storeLearningId(labeledItems[6].learning_id)]">
+                    <div class="race-btn" @click="[storeLearningId(labeledItems[6]), viewDetail(item)]">
                         <div class="rabbit-running"><img src="../../../resources/img/img09_s.png" alt=""
                                 :style="{ display: rabbitPos[7] ? 'block' : 'none' }"></div>
                         <button class="popTxt" v-for="(item, index) in items" :key="index" @click="toggleImage(index)"

                         </button>
                         <p>{{ labeledItems[6].label }}</p>
                     </div>
-                    <div class="race-btn" @click="[goToPage('Chapter6'), storeLearningId(labeledItems[5].learning_id)]">
+                    <div class="race-btn"
+                        @click="[goToPage('Chapter2_8'), storeLearningId(labeledItems[5].learning_id)]">
                         <div class="rabbit-running"><img src="../../../resources/img/img09_s.png" alt=""
                                 :style="{ display: rabbitPos[6] ? 'block' : 'none' }"></div>
                         <button class="popTxt" v-for="(item, index) in items" :key="index" @click="toggleImage(index)"

             ],
 
             isHeartFilled: false, // 하트가 채워졌는지 여부
+
+            problemType: null,
         }
     },
     methods: {

             // this.$router.push({ name: page, query: { unit_id, book_id } });
             this.$router.push({ name: page });
         },
-        storeLearningId(learningId) {
-            // console.log(learningId)
-            this.$store.dispatch('updateLearningId', learningId);
-            // console.log(this.$store.getters.getLearningId)
+        storeLearningId(labeledItems) {
+            this.$store.dispatch('updateLearningData', labeledItems)
+            if (labeledItems.label === "문제3") {
+                axios({
+                    url: "problem/problemInfo.json",
+                    method: "post",
+                    headers: {
+                        "Content-Type": "application/json; charset=UTF-8",
+                    },
+                    data: {
+                        prblmId: this.$store.getters.currentLearningId.prblm_id,
+                    },
+                })
+                    .then(response => {
+                        this.handleProblemDetail(response.data.problem);
+                        this.goToPage(this.problemType);
+                    })
+            }
+        },
+        handleProblemDetail(item) {
+            console.log(item);
+            if (item.prblmTypeId === "prblm_type_001") {
+                this.problemType = "Chapter3";
+            } else if (item.prblmTypeId === "prblm_type_002") {
+                this.problemType = "Chapter3_1";
+            } else if (item.prblmTypeId === "prblm_type_003") {
+                this.problemType = "Chapter3_2";
+            } else if (item.prblmTypeId === "prblm_type_004") {
+                this.problemType = "Chapter3_3";
+            } else if (item.prblmTypeId === "prblm_type_005") {
+                this.problemType = "Chapter3_3_1";
+            } else if (item.prblmTypeId === "prblm_type_006") {
+                this.problemType = "Chapter3_4";
+            } else if (item.prblmTypeId === "prblm_type_007") {
+                this.problemType = "Chapter3_5";
+            } else if (item.prblmTypeId === "prblm_type_008") {
+                this.problemType = "Chapter3_6";
+            } else if (item.prblmTypeId === "prblm_type_009") {
+                this.problemType = "Chapter3_7";
+            } else if (item.prblmTypeId === "prblm_type_010") {
+                this.problemType = "Chapter3_8";
+            } else if (item.prblmTypeId === "prblm_type_011") {
+                this.problemType = "Chapter3_9";
+            }
         },
         openCameraModal() {
             this.closeModal();

Add a comment

Open 0
Closed 0

List

...	...	@@ -9,7 +9,10 @@
9	9	schdlId: null,
10	10	bookId: null,
11	11	unitId: null,
12		- learningId: null,
	12	+ LearningId: null,
	13	+ currentLearningIds: [], // Stores multiple learning_ids (prblm_id)
	14	+ currentLabel: null,
	15	+ currentProblemIndex: 0,
13	16	},
14	17	getters: {
15	18	isLoggedIn(state) {
...	...	@@ -36,6 +39,11 @@
36	39	getLearningId(state) {
37	40	return state.learningId;
38	41	},
	42	+ currentLearningId(state) {
	43	+ return state.currentLearningIds[state.currentProblemIndex];
	44	+ },
	45	+ currentLabel: state => state.currentLabel,
	46	+ currentProblemIndex: state => state.currentProblemIndex
39	47	},
40	48	mutations: {
41	49	setToken(state, token) {
...	...	@@ -72,6 +80,21 @@
72	80	setLearningId(state, learningId) {
73	81	state.learningId = learningId;
74	82	},
	83	+ setLearningData(state, payload) {
	84	+ state.currentLearningIds = payload.learning_id; // Array of IDs
	85	+ state.currentLabel = payload.label;
	86	+ state.currentProblemIndex = 0; // Reset to the first problem
	87	+ },
	88	+ incrementProblemIndex(state) {
	89	+ if (state.currentProblemIndex < state.currentLearningIds.length - 1) {
	90	+ state.currentProblemIndex++;
	91	+ }
	92	+ },
	93	+ decrementProblemIndex(state) {
	94	+ if (state.currentProblemIndex > 0) {
	95	+ state.currentProblemIndex--;
	96	+ }
	97	+ }
75	98	},
76	99	actions: {
77	100	login({ commit }, token) {
...	...	@@ -109,5 +132,14 @@
109	132	updateLearningId({ commit }, learningId) {
110	133	commit("setLearningId", learningId);
111	134	},
	135	+ updateLearningData({ commit }, payload) {
	136	+ commit('setLearningData', payload);
	137	+ },
	138	+ goToNextProblem({ commit }) {
	139	+ commit('incrementProblemIndex');
	140	+ },
	141	+ goToPreviousProblem({ commit }) {
	142	+ commit('decrementProblemIndex');
	143	+ }
112	144	},
113	145	});

...	...	@@ -88,6 +88,7 @@
88	88	timer: "00",
89	89	selectedButton: null, // 선택한 버튼
90	90	prblm_id: [],
	91	+ unit_id: null,
91	92	};
92	93	},
93	94	methods: {
...	...	@@ -118,21 +119,18 @@
118	119	handleSubmit() {
119	120	console.log("선택된 번호 : ", this.selectedButton);
120	121	},
121		- storeProblemId() {
122		- this.prblm_id = this.$store.getters.getLearningId
123		- console.log("prblm_id", this.prblm_id)
124		- }
125	122	},
126	123	watch: {},
127	124	computed: {
128		- // learningId() {
129		- // this.$store.getters.getLearningId
130		- // },
	125	+ learningId() {
	126	+ return this.$store.getters.getLearningId
	127	+ },
	128	+ },
	129	+ created() {
	130	+ this.prblm_id = this.learningId
131	131	},
132	132	components: {},
133		- mounted() {
134		- this.storeProblemId();
135		- },
	133	+ mounted() { },
136	134	};
137	135	</script>
138	136	<style scoped>

...	...	@@ -10,7 +10,8 @@
10	10	<span class="subtitle">my name is dd</span>
11	11	</div>
12	12	<div class="flex justify-between align-center">
13		- <div class="pre-btn" @click="goToPage('Chapter3')"><img src="../../../../resources/img/left.png" alt="" /></div>
	13	+ <div class="pre-btn" @click="g[oToPage('Chapter3'), previousProblem]"><img
	14	+ src="../../../../resources/img/left.png" alt="" /></div>
14	15	<div class="content title-box">
15	16	<p class="title mt25 title-bg">step3.</p>
16	17	<div class="flex align-center mb30">
...	...	@@ -49,7 +50,9 @@
49	50	</div>
50	51	<button class="submit-button" @click="handleSubmit()">제출하기</button>
51	52	</div>
52		- <div class="next-btn" @click="goToPage('Chapter3_2')"><img src="../../../../resources/img/right.png" alt="" /></div>
	53	+ <div class="next-btn" @click="[goToPage('Chapter3_2'), nextProblem()]"><img
	54	+ src="../../../../resources/img/right.png" alt="" />
	55	+ </div>
53	56	</div>
54	57	</div>
55	58	</template>
...	...	@@ -66,7 +69,7 @@
66	69	},
67	70	methods: {
68	71	goToPage(page) {
69		- this.$router.push({ name: page });
	72	+ // this.$router.push({ name: page });
70	73	},
71	74	startTimer() {
72	75	if (this.intervalId) {
...	...	@@ -88,17 +91,42 @@
88	91	handleSubmit() {
89	92	console.log("선택된 번호 : ", this.selectedButton);
90	93	},
	94	+ nextProblem() {
	95	+ this.$store.dispatch('goToNextProblem')
	96	+ console.log('Current Problem Index:', this.currentProblemIndex);
	97	+ },
	98	+ previousProblem() {
	99	+ this.$store.dispatch('goToPreviousProblem');
	100	+ }
91	101	},
92	102	watch: {},
93		- computed: {},
	103	+ computed: {
	104	+ currentLearningId() {
	105	+ return this.$store.getters.currentLearningId;
	106	+ },
	107	+ currentLabel() {
	108	+ return this.$store.getters.currentLabel;
	109	+ },
	110	+ currentProblemIndex() {
	111	+ return this.$store.getters.currentProblemIndex;
	112	+ }
	113	+ },
	114	+ created() {
	115	+ console.log('Current Learning ID:', this.currentLearningId);
	116	+ console.log('Current Label:', this.currentLabel);
	117	+ console.log('Current Problem Index:', this.currentProblemIndex);
	118	+
	119	+ // Fetch or process the current problem based on `currentLearningId`
	120	+ },
94	121	components: {},
95		- mounted() {},
	122	+ mounted() { },
96	123	};
97	124	</script>
98	125	<style scoped>
99	126	.imgGroup {
100	127	width: fit-content;
101	128	}
	129	+
102	130	.imgGroup button {
103	131	position: relative;
104	132	}

...	...	@@ -41,7 +41,7 @@
41	41	</div>
42	42	</div>
43	43	<div class="lcon flex justify-between mb5">
44		- <div class="race-btn" @click="[goToPage('Chapter3'), storeLearningId(labeledItems[6].learning_id)]">
	44	+ <div class="race-btn" @click="[storeLearningId(labeledItems[6]), viewDetail(item)]">
45	45	<div class="rabbit-running"><img src="../../../resources/img/img09_s.png" alt=""
46	46	:style="{ display: rabbitPos[7] ? 'block' : 'none' }"></div>
47	47	<button class="popTxt" v-for="(item, index) in items" :key="index" @click="toggleImage(index)"
...	...	@@ -53,7 +53,8 @@
53	53	</button>
54	54	<p>{{ labeledItems[6].label }}</p>
55	55	</div>
56		- <div class="race-btn" @click="[goToPage('Chapter6'), storeLearningId(labeledItems[5].learning_id)]">
	56	+ <div class="race-btn"
	57	+ @click="[goToPage('Chapter2_8'), storeLearningId(labeledItems[5].learning_id)]">
57	58	<div class="rabbit-running"><img src="../../../resources/img/img09_s.png" alt=""
58	59	:style="{ display: rabbitPos[6] ? 'block' : 'none' }"></div>
59	60	<button class="popTxt" v-for="(item, index) in items" :key="index" @click="toggleImage(index)"
...	...	@@ -340,6 +341,8 @@
340	341	],
341	342
342	343	isHeartFilled: false, // 하트가 채워졌는지 여부
	344	+
	345	+ problemType: null,
343	346	}
344	347	},
345	348	methods: {
...	...	@@ -586,10 +589,50 @@
586	589	// this.$router.push({ name: page, query: { unit_id, book_id } });
587	590	this.$router.push({ name: page });
588	591	},
589		- storeLearningId(learningId) {
590		- // console.log(learningId)
591		- this.$store.dispatch('updateLearningId', learningId);
592		- // console.log(this.$store.getters.getLearningId)
	592	+ storeLearningId(labeledItems) {
	593	+ this.$store.dispatch('updateLearningData', labeledItems)
	594	+ if (labeledItems.label === "문제3") {
	595	+ axios({
	596	+ url: "problem/problemInfo.json",
	597	+ method: "post",
	598	+ headers: {
	599	+ "Content-Type": "application/json; charset=UTF-8",
	600	+ },
	601	+ data: {
	602	+ prblmId: this.$store.getters.currentLearningId.prblm_id,
	603	+ },
	604	+ })
	605	+ .then(response => {
	606	+ this.handleProblemDetail(response.data.problem);
	607	+ this.goToPage(this.problemType);
	608	+ })
	609	+ }
	610	+ },
	611	+ handleProblemDetail(item) {
	612	+ console.log(item);
	613	+ if (item.prblmTypeId === "prblm_type_001") {
	614	+ this.problemType = "Chapter3";
	615	+ } else if (item.prblmTypeId === "prblm_type_002") {
	616	+ this.problemType = "Chapter3_1";
	617	+ } else if (item.prblmTypeId === "prblm_type_003") {
	618	+ this.problemType = "Chapter3_2";
	619	+ } else if (item.prblmTypeId === "prblm_type_004") {
	620	+ this.problemType = "Chapter3_3";
	621	+ } else if (item.prblmTypeId === "prblm_type_005") {
	622	+ this.problemType = "Chapter3_3_1";
	623	+ } else if (item.prblmTypeId === "prblm_type_006") {
	624	+ this.problemType = "Chapter3_4";
	625	+ } else if (item.prblmTypeId === "prblm_type_007") {
	626	+ this.problemType = "Chapter3_5";
	627	+ } else if (item.prblmTypeId === "prblm_type_008") {
	628	+ this.problemType = "Chapter3_6";
	629	+ } else if (item.prblmTypeId === "prblm_type_009") {
	630	+ this.problemType = "Chapter3_7";
	631	+ } else if (item.prblmTypeId === "prblm_type_010") {
	632	+ this.problemType = "Chapter3_8";
	633	+ } else if (item.prblmTypeId === "prblm_type_011") {
	634	+ this.problemType = "Chapter3_9";
	635	+ }
593	636	},
594	637	openCameraModal() {
595	638	this.closeModal();

Delete comment