feat(practise):完善下错题复习功能，优化部分代码

heming-system/src/main/java/dev/heming/enstudy/controller/api/BookController.java

@@ -40,6 +40,12 @@ public CommonResult<Book> getWord() {
         return CommonResult.success(bookService.getWord());
     }
 
+    @GetMapping("/getWorkWord")
+    @Operation(summary = "获取错题本单个单词")
+    public CommonResult<Book> getWorkWord() {
+        return CommonResult.success(bookService.getWorkWord());
+    }
+
     @GetMapping("/getWordList")
     @Operation(summary = "获取单词列表")
     public CommonResult<List<Book>> getWordList() {

heming-system/src/main/java/dev/heming/enstudy/mapper/UserWrongWordMapper.java

@@ -31,4 +31,13 @@ UserWrongWord selectByUserIdAndBookIdAndWordId(@Param("userId") Long userId,
                                                    @Param("bookId") String bookId,
                                                    @Param("wordId") Long wordId);
 
+    /**
+     * 查询用户错题本单个单词 id
+     * @param userId 用户 id
+     * @param bookId 词典 id
+     * @return 单词 id
+     */
+    Long selectWordIdByUserIdAndBookId(@Param("userId") Long userId,
+                                       @Param("bookId") String bookId);
+
 }

heming-system/src/main/java/dev/heming/enstudy/mongo/service/BookService.java

@@ -26,6 +26,12 @@ public interface BookService {
      */
     Book getWord();
 
+    /**
+     * 获取当前用户活动词典对应的错题本的下一个单词信息
+     * @return 单词信息
+     */
+    Book getWorkWord();
+
     /**
      * 获取当前用户活动词典的单词学习列表
      * @return 单词信息列表

heming-system/src/main/java/dev/heming/enstudy/mongo/service/impl/BookServiceImpl.java

@@ -14,6 +14,7 @@
 import dev.heming.enstudy.mongo.service.BookService;
 import dev.heming.enstudy.common.param.book.GetBookParam;
 import dev.heming.enstudy.service.UserBookDictService;
+import dev.heming.enstudy.service.WordService;
 import lombok.RequiredArgsConstructor;
 import lombok.extern.slf4j.Slf4j;
 import org.springframework.data.mongodb.core.MongoTemplate;
@@ -43,6 +44,7 @@ public class BookServiceImpl implements BookService {
     private final UserBookDictService userBookDictService;
     private final UserWorkActionsMapper userWorkActionsMapper;
     private final WordMapper wordMapper;
+    private final WordService wordService;
     private final UserBookDictMapper userBookDictMapper;
     private final UserWrongWordMapper userWrongWordMapper;
     private final RedisTemplate<String, Object> redisTemplate;
@@ -68,16 +70,18 @@ public Book getWord() {
         Assert.notNull(userDict, "还未选择词典！");
         UserWorkActions actions = userWorkActionsMapper.selectByUserIdAndBookId(userId, userDict.getBookId());
         Assert.notNull(actions, "未生成学习数据，请联系管理员！");
-        Word word = wordMapper.selectById(actions.getWordId());
-        Assert.notNull(word, "单词数据不存在，请联系管理员！");
-        Query query = new Query(
-                Criteria
-                        .where("bookId").is(userDict.getBookId())
-                        .and("wordRank").is(word.getWordRank())
-                        .and("headWord").is(word.getHeadWord())
-        );
-        Book result = mongoTemplate.findOne(query, Book.class);
-        return result;
+        return wordService.getWordByWordIdAndBookId(actions.getWordId(), userDict.getBookId());
+    }
+
+    @Override
+    public Book getWorkWord() {
+        // TODO 优化
+        long userId = StpUtil.getLoginIdAsLong();
+        UserBookDictVo userDict = userBookDictService.getUserDict();
+        Assert.notNull(userDict, "还未选择词典！");
+        Long wordId = userWrongWordMapper.selectWordIdByUserIdAndBookId(userId, userDict.getBookId());
+        Assert.notNull(wordId, "当前错题本暂无错题！");
+        return wordService.getWordByWordIdAndBookId(wordId, userDict.getBookId());
     }
 
     @Override

heming-system/src/main/java/dev/heming/enstudy/service/WordService.java

@@ -1,6 +1,7 @@
 package dev.heming.enstudy.service;
 
 import com.baomidou.mybatisplus.extension.service.IService;
+import dev.heming.enstudy.common.entity.Book;
 import dev.heming.enstudy.common.entity.Word;
 import dev.heming.enstudy.common.vo.console.ConsoleVo;
 
@@ -34,4 +35,12 @@ public interface WordService extends IService<Word> {
      */
     ConsoleVo getConsoleInfo();
 
+    /**
+     * 获取单词
+     * @param wordId 单词表 id
+     * @param bookId 词典 id
+     * @return 单词数据
+     */
+    Book getWordByWordIdAndBookId(Long wordId, String bookId);
+
 }

