PsHooN7979
2024-08-23
240823 박세훈 Chapter3 문제들 수정
@33a2bd707a9411394ce6eb4446e4b6a8d239b65c
--- client/views/pages/main/Chapter/Chapter3.vue
+++ client/views/pages/main/Chapter/Chapter3.vue
... | ... | @@ -53,24 +53,6 @@ |
| 53 | 53 |
<p>{{ item.prblmDtlExpln }}</p>
|
| 54 | 54 |
</div> |
| 55 | 55 |
</article> |
| 56 |
- <!-- <article class="flex justify-center mb50" style="gap: 60px"> |
|
| 57 |
- <div class="flex" @click="handleClick(2)"> |
|
| 58 |
- <button> |
|
| 59 |
- <img src="../../../../resources/img/img136_71s.png" alt="" /> |
|
| 60 |
- <p :class="{ active: selectedButton === 2 }">2</p>
|
|
| 61 |
- </button> |
|
| 62 |
- <p>violin</p> |
|
| 63 |
- </div> |
|
| 64 |
- </article> |
|
| 65 |
- <article class="flex justify-center" style="gap: 60px"> |
|
| 66 |
- <div class="flex" @click="handleClick(3)"> |
|
| 67 |
- <button> |
|
| 68 |
- <img src="../../../../resources/img/img136_71s.png" alt="" /> |
|
| 69 |
- <p :class="{ active: selectedButton === 3 }">3</p>
|
|
| 70 |
- </button> |
|
| 71 |
- <p>piano</p> |
|
| 72 |
- </div> |
|
| 73 |
- </article> --> |
|
| 74 | 56 |
</div> |
| 75 | 57 |
</div> |
| 76 | 58 |
<button class="submit-button" @click="handleSubmit()">제출하기</button> |
... | ... | @@ -119,9 +101,7 @@ |
| 119 | 101 |
}, |
| 120 | 102 |
handleClick(answer) {
|
| 121 | 103 |
console.log(answer) |
| 122 |
- this.$store.dispatch('updatePrblmAns', answer);
|
|
| 123 | 104 |
this.selectedButton = answer; |
| 124 |
- |
|
| 125 | 105 |
}, |
| 126 | 106 |
// 제출하기 버튼 |
| 127 | 107 |
handleSubmit() {
|
... | ... | @@ -156,6 +136,7 @@ |
| 156 | 136 |
prblmAns: this.selectedButton |
| 157 | 137 |
} |
| 158 | 138 |
this.$store.dispatch('saveProblemData', problemData);
|
| 139 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 159 | 140 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 160 | 141 |
this.$store.dispatch('goToNextProblem');
|
| 161 | 142 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_1.vue
+++ client/views/pages/main/Chapter/Chapter3_1.vue
... | ... | @@ -32,16 +32,16 @@ |
| 32 | 32 |
</div> |
| 33 | 33 |
<div class="pickGroup"> |
| 34 | 34 |
<div class="flex" style="gap: 250px"> |
| 35 |
- <article class="text-ct" @click="handleClick(1)"> |
|
| 35 |
+ <article class="text-ct" @click="handleClick('A')">
|
|
| 36 | 36 |
<div class="mb30"><img src="../../../../resources/img/img107_50s.png" alt="" /></div> |
| 37 | 37 |
<button class="popTxt"> |
| 38 |
- <img :src="selectedButton === 1 ? selectedbuttonImg : buttonImg" alt="" /> |
|
| 38 |
+ <img :src="selectedButton === 'A' ? selectedbuttonImg : buttonImg" alt="" /> |
|
| 39 | 39 |
</button> |
| 40 | 40 |
</article> |
| 41 |
- <article class="text-ct" @click="handleClick(2)"> |
|
| 41 |
+ <article class="text-ct" @click="handleClick('B')">
|
|
| 42 | 42 |
<div class="mb30"><img src="../../../../resources/img/img108_50s.png" alt="" /></div> |
| 43 | 43 |
<button class="popTxt"> |
| 44 |
- <img :src="selectedButton === 2 ? selectedbuttonImg : buttonImg" alt="" /> |
|
| 44 |
+ <img :src="selectedButton === 'B' ? selectedbuttonImg : buttonImg" alt="" /> |
|
| 45 | 45 |
</button> |
| 46 | 46 |
</article> |
| 47 | 47 |
</div> |
... | ... | @@ -124,6 +124,7 @@ |
| 124 | 124 |
prblmAns: this.selectedButton |
| 125 | 125 |
} |
| 126 | 126 |
this.$store.dispatch('saveProblemData', problemData);
|
| 127 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 127 | 128 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 128 | 129 |
this.$store.dispatch('goToNextProblem');
|
| 129 | 130 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_10.vue
+++ client/views/pages/main/Chapter/Chapter3_10.vue
... | ... | @@ -116,6 +116,7 @@ |
| 116 | 116 |
prblmAns: this.selectedButton |
| 117 | 117 |
} |
| 118 | 118 |
this.$store.dispatch('saveProblemData', problemData);
|
| 119 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 119 | 120 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 120 | 121 |
this.$store.dispatch('goToNextProblem');
|
| 121 | 122 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_11.vue
+++ client/views/pages/main/Chapter/Chapter3_11.vue
... | ... | @@ -115,6 +115,7 @@ |
| 115 | 115 |
prblmAns: this.selectedButton |
| 116 | 116 |
} |
| 117 | 117 |
this.$store.dispatch('saveProblemData', problemData);
|
| 118 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 118 | 119 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 119 | 120 |
this.$store.dispatch('goToNextProblem');
|
| 120 | 121 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_12.vue
+++ client/views/pages/main/Chapter/Chapter3_12.vue
... | ... | @@ -149,6 +149,7 @@ |
| 149 | 149 |
prblmAns: this.selectedButton |
| 150 | 150 |
} |
| 151 | 151 |
this.$store.dispatch('saveProblemData', problemData);
|
| 152 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 152 | 153 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 153 | 154 |
this.$store.dispatch('goToNextProblem');
|
| 154 | 155 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_13.vue
+++ client/views/pages/main/Chapter/Chapter3_13.vue
... | ... | @@ -54,10 +54,10 @@ |
| 54 | 54 |
</div> |
| 55 | 55 |
|
| 56 | 56 |
<div class="pickGroup right"> |
| 57 |
- <article v-for="(word, index) in question" :key="index" class="flex align-center justify-start mb20" |
|
| 58 |
- style="gap: 30px"> |
|
| 57 |
+ <article v-for="(word, index) in problemDetail" :key="index" |
|
| 58 |
+ class="flex align-center justify-start mb20" style="gap: 30px"> |
|
| 59 | 59 |
<button class="blue-c" @click="selectRight(index, $event)"></button> |
| 60 |
- <p class="word">{{ word }}</p>
|
|
| 60 |
+ <p class="word">{{ word.prblmDtlExpln }}</p>
|
|
| 61 | 61 |
</article> |
| 62 | 62 |
</div> |
| 63 | 63 |
</div> |
... | ... | @@ -185,6 +185,7 @@ |
| 185 | 185 |
prblmAns: this.selectedButton |
| 186 | 186 |
} |
| 187 | 187 |
this.$store.dispatch('saveProblemData', problemData);
|
| 188 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 188 | 189 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 189 | 190 |
this.$store.dispatch('goToNextProblem');
|
| 190 | 191 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_14.vue
+++ client/views/pages/main/Chapter/Chapter3_14.vue
... | ... | @@ -42,7 +42,7 @@ |
| 42 | 42 |
</div> |
| 43 | 43 |
<button class="submit-button" @click="handleSubmit()">제출하기</button> |
| 44 | 44 |
</div> |
| 45 |
- <div class="next-btn" @click="nextProblem()"><img src="../../../../resources/img/right.png" alt="" /> |
|
| 45 |
+ <div class="next-btn" @click="nextProblem(answer)"><img src="../../../../resources/img/right.png" alt="" /> |
|
| 46 | 46 |
</div> |
| 47 | 47 |
</div> |
| 48 | 48 |
</div> |
... | ... | @@ -76,9 +76,6 @@ |
| 76 | 76 |
} |
| 77 | 77 |
}, 1000); |
| 78 | 78 |
}, |
| 79 |
- handleSubmit() {
|
|
| 80 |
- console.log("정답 : ", this.answer);
|
|
| 81 |
- }, |
|
| 82 | 79 |
getProblem() {
|
| 83 | 80 |
const vm = this; |
| 84 | 81 |
const prblmId = this.currentLearningId.prblm_id; |
... | ... | @@ -101,13 +98,14 @@ |
| 101 | 98 |
console.log("problem - error : ", error);
|
| 102 | 99 |
}); |
| 103 | 100 |
}, |
| 104 |
- nextProblem() {
|
|
| 101 |
+ nextProblem(answer) {
|
|
| 105 | 102 |
const problemData = {
|
| 106 | 103 |
prblmImfo: this.currentLearningId, |
| 107 | 104 |
prblmNumber: this.currentProblemIndex, |
| 108 |
- prblmAns: this.selectedButton |
|
| 105 |
+ prblmAns: answer |
|
| 109 | 106 |
} |
| 110 | 107 |
this.$store.dispatch('saveProblemData', problemData);
|
| 108 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 111 | 109 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 112 | 110 |
this.$store.dispatch('goToNextProblem');
|
| 113 | 111 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_15.vue
+++ client/views/pages/main/Chapter/Chapter3_15.vue
... | ... | @@ -101,6 +101,7 @@ |
| 101 | 101 |
prblmAns: this.selectedButton |
| 102 | 102 |
} |
| 103 | 103 |
this.$store.dispatch('saveProblemData', problemData);
|
| 104 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 104 | 105 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 105 | 106 |
this.$store.dispatch('goToNextProblem');
|
| 106 | 107 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_2.vue
+++ client/views/pages/main/Chapter/Chapter3_2.vue
... | ... | @@ -131,6 +131,7 @@ |
| 131 | 131 |
prblmAns: this.selectedButton |
| 132 | 132 |
} |
| 133 | 133 |
this.$store.dispatch('saveProblemData', problemData);
|
| 134 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 134 | 135 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 135 | 136 |
this.$store.dispatch('goToNextProblem');
|
| 136 | 137 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_3.vue
+++ client/views/pages/main/Chapter/Chapter3_3.vue
... | ... | @@ -31,14 +31,14 @@ |
| 31 | 31 |
</div> |
| 32 | 32 |
<div class="pickGroup mt60 flex align-center justify-center" |
| 33 | 33 |
style="flex-wrap: wrap; gap: 100px; margin-top: 7%; margin-left: 5%"> |
| 34 |
- <article v-for="(detail, index) in problemDetail" :key="index" |
|
| 34 |
+ <article v-for="(item, index) in problemDetail" :key="index" |
|
| 35 | 35 |
style="flex: 1 0 calc(50% - 100px); bottom: 159px; left: 242px"> |
| 36 |
- <div class="flex align-center" @click="handleClick(item)"> |
|
| 36 |
+ <div class="flex align-center" @click="handleClick(item.prblmDtlExpln)"> |
|
| 37 | 37 |
<button> |
| 38 | 38 |
<img src="../../../../resources/img/img136_71s.png" alt="" /> |
| 39 |
- <p :class="{ active: selectedButton === item }">{{ index + 1 }}</p>
|
|
| 39 |
+ <p :class="{ active: selectedButton === item.prblmDtlExpln }">{{ index + 1 }}</p>
|
|
| 40 | 40 |
</button> |
| 41 |
- <p>{{ detail.prblmDtlExpln }}</p>
|
|
| 41 |
+ <p>{{ item.prblmDtlExpln }}</p>
|
|
| 42 | 42 |
</div> |
| 43 | 43 |
</article> |
| 44 | 44 |
</div> |
... | ... | @@ -120,6 +120,7 @@ |
| 120 | 120 |
prblmAns: this.selectedButton |
| 121 | 121 |
} |
| 122 | 122 |
this.$store.dispatch('saveProblemData', problemData);
|
| 123 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 123 | 124 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 124 | 125 |
this.$store.dispatch('goToNextProblem');
|
| 125 | 126 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_3_1.vue
+++ client/views/pages/main/Chapter/Chapter3_3_1.vue
... | ... | @@ -137,6 +137,7 @@ |
| 137 | 137 |
prblmAns: this.selectedButton |
| 138 | 138 |
} |
| 139 | 139 |
this.$store.dispatch('saveProblemData', problemData);
|
| 140 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 140 | 141 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 141 | 142 |
this.$store.dispatch('goToNextProblem');
|
| 142 | 143 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_4.vue
+++ client/views/pages/main/Chapter/Chapter3_4.vue
... | ... | @@ -42,10 +42,10 @@ |
| 42 | 42 |
<article v-for="(item, index) in problemDetail" :key="index" |
| 43 | 43 |
style="flex: 1 0 calc(50% - 100px); bottom: 159px; left: 242px"> |
| 44 | 44 |
<div class="flex align-center"> |
| 45 |
- <button @click="submitAnswer(item)"> |
|
| 45 |
+ <button @click="handleClick(item.prblmDtlExpln)"> |
|
| 46 | 46 |
<img src="../../../../resources/img/img136_71s.png" alt="" /> |
| 47 | 47 |
<p :class="{
|
| 48 |
- active: answer === item.prblmDtlExpln, |
|
| 48 |
+ active: selectedButton === item.prblmDtlExpln, |
|
| 49 | 49 |
}"> |
| 50 | 50 |
{{ index + 1 }}
|
| 51 | 51 |
</p> |
... | ... | @@ -53,37 +53,11 @@ |
| 53 | 53 |
<p>{{ item.prblmDtlExpln }}</p>
|
| 54 | 54 |
</div> |
| 55 | 55 |
</article> |
| 56 |
- <!-- <article style="gap: 60px; bottom: 159px; right: 559px"> |
|
| 57 |
- <div class="flex align-center"> |
|
| 58 |
- <button> |
|
| 59 |
- <img |
|
| 60 |
- src="../../../../resources/img/img136_71s.png" |
|
| 61 |
- alt="" |
|
| 62 |
- /> |
|
| 63 |
- <p>2</p> |
|
| 64 |
- </button> |
|
| 65 |
- <p>b</p> |
|
| 66 |
- </div> |
|
| 67 |
- </article> |
|
| 68 |
- <article style="gap: 60px; bottom: 159px; right: 559px"> |
|
| 69 |
- <div class="flex align-center"> |
|
| 70 |
- <button> |
|
| 71 |
- <img |
|
| 72 |
- src="../../../../resources/img/img136_71s.png" |
|
| 73 |
- alt="" |
|
| 74 |
- /> |
|
| 75 |
- <p>3</p> |
|
| 76 |
- </button> |
|
| 77 |
- <p>c</p> |
|
| 78 |
- </div> |
|
| 79 |
- </article> --> |
|
| 80 | 56 |
</div> |
| 81 | 57 |
</div> |
| 82 | 58 |
<button class="submit-button" @click="handleSubmit()">제출하기</button> |
| 83 | 59 |
</div> |
| 84 |
- <div class="next-btn" @click=" |
|
| 85 |
- nextProblem() |
|
| 86 |
- "> |
|
| 60 |
+ <div class="next-btn" @click="nextProblem()"> |
|
| 87 | 61 |
<img src="../../../../resources/img/right.png" alt="" /> |
| 88 | 62 |
</div> |
| 89 | 63 |
</div> |
... | ... | @@ -101,7 +75,7 @@ |
| 101 | 75 |
dataList: [], |
| 102 | 76 |
prblmExpln: null, |
| 103 | 77 |
accessTime: null, |
| 104 |
- answer: null, |
|
| 78 |
+ selectedButton: null, |
|
| 105 | 79 |
}; |
| 106 | 80 |
}, |
| 107 | 81 |
methods: {
|
... | ... | @@ -125,6 +99,9 @@ |
| 125 | 99 |
const audio = document.getElementById("audio-player");
|
| 126 | 100 |
audio.play(); |
| 127 | 101 |
console.log("playing");
|
| 102 |
+ }, |
|
| 103 |
+ handleClick(number) {
|
|
| 104 |
+ this.selectedButton = number; |
|
| 128 | 105 |
}, |
| 129 | 106 |
handleSubmit() {
|
| 130 | 107 |
console.log("정답 : ", this.answer);
|
... | ... | @@ -158,6 +135,7 @@ |
| 158 | 135 |
prblmAns: this.selectedButton |
| 159 | 136 |
} |
| 160 | 137 |
this.$store.dispatch('saveProblemData', problemData);
|
| 138 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 161 | 139 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 162 | 140 |
this.$store.dispatch('goToNextProblem');
|
| 163 | 141 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_5.vue
+++ client/views/pages/main/Chapter/Chapter3_5.vue
... | ... | @@ -136,6 +136,7 @@ |
| 136 | 136 |
prblmAns: this.selectedButton |
| 137 | 137 |
} |
| 138 | 138 |
this.$store.dispatch('saveProblemData', problemData);
|
| 139 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 139 | 140 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 140 | 141 |
this.$store.dispatch('goToNextProblem');
|
| 141 | 142 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_6.vue
+++ client/views/pages/main/Chapter/Chapter3_6.vue
... | ... | @@ -34,13 +34,24 @@ |
| 34 | 34 |
<img src="../../../../resources/img/img114_57s.png" alt="" /> |
| 35 | 35 |
</div> --> |
| 36 | 36 |
|
| 37 |
- <div class="flex justify-center"> |
|
| 38 |
- <div class="btnGroup mt50 flex justify-between"> |
|
| 39 |
- <button class="popTxt" v-for="(item, index) in items" :key="index" @click="updateContent(index)" |
|
| 40 |
- :class="{ active: selectedIndex === index }">
|
|
| 41 |
- <img :src="item.imgSrc1" /> |
|
| 42 |
- <img :src="item.imgSrc2" v-if="selectedIndex === index" style="display: block" /> |
|
| 43 |
- </button> |
|
| 37 |
+ <div class="pickGroup flex align-center justify-center" |
|
| 38 |
+ style="flex-wrap: wrap; gap: 100px; margin-top: 7%; margin-left: 5%"> |
|
| 39 |
+ <div class="pickGroup flex align-center justify-center" |
|
| 40 |
+ style="flex-wrap: wrap; gap: 100px; margin-top: 7%; margin-left: 5%"> |
|
| 41 |
+ <article v-for="(item, index) in problemDetail" :key="index" |
|
| 42 |
+ style="flex: 1 0 calc(50% - 100px); bottom: 159px; left: 242px"> |
|
| 43 |
+ <div class="flex align-center"> |
|
| 44 |
+ <button @click="handleClick(item.prblmDtlExpln)"> |
|
| 45 |
+ <img src="../../../../resources/img/img136_71s.png" alt="" /> |
|
| 46 |
+ <p :class="{
|
|
| 47 |
+ active: selectedButton === item.prblmDtlExpln, |
|
| 48 |
+ }"> |
|
| 49 |
+ {{ index + 1 }}
|
|
| 50 |
+ </p> |
|
| 51 |
+ </button> |
|
| 52 |
+ <p>{{ item.prblmDtlExpln }}</p>
|
|
| 53 |
+ </div> |
|
| 54 |
+ </article> |
|
| 44 | 55 |
</div> |
| 45 | 56 |
</div> |
| 46 | 57 |
<button class="submit-button" @click="handleSubmit()">제출하기</button> |
... | ... | @@ -69,6 +80,7 @@ |
| 69 | 80 |
intervalId: null, |
| 70 | 81 |
dataList: [], |
| 71 | 82 |
problemDetail: [], |
| 83 |
+ selectedButton: null, |
|
| 72 | 84 |
}; |
| 73 | 85 |
}, |
| 74 | 86 |
beforeDestroy() {
|
... | ... | @@ -96,6 +108,9 @@ |
| 96 | 108 |
clearInterval(this.intervalId); |
| 97 | 109 |
} |
| 98 | 110 |
}, 1000); |
| 111 |
+ }, |
|
| 112 |
+ handleClick(number) {
|
|
| 113 |
+ this.selectedButton = number; |
|
| 99 | 114 |
}, |
| 100 | 115 |
handleSubmit() {
|
| 101 | 116 |
console.log("정답 : ", this.selectedIndex + 1);
|
... | ... | @@ -134,6 +149,7 @@ |
| 134 | 149 |
prblmAns: this.selectedButton |
| 135 | 150 |
} |
| 136 | 151 |
this.$store.dispatch('saveProblemData', problemData);
|
| 152 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 137 | 153 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 138 | 154 |
this.$store.dispatch('goToNextProblem');
|
| 139 | 155 |
this.handleProblemDetail(this.currentLearningId); |
... | ... | @@ -239,6 +255,29 @@ |
| 239 | 255 |
left: 0; |
| 240 | 256 |
} |
| 241 | 257 |
|
| 258 |
+.pickGroup p {
|
|
| 259 |
+ font-size: 34px; |
|
| 260 |
+ font-weight: bold; |
|
| 261 |
+} |
|
| 262 |
+ |
|
| 263 |
+.pickGroup button {
|
|
| 264 |
+ position: relative; |
|
| 265 |
+ margin-right: 30px; |
|
| 266 |
+} |
|
| 267 |
+ |
|
| 268 |
+.pickGroup button p {
|
|
| 269 |
+ font-size: 34px; |
|
| 270 |
+ color: #c6c6c6; |
|
| 271 |
+ position: absolute; |
|
| 272 |
+ top: 50%; |
|
| 273 |
+ left: 50%; |
|
| 274 |
+ transform: translate(-50%, -50%); |
|
| 275 |
+} |
|
| 276 |
+ |
|
| 277 |
+.pickGroup button p.active {
|
|
| 278 |
+ color: #000000; |
|
| 279 |
+} |
|
| 280 |
+ |
|
| 242 | 281 |
.submit-button {
|
| 243 | 282 |
position: absolute; |
| 244 | 283 |
background-color: #ffba08; |
--- client/views/pages/main/Chapter/Chapter3_7.vue
+++ client/views/pages/main/Chapter/Chapter3_7.vue
... | ... | @@ -44,7 +44,7 @@ |
| 44 | 44 |
<div class="flex align-center"> |
| 45 | 45 |
<button @click="handleCheck('O')" name="O">
|
| 46 | 46 |
<img src="../../../../resources/img/img136_71s.png" alt="" /> |
| 47 |
- <p :class="{ active: answer === 'O' }">1</p>
|
|
| 47 |
+ <p :class="{ active: selectedButton === 'O' }">1</p>
|
|
| 48 | 48 |
</button> |
| 49 | 49 |
<img src="../../../../resources/img/img111_56s.png" alt="" /> |
| 50 | 50 |
</div> |
... | ... | @@ -53,7 +53,7 @@ |
| 53 | 53 |
<div class="flex align-center"> |
| 54 | 54 |
<button @click="handleCheck('X')" name="X">
|
| 55 | 55 |
<img src="../../../../resources/img/img136_71s.png" alt="" /> |
| 56 |
- <p :class="{ active: answer === 'X' }">2</p>
|
|
| 56 |
+ <p :class="{ active: selectedButton === 'X' }">2</p>
|
|
| 57 | 57 |
</button> |
| 58 | 58 |
<img src="../../../../resources/img/img112_56s.png" alt="" /> |
| 59 | 59 |
</div> |
... | ... | @@ -63,9 +63,7 @@ |
| 63 | 63 |
</div> |
| 64 | 64 |
<button class="submit-button" @click="handleSubmit()">제출하기</button> |
| 65 | 65 |
</div> |
| 66 |
- <div class="next-btn" @click=" |
|
| 67 |
- nextProblem() |
|
| 68 |
- "> |
|
| 66 |
+ <div class="next-btn" @click="nextProblem()"> |
|
| 69 | 67 |
<img src="../../../../resources/img/right.png" alt="" /> |
| 70 | 68 |
</div> |
| 71 | 69 |
</div> |
... | ... | @@ -84,7 +82,7 @@ |
| 84 | 82 |
dataList: [], |
| 85 | 83 |
prblmExpln: null, |
| 86 | 84 |
accessTime: null, |
| 87 |
- answer: null, |
|
| 85 |
+ selectedButton: null, |
|
| 88 | 86 |
prblmLogAnsCnt: 0, |
| 89 | 87 |
}; |
| 90 | 88 |
}, |
... | ... | @@ -107,11 +105,11 @@ |
| 107 | 105 |
}, |
| 108 | 106 |
|
| 109 | 107 |
handleCheck(value) {
|
| 110 |
- this.answer = value; |
|
| 111 |
- console.log(this.answer); |
|
| 108 |
+ this.selectedButton = value; |
|
| 109 |
+ console.log(this.selectedButton); |
|
| 112 | 110 |
}, |
| 113 | 111 |
handleSubmit() {
|
| 114 |
- console.log("정답 : ", this.answer);
|
|
| 112 |
+ console.log("정답 : ", this.selectedButton);
|
|
| 115 | 113 |
}, |
| 116 | 114 |
getProblem() {
|
| 117 | 115 |
const vm = this; |
... | ... | @@ -142,6 +140,7 @@ |
| 142 | 140 |
prblmAns: this.selectedButton |
| 143 | 141 |
} |
| 144 | 142 |
this.$store.dispatch('saveProblemData', problemData);
|
| 143 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 145 | 144 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 146 | 145 |
this.$store.dispatch('goToNextProblem');
|
| 147 | 146 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_8.vue
+++ client/views/pages/main/Chapter/Chapter3_8.vue
... | ... | @@ -146,6 +146,7 @@ |
| 146 | 146 |
prblmAns: this.selectedButton |
| 147 | 147 |
} |
| 148 | 148 |
this.$store.dispatch('saveProblemData', problemData);
|
| 149 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 149 | 150 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 150 | 151 |
this.$store.dispatch('goToNextProblem');
|
| 151 | 152 |
this.handleProblemDetail(this.currentLearningId); |
--- client/views/pages/main/Chapter/Chapter3_9.vue
+++ client/views/pages/main/Chapter/Chapter3_9.vue
... | ... | @@ -149,6 +149,7 @@ |
| 149 | 149 |
prblmAns: this.selectedButton |
| 150 | 150 |
} |
| 151 | 151 |
this.$store.dispatch('saveProblemData', problemData);
|
| 152 |
+ console.log(this.$store.getters.getAllProblems) |
|
| 152 | 153 |
if (this.currentProblemIndex < this.$store.state.currentLearningIds.length - 1) {
|
| 153 | 154 |
this.$store.dispatch('goToNextProblem');
|
| 154 | 155 |
this.handleProblemDetail(this.currentLearningId); |
Add a comment
Delete comment
Once you delete this comment, you won't be able to recover it. Are you sure you want to delete this comment?