AMAZEHOME/TypeWords
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix:remove @iconify/vue

Browse Source
This commit is contained in:
zyronon
2025-08-17 04:30:31 +08:00
parent 41a72dfb28
commit 4183219522
36 changed files with 740 additions and 290 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/BaseButton.vue
View File

@@ -1,6 +1,5 @@
<script setup lang="ts">
import Tooltip from "@/pages/pc/components/base/Tooltip.vue";
import {Icon} from "@iconify/vue";
interface IProps {
keyboard?: string,
@@ -32,14 +31,14 @@ defineEmits(['click'])
(disabled||loading) && 'disabled',
]">
<span :style="{opacity:loading?0:1}"><slot></slot></span>
<Icon v-if="loading"
class="loading"
icon="eos-icons:loading"
width="18"
:color="type === 'info'?'#000000':'#ffffff'"
<IconEosIconsLoading
v-if="loading"
class="loading"
width="18"
:color="type === 'info'?'#000000':'#ffffff'"
/>
<div class="key-notice" v-if="keyboard">
<Icon icon="bi:keyboard" width="14" color="#ffffff"/>
<IconBiKeyboard width="14" color="#ffffff"/>
<span class="key">{{ keyboard }}</span>
</div>
</div>

6
src/components/BaseIcon.vue
View File