heming-system/src/main/java/dev/heming/enstudy/service/impl/WordServiceImpl.java

@@ -3,6 +3,7 @@
 import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
 import com.github.pagehelper.PageHelper;
 import dev.heming.enstudy.common.constant.CacheConstants;
+import dev.heming.enstudy.common.entity.Book;
 import dev.heming.enstudy.common.entity.Word;
 import dev.heming.enstudy.common.vo.console.ConsoleVo;
 import dev.heming.enstudy.mapper.BookDictMapper;
@@ -11,8 +12,12 @@
 import dev.heming.enstudy.service.WordService;
 import lombok.RequiredArgsConstructor;
 import org.springframework.cache.annotation.Cacheable;
+import org.springframework.data.mongodb.core.MongoTemplate;
+import org.springframework.data.mongodb.core.query.Criteria;
+import org.springframework.data.mongodb.core.query.Query;
 import org.springframework.data.redis.core.RedisTemplate;
 import org.springframework.stereotype.Service;
+import org.springframework.util.Assert;
 
 import java.util.List;
 import java.util.Optional;
@@ -27,6 +32,7 @@
 @RequiredArgsConstructor
 public class WordServiceImpl extends ServiceImpl<WordMapper, Word> implements WordService {
 
+    private final MongoTemplate mongoTemplate;
     private final UserMapper userMapper;
     private final BookDictMapper bookDictMapper;
     private final RedisTemplate<String, Object> redisTemplate;
@@ -58,4 +64,18 @@ public ConsoleVo getConsoleInfo() {
                 );
     }
 
+    @Override
+    public Book getWordByWordIdAndBookId(Long wordId, String bookId) {
+        // TODO 优化
+        Word word = this.baseMapper.selectById(wordId);
+        Assert.notNull(word, "单词数据不存在，请联系管理员！");
+        Query query = new Query(
+                Criteria
+                        .where("bookId").is(bookId)
+                        .and("wordRank").is(word.getWordRank())
+                        .and("headWord").is(word.getHeadWord())
+        );
+        return mongoTemplate.findOne(query, Book.class);
+    }
+
 }

heming-system/src/main/resources/mapper/UserWrongWordMapper.xml

@@ -54,4 +54,19 @@
             word_id =#{wordId}
     </select>
 
+    <select id="selectWordIdByUserIdAndBookId" resultType="java.lang.Long">
+        SELECT
+            word_id
+        FROM
+            enstudy_user_wrong_word
+        WHERE
+            del = 1
+        AND
+            user_id = #{userId}
+        AND
+            book_id = #{bookId}
+        <!-- TODO 查询条件补全 -->
+        LIMIT 1
+    </select>
+
 </mapper>

heming-web/pages/practise.vue

@@ -1,5 +1,75 @@
 <script setup lang="ts">
 const router = useRouter()
