feat[problem]submit status follow

serfend · May 23, 2022 · 94cf473 · 94cf473
1 parent 71b7317
commit 94cf473
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 15 deletions.
diff --git a/src/views/problems/Problem/ProblemBase/ProblemHeader/index.vue b/src/views/problems/Problem/ProblemBase/ProblemHeader/index.vue
@@ -54,14 +54,16 @@ export default {
       this.$emit('update:showAnswer', show)
     },
     practice_submit ({ is_right, is_manual, answer }) {
-      if (this.beenSolved) {
+      if (this.beenSolved && !is_manual) {
         this.$message.warning('已提交过答案啦')
         return
       }
-      if (!is_right) this.$message.error((is_manual ? '不会做' : '做错了') + '，仔细看看哦~')
-      else this.$message.success(is_manual ? '我会做！' : '做对啦~')
-      this.requireShowAnswer()
-      this.beenSolved = true
+      if (!this.beenSolved) {
+        if (!is_right) this.$message.error((is_manual ? '不会做' : '做错了') + '，仔细看看哦~')
+        else this.$message.success(is_manual ? '我会做！' : '做对啦~')
+        this.requireShowAnswer()
+        this.beenSolved = true
+      }
       this.$emit('onAnswer', { is_right, is_manual, answer })
     }
   }

diff --git a/src/views/problems/Problem/ProblemBase/index.vue b/src/views/problems/Problem/ProblemBase/index.vue
@@ -1,6 +1,6 @@
 <template>
   <el-card
-    :style="{ 'box-shadow': iFocus ? '0 2px 12px 0 #0ff7f0' : null }"
+    :style="{ 'box-shadow': styleBoxShadow }"
     class="base-card"
     @mouseenter.native="onMouseEnter"
     @mouseleave.native="onMouseLeave"
@@ -24,7 +24,9 @@
 
 <script>
 import { statistics_problem } from './statistics'
+import { problemColorSet } from '../type_dispatch'
 import api from '@/api/problems'
+import { debounce } from '@/utils'
 export default {
   name: 'ProblemBase',
   components: {
@@ -44,7 +46,9 @@ export default {
     lastEnter: 0,
     time_spent: 0,
     mouse_active: false,
-    reset_index: true
+    reset_index: true,
+    is_right: null,
+    styleBoxShadow: null
   }),
   computed: {
     options () {
@@ -56,18 +60,38 @@ export default {
     current_database () {
       return this.$store.state.problems.current_database
     },
-    iFocus () {
-      return this.focus || this.mouse_active
+    requireUpdateBoxShadow() {
+      return debounce(() => {
+        this.update_box_shadow()
+      }, 2e2)
     }
   },
   watch: {
     userAnswerConfirmResult: {
       handler (val) {
         this.$emit('update:completed', val ? new Date() : null)
       }
-    }
+    },
+    mouse_active() { this.requireUpdateBoxShadow() },
+    focus() { this.requireUpdateBoxShadow() },
+    is_right() { this.requireUpdateBoxShadow() },
   },
   methods: {
+    update_box_shadow() {
+      const get_color = () => {
+        const { mouse_active, focus, is_right } = this
+        if (is_right === null) {
+          if (mouse_active) return `0 2px 12px 0 ${problemColorSet.mouse_focus}`
+          if (focus) return `0 2px 12px 0 ${problemColorSet.focus}`
+          return null
+        }
+        const t = '0 4px 12px 0 '
+        const r = `${t}${is_right ? problemColorSet.answer_right : problemColorSet.answer_wrong}`
+        console.log('change to ', r)
+        return r
+      }
+      this.styleBoxShadow = get_color()
+    },
     reset () {
       this.showAnswer = false
       this.userAnswerResult = null
@@ -95,16 +119,17 @@ export default {
       this.time_spent += d
     },
     onAnswer ({ is_right, is_manual, answer }) {
+      if (this.is_right === null || this.is_right) this.is_right = is_right
+      const is_confirm_submit = !(this.userAnswerResult === null)
       this.userAnswerResult = is_right
       this.user_answer = answer
-      // 当做对了 且 开启了急速过题 且是正常提交答案，则直接跳过该题显示答案
-      if (is_right && this.lighting_mode && !is_manual) return this.onAnswerResult({ is_right, is_manual })
-      if (!is_right) this.update_problem({ is_right: false, is_manual })
+      // 当 是确认答案 或 (做对了 且 开启了急速过题 且是正常提交答案)，则直接跳过该题显示答案
+      if (is_confirm_submit || (is_right && this.lighting_mode && !is_manual)) return this.onAnswerResult({ is_right, is_manual, answer })
     },
     onAnswerResult ({ is_right, is_manual, answer }) {
-      console.log('onAnswerResult', is_right, is_manual, answer)
+      if (this.is_right === null || this.is_right) this.is_right = is_right
+      console.warn('onAnswerResult', is_right, is_manual, answer)
       this.userAnswerConfirmResult = true
-      if (this.userAnswerResult === false) return
       this.showAnswer = false
       console.log('update_problem', is_right, is_manual, answer)
       this.update_problem({ is_right, is_manual, answer })

diff --git a/src/views/problems/Problem/type_dispatch.js b/src/views/problems/Problem/type_dispatch.js
@@ -12,3 +12,10 @@ export function getTypeName (type) {
   const r = t.split('_').map(i => handle_single(i))
   return `Problem${r.join('')}`
 }
+
+export const problemColorSet = {
+  focus: '#0ff7f0',
+  mouse_focus: '#000ce6',
+  answer_right: '#1bdb0d',
+  answer_wrong: '#e60800'
+}