@@ -1,11 +1,9 @@
<script setup lang="ts">
import Tooltip from "@/pages/pc/components/base/Tooltip.vue";
import {Icon} from "@iconify/vue";
defineProps<{
title?: string,
icon: string,
disabled?: boolean,
noBg?: boolean,
}>()
@@ -22,7 +20,7 @@ const emit = defineEmits(['click'])
class="icon-wrapper"
:class="{disabled,noBg}"
>
<Icon :icon="icon"/>
<slot/>
</div>
</Tooltip>
</template>
@@ -45,7 +43,7 @@ $w: 1.4rem;
&:hover:not(.disabled,.noBg) {
background: var(--color-icon-hightlight);
svg {
:deep(svg) {
color: white;
}
}

15
src/components/icon/BackIcon.vue
View File

@@ -1,15 +0,0 @@
<script setup lang="ts">
import {Icon} from "@iconify/vue";
</script>
<template>
<Icon
class="back-icon"
icon="octicon:arrow-left-24" width="22"
/>
</template>
<style scoped lang="scss">
</style>

3
src/components/icon/Close.vue
View File

@@ -13,8 +13,7 @@ defineProps<{
@click="$emit('click')"
>
<Tooltip :title="title">
<Icon icon="carbon:close-outline"
/>
<IconCarbonCloseOutline/>
</Tooltip>
</div>
</template>

11
src/components/icon/DeleteIcon.vue
View File

@@ -1,12 +1,5 @@
<script setup lang="ts">
import {Icon} from "@iconify/vue";
</script>
<script setup lang="ts"></script>
<template>
<Icon icon="solar:trash-bin-minimalistic-linear" width="20"/>
<IconSolarTrashBinMinimalisticLinear/>
</template>
<style scoped lang="scss">
</style>

13
src/pages/pc/Setting.vue
View File

@@ -1,5 +1,4 @@
<script setup lang="ts">
import {Icon} from '@iconify/vue';
import {ref, watch} from "vue";
import {useSettingStore} from "@/stores/setting.ts";
import {getAudioFileUrl, useChangeAllSound, usePlayAudio, useWatchAllSound} from "@/hooks/sound.ts";
@@ -136,27 +135,27 @@ function importData(e) {
<div class="left mt-10">
<div class="tabs">
<div class="tab" :class="tabIndex === 0 && 'active'" @click="tabIndex = 0">
<Icon icon="bx:headphone" width="20"/>
<IconBxHeadphone width="20"/>
<span>音效设置</span>
</div>
<div class="tab" :class="tabIndex === 1 && 'active'" @click="tabIndex = 1">
<Icon icon="icon-park-outline:setting-config" width="20"/>
<IconIconParkOutlineSettingConfig width="20"/>
<span>练习设置</span>
</div>
<div class="tab" :class="tabIndex === 2 && 'active'" @click="tabIndex = 2">
<Icon icon="material-symbols:keyboard-outline" width="20"/>
<IconMaterialSymbolsKeyboardOutline width="20"/>
<span>快捷键设置</span>
</div>
<div class="tab" :class="tabIndex === 3 && 'active'" @click="tabIndex = 3">
<Icon icon="mdi:database-cog-outline" width="20"/>
<IconMdiDatabaseCogOutline width="20"/>
<span>数据管理</span>
</div>
<div class="tab" :class="tabIndex === 4 && 'active'" @click="tabIndex = 4">
<Icon icon="mingcute:service-fill" width="20"/>
<IconMingcuteServiceFill width="20"/>
<span>反馈</span>
</div>
<div class="tab" :class="tabIndex === 5 && 'active'" @click="tabIndex = 5">
<Icon icon="mdi:about-circle-outline" width="20"/>
<IconMdiAboutCircleOutline width="20"/>
<span>关于</span>
</div>
</div>

14
src/pages/pc/article/ArticleHomePage.vue
View File

@@ -1,6 +1,5 @@
<script setup lang="ts">
import {useBaseStore} from "@/stores/base.ts";
import {Icon} from '@iconify/vue'
import {useRouter} from "vue-router";
import BasePage from "@/pages/pc/components/BasePage.vue";
import {_getDictDataByUrl, useNav} from "@/utils";
@@ -14,6 +13,7 @@ import BaseButton from "@/components/BaseButton.vue";
import PopConfirm from "@/pages/pc/components/PopConfirm.vue";
import {onMounted, watch} from "vue";
import {getDefaultDict} from "@/types/func.ts";
import DeleteIcon from "@/components/icon/DeleteIcon.vue";
const {nav} = useNav()
const base = useBaseStore()
@@ -95,8 +95,10 @@ async function goBookDetail(val: DictResource) {
@click="goBookDetail(base.currentBook)">{{
base.currentBook.name || '请选择书籍开始学习'
}}</span>
<BaseIcon @click="router.push('/book-list')"
:icon="base.currentBook.name ? 'gg:arrows-exchange':'fluent:add-20-filled'"/>
<BaseIcon @click="router.push('/book-list')">
<IconGgArrowsExchange v-if="base.currentBook.name"/>
<IconFluentAdd20Filled v-else/>
</BaseIcon>
</div>
<BaseButton
size="large"
@@ -105,7 +107,7 @@ async function goBookDetail(val: DictResource) {
>
<div class="flex items-center gap-2">
<span>开始学习</span>
<Icon icon="icons8:right-round" class="text-2xl"/>
<IconIcons8RightRound class="text-2xl"/>
</div>
</BaseButton>
</div>
@@ -118,7 +120,9 @@ async function goBookDetail(val: DictResource) {
<div class="title">我的书籍</div>
<div class="flex gap-4 items-center">
<PopConfirm title="确认删除所有选中书籍？" @confirm="handleBatchDel" v-if="selectIds.length">
<BaseIcon class="del" title="删除" icon="solar:trash-bin-minimalistic-linear"/>
<BaseIcon class="del" title="删除" >
<DeleteIcon/>
</BaseIcon>
</PopConfirm>
<div class="color-blue cursor-pointer" v-if="base.article.bookList.length > 1"

7
src/pages/pc/article/BatchEditArticlePage.vue
View File

@@ -12,9 +12,9 @@ import {MessageBox} from "@/utils/MessageBox.tsx";
import {useRuntimeStore} from "@/stores/runtime.ts";
import {nanoid} from "nanoid";
import EditArticle from "@/pages/pc/article/components/EditArticle.vue";
import BaseIcon from "@/components/BaseIcon.vue";
import Toast from '@/pages/pc/components/base/toast/Toast.ts'
import {getDefaultArticle} from "@/types/func.ts";
import BackIcon from "@/pages/pc/components/BackIcon.vue";
const emit = defineEmits<{
importData: [val: Event]
@@ -161,10 +161,7 @@ useWindowClick(() => showExport = false)
<div class="add-article">
<div class="aslide">
<header class="flex justify-between items-center">
<BaseIcon
title="返回"
@click="$router.back"
icon="formkit:left"/>
<BackIcon/>
<div class="text-xl">{{ runtimeStore.editDict.name }}</div>
</header>
<List

17
src/pages/pc/article/BookDetail.vue
View File

@@ -93,7 +93,7 @@ const {
<div class="absolute text-2xl text-align-center w-full">{{ runtimeStore.editDict.name }}</div>
<div class="flex">
<BaseButton :loading="studyLoading||loading" type="info" @click="isEdit = true">编辑</BaseButton>
<BaseButton type="info" @click="router.push('batch-edit-article')">文章管理</BaseButton>
<BaseButton type="info" @click="router.push('batch-edit-article')">文章管理</BaseButton>
<BaseButton :loading="studyLoading||loading" @click="addMyStudyList">学习</BaseButton>
</div>
</div>
@@ -110,15 +110,12 @@ const {
:active-id="selectArticle.id">
<template v-slot:suffix="{item,index}">
<BaseIcon
v-if="!isArticleCollect(item)"
class="collect"
@click="toggleArticleCollect(item)"
title="收藏" icon="ph:star"/>
<BaseIcon
v-else
class="fill"
@click="toggleArticleCollect(item)"
title="取消收藏" icon="ph:star-fill"/>
:class="!isArticleCollect(item)?'collect':'fill'"
@click.stop="toggleArticleCollect(item)"
:title="!isArticleCollect(item) ? '收藏' : '取消收藏'">
<IconPhStar v-if="!isArticleCollect(item)"/>
<IconPhStarFill v-else/>
</BaseIcon>
</template>
</ArticleList>
<Empty v-else/>

5
src/pages/pc/article/BookList.vue
View File

@@ -59,8 +59,9 @@ const searchList = computed<any[]>(() => {
<div class="py-1 flex flex-1 justify-end" v-else>
<span class="page-title absolute w-full center">书籍列表</span>
<BaseIcon @click="showSearchInput = true"
class="z-1"
icon="fluent:search-24-regular"/>
class="z-1">
<IconFluentSearch24Regular/>
</BaseIcon>
</div>
</div>
<div class="mt-4" v-if="searchKey">

7
src/pages/pc/article/EditArticlePage.vue
View File

@@ -1,15 +1,12 @@
<script setup lang="ts">
import EditArticle from "@/pages/pc/article/components/EditArticle.vue";
import BaseIcon from "@/components/BaseIcon.vue";
import BackIcon from "@/pages/pc/components/BackIcon.vue";
</script>
<template>
<div class="h-screen">
<BaseIcon
title="返回"
@click="$router.back"
icon="formkit:left"/>
<BackIcon/>
<EditArticle class="vue"></EditArticle>
</div>

47
src/pages/pc/article/StudyArticle.vue
View File

@@ -20,7 +20,6 @@ import Panel from "@/pages/pc/components/Panel.vue";
import ArticleList from "@/pages/pc/components/list/ArticleList.vue";
import EditSingleArticleModal from "@/pages/pc/article/components/EditSingleArticleModal.vue";
import Tooltip from "@/pages/pc/components/base/Tooltip.vue";
import {Icon} from "@iconify/vue";
import ConflictNotice from "@/pages/pc/components/ConflictNotice.vue";
const store = useBaseStore()
@@ -270,15 +269,12 @@ const {playSentenceAudio} = usePlaySentenceAudio()
:list="articleData.list ">
<template v-slot:suffix="{item,index}">
<BaseIcon
v-if="!isArticleCollect(item)"
class="collect"
@click="toggleArticleCollect(item)"
title="收藏" icon="ph:star"/>
<BaseIcon
v-else
class="fill"
@click="toggleArticleCollect(item)"
title="取消收藏" icon="ph:star-fill"/>
:class="!isArticleCollect(item) ? 'collect' : 'fill'"
@click.stop="toggleArticleCollect(item)"
:title="!isArticleCollect(item) ? '收藏' : '取消收藏'">
<IconPhStar v-if="!isArticleCollect(item)"/>
<IconPhStarFill v-else/>
</BaseIcon>
</template>
</ArticleList>
</div>
@@ -293,7 +289,7 @@ const {playSentenceAudio} = usePlaySentenceAudio()
</div>
<div class="footer" :class="!settingStore.showToolbar && 'hide'">
<Tooltip :title="settingStore.showToolbar?'收起':'展开'">
<Icon icon="icon-park-outline:down"
<IconIconParkOutlineDown
@click="settingStore.showToolbar = !settingStore.showToolbar"
class="arrow"
:class="!settingStore.showToolbar && 'down'"
@@ -321,21 +317,29 @@ const {playSentenceAudio} = usePlaySentenceAudio()
<div class="flex gap-2 center">
<BaseIcon
:title="`下一句(${settingStore.shortcutKeyMap[ShortcutKey.Next]})`"
icon="icon-park-outline:go-ahead"
@click="skip"/>
@click="skip">
<IconIconParkOutlineGoAhead/>
</BaseIcon>
<BaseIcon
:title="`重听(${settingStore.shortcutKeyMap[ShortcutKey.PlayWordPronunciation]})`"
icon="fluent:replay-16-filled"
@click="play"/>
@click="play">
<IconFluentReplay16Filled/>
</BaseIcon>
<BaseIcon
@click="settingStore.dictation = !settingStore.dictation"
:title="`开关默写模式(${settingStore.shortcutKeyMap[ShortcutKey.ToggleDictation]})`"
:icon="['majesticons:eye-off-line','mdi:eye-outline'][settingStore.dictation?0:1]"/>
>
<IconMajesticonsEyeOffLine v-if="settingStore.dictation"/>
<IconMdiEyeOutline v-else/>
</BaseIcon>
<BaseIcon :icon="['mdi:translate','mdi:translate-off'][settingStore.translate?0:1]"
:title="`开关释义显示(${settingStore.shortcutKeyMap[ShortcutKey.ToggleShowTranslate]})`"
@click="settingStore.translate = !settingStore.translate"/>
<BaseIcon
:title="`开关释义显示(${settingStore.shortcutKeyMap[ShortcutKey.ToggleShowTranslate]})`"
@click="settingStore.translate = !settingStore.translate">
<IconMdiTranslate v-if="settingStore.translate"/>
<IconMdiTranslateOff v-else/>
</BaseIcon>
<!-- <BaseIcon-->
<!-- :title="`编辑(${settingStore.shortcutKeyMap[ShortcutKey.EditArticle]})`"-->
@@ -344,8 +348,9 @@ const {playSentenceAudio} = usePlaySentenceAudio()
<!-- />-->
<BaseIcon
@click="settingStore.showPanel = !settingStore.showPanel"
:title="`面板(${settingStore.shortcutKeyMap[ShortcutKey.TogglePanel]})`"
icon="tdesign:menu-unfold"/>
:title="`面板(${settingStore.shortcutKeyMap[ShortcutKey.TogglePanel]})`">
<IconTdesignMenuUnfold/>
</BaseIcon>
</div>
</div>
</div>

51
src/pages/pc/article/components/EditArticle.vue
View File

@@ -3,7 +3,6 @@
import {Article, Sentence, TranslateEngine} from "@/types/types.ts";
import BaseButton from "@/components/BaseButton.vue";
import EditAbleText from "@/pages/pc/components/EditAbleText.vue";
import {Icon} from "@iconify/vue";
import {getNetworkTranslate, getSentenceAllText, getSentenceAllTranslateText} from "@/hooks/translate.ts";
import {genArticleSectionData, splitCNArticle2, splitEnArticle2, usePlaySentenceAudio} from "@/hooks/article.ts";
import {_nextTick, _parseLRC, cloneDeep, last} from "@/utils";
@@ -295,7 +294,7 @@ function setStartTime(val: Sentence, i: number, j: number) {
</textarea>
<div class="justify-end items-center flex">
<Tooltip>
<Icon icon="ri:question-line" class="mr-3" width="20"/>
<IconRiQuestionLine class="mr-3" width="20"/>
<template #reference>
<div>
<div class="mb-2">使用方法</div>
@@ -357,7 +356,7 @@ function setStartTime(val: Sentence, i: number, j: number) {
</div>
<div class="flex items-center">
<Tooltip>
<Icon icon="ri:question-line" class="mr-3" width="20"/>
<IconRiQuestionLine class="mr-3" width="20"/>
<template #reference>
<div>
<div class="mb-2">使用方法</div>
@@ -421,9 +420,11 @@ function setStartTime(val: Sentence, i: number, j: number) {
<div>{{ sentence.audioPosition?.[0] ?? 0 }}s</div>
<BaseIcon
@click="setStartTime(sentence,indexI,indexJ)"
:icon="indexI === 0 && indexJ === 0 ?'ic:sharp-my-location':'twemoji:end-arrow'"
:title="indexI === 0 && indexJ === 0 ?'设置开始时间':'使用前一句的结束时间'"
/>
>
<IconIcSharpMyLocation v-if="indexI === 0 && indexJ === 0"/>
<IconTwemojiEndArrow v-else/>
</BaseIcon>
</div>
<div>-</div>
<div class="flex flex-col items-center justify-center">
@@ -432,15 +433,21 @@ function setStartTime(val: Sentence, i: number, j: number) {
<BaseIcon
@click="sentence.audioPosition[1] = Number(Number(audioRef.currentTime).toFixed(2))"
title="设置结束时间"
icon="ic:sharp-my-location"
/>
>
<IconIcSharpMyLocation/>
</BaseIcon>
</div>
</div>
<div class="flex flex-col">
<BaseIcon :icon="sentence.audioPosition?.length ? 'basil:edit-outline' : 'basil:add-outline'"
@click="handleShowEditAudioDialog(sentence,indexI,indexJ)"/>
<BaseIcon v-if="sentence.audioPosition?.length" icon="hugeicons:play"
@click="playSentenceAudio(sentence,audioRef,editArticle)"/>
@click="handleShowEditAudioDialog(sentence,indexI,indexJ)">
<IconBasilEditOutline v-if="sentence.audioPosition?.length"/>
<IconBasilAddOutline v-else/>
</BaseIcon>
<BaseIcon v-if="sentence.audioPosition?.length"
@click="playSentenceAudio(sentence,audioRef,editArticle)">
<IconHugeiconsPlay/>
</BaseIcon>
</div>
</div>
</div>
@@ -451,11 +458,11 @@ function setStartTime(val: Sentence, i: number, j: number) {
<div class="status">
<span>状态：</span>
<div class="warning" v-if="failCount">
<Icon icon="typcn:warning-outline"/>
<IconTypcnWarningOutline/>
共有{{ failCount }}句没有翻译！
</div>
<div class="success" v-else>
<Icon icon="mdi:success-circle-outline"/>
<IconMdiSuccessCircleOutline/>
翻译完成！
</div>
</div>
@@ -487,9 +494,11 @@ function setStartTime(val: Sentence, i: number, j: number) {
<span v-if="editSentence.audioPosition?.[1] !== -1"> - {{ editSentence.audioPosition?.[1] }}s</span>
<span v-else> - 结束</span>
</div>
<BaseIcon icon="hugeicons:play"
<BaseIcon2
title="试听"
@click="playSentenceAudio(editSentence,sentenceAudioRef,editArticle)"/>
@click="playSentenceAudio(editSentence,sentenceAudioRef,editArticle)">
<IconHugeiconsPlay/>
</BaseIcon2>
</div>
</div>
<div class="flex flex-col gap-2">
@@ -498,16 +507,18 @@ function setStartTime(val: Sentence, i: number, j: number) {
<div class="flex justify-between flex-1">
<div class="flex items-center gap-2">
<InputNumber v-model="editSentence.audioPosition[0]" :precision="2" :step="0.1"/>
<BaseIcon
<BaseIcon2
@click="jumpAudio(editSentence.audioPosition[0])"
title="跳转"
icon="ic:sharp-my-location"
/>
<BaseIcon
>
<IconIcSharpMyLocation/>
</BaseIcon2>
<BaseIcon2
@click="setPreEndTimeToCurrentStartTime"
title="使用前一句的结束时间"
icon="twemoji:end-arrow"
/>
>
<IconTwemojiEndArrow/>
</BaseIcon2>
</div>
<BaseButton @click="recordStart">记录</BaseButton>
</div>

4
src/pages/pc/components/BackIcon.vue
View File

@@ -6,7 +6,9 @@ import BaseIcon from "@/components/BaseIcon.vue";
<template>
<BaseIcon
title="返回"
icon="formkit:left"/>
@click="$router.back">
<IconFormkitLeft/>
</BaseIcon>
</template>
<style scoped lang="scss">

23
src/pages/pc/components/BaseTable.vue
View File

@@ -9,10 +9,10 @@ import {cloneDeep, debounce, reverse, shuffle} from "@/utils";
import Input from "@/pages/pc/components/Input.vue";
import PopConfirm from "@/pages/pc/components/PopConfirm.vue";
import Empty from "@/components/Empty.vue";
import {Icon} from "@iconify/vue";
import Pagination from '@/pages/pc/components/base/Pagination.vue'
import Toast from '@/pages/pc/components/base/toast/Toast.ts'
import Checkbox from "@/pages/pc/components/base/checkbox/Checkbox.vue";
import DeleteIcon from "@/components/icon/DeleteIcon.vue";
let list = defineModel('list')
@@ -161,26 +161,32 @@ defineRender(
>
<BaseIcon
class="del"
title="删除"
icon="solar:trash-bin-minimalistic-linear"/>
title="删除">
<DeleteIcon/>
</BaseIcon>
</PopConfirm>
: null
}
<BaseIcon
onClick={props.add}
icon="fluent:add-20-filled"
title="添加单词"/>
title="添加单词">
<IconFluentAdd20Filled/>
</BaseIcon>
<BaseIcon
disabled={!currentList.length}
title="改变顺序"
icon="icon-park-outline:sort-two"
onClick={() => showSortDialog = !showSortDialog}
/>
>
<IconIconParkOutlineSortTwo/>
</BaseIcon>
<BaseIcon
disabled={!currentList.length}
onClick={() => showSearchInput = !showSearchInput}
title="搜索"
icon="fluent:search-24-regular"/>
title="搜索">
<IconFluentSearch24Regular/>
</BaseIcon>
<MiniDialog
modelValue={showSortDialog}
onUpdate:modelValue={e => showSortDialog = e}
@@ -203,8 +209,7 @@ defineRender(
{
props.loading ?
<div class="h-full w-full center text-4xl">
<Icon
icon="eos-icons:loading"
<IconEosIconsLoading
color="gray"
/>
</div>

5
src/pages/pc/components/Book.vue
View File

@@ -1,6 +1,5 @@
<script setup lang="ts">
import {Dict} from "@/types/types.ts";
import {Icon} from "@iconify/vue";
import Progress from '@/pages/pc/components/base/Progress.vue'
import Checkbox from "@/pages/pc/components/base/checkbox/Checkbox.vue";
@@ -49,9 +48,9 @@ const studyProgress = $computed(() => {
<div class="custom" v-if="item.custom">自定义</div>
</template>
<div v-else class="center h-full">
<Icon
<IconFluentAdd20Filled
width="40px"
icon="fluent:add-20-filled"/>
/>
</div>
</div>

12
src/pages/pc/components/CollectNotice.vue
View File

@@ -1,9 +1,8 @@
<script setup lang="ts">
import {Icon} from "@iconify/vue";
import Close from "@/components/icon/Close.vue";
import BaseButton from "@/components/BaseButton.vue";
import {onMounted, watch} from "vue";
import {watch} from "vue";
import {useSettingStore} from "@/stores/setting.ts";
import {isMobile} from "@/utils";
@@ -54,16 +53,11 @@ watch(() => settingStore.load, (n) => {
<div class="href-wrapper">
<div class="round">
<div class="href">2study.top</div>
<Icon
width="22"
icon="mdi:star-outline"/>
<IconMdiStarOutline width="22"/>
</div>
<div class="right">
👈
<Icon
class="star"
width="22"
icon="mdi:star"/>
<IconMdiStar class="star" width="22"/>
点亮它!
</div>
</div>

1
src/pages/pc/components/EditAbleText.vue
View File

@@ -3,7 +3,6 @@
import BaseButton from "@/components/BaseButton.vue";
import {watchEffect} from "vue";
import BaseInput from "@/pages/pc/components/base/BaseInput.vue";
import Textarea from "@/pages/pc/components/base/Textarea.vue";
interface IProps {

3
src/pages/pc/components/Input.vue
View File

@@ -1,6 +1,5 @@
<script setup lang="ts">
import {Icon} from "@iconify/vue";
import Close from "@/components/icon/Close.vue";
import {useDisableEventListener, useWindowClick} from "@/hooks/event.ts";
@@ -37,7 +36,7 @@ const vFocus = {
:class="{focus}"
ref="inputEl"
>
<Icon icon="fluent:search-24-regular"
<IconFluentSearch24Regular
v-if="prefixIcon"
width="20"/>
<input type="text"

7
src/pages/pc/components/base/Pagination.vue
View File

@@ -1,6 +1,5 @@
<script setup lang="ts">
import {computed, ref, onMounted, onUnmounted} from 'vue';
import {Icon} from "@iconify/vue";
import {computed, onMounted, onUnmounted, ref} from 'vue';
interface IProps {
currentPage?: number;
@@ -190,7 +189,7 @@ function quickNextPage() {
:disabled="internalCurrentPage <= 1"
@click="prev"
>
<Icon icon="mingcute:left-line"/>
<IconMingcuteLeftLine/>
</button>
<!-- 页码 -->
@@ -251,7 +250,7 @@ function quickNextPage() {
:disabled="internalCurrentPage >= pageCount"
@click="next"
>
<Icon icon="mingcute:right-line"/>
<IconMingcuteRightLine/>
</button>
<!-- 每页条数选择器 -->

4
src/pages/pc/components/base/select/Select.vue
View File

@@ -1,6 +1,5 @@
<script setup lang="ts">
import {computed, nextTick, onBeforeUnmount, onMounted, provide, ref, useAttrs, useSlots, VNode, watch} from 'vue';
import {Icon} from "@iconify/vue";
import {useWindowClick} from "@/hooks/event.ts";
interface Option {
@@ -161,8 +160,7 @@ onBeforeUnmount(() => {
{{ displayValue }}
</div>
<div class="custom-select__suffix">
<Icon
icon="mdi:chevron-down"
<IconMdiChevronDown
:class="{ 'is-reverse': isOpen }"
width="16"
/>

20
src/pages/pc/components/base/toast/Toast.vue
View File

@@ -3,17 +3,19 @@
<div v-if="visible" class="message" :class="type" :style="style" @mouseenter="handleMouseEnter"
@mouseleave="handleMouseLeave">
<div class="message-content">
<Icon v-if="icon" :icon="icon" class="message-icon"/>
<IconMdiCheckCircle v-if="props.type === 'success'" class="message-icon"/>
<IconMdiAlertCircle v-if="props.type === 'warning'" class="message-icon"/>
<IconMdiInformation v-if="props.type === 'info'" class="message-icon"/>
<IconMdiCloseCircle v-if="props.type === 'error'" class="message-icon"/>
<span class="message-text">{{ message }}</span>
<Icon v-if="showClose" icon="mdi:close" class="message-close" @click="close"/>
<IconMdiClose v-if="showClose" class="message-close" @click="close"/>
</div>
</div>
</Transition>
</template>
<script setup lang="ts">
import {ref, computed, onMounted, onBeforeUnmount} from 'vue'
import {Icon} from '@iconify/vue'
import {computed, onBeforeUnmount, onMounted, ref} from 'vue'
interface Props {
message: string
@@ -32,16 +34,6 @@ const emit = defineEmits(['close'])
const visible = ref(false)
let timer = null
const icon = computed(() => {
const icons = {
success: 'mdi:check-circle',
warning: 'mdi:alert-circle',
info: 'mdi:information',
error: 'mdi:close-circle'
}
return icons[props.type]
})
const style = computed(() => ({
// 移除offset，现在由容器管理位置
}))

6
src/pages/pc/components/dialog/Dialog.vue
View File

@@ -1,7 +1,6 @@
<script setup lang="ts">
import {onMounted, onUnmounted, watch} from "vue";
import Tooltip from "@/pages/pc/components/base/Tooltip.vue";
import {Icon} from '@iconify/vue';
import {useEventListener} from "@/hooks/event.ts";
import BaseButton from "@/components/BaseButton.vue";
@@ -158,11 +157,10 @@ async function cancel() {
]"
>
<Tooltip title="关闭">
<Icon @click="close"
<IconIonCloseOutline @click="close"
v-if="showClose"
class="close hvr-grow cursor-pointer"
width="24" color="#929596"
icon="ion:close-outline"/>
width="24" color="#929596"/>
</Tooltip>
<div class="modal-header" v-if="header">
<div class="title">{{ props.title }}</div>

9
src/pages/pc/components/list/List.vue
View File

@@ -124,13 +124,16 @@ defineExpose({scrollBottom})
<div class="right">
<BaseIcon
@click="delItem(item)"
title="删除" icon="fluent:delete-24-regular"/>
title="删除">
<IconFluentDelete24Regular/>
</BaseIcon>
<div
@mousedown="draggable = true"
@mouseup="draggable = false"
>
<BaseIcon
icon="carbon:move"/>
<BaseIcon>
<IconCarbonMove/>
</BaseIcon>
</div>
</div>
</div>

31
src/pages/pc/index.vue
View File

@@ -2,7 +2,6 @@
import {ShortcutKey} from "@/types/types.ts";
import Logo from "@/pages/pc/components/Logo.vue";
import {Icon} from "@iconify/vue";
import {useSettingStore} from "@/stores/setting.ts";
import {useRouter} from "vue-router";
import useTheme from "@/hooks/theme.ts";
@@ -23,41 +22,33 @@ const {toggleTheme} = useTheme()
<div class="aside anim fixed" :class="{'expand':settingStore.sideExpand}">
<div class="top">
<Logo v-if="settingStore.sideExpand"/>
<!-- <div class="row" @click="router.push('/home')">-->
<!-- <Icon icon="iconoir:home"/>-->
<!-- <span v-if="settingStore.sideExpand">主页</span>-->
<!-- </div>-->
<div class="row" @click="router.push('/word')">
<Icon icon="material-symbols-light:dictionary-outline-sharp"/>
<!-- <Icon icon="streamline:dictionary-language-book"/>-->
<IconMaterialSymbolsLightDictionaryOutlineSharp/>
<span v-if="settingStore.sideExpand">单词</span>
</div>
<div class="row" @click="router.push('/article')">
<Icon icon="ph:article-ny-times"/>
<IconPhArticleNyTimes/>
<span v-if="settingStore.sideExpand">文章</span>
</div>
<div class="row" @click="router.push('/setting')">
<Icon icon="uil:setting"/>
<IconUilSetting/>
<span v-if="settingStore.sideExpand">设置</span>
</div>
<!-- <div class="row" @click="router.push('/article2')">-->
<!-- <Icon icon="healthicons:i-exam-multiple-choice-outline"/>-->
<!-- <span v-if="settingStore.sideExpand">试卷</span>-->
<!-- </div>-->
<!-- <div class="row">-->
<!-- <Icon icon="mdi-light:forum"/>-->
<!-- <span v-if="settingStore.sideExpand">社区</span>-->
<!-- </div>-->
</div>
<div class="bottom flex justify-evenly ">
<BaseIcon
@click="settingStore.sideExpand = !settingStore.sideExpand"
:icon="settingStore.sideExpand?'formkit:left':'formkit:right'"/>
@click="settingStore.sideExpand = !settingStore.sideExpand">
<IconFormkitLeft v-if="settingStore.sideExpand"/>
<IconFormkitRight v-else/>
</BaseIcon>
<BaseIcon
v-if="settingStore.sideExpand"
:title="`切换主题(${settingStore.shortcutKeyMap[ShortcutKey.ToggleTheme]})`"
@click="toggleTheme"
:icon="settingStore.theme === 'light' ? 'ep:moon' : 'tabler:sun'"/>
>
<IconEpMoon v-if="settingStore.theme === 'light'"/>
<IconTablerSun v-else/>
</BaseIcon>
</div>
</div>
<div class="flex-1 z-1 relative">

11
src/pages/pc/word/DictDetail.vue
View File

@@ -21,6 +21,7 @@ import BaseInput from "@/pages/pc/components/base/BaseInput.vue";
import Textarea from "@/pages/pc/components/base/Textarea.vue";
import FormItem from "@/pages/pc/components/base/form/FormItem.vue";
import Form from "@/pages/pc/components/base/form/Form.vue";
import DeleteIcon from "@/components/icon/DeleteIcon.vue";
const runtimeStore = useRuntimeStore()
const base = useBaseStore()
@@ -241,15 +242,17 @@ defineRender(() => {
<BaseIcon
class="option-icon"
onClick={() => editWord(val.item)}
title="编辑"
icon="tabler:edit"/>
title="编辑">
<IconTablerEdit/>
</BaseIcon>
<PopConfirm title="确认删除？"
onConfirm={() => delWord(val.item.id)}
>
<BaseIcon
class="option-icon"
title="删除"
icon="solar:trash-bin-minimalistic-linear"/>
title="删除">
<DeleteIcon/>
</BaseIcon>
</PopConfirm>
</div>

7
src/pages/pc/word/DictList.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import {useNav} from "@/utils";
import {groupBy, useNav} from "@/utils";
import BasePage from "@/pages/pc/components/BasePage.vue";
import {DictResource} from "@/types/types.ts";
import {useRuntimeStore} from "@/stores/runtime.ts";
@@ -12,7 +12,6 @@ import BackIcon from "@/pages/pc/components/BackIcon.vue";
import DictGroup from "@/pages/pc/components/list/DictGroup.vue";
import {useBaseStore} from "@/stores/base.ts";
import {useRouter} from "vue-router";
import {groupBy} from "@/utils";
import {dictionaryResources} from "@/assets/dictionary.ts";
import {computed} from "vue";
import {getDefaultDict} from "@/types/func.ts";
@@ -87,7 +86,9 @@ const searchList = computed<any[]>(() => {
<span class="page-title absolute w-full center">词典列表</span>
<BaseIcon @click="showSearchInput = true"
class="z-1"
icon="fluent:search-24-regular"/>
icon="fluent:search-24-regular">
<IconFluentSearch24Regular/>
</BaseIcon>
</div>
</div>
<div class="mt-4" v-if="searchKey">

5
src/pages/pc/word/Statistics.vue
View File

@@ -4,7 +4,6 @@ import {useBaseStore} from "@/stores/base.ts";
import BaseButton from "@/components/BaseButton.vue";
import {ShortcutKey, Statistics} from "@/types/types.ts";
import {emitter, EventKey, useEvents} from "@/utils/eventBus.ts";
import {Icon} from '@iconify/vue';
import {useSettingStore} from "@/stores/setting.ts";
import {usePracticeStore} from "@/stores/practice.ts";
import dayjs from "dayjs";
@@ -131,7 +130,7 @@ function options(emitType: string) {
style="background: rgb(254,236,236)">
<div class="text-3xl">{{ statStore.wrong }}</div>
<div class="center gap-2">
<Icon icon="iconamoon:close" class="text-2xl"/>
<IconIconamoonClose class="text-2xl"/>
错词
</div>
</div>
@@ -139,7 +138,7 @@ function options(emitType: string) {
style="background: rgb(231,248,241)">
<div class="text-3xl">{{ statStore.total - statStore.wrong }}</div>
<div class="center gap-2">
<Icon icon="tabler:check" class="text-2xl"/>
<IconTablerCheck class="text-2xl"/>
正确
</div>
</div>

34
src/pages/pc/word/StudyWord.vue
View File

@@ -12,7 +12,6 @@ import useTheme from "@/hooks/theme.ts";
import {getCurrentStudyWord, useWordOptions} from "@/hooks/dict.ts";
import {_getDictDataByUrl, cloneDeep, shuffle} from "@/utils";
import {useRoute, useRouter} from "vue-router";
import {Icon} from "@iconify/vue";
import Footer from "@/pages/pc/word/components/Footer.vue";
import Panel from "@/pages/pc/components/Panel.vue";
import BaseIcon from "@/components/BaseIcon.vue";
@@ -361,7 +360,7 @@ useEvents([
<div class="center gap-2 cursor-pointer float-left"
@click="prev"
v-if="prevWord">
<Icon class="arrow" icon="bi:arrow-left" width="22"/>
<IconBiArrowLeft class="arrow" width="22"/>
<Tooltip
:title="`上一个(${settingStore.shortcutKeyMap[ShortcutKey.Previous]})`"
>
@@ -376,7 +375,7 @@ useEvents([
>
<div class="word" :class="settingStore.dictation && 'word-shadow'">{{ nextWord.word }}</div>
</Tooltip>
<Icon class="arrow" icon="bi:arrow-right" width="22"/>
<IconBiArrowRight class="arrow" width="22"/>
</div>
</div>
<TypeWord
@@ -411,27 +410,20 @@ useEvents([
>
<template v-slot:suffix="{item,index}">
<BaseIcon
v-if="!isWordCollect(item)"
class="collect"
:class="!isWordCollect(item)?'collect':'fill'"
@click.stop="toggleWordCollect(item)"
title="收藏" icon="ph:star"/>
:title="!isWordCollect(item) ? '收藏' : '取消收藏'">
<IconPhStar v-if="!isWordCollect(item)"/>
<IconPhStarFill v-else/>
</BaseIcon>
<BaseIcon
v-else
class="fill"
@click.stop="toggleWordCollect(item)"
title="取消收藏" icon="ph:star-fill"/>
<BaseIcon
v-if="!isWordSimple(item)"
class="easy"
:class="!isWordSimple(item)?'collect':'fill'"
@click.stop="toggleWordSimple(item)"
title="标记为已掌握"
icon="material-symbols:check-circle-outline-rounded"/>
<BaseIcon
v-else
class="fill"
@click.stop="toggleWordSimple(item)"
title="取消标记已掌握"
icon="material-symbols:check-circle-rounded"/>
:title="!isWordSimple(item) ? '标记为已掌握' : '取消标记已掌握'">
<IconMaterialSymbolsCheckCircleOutlineRounded v-if="!isWordSimple(item)"/>
<IconMaterialSymbolsCheckCircleRounded v-else/>
</BaseIcon>
</template>
</WordList>
<Empty v-else/>

22
src/pages/pc/word/WordHomePage.vue
View File

@@ -1,6 +1,5 @@
<script setup lang="ts">
import {useBaseStore} from "@/stores/base.ts";
import {Icon} from '@iconify/vue'
import {useRouter} from "vue-router";
import BaseIcon from "@/components/BaseIcon.vue";
import Dialog from "@/pages/pc/components/dialog/Dialog.vue";
@@ -17,6 +16,7 @@ import Toast from '@/pages/pc/components/base/toast/Toast.ts';
import BaseButton from "@/components/BaseButton.vue";
import {getDefaultDict} from "@/types/func.ts";
import Slider from "@/pages/pc/components/base/Slider.vue";
import DeleteIcon from "@/components/icon/DeleteIcon.vue";
const store = useBaseStore()
const router = useRouter()
@@ -134,12 +134,15 @@ const progressTextRight = $computed(() => {
<div class="flex">
<div class="bg-third px-3 h-14 rounded-md flex items-center ">
<span @click="goDictDetail(store.sdict)"
class="text-xl font-bold cursor-pointer">{{ store.sdict.name || '请选择词典开始学习' }}</span>
class="text-lg font-bold cursor-pointer">{{ store.sdict.name || '请选择词典开始学习' }}</span>
<BaseIcon title="切换词典"
:icon="store.sdict.name ? 'gg:arrows-exchange' : 'fluent:add-20-filled'"
class="ml-4"
@click="router.push('/dict-list')"
/>
class="ml-4"
@click="router.push('/dict-list')"
>
<IconGgArrowsExchange v-if="store.sdict.name"/>
<IconFluentAdd20Filled v-else/>
</BaseIcon>
</div>
</div>
<div class="">
@@ -152,6 +155,7 @@ const progressTextRight = $computed(() => {
<div class="text-sm text-align-end">
预计完成日期：{{ _getAccomplishDate(store.sdict.words.length, store.sdict.perDayStudyNumber) }}
</div>
</div>
<div class="w-3/10 flex flex-col justify-evenly">
@@ -186,7 +190,7 @@ const progressTextRight = $computed(() => {
<!-- <BaseButton size="large" @click="startStudy">-->
<div class="flex items-center gap-2">
<span>开始学习</span>
<Icon icon="icons8:right-round" class="text-2xl"/>
<IconIcons8RightRound class="text-2xl"/>
</div>
</BaseButton>
</div>
@@ -197,7 +201,9 @@ const progressTextRight = $computed(() => {
<div class="title">我的词典</div>
<div class="flex gap-4 items-center">
<PopConfirm title="确认删除所有选中词典？" @confirm="handleBatchDel" v-if="selectIds.length">
<BaseIcon class="del" title="删除" icon="solar:trash-bin-minimalistic-linear"/>
<BaseIcon class="del" title="删除">
<DeleteIcon/>
</BaseIcon>
</PopConfirm>
<div class="color-blue cursor-pointer" v-if="store.word.bookList.length > 3"

59
src/pages/pc/word/components/Footer.vue
View File

@@ -5,7 +5,6 @@ import {usePracticeStore} from "@/stores/practice.ts";
import {useSettingStore} from "@/stores/setting.ts";
import {ShortcutKey, StudyData} from "@/types/types.ts";
import BaseIcon from "@/components/BaseIcon.vue";
import {Icon} from "@iconify/vue";
import Tooltip from "@/pages/pc/components/base/Tooltip.vue";
import Progress from '@/pages/pc/components/base/Progress.vue'
@@ -63,7 +62,7 @@ const progress = $computed(() => {
<template>
<div class="footer" :class="!settingStore.showToolbar && 'hide'">
<Tooltip :title="settingStore.showToolbar?'收起':'展开'">
<Icon icon="icon-park-outline:down"
<IconIconParkOutlineDown
@click="settingStore.showToolbar = !settingStore.showToolbar"
class="arrow"
:class="!settingStore.showToolbar && 'down'"
@@ -101,48 +100,46 @@ const progress = $computed(() => {
</div>
<div class="flex gap-2 justify-center items-center">
<BaseIcon
v-if="!isSimple"
class="collect"
:class="!isSimple?'collect':'fill'"
@click="$emit('toggleSimple')"
:title="`标记为已掌握(${settingStore.shortcutKeyMap[ShortcutKey.ToggleSimple]})`"
icon="material-symbols:check-circle-outline-rounded"/>
<BaseIcon
v-else
class="fill"
@click="$emit('toggleSimple')"
:title="`取消标记已掌握(${settingStore.shortcutKeyMap[ShortcutKey.ToggleSimple]})`"
icon="material-symbols:check-circle-rounded"/>
:title="(!isSimple ? '标记为已掌握' : '取消标记已掌握')+`(${settingStore.shortcutKeyMap[ShortcutKey.ToggleSimple]})`">
<IconMaterialSymbolsCheckCircleOutlineRounded v-if="!isSimple"/>
<IconMaterialSymbolsCheckCircleRounded v-else/>
</BaseIcon>
<BaseIcon
v-if="!isCollect"
class="collect"
@click="$emit('toggleCollect')"
:title="`收藏(${settingStore.shortcutKeyMap[ShortcutKey.ToggleCollect]})`"
icon="ph:star"/>
<BaseIcon
v-else
@click="$emit('toggleCollect')"
:title="`取消收藏(${settingStore.shortcutKeyMap[ShortcutKey.ToggleCollect]})`"
icon="ph:star-fill"/>
:class="!isCollect?'collect':'fill'"
@click.stop="$emit('toggleCollect')"
:title="(!isCollect ? '收藏' : '取消收藏')+`(${settingStore.shortcutKeyMap[ShortcutKey.ToggleCollect]})`">
<IconPhStar v-if="!isCollect"/>
<IconPhStarFill v-else/>
</BaseIcon>
<BaseIcon
@click="emit('skip')"
:title="`跳过(${settingStore.shortcutKeyMap[ShortcutKey.Next]})`"
icon="icon-park-outline:go-ahead"/>
:title="`跳过(${settingStore.shortcutKeyMap[ShortcutKey.Next]})`">
<IconIconParkOutlineGoAhead/>
</BaseIcon>
<BaseIcon
@click="settingStore.dictation = !settingStore.dictation"
:title="`开关默写模式(${settingStore.shortcutKeyMap[ShortcutKey.ToggleDictation]})`"
:icon="['majesticons:eye-off-line','mdi:eye-outline'][settingStore.dictation?0:1]"/>
>
<IconMajesticonsEyeOffLine v-if="settingStore.dictation"/>
<IconMdiEyeOutline v-else/>
</BaseIcon>
<BaseIcon :icon="['mdi:translate','mdi:translate-off'][settingStore.translate?0:1]"
:title="`开关释义显示(${settingStore.shortcutKeyMap[ShortcutKey.ToggleShowTranslate]})`"
@click="settingStore.translate = !settingStore.translate"/>
<BaseIcon
:title="`开关释义显示(${settingStore.shortcutKeyMap[ShortcutKey.ToggleShowTranslate]})`"
@click="settingStore.translate = !settingStore.translate">
<IconMdiTranslate v-if="settingStore.translate"/>
<IconMdiTranslateOff v-else/>
</BaseIcon>
<BaseIcon
@click="settingStore.showPanel = !settingStore.showPanel"
:title="`单词本(${settingStore.shortcutKeyMap[ShortcutKey.TogglePanel]})`"
icon="tdesign:menu-unfold"/>
:title="`单词本(${settingStore.shortcutKeyMap[ShortcutKey.TogglePanel]})`">
<IconTdesignMenuUnfold/>
</BaseIcon>
</div>
</div>
</div>