This commit is contained in:
Zyronon
2025-11-16 22:08:30 +08:00
parent 4f7ecbea29
commit 5830b3eacd
7 changed files with 38 additions and 61 deletions

View File

@@ -27,6 +27,7 @@
}
@keyframes shake {
10%,
90% {

View File

@@ -399,7 +399,7 @@ a {
}
.card {
@apply rounded-xl p-4 mb-5 box-border relative;
@apply rounded-xl p-4 mb-8 shadow-lg box-border relative;
background: var(--color-second);
}

View File

@@ -76,8 +76,8 @@ defineEmits(['click'])
}
&.small {
border-radius: 0.2rem;
padding: 0 0.8rem;
border-radius: 0.3rem;
padding: 0 0.6rem;
height: 1.6rem;
font-size: .8rem;
}

View File

@@ -1,11 +1,13 @@
<script lang="jsx">
import {Teleport, Transition} from 'vue'
import BaseButton from "@/components/BaseButton.vue";
export default {
name: "PopConfirm",
components: {
Teleport,
Transition
Transition,
BaseButton
},
props: {
title: {
@@ -60,18 +62,18 @@ export default {
render() {
let Vnode = this.$slots.default()[0]
return (
<div class="pop-confirm">
<div class="pop-confirm leading-none">
<Teleport to="body">
<Transition>
<Transition name="fade">
{
this.show && (
<div ref="tip" class="pop-confirm-content">
<div class="text">
<div ref="tip" class="pop-confirm-content shadow-2xl">
<div class="w-50">
{this.title}
</div>
<div class="options">
<div onClick={() => this.show = false}>取消</div>
<div class="main" onClick={() => this.confirm()}>确认</div>
<BaseButton type="info" size="small" onClick={() => this.show = false}>取消</BaseButton>
<BaseButton size="small" onClick={() => this.confirm()}>确认</BaseButton>
</div>
</div>
)
@@ -85,43 +87,18 @@ export default {
}
</script>
<style lang="scss" scoped>
$bg-color: rgb(226, 226, 226);
.pop-confirm-content {
position: fixed;
background: var(--color-tooltip-bg);
padding: 1rem;
border-radius: .3rem;
border-radius: .6rem;
transform: translate(-50%, calc(-100% - .6rem));
box-shadow: 0 0 6px 1px var(--color-tooltip-shadow);
z-index: 999;
.text {
color: var(--color-font-1);
text-align: start;
font-size: 1rem;
width: 9rem;
min-width: 9rem;
}
.options {
margin-top: .9rem;
display: flex;
justify-content: flex-end;
align-items: center;
gap: .7rem;
font-size: .9rem;
div {
cursor: pointer;
}
.main {
color: gray;
background: $bg-color;
padding: .2rem .6rem;
border-radius: .24rem;
}
text-align: right;
}
}
</style>

View File

@@ -188,7 +188,7 @@ async function cancel() {
<style scoped lang="scss">
$modal-mask-bg: rgba(#000, .45);
$modal-mask-bg: rgba(#000, .6);
$radius: .5rem;
$time: 0.3s;
$header-height: 4rem;
@@ -196,11 +196,9 @@ $header-height: 4rem;
@keyframes bounce-in {
0% {
opacity: 0;
transform: scale(0);
}
100% {
opacity: 1;
transform: scale(1);
}
}
@@ -259,7 +257,6 @@ $header-height: 4rem;
animation: bounce-in $time ease-out;
&.bounce-out {
transform: scale(0);
opacity: 0;
}
}

View File

@@ -44,10 +44,10 @@ function goHome() {
<span v-if="settingStore.sideExpand">设置</span>
<div class="red-point" :class="!settingStore.sideExpand && 'top-1 right-0'" v-if="runtimeStore.isNew"></div>
</div>
<div class="row" @click="router.push('/user')">
<IconFluentPerson20Regular/>
<span v-if="settingStore.sideExpand">用户</span>
</div>
<!-- <div class="row" @click="router.push('/user')">-->
<!-- <IconFluentPerson20Regular/>-->
<!-- <span v-if="settingStore.sideExpand">用户</span>-->
<!-- </div>-->
</div>
<div class="bottom flex justify-evenly ">
<BaseIcon

View File

@@ -225,8 +225,10 @@ const {
</span>
</div>
</div>
<div class="flex mt-4 gap-4">
<BaseButton type="info" @click="router.push('/dict-list')">
<div class="flex items-center mt-4 gap-4">
<BaseButton type="info"
size="small"
@click="router.push('/dict-list')">
<div class="center gap-1">
<IconFluentArrowSwap20Regular/>
<span>选择词典</span>
@@ -237,6 +239,7 @@ const {
title="当前存在未完成的学习任务,修改会重新生成学习任务,是否继续?"
@confirm="check(()=>showChangeLastPracticeIndexDialog = true)">
<BaseButton type="info"
size="small"
v-if="store.sdict.id"
>
<div class="center gap-1">
@@ -310,7 +313,6 @@ const {
</div>
<div class="flex items-end mt-4">
<BaseButton size="large"
v-if="false"
class="flex-1"
:disabled="!store.sdict.id"
:loading="loading"
@@ -322,6 +324,7 @@ const {
</BaseButton>
<div
v-if="false"
class="w-full flex box-border cp color-white">
<div
@click="startPractice"
@@ -367,22 +370,21 @@ const {
</div>
</div>
<!-- <BaseButton-->
<!-- v-if="store.sdict.id && store.sdict.lastLearnIndex"-->
<!-- size="large" type="orange"-->
<!-- :loading="loading"-->
<!-- @click="check(()=>showShufflePracticeSettingDialog = true)">-->
<!-- <div class="flex items-center gap-2">-->
<!-- <span class="line-height-[2]">随机复习</span>-->
<!-- <IconFluentArrowShuffle20Filled class="text-xl"/>-->
<!-- </div>-->
<!-- </BaseButton>-->
<BaseButton
v-if="store.sdict.id && store.sdict.lastLearnIndex"
size="large" type="orange"
:loading="loading"
@click="check(()=>showShufflePracticeSettingDialog = true)">
<div class="flex items-center gap-2">
<span class="line-height-[2]">随机复习</span>
<IconFluentArrowShuffle20Filled class="text-xl"/>
</div>
</BaseButton>
</div>
</div>
</div>
<div class="card flex flex-col">
<div class="card flex flex-col">
<div class="flex justify-between">
<div class="title">我的词典</div>
<div class="flex gap-4 items-center">
@@ -406,7 +408,7 @@ const {
</div>
</div>
<div class="card flex flex-col overflow-hidden" v-loading="isFetching">
<div class="card flex flex-col overflow-hidden" v-loading="isFetching">
<div class="flex justify-between">
<div class="title">推荐</div>
<div class="flex gap-4 items-center">