新增

2026-03-01 14:17:59 +08:00
parent 65aa12f146
commit a07e844c47
6071 changed files with 777651 additions and 0 deletions
@@ -0,0 +1,69 @@
+<template>
+    <div class="logo" @click="handleClick">
+        <image-contain :width="szie" :height="szie" :src="config.web_logo" />
+        <transition name="title-width">
+            <div
+                v-show="showTitle"
+                class="logo-title overflow-hidden whitespace-nowrap"
+                :class="{ 'text-white': theme == ThemeEnum.DARK }"
+                :style="{ left: `${szie + 16}px` }"
+            >
+                <overflow-tooltip
+                    :content="title || config.web_name"
+                    :teleported="true"
+                    placement="bottom"
+                    overflo-type="unset"
+                >
+                </overflow-tooltip>
+            </div>
+        </transition>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ThemeEnum } from '@/enums/appEnums'
+import useAppStore from '@/stores/modules/app'
+
+defineProps({
+    szie: { type: Number, default: 34 },
+    title: { type: String },
+    theme: { type: String },
+    showTitle: { type: Boolean, default: true }
+})
+const appStore = useAppStore()
+const config = computed(() => appStore.config)
+const router = useRouter()
+
+const handleClick = () => {
+    router.push('/')
+}
+</script>
+<style lang="scss" scoped>
+.logo {
+    height: var(--navbar-height);
+    overflow: hidden;
+    cursor: pointer;
+    user-select: none;
+    @apply flex items-center p-2 relative;
+    .logo-title {
+        width: 70%;
+        position: absolute;
+        @apply text-xl;
+    }
+
+    .title-width-enter-active {
+        opacity: 0;
+        transition: all 0.3s ease-out;
+    }
+
+    .title-width-leave-active {
+        transition: all 0.3s cubic-bezier(1, 0.5, 0.8, 1);
+    }
+
+    .title-width-enter-from,
+    .title-width-leave-to {
+        width: 0;
+        opacity: 0;
+    }
+}
+</style>