添加logo

src/views/chat/layout/sider/index.vue

@@ -1,95 +1,99 @@
 <script setup lang='ts'>
-import type { CSSProperties } from "vue";
-import { computed, ref, watch } from "vue";
-import { NButton, NLayoutSider } from "naive-ui";
+import type {CSSProperties} from "vue";
+import {computed, ref, watch} from "vue";
+import {NButton, NLayoutSider} from "naive-ui";
 import List from "./List.vue";
 import Footer from "./Footer.vue";
-import { useAppStore, useChatStore } from "@/store";
-import { useBasicLayout } from "@/hooks/useBasicLayout";
-import { PromptStore } from "@/components/common";
+import {useAppStore, useChatStore} from "@/store";
+import {useBasicLayout} from "@/hooks/useBasicLayout";
+import {PromptStore} from "@/components/common";
 
 const appStore = useAppStore();
 const chatStore = useChatStore();
 
-const { isMobile } = useBasicLayout();
+const {isMobile} = useBasicLayout();
 const show = ref(false);
 
 const collapsed = computed(() => appStore.siderCollapsed);
 
 function handleAdd() {
-  chatStore.addHistory({ title: "新对话", uuid: Date.now(), isEdit: false });
+	chatStore.addHistory({title: "新对话", uuid: Date.now(), isEdit: false});
 }
 
 function handleUpdateCollapsed() {
-  appStore.setSiderCollapsed(!collapsed.value);
+	appStore.setSiderCollapsed(!collapsed.value);
 }
 
 const getMobileClass = computed<CSSProperties>(() => {
-  if (isMobile.value) {
-    return {
-      position: "fixed",
-      zIndex: 50,
-    };
-  }
-  return {};
+	if (isMobile.value) {
+		return {
+			position: "fixed",
+			zIndex: 50,
+		};
+	}
+	return {};
 });
 
 const mobileSafeArea = computed(() => {
-  if (isMobile.value) {
-    return {
-      paddingBottom: "env(safe-area-inset-bottom)",
-    };
-  }
-  return {};
+	if (isMobile.value) {
+		return {
+			paddingBottom: "env(safe-area-inset-bottom)",
+		};
+	}
+	return {};
 });
 
 watch(
-  isMobile,
-  (val) => {
-    appStore.setSiderCollapsed(val);
-  },
-  {
-    immediate: true,
-    flush: "post",
-  }
+	isMobile,
+	(val) => {
+		appStore.setSiderCollapsed(val);
+	},
+	{
+		immediate: true,
+		flush: "post",
+	}
 );
 </script>
 
 <template>
-  <NLayoutSider
-    :collapsed="collapsed"
-    :collapsed-width="0"
-    :width="260"
-    :show-trigger="isMobile ? false : 'arrow-circle'"
-    collapse-mode="transform"
-    position="absolute"
-    bordered
-    :style="getMobileClass"
-    @update-collapsed="handleUpdateCollapsed"
-  >
-    <div class="flex flex-col h-full" :style="mobileSafeArea">
-      <main class="flex flex-col flex-1 min-h-0">
-        <div class="p-4">
-          <NButton dashed block @click="handleAdd"> + 新的对话 </NButton>
-        </div>
-        <div class="flex-1 min-h-0 pb-4 overflow-hidden">
-          <List />
-        </div>
-        <!-- <div class="p-4">
-          <NButton block @click="show = true">
-            Prompt Store
-          </NButton>
-        </div> -->
-      </main>
-      <Footer />
-    </div>
-  </NLayoutSider>
-  <template v-if="isMobile">
-    <div
-      v-show="!collapsed"
-      class="fixed inset-0 z-40 bg-black/40"
-      @click="handleUpdateCollapsed"
-    />
-  </template>
-  <!-- <PromptStore v-model:visible="show" /> -->
+	<NLayoutSider
+		:collapsed="collapsed"
+		:collapsed-width="0"
+		:width="260"
+		:show-trigger="isMobile ? false : 'arrow-circle'"
+		collapse-mode="transform"
+		position="absolute"
+		bordered
+		:style="getMobileClass"
+		@update-collapsed="handleUpdateCollapsed"
+	>
+		<div class="flex flex-col h-full" :style="mobileSafeArea">
+			<main class="flex flex-col flex-1 min-h-0">
+				<div style="display: flex;justify-content: center;align-items: center;margin: 20px 0 10px 0; font-size: 20px;">
+					<img src="../../../../assets/logo0.png" alt="" style="width: 24px;height: 24px;margin-right: 5px;">
+					极创科技DeepSeek
+				</div>
+				<div class="p-4">
+					<NButton dashed block @click="handleAdd"> + 新的对话</NButton>
+				</div>
+				<div class="flex-1 min-h-0 pb-4 overflow-hidden">
+					<List/>
+				</div>
+				<!-- <div class="p-4">
+					<NButton block @click="show = true">
+						Prompt Store
+					</NButton>
+				</div> -->
+			</main>
+			<Footer/>
+		</div>
+	</NLayoutSider>
+	<template v-if="isMobile">
+		<div
+			v-show="!collapsed"
+			class="fixed inset-0 z-40 bg-black/40"
+			@click="handleUpdateCollapsed"
+		/>
+	</template>
+	<!-- <PromptStore v-model:visible="show" /> -->
 </template>