+const nuxtApp = useNuxtApp()
+const wordInfo = ref({})
+const loading = ref(false)
+const phrases = ref([])
+const exam = ref([])
+
+const data = reactive({
+  form: {},
+  actionsParam: {
+    wordJsonId: '',
+    bookId: '',
+    wordRank: 0,
+    headWord: '',
+    state: 0,
+  },
+})
+
+const getWorkWord = async () => {
+  loading.value = true
+  const json = await nuxtApp.$api.get('/@api/book/getWorkWord').json();
+  if (json.code === 200) {
+    wordInfo.value = json.data
+    console.log(json.data)
+    if (json.data?.content?.word?.content?.phrase?.phrases) {
+      phrases.value = json.data.content.word.content.phrase.phrases
+    }
+    if (json.data?.content?.word?.content?.exam) {
+      exam.value = json.data.content.word.content.exam
+    }
+  } else {
+    console.log(json.message)
+  }
+  loading.value = false
+}
+
+const handleActions = async (state: number) => {
+  loading.value = true
+  data.actionsParam.state = state
+  data.actionsParam.wordJsonId = wordInfo.value.id
+  data.actionsParam.bookId = wordInfo.value.bookId
+  data.actionsParam.wordRank = wordInfo.value.wordRank
+  data.actionsParam.headWord = wordInfo.value.headWord
+  const json = await nuxtApp.$api.post('/@api/book/actions', {
+    json: data.actionsParam
+  }).json();
+  if (json.code === 200) {
+    await getWorkWord()
+  } else {
+    console.log(json.message)
+  }
+  loading.value = false
+}
+
+const handleAudio = (type: number) => {
+  if (type === 1) {
+    const audio = document.getElementById('ukAudio')
+    audio.play()
+  } else {
+    const audio = document.getElementById('usAudio')
+    audio.play()
+  }
+}
+
+onBeforeMount(async () => {
+  await getWorkWord()
+})
+
+onMounted(() => {
+  loading.value = false
+})
 
 definePageMeta({
   layout: 'learn',
@@ -14,11 +84,78 @@ definePageMeta({
         <v-app-bar-nav-icon icon="mdi-arrow-left" @click="router.push('/learn')"></v-app-bar-nav-icon>
       </template>
 
-      <v-app-bar-title>错题训练</v-app-bar-title>
+      <v-app-bar-title>错题训练(开发中)</v-app-bar-title>
     </v-app-bar>
     <div pt18 px2>
-      开发中...
+      <v-no-ssr>
+        <v-card
+          :loading="loading"
+          mx-auto w-full sm:w-160
+        >
+          <template v-slot:title>
+            <div space-x-2>
+              {{ wordInfo.headWord }}
+              <UBadge color="black" cursor-pointer @click="handleAudio(2)"><span dark:text-black>美[{{ wordInfo.content?.word?.content?.usphone || '' }}]</span></UBadge>
+              <UBadge cursor-pointer @click="handleAudio(1)"><span dark:text-black>英[{{ wordInfo.content?.word?.content?.ukphone  || '' }}]</span></UBadge>
+            </div>
+          </template>
+
+          <v-card-text>
+            <v-list lines="one">
+              <v-list-item
+                v-for="item in wordInfo.content?.word?.content?.trans"
+                :key="item"
+                :title="item.pos + '. ' + item.tranCn"
+                :subtitle="item.tranOther"
+              ></v-list-item>
+            </v-list>
+          </v-card-text>
+
+          <v-card-actions>
+            <v-btn
+              color="green-accent-3"
+              variant="text"
+              @click="handleActions(1)"
+            >
+              这下学会了
+            </v-btn>
+            <v-btn
+                color="deep-orange-accent-3"
+                variant="text"
+                @click="handleActions(0)"
+            >
+              忘了
+            </v-btn>
+
+            <v-spacer></v-spacer>
+
+            <v-btn>
+              反馈(开发中)
+            </v-btn>
+          </v-card-actions>
+          <div>
+            <v-list lines="one" v-show="Array.isArray(phrases) && phrases.length > 0">
+              <v-list-item
+                  v-for="item in phrases.slice(0, 3)"
+                  :key="item"
+                  :title="item.pContent + ' ' + item.pCn"
+              ></v-list-item>
+            </v-list>
+            <v-spacer v-show="Array.isArray(exam) && exam.length > 0"></v-spacer>
+            <div v-show="Array.isArray(exam) && exam.length > 0" px-4 py-2 space-y-2>
+              <div v-for="item in exam" :key="item">
+                <UAlert
+                    :description="item.question"
+                    :avatar="{ src: 'https://besscroft.com/uploads/avatar.jpeg' }"
+                />
+              </div>
+            </div>
+          </div>
+        </v-card>
+      </v-no-ssr>
     </div>
+    <audio id="ukAudio" v-show="false" controls :src="`https://dict.youdao.com/dictvoice?audio=${wordInfo.headWord}&type=1`" />
+    <audio id="usAudio" v-show="false" controls :src="`https://dict.youdao.com/dictvoice?audio=${wordInfo.headWord}&type=2`" />
   </div>
 </template>