教程：点击音频播放按钮，当播放到句子开始时，点击开始时间的
记录
按钮；当播放到句子结束时，点击结束时间的
记录 按钮，最后再试听是否正确
@@ -539,8 +539,6 @@ function setStartTime(val: Sentence, i: number, j: number) {
diff --git a/src/pages/pc/article/practice-article/TypingArticle.vue b/src/pages/pc/article/practice-article/TypingArticle.vue
index b933cdef..bdb1eed9 100644
--- a/src/pages/pc/article/practice-article/TypingArticle.vue
+++ b/src/pages/pc/article/practice-article/TypingArticle.vue
@@ -6,7 +6,6 @@ import {usePracticeStore} from "@/stores/practice.ts";
import {useSettingStore} from "@/stores/setting.ts";
import {usePlayBeep, usePlayCorrect, usePlayKeyboardAudio, usePlayWordAudio} from "@/hooks/sound.ts";
import {emitter, EventKey} from "@/utils/eventBus.ts";
-import jq from 'jquery'
import {_nextTick} from "@/utils";
import '@imengyu/vue3-context-menu/lib/vue3-context-menu.css'
import ContextMenu from '@imengyu/vue3-context-menu'
@@ -75,7 +74,6 @@ const store = useBaseStore()
const statisticsStore = usePracticeStore()
const settingStore = useSettingStore()
-window.$ = jq
watch([() => sectionIndex, () => sentenceIndex, () => wordIndex, () => stringIndex], ([a, b, c,]) => {
checkCursorPosition(a, b, c)
})
@@ -97,18 +95,20 @@ watch(() => settingStore.translate, () => {
function checkCursorPosition(a = sectionIndex, b = sentenceIndex, c = wordIndex) {
// console.log('checkCursorPosition')
_nextTick(() => {
- let currentWord = jq(`.section:nth(${a}) .sentence:nth(${b}) .word:nth(${c})`)
- // console.log(a, b, c, currentWord)
- if (currentWord.length) {
- let end = currentWord.find('.word-end')
- // console.log(end)
- if (end.length) {
- let articleRect = articleWrapperRef.getBoundingClientRect()
+ // 选中目标元素
+ const currentWord = document.querySelector(`.section:nth-of-type(${a + 1}) .sentence:nth-of-type(${b + 1}) .word:nth-of-type(${c + 1})`);
+ if (currentWord) {
+ // 在 currentWord 内找 .word-end
+ const end = currentWord.querySelector('.word-end');
+ if (end) {
+ // 获取 articleWrapper 的位置
+ const articleRect = articleWrapperRef.getBoundingClientRect();
+ const endRect = end.getBoundingClientRect();
+ // 计算相对位置
cursor = {
- top: end.offset().top - articleRect.top,
- left: end.offset().left - articleRect.left,
- }
- // console.log(cursor)
+ top: endRect.top - articleRect.top,
+ left: endRect.left - articleRect.left,
+ };
}
}
},)
@@ -548,7 +548,7 @@ let showQuestions = $ref(false)
}
.hover-show {
- background: var(--color-main-active);
+ background: var(--color-select-bg);
color: white !important;
.wrote {
@@ -654,7 +654,7 @@ let showQuestions = $ref(false)
}
.word-start {
- color: var(--color-main-active);
+ color: var(--color-select-bg);
}
.wrong {
diff --git a/src/pages/pc/article/practice-article/index.vue b/src/pages/pc/article/practice-article/index.vue
index b4e5f704..93858319 100644
--- a/src/pages/pc/article/practice-article/index.vue
+++ b/src/pages/pc/article/practice-article/index.vue
@@ -53,6 +53,7 @@ function next() {
}
function init() {
+ //todo 这个页面，直接访问白屏
if (!store.currentBook.articles.length) return
articleData.articles = cloneDeep(store.currentBook.articles)
getCurrentPractice()
@@ -436,8 +437,6 @@ const {playSentenceAudio} = usePlaySentenceAudio()
flex-direction: column;
justify-content: space-between;
align-items: center;
- //padding-right: var(--practice-wrapper-padding-right);
- transform: translateX(var(--practice-wrapper-translateX));
}
.swiper-wrapper {
@@ -501,7 +500,7 @@ const {playSentenceAudio} = usePlaySentenceAudio()
width: 100%;
box-sizing: border-box;
border-radius: .6rem;
- background: var(--color-second-bg);
+ background: var(--color-second);
padding: .2rem var(--space) .4rem var(--space);
z-index: 2;
border: 1px solid var(--color-item-border);
diff --git a/src/pages/pc/components/AItem.vue b/src/pages/pc/components/AItem.vue
deleted file mode 100644
index 61f53715..00000000
--- a/src/pages/pc/components/AItem.vue
+++ /dev/null
@@ -1,153 +0,0 @@
-
-
-
-
-
-
-
-
- {{ item.word }}
- {{ item.phonetic0 }}
-
-
-
-
{{ (v.pos ? v.pos + '.' : '') + (v.cn) }}
-
-
-
-
-
-
-
-
-
-
diff --git a/src/pages/pc/components/BasePage.vue b/src/pages/pc/components/BasePage.vue
index 1df8a14a..caf80e03 100644
--- a/src/pages/pc/components/BasePage.vue
+++ b/src/pages/pc/components/BasePage.vue
@@ -4,7 +4,7 @@
-
diff --git a/src/pages/pc/components/CollectNotice.vue b/src/pages/pc/components/CollectNotice.vue
index 880b04ef..0b367cc4 100644
--- a/src/pages/pc/components/CollectNotice.vue
+++ b/src/pages/pc/components/CollectNotice.vue
@@ -103,7 +103,7 @@ watch(() => settingStore.load, (n) => {
display: flex;
flex-direction: column;
align-items: center;
- background: var(--color-second-bg);
+ background: var(--color-notice-bg);
padding: 1.8rem;
border-radius: 0.7rem;
width: 30rem;
@@ -124,7 +124,7 @@ watch(() => settingStore.load, (n) => {
}
.active {
- color: var(--color-main-active);
+ color: var(--color-select-bg);
}
.wrapper {
@@ -148,7 +148,7 @@ watch(() => settingStore.load, (n) => {
display: flex;
align-items: center;
justify-content: space-between;
- background: var(--color-main-bg);
+ background: var(--color-primary);
.href {
font-size: 0.9rem;
@@ -156,7 +156,7 @@ watch(() => settingStore.load, (n) => {
}
.star {
- color: var(--color-main-active);
+ color: var(--color-select-bg);
}
.right {
diff --git a/src/pages/pc/components/IconWrapper.vue b/src/pages/pc/components/IconWrapper.vue
index 305f5ea6..76fcce49 100644
--- a/src/pages/pc/components/IconWrapper.vue
+++ b/src/pages/pc/components/IconWrapper.vue
@@ -18,7 +18,6 @@ $w: 1.4rem;
border-radius: .3rem;
background: transparent;
transition: all .3s;
- //color: var(--color-main-active);
&:hover {
background: var(--color-primary);
@@ -30,4 +29,4 @@ $w: 1.4rem;
height: $w;
}
}
-
\ No newline at end of file
+
diff --git a/src/pages/pc/components/Input.vue b/src/pages/pc/components/Input.vue
index 2bc47f74..a918d6ec 100644
--- a/src/pages/pc/components/Input.vue
+++ b/src/pages/pc/components/Input.vue
@@ -70,7 +70,7 @@ const vFocus = {
}
&.focus {
- border: 1px solid var(--color-main-active);
+ border: 1px solid var(--color-select-bg);
:deep(svg) {
color: gray;
diff --git a/src/pages/pc/components/Panel.vue b/src/pages/pc/components/Panel.vue
index 01287944..beb2bd4b 100644
--- a/src/pages/pc/components/Panel.vue
+++ b/src/pages/pc/components/Panel.vue
@@ -219,7 +219,7 @@ $header-height: 3rem;
.panel {
border-radius: .5rem;
width: var(--panel-width);
- background: var(--color-second-bg);
+ background: var(--color-second);
height: 100%;
display: flex;
flex-direction: column;
@@ -257,7 +257,7 @@ $header-height: 3rem;
color: gray;
&.active {
- color: var(--color-main-active);
+ color: var(--color-select-bg);
font-weight: bold;
}
}
diff --git a/src/pages/pc/components/Setting.vue b/src/pages/pc/components/Setting.vue
index 6088bc84..65292e0c 100644
--- a/src/pages/pc/components/Setting.vue
+++ b/src/pages/pc/components/Setting.vue
@@ -499,7 +499,6 @@ function importData(e) {
}
.content {
- background: var(--color-header-bg);
flex: 1;
height: 100%;
overflow: auto;
@@ -539,7 +538,7 @@ function importData(e) {
border: 1px solid gray;
border-radius: .2rem;
padding: 0 .3rem;
- background: var(--color-second-bg);
+ background: var(--color-second);
color: var(--color-font-1);
}
}
diff --git a/src/pages/pc/components/dialog/Dialog.vue b/src/pages/pc/components/dialog/Dialog.vue
index 6e266986..d62bd09a 100644
--- a/src/pages/pc/components/dialog/Dialog.vue
+++ b/src/pages/pc/components/dialog/Dialog.vue
@@ -279,7 +279,7 @@ $header-height: 4rem;
.modal {
position: relative;
- background: var(--color-second-bg);
+ background: var(--color-second);
overflow: hidden;
display: flex;
flex-direction: column;
diff --git a/src/pages/pc/components/dialog/MiniDialog.vue b/src/pages/pc/components/dialog/MiniDialog.vue
index a839c07b..2dde7836 100644
--- a/src/pages/pc/components/dialog/MiniDialog.vue
+++ b/src/pages/pc/components/dialog/MiniDialog.vue
@@ -59,7 +59,7 @@ watch(() => props.modelValue, (n) => {
position: absolute;
z-index: 9;
width: 12rem;
- background: var(--color-second-bg);
+ background: var(--color-second);
border-radius: .5rem;
box-shadow: 0 0 8px 2px var(--color-item-border);
padding: .6rem var(--space);
diff --git a/src/pages/pc/components/list/List.vue b/src/pages/pc/components/list/List.vue
index 0ad220f3..8efacdfe 100644
--- a/src/pages/pc/components/list/List.vue
+++ b/src/pages/pc/components/list/List.vue
@@ -203,4 +203,4 @@ defineExpose({scrollBottom})
}
}
}
-
\ No newline at end of file
+
diff --git a/src/pages/pc/index.vue b/src/pages/pc/index.vue
index ff22c8b1..beae0e23 100644
--- a/src/pages/pc/index.vue
+++ b/src/pages/pc/index.vue
@@ -19,10 +19,10 @@ const {toggleTheme} = useTheme()
-
+
-
+
@@ -78,11 +78,11 @@ const {toggleTheme} = useTheme()
width: 100%;
height: 100%;
display: flex;
- background: var(--color-background);
+ background: var(--color-primary);
}
.aside {
- background: var(--color-second-bg);
+ background: var(--color-second);
height: 100vh;
padding: 1rem 1rem;
box-sizing: border-box;
@@ -91,7 +91,6 @@ const {toggleTheme} = useTheme()
justify-content: space-between;
box-shadow: rgb(0 0 0 / 3%) 0px 0px 12px 0px;
width: 4.5rem;
- transition: all 0.3s;
z-index: 2;
.row {
diff --git a/src/pages/pc/word/WordHomePage.vue b/src/pages/pc/word/WordHomePage.vue
index f444e3eb..70f17bda 100644
--- a/src/pages/pc/word/WordHomePage.vue
+++ b/src/pages/pc/word/WordHomePage.vue
@@ -172,7 +172,7 @@ const progressTextRight = $computed(() => {
-
+
{{ store.sdict.name || '请选择书籍开始学习' }}
{
每日目标
+ class="bg-third px-2 h-10 flex center text-2xl rounded cursor-pointer">
{{ store.sdict.id ? store.sdict.perDayStudyNumber : 0 }}
个单词
更改
开始学习
开始学习
diff --git a/src/pages/pc/word/components/Footer.vue b/src/pages/pc/word/components/Footer.vue
index bd768991..c401de5b 100644
--- a/src/pages/pc/word/components/Footer.vue
+++ b/src/pages/pc/word/components/Footer.vue
@@ -206,7 +206,7 @@ const progress = $computed(() => {
width: 100%;
box-sizing: border-box;
border-radius: .6rem;
- background: var(--color-second-bg);
+ background: var(--color-second);
padding: .2rem var(--space) .4rem var(--space);
z-index: 2;
border: 1px solid var(--color-item-border);
diff --git a/uno.config.ts b/uno.config.ts
index 653f0475..754bc5f6 100644
--- a/uno.config.ts
+++ b/uno.config.ts
@@ -1,23 +1,15 @@
// uno.config.ts
-import {defineConfig, presetUno} from 'unocss'
+import {defineConfig, presetWind3} from 'unocss'
export default defineConfig({
- content: {
-
- pipeline: {
- include: [
- './src/**/*.{html,vue,ts,js}',
- './index.html',
- ],
- exclude: [
- './node_modules/**/*',
- './dist/**/*',
- './.pnpm/**/*',
- './.output/**/*',
- ],
- },
+ shortcuts: {
+ 'bg-primary': 'bg-[var(--color-primary)]',
+ 'bg-second': 'bg-[var(--color-second)]',
+ 'bg-third': 'bg-[var(--color-third)]',
+ 'bg-card-active': 'bg-[var(--color-card-active)]',
+ 'color-main': 'color-[var(--color-main-text)]',
},
presets: [
- presetUno(),
+ presetWind3(),
],
})
diff --git a/vite.config.ts b/vite.config.ts
index 8eac2dfa..5d8129ef 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -58,11 +58,6 @@ async function getConfig() {
var: 'VueRouter',
path: `https://cdn.jsdelivr.net/npm/vue-router@4.5.1/dist/vue-router.global.prod.min.js`
},
- {
- name: 'jquery',
- var: 'jQuery',
- path: 'https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js'
- },
// {
// name: 'axios',
// var: 'axios',
@@ -92,7 +87,7 @@ async function getConfig() {
},
server: {
port: 3000,
- open: true,
+ open: false,
host: '0.0.0.0',
fs: {
strict: false,