v1.0.0

src/App.vue

@@ -0,0 +1,22 @@
+<script setup lang="ts">
+import { NConfigProvider } from 'naive-ui'
+import { NaiveProvider } from '@/components/common'
+import { useTheme } from '@/hooks/useTheme'
+import { useLanguage } from '@/hooks/useLanguage'
+
+const { theme, themeOverrides } = useTheme()
+const { language } = useLanguage()
+</script>
+
+<template>
+  <NConfigProvider
+    class="h-full"
+    :theme="theme"
+    :theme-overrides="themeOverrides"
+    :locale="language"
+  >
+    <NaiveProvider>
+      <RouterView />
+    </NaiveProvider>
+  </NConfigProvider>
+</template>

src/api/index.ts

@@ -0,0 +1,242 @@
+import type { AxiosProgressEvent, GenericAbortSignal } from 'axios'
+import { post } from '@/utils/request'
+
+export function fetchChatAPI<T = any>(
+  prompt: string,
+  options?: { conversationId?: string; parentMessageId?: string },
+  signal?: GenericAbortSignal,
+) {
+  return post<T>({
+    url: '/chat',
+    data: { prompt, options },
+    signal,
+  })
+}
+
+export function fetchChatConfig<T = any>() {
+  return post<T>({
+    url: '/config',
+  })
+}
+
+export function fetchChatAPIProcess<T = any>(
+  params: {
+    aiChatDialogId: number
+    prompt: string
+    options?: { conversationId?: string; parentMessageId?: string }
+    signal?: GenericAbortSignal
+
+    onDownloadProgress?: (progressEvent: AxiosProgressEvent) => void },
+) {
+  // const settingStore = useSettingStore()
+  // const authStore = useAuthStore()
+  const data: Record<string, any> = {
+    prompt: params.prompt,
+    options: params.options,
+    aiChatDialogId: params.aiChatDialogId,
+  }
+
+  // if (authStore.isChatGPTAPI) {
+  //   data = {
+  //     ...data,
+  //     systemMessage: settingStore.systemMessage,
+  //     temperature: settingStore.temperature,
+  //     top_p: settingStore.top_p,
+  //   }
+  // }
+  return post<T>({
+    url: '/chatGpt/chatCompletion',
+    data,
+    signal: params.signal,
+    onDownloadProgress: params.onDownloadProgress,
+  })
+}
+
+export function againFetchChatAPIProcess<T = any>(
+  params: {
+    aiChatDialogId: number
+    prompt?: string
+    options?: { conversationId?: string; parentMessageId?: string }
+    signal?: GenericAbortSignal
+    id?: number // 记录id
+
+    onDownloadProgress?: (progressEvent: AxiosProgressEvent) => void },
+) {
+  const data: Record<string, any> = {
+    prompt: params.prompt,
+    options: params.options,
+    aiChatDialogId: params.aiChatDialogId,
+    id: params.id,
+  }
+
+  return post<T>({
+    url: '/chatGpt/againChatCompletion',
+    data,
+    signal: params.signal,
+    onDownloadProgress: params.onDownloadProgress,
+  })
+}
+
+export function fetchSession<T>() {
+  return post<T>({
+    url: '/chatGpt/session',
+  })
+}
+
+export function fetchVerify<T>(token: string) {
+  return post<T>({
+    url: '/verify',
+    data: { token },
+  })
+}
+
+// 获取对话列表
+export function chatDialogGetList<T>(page: number, limit: number, keyword?: string) {
+  return post<T>({
+    url: '/aiChatDialog/getList',
+    data: { page, limit, keyword },
+  })
+}
+
+// 新建对话
+export function chatDialogAdd<T>(title: string, aiRoleId: number) {
+  return post<T>({
+    url: '/aiChatDialog/add',
+    data: { title, aiRoleId },
+  })
+}
+
+// 修改
+export function chatDialogUpdate<T>(aiChatDialogId: number, title: string) {
+  return post<T>({
+    url: '/aiChatDialog/update',
+    data: { aiChatDialogId, title },
+  })
+}
+
+// 删除对话
+export function chatDialogDelete<T>(aiChatDialogId: number) {
+  return post<T>({
+    url: '/aiChatDialog/delete',
+    data: { aiChatDialogId },
+  })
+}
+
+export function chatDialogGetInfo<T>(aiChatDialogId: number) {
+  return post<T>({
+    url: '/aiChatDialog/getInfo',
+    data: { aiChatDialogId },
+  })
+}
+
+// 获取某对话框聊天记录
+export function chatRecordGetList<T>(aiChatDialogId: number) {
+  return post<T>({
+    url: '/aiChatRecord/getList',
+    data: { aiChatDialogId },
+  })
+}
+
+// export function chatRecordAddOne<T>(data: ChatRecord.AddOneRequest) {
+//   return post<T>({
+//     url: '/aiChatRecord/addOne',
+//     data,
+//   })
+// }
+
+export function chatRecordDelete<T>(aiChatDialogId: number, recordId: number) {
+  return post<T>({
+    url: '/aiChatRecord/delete',
+    data: { aiChatDialogId, id: recordId },
+  })
+}
+
+export function chatRoleGetSystemList<T>(data: Common.ListRequest) {
+  return post<T>({
+    url: '/aiChatRole/getSystemList',
+    data,
+  })
+}
+
+export function chatRoleGetMyCreateList<T>(data: Common.ListRequest) {
+  return post<T>({
+    url: '/aiChatRole/getMyCreateList',
+    data,
+  })
+}
+
+export function chatRoleGetInfo<T>(aiRoleId: number) {
+  return post<T>({
+    url: '/aiChatRole/getInfo',
+    data: { aiRoleId },
+  })
+}
+
+// export function chatRoleEdit<T>(roleInfo: ChatRole.RoleInfo) {
+//   return post<T>({
+//     url: '/aiChatRole/edit',
+//     data: roleInfo,
+//   })
+// }
+
+export function chatRoleEditDeletes<T>(aiRoleIds: number[]) {
+  return post<T>({
+    url: '/aiChatRole/deletes',
+    data: { aiRoleIds },
+  })
+}
+
+// 登录相关
+
+export function login<T>(data: Login.LoginReqest) {
+  return post<T>({
+    url: '/login',
+    data,
+  })
+}
+
+export function logout<T>() {
+  return post<T>({
+    url: '/logout',
+  })
+}
+
+export function UserUpdateInfo<T>(headImage: string, name: string) {
+  return post<T>({
+    url: '/user/updateInfo',
+    data: { headImage, name },
+  })
+}
+
+export function AdminSystemSettingGetEmail<T>() {
+  return post<T>({
+    url: '/admin/systemSetting/getEmail',
+  })
+}
+
+export function AdminSystemSettingGetWebsiteSetting<T>() {
+  return post<T>({
+    url: '/admin/systemSetting/getApplicationSetting',
+  })
+}
+
+export function adminSystemSettingRoleManageGetSystemList<T>(data: Common.ListRequest) {
+  return post<T>({
+    url: '/admin/roleManage/getSystemList',
+    data,
+  })
+}
+
+export function adminSystemSettingRoleManageGetInfo<T>(aiRoleId: number) {
+  return post<T>({
+    url: '/admin/roleManage/getInfo',
+    data: { aiRoleId },
+  })
+}
+
+export function adminSystemSettingRoleManageDeletes<T>(aiRoleIds: number[]) {
+  return post<T>({
+    url: '/admin/roleManage/deletes',
+    data: { aiRoleIds },
+  })
+}

src/api/login.ts

@@ -0,0 +1,17 @@
+import { post } from '@/utils/request'
+
+// 下发重置密码的验证码到邮箱
+export function sendResetPasswordVCode<T>(email: string, verification: Common.VerificationRequest) {
+  return post<T>({
+    url: '/login/sendResetPasswordVCode',
+    data: { email, verification },
+  })
+}
+
+// 下发重置密码的验证码到邮箱
+export function resetPasswordByVCode<T>(data: Login.ResetPasswordByVCodeReqest) {
+  return post<T>({
+    url: '/login/resetPasswordByVCode',
+    data,
+  })
+}

src/api/notice.ts

@@ -0,0 +1,9 @@
+import { post } from '@/utils/request'
+
+// 下发重置密码的验证码到邮箱
+export function getListByDisplayType<T>(displayType: number[]) {
+  return post<T>({
+    url: '/notice/getListByDisplayType',
+    data: { displayType },
+  })
+}

src/api/openness.ts

@@ -0,0 +1,21 @@
+import { get } from '@/utils/request'
+
+export function getLoginConfig<T>() {
+  return get<T>({
+    url: '/openness/loginConfig',
+  })
+}
+
+// 获取免责声明
+export function getDisclaimer<T>() {
+  return get<T>({
+    url: '/openness/getDisclaimer',
+  })
+}
+
+// 获取关于的描述信息
+export function getAboutDescription<T>() {
+  return get<T>({
+    url: '/openness/getAboutDescription',
+  })
+}

src/api/panel/itemIcon.ts

@@ -0,0 +1,36 @@
+import { post } from '@/utils/request'
+
+// // 获取绘图的列表
+// export function getMyDrawList<T>(req: Common.ListRequest) {
+//   return post<T>({
+//     url: '/aiDraw/getMyDrawList',
+//     data: req,
+//   })
+// }
+
+export function edit<T>(req: Panel.ItemInfo) {
+  return post<T>({
+    url: '/panel/itemIcon/edit',
+    data: req,
+  })
+}
+
+// export function getInfo<T>(id: number) {
+//   return post<T>({
+//     url: '/aiApplet/getInfo',
+//     data: { id },
+//   })
+// }
+
+export function getListByGroupId<T>() {
+  return post<T>({
+    url: '/panel/itemIcon/getListByGroupId',
+  })
+}
+
+export function getSystemList<T>(data: Common.ListRequest) {
+  return post<T>({
+    url: '/aiApplet/getSystemList',
+    data,
+  })
+}

src/api/panel/userConfig.ts

@@ -0,0 +1,14 @@
+import { post } from '@/utils/request'
+
+export function set<T>(req: Panel.userConfig) {
+  return post<T>({
+    url: '/panel/userConfig/set',
+    data: req,
+  })
+}
+
+export function get<T>() {
+  return post<T>({
+    url: '/panel/userConfig/get',
+  })
+}

src/api/panel/users.ts

@@ -0,0 +1,27 @@
+import { post } from '@/utils/request'
+
+export function edit<T>(param: User.Info) {
+  let url = '/panel/users/create'
+  if (param.id)
+    url = '/panel/users/update'
+
+  return post<T>({
+    url,
+    data: param,
+  })
+}
+
+// 用户相关
+export function getList<T>(param: AdminUserManage.GetListRequest) {
+  return post<T>({
+    url: '/panel/users/getList',
+    data: param,
+  })
+}
+
+export function deletes<T>(userIds: number[]) {
+  return post<T>({
+    url: '/panel/users/deletes',
+    data: { userIds },
+  })
+}

src/api/register.ts

@@ -0,0 +1,15 @@
+import { post } from '@/utils/request'
+
+export function sendRegisterVcode<T>(data: System.Register.SendRegisterVcodeRquest) {
+  return post<T>({
+    url: '/register/sendRegisterVcode',
+    data,
+  })
+}
+
+export function commit<T>(data: System.Register.SendRegisterVcodeRquest) {
+  return post<T>({
+    url: '/register/commit',
+    data,
+  })
+}

src/api/system/about.ts

@@ -0,0 +1,7 @@
+import { post } from '@/utils/request'
+
+export function get<T>() {
+  return post<T>({
+    url: '/about',
+  })
+}

src/api/system/user.ts

@@ -0,0 +1,13 @@
+import { post } from '@/utils/request'
+
+export function getInfo<T>() {
+  return post<T>({
+    url: '/user/getInfo',
+  })
+}
+
+export function getReferralCode<T>() {
+  return post<T>({
+    url: '/user/getReferralCode',
+  })
+}

src/components/common/Captcha/index.vue

@@ -0,0 +1,40 @@
+<script setup lang='ts'>
+import { NImage } from 'naive-ui'
+import { ref } from 'vue'
+defineProps<{
+  src: string
+}>()
+
+const emit = defineEmits<{
+  (event: 'click'): void
+  (event: 'refresh'): void
+}>()
+
+const randCode = ref<string>('0')
+
+function handleClick() {
+  randCode.value = String(rand(100, 99999))
+  emit('click')
+}
+
+function rand(min: number, max: number) {
+  return Math.floor(Math.random() * (max - min)) + min
+}
+
+defineExpose({
+  // 刷新验证码
+  refresh() {
+    handleClick()
+  },
+})
+</script>
+
+<template>
+  <!-- <div> -->
+  <NImage
+    :src="`${src}?${randCode}`"
+    :preview-disabled="true"
+    @click="handleClick"
+  />
+  <!-- </div> -->
+</template>

src/components/common/HoverButton/Button.vue

@@ -0,0 +1,20 @@
+<script setup lang='ts'>
+interface Emit {
+  (e: 'click'): void
+}
+
+const emit = defineEmits<Emit>()
+
+function handleClick() {
+  emit('click')
+}
+</script>
+
+<template>
+  <button
+    class="flex items-center justify-center w-10 h-10 transition rounded-full hover:bg-neutral-100 dark:hover:bg-[#414755]"
+    @click="handleClick"
+  >
+    <slot />
+  </button>
+</template>

src/components/common/HoverButton/index.vue

@@ -0,0 +1,46 @@
+<script setup lang='ts'>
+import { computed } from 'vue'
+import type { PopoverPlacement } from 'naive-ui'
+import { NTooltip } from 'naive-ui'
+import Button from './Button.vue'
+
+interface Props {
+  tooltip?: string
+  placement?: PopoverPlacement
+}
+
+interface Emit {
+  (e: 'click'): void
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  tooltip: '',
+  placement: 'bottom',
+})
+
+const emit = defineEmits<Emit>()
+
+const showTooltip = computed(() => Boolean(props.tooltip))
+
+function handleClick() {
+  emit('click')
+}
+</script>
+
+<template>
+  <div v-if="showTooltip">
+    <NTooltip :placement="placement" trigger="hover">
+      <template #trigger>
+        <Button @click="handleClick">
+          <slot />
+        </Button>
+      </template>
+      {{ tooltip }}
+    </NTooltip>
+  </div>
+  <div v-else>
+    <Button @click="handleClick">
+      <slot />
+    </Button>
+  </div>
+</template>

src/components/common/ItemIcon/index.vue

@@ -0,0 +1,48 @@
+<script setup lang="ts">
+import { NAvatar, NImage } from 'naive-ui'
+import { computed, withDefaults } from 'vue'
+import { SvgIcon } from '@/components/common'
+
+interface Prop {
+  itemIcon?: Panel.ItemIcon | null
+  size?: number // 默认70
+}
+
+const props = withDefaults(defineProps<Prop>(), { size: 70 })
+const defaultStyle = { width: `${props.size}px`, height: `${props.size}px` }
+const iconExt = computed(() => {
+  return props.itemIcon?.src?.split('.').pop()
+})
+</script>
+
+<template>
+  <div class="overflow-hidden rounded-2xl" :style="defaultStyle">
+    <slot>
+      <div v-if="itemIcon">
+        <div v-if="itemIcon?.itemType === 1">
+          <NAvatar :size="props.size" :style="{ backgroundColor: itemIcon?.bgColor }">
+            {{ itemIcon.text }}
+          </NAvatar>
+        </div>
+
+        <div v-else-if="itemIcon?.itemType === 2">
+          <div v-if="iconExt === 'svg'" :style="defaultStyle" class="flex justify-center items-center">
+            <img :src="itemIcon?.src" class="w-[35px] h-[35px]">
+            <!-- <object :data="itemIcon?.src" type="image/svg+xml" class="w-[35px] h-[35px]" style="fill: rgb(255, 255, 255) !important;" /> -->
+          </div>
+          <NImage v-else :style="defaultStyle" :src="itemIcon?.src" preview-disabled />
+        </div>
+
+        <div v-else-if="itemIcon?.itemType === 3">
+          <NAvatar :size="props.size" :style="{ backgroundColor: itemIcon?.bgColor }">
+            <SvgIcon style="font-size: 35px;" :icon="itemIcon.text" />
+          </NAvatar>
+        </div>
+      </div>
+
+      <div v-else>
+        <NAvatar :size="props.size" />
+      </div>
+    </slot>
+  </div>
+</template>

src/components/common/NaiveProvider/index.vue

@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import { defineComponent, h } from 'vue'
+import {
+  NDialogProvider,
+  NLoadingBarProvider,
+  NMessageProvider,
+  NNotificationProvider,
+  useDialog,
+  useLoadingBar,
+  useMessage,
+  useNotification,
+} from 'naive-ui'
+
+function registerNaiveTools() {
+  window.$loadingBar = useLoadingBar()
+  window.$dialog = useDialog()
+  window.$message = useMessage()
+  window.$notification = useNotification()
+}
+
+const NaiveProviderContent = defineComponent({
+  name: 'NaiveProviderContent',
+  setup() {
+    registerNaiveTools()
+  },
+  render() {
+    return h('div')
+  },
+})
+</script>
+
+<template>
+  <NLoadingBarProvider>
+    <NDialogProvider>
+      <NNotificationProvider>
+        <NMessageProvider>
+          <slot />
+          <NaiveProviderContent />
+        </NMessageProvider>
+      </NNotificationProvider>
+    </NDialogProvider>
+  </NLoadingBarProvider>
+</template>

src/components/common/RoundCardModal/index.vue

@@ -0,0 +1,51 @@
+<script setup lang="ts">
+import { computed, useAttrs } from 'vue'
+import { NModal } from 'naive-ui'
+const props = defineProps<{
+  title?: string
+  show: boolean
+  size?: 'medium' | 'small' | 'large' | 'huge' | undefined
+}>()
+
+const emit = defineEmits<Emit>()
+interface Emit {
+  (e: 'update:show', show: boolean): void
+//   (e: 'done', item: Panel.Info): void// 创建完成
+}
+
+const attrs = useAttrs()
+
+const bindAttrs = computed<{ class: string; style: string }>(() => ({
+  class: (attrs.class as string) || '',
+  style: (attrs.style as string) || '',
+}))
+
+// 更新值父组件传来的值
+const showModal = computed({
+  get: () => props.show,
+  set: (show: boolean) => {
+    emit('update:show', show)
+  },
+})
+</script>
+
+<template>
+  <NModal v-model:show="showModal" preset="card" :size="size" v-bind="bindAttrs" style="border-radius: 1rem;width: 600px;" :title="title">
+    <template #cover>
+      <slot name="cover" />
+    </template>
+    <template #header>
+      <slot name="header" />
+    </template>
+    <template #eader-extra>
+      <slot name="header-extra" />
+    </template>
+    <template #footer>
+      <slot name="footer" />
+    </template>
+    <template #action>
+      <slot name="action" />
+    </template>
+    <slot />
+  </NModal>
+</template>

src/components/common/Setting/About.vue

@@ -0,0 +1,82 @@
+<script setup lang='ts'>
+import { onMounted, ref } from 'vue'
+import { NSpin } from 'naive-ui'
+import { fetchChatConfig } from '@/api'
+import { getAboutDescription as getAboutDescriptionApi } from '@/api/openness'
+
+interface ConfigState {
+  timeoutMs?: number
+  reverseProxy?: string
+  apiModel?: string
+  socksProxy?: string
+  httpsProxy?: string
+  usage?: string
+}
+
+const loading = ref(false)
+
+const config = ref<ConfigState>()
+
+const content = ref<string>()
+
+async function fetchConfig() {
+  try {
+    loading.value = true
+    const { data } = await fetchChatConfig<ConfigState>()
+    config.value = data
+  }
+  finally {
+    loading.value = false
+  }
+}
+
+onMounted(() => {
+  fetchConfig()
+  getAboutDescription()
+})
+
+async function getAboutDescription() {
+  const { data } = await getAboutDescriptionApi<string>()
+  content.value = data
+}
+</script>
+
+<template>
+  <NSpin :show="loading">
+    <div class="p-4 space-y-4">
+      <h2 class="text-xl font-bold">
+        {{ $t('common.appName') }}
+      </h2>
+      <div>
+        <span v-html="content" />
+      </div>
+
+      <!-- <div class="p-2 space-y-2 rounded-md bg-neutral-100 dark:bg-neutral-700">
+        <p>
+          此项目开源于
+          <a
+            class="text-blue-600 dark:text-blue-500"
+            href="https://github.com/Chanzhaoyu/chatgpt-web"
+            target="_blank"
+          >
+            GitHub
+          </a>
+          ，免费且基于 MIT 协议，没有任何形式的付费行为！
+        </p>
+        <p>
+          如果你觉得此项目对你有帮助，请在 GitHub 帮我点个 Star 或者给予一点赞助，谢谢！
+        </p>
+      </div> -->
+      <!-- <p>{{ $t("setting.api") }}：{{ config?.apiModel ?? '-' }}</p>
+      <p v-if="isChatGPTAPI">
+        {{ $t("setting.monthlyUsage") }}：{{ config?.usage ?? '-' }}
+      </p>
+      <p v-if="!isChatGPTAPI">
+        {{ $t("setting.reverseProxy") }}：{{ config?.reverseProxy ?? '-' }}
+      </p>
+      <p>{{ $t("setting.timeout") }}：{{ config?.timeoutMs ?? '-' }}</p>
+      <p>{{ $t("setting.socks") }}：{{ config?.socksProxy ?? '-' }}</p>
+      <p>{{ $t("setting.httpsProxy") }}：{{ config?.httpsProxy ?? '-' }}</p> -->
+    </div>
+  </NSpin>
+</template>

src/components/common/Setting/General.vue

@@ -0,0 +1,225 @@
+<!-- eslint-disable eslint-comments/no-unlimited-disable
+<script lang="ts" setup>
+import { computed, ref } from 'vue'
+import { NButton, NInput, NPopconfirm, NSelect, useMessage } from 'naive-ui'
+import type { Language, Theme } from '@/store/modules/app/helper'
+import { SvgIcon } from '@/components/common'
+import { useAppStore, useUserStore } from '@/store'
+import type { UserInfo } from '@/store/modules/user/helper'
+import { getCurrentDate } from '@/utils/functions'
+import { useBasicLayout } from '@/hooks/useBasicLayout'
+import { t } from '@/locales'
+
+const appStore = useAppStore()
+const userStore = useUserStore()
+
+const { isMobile } = useBasicLayout()
+
+const ms = useMessage()
+
+const theme = computed(() => appStore.theme)
+
+const userInfo = computed(() => userStore.userInfo)
+
+const avatar = ref(userInfo.value.headImage ?? '')
+
+const name = ref(userInfo.value.name ?? '')
+
+// const description = ref(userInfo.value.description ?? '')
+
+const language = computed({
+  get() {
+    return appStore.language
+  },
+  set(value: Language) {
+    appStore.setLanguage(value)
+  },
+})
+
+const themeOptions: { label: string; key: Theme; icon: string }[] = [
+  {
+    label: 'Auto',
+    key: 'auto',
+    icon: 'ri:contrast-line',
+  },
+  {
+    label: 'Light',
+    key: 'light',
+    icon: 'ri:sun-foggy-line',
+  },
+  {
+    label: 'Dark',
+    key: 'dark',
+    icon: 'ri:moon-foggy-line',
+  },
+]
+
+const languageOptions: { label: string; key: Language; value: Language }[] = [
+  { label: '简体中文', key: 'zh-CN', value: 'zh-CN' },
+  { label: '繁體中文', key: 'zh-TW', value: 'zh-TW' },
+  { label: 'English', key: 'en-US', value: 'en-US' },
+  { label: '한국어', key: 'ko-KR', value: 'ko-KR' },
+]
+
+function updateUserInfo(options: Partial<UserInfo>) {
+  // userStore.updateUserInfo(options)
+  ms.success(t('common.success'))
+}
+
+function handleReset() {
+  userStore.resetUserInfo()
+  ms.success(t('common.success'))
+  window.location.reload()
+}
+
+function exportData(): void {
+  const date = getCurrentDate()
+  const data: string = localStorage.getItem('chatStorage') || '{}'
+  const jsonString: string = JSON.stringify(JSON.parse(data), null, 2)
+  const blob: Blob = new Blob([jsonString], { type: 'application/json' })
+  const url: string = URL.createObjectURL(blob)
+  const link: HTMLAnchorElement = document.createElement('a')
+  link.href = url
+  link.download = `chat-store_${date}.json`
+  document.body.appendChild(link)
+  link.click()
+  document.body.removeChild(link)
+}
+
+function importData(event: Event): void {
+  const target = event.target as HTMLInputElement
+  if (!target || !target.files)
+    return
+
+  const file: File = target.files[0]
+  if (!file)
+    return
+
+  const reader: FileReader = new FileReader()
+  reader.onload = () => {
+    try {
+      const data = JSON.parse(reader.result as string)
+      localStorage.setItem('chatStorage', JSON.stringify(data))
+      ms.success(t('common.success'))
+      location.reload()
+    }
+    catch (error) {
+      ms.error(t('common.invalidFileFormat'))
+    }
+  }
+  reader.readAsText(file)
+}
+
+function clearData(): void {
+  localStorage.removeItem('chatStorage')
+  location.reload()
+}
+
+function handleImportButtonClick(): void {
+  const fileInput = document.getElementById('fileInput') as HTMLElement
+  if (fileInput)
+    fileInput.click()
+}
+</script>
+
+<template>
+  <div class="p-4 space-y-5 min-h-[200px]">
+    <div class="space-y-6">
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.avatarLink') }}</span>
+        <div class="flex-1">
+          <NInput v-model:value="avatar" placeholder="" />
+        </div>
+        <NButton size="tiny" text type="primary" @click="updateUserInfo({ headImage })">
+          {{ $t('common.save') }}
+        </NButton>
+      </div>
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.name') }}</span>
+        <div class="w-[200px]">
+          <NInput v-model:value="name" placeholder="" />
+        </div>
+        <NButton size="tiny" text type="primary" @click="updateUserInfo({ name })">
+          {{ $t('common.save') }}
+        </NButton>
+      </div>
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.description') }}</span>
+        <div class="flex-1">
+          <NInput v-model:value="description" placeholder="" />
+        </div>
+        <NButton size="tiny" text type="primary" @click="updateUserInfo({ description })">
+          {{ $t('common.save') }}
+        </NButton>
+      </div>
+      <div
+        class="flex items-center space-x-4"
+        :class="isMobile && 'items-start'"
+      >
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.chatHistory') }}</span>
+
+        <div class="flex flex-wrap items-center gap-4">
+          <NButton size="small" @click="exportData">
+            <template #icon>
+              <SvgIcon icon="ri:download-2-fill" />
+            </template>
+            {{ $t('common.export') }}
+          </NButton>
+
+          <input id="fileInput" type="file" style="display:none" @change="importData">
+          <NButton size="small" @click="handleImportButtonClick">
+            <template #icon>
+              <SvgIcon icon="ri:upload-2-fill" />
+            </template>
+            {{ $t('common.import') }}
+          </NButton>
+
+          <NPopconfirm placement="bottom" @positive-click="clearData">
+            <template #trigger>
+              <NButton size="small">
+                <template #icon>
+                  <SvgIcon icon="ri:close-circle-line" />
+                </template>
+                {{ $t('common.clear') }}
+              </NButton>
+            </template>
+            {{ $t('chat.clearHistoryConfirm') }}
+          </NPopconfirm>
+        </div>
+      </div>
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.theme') }}</span>
+        <div class="flex flex-wrap items-center gap-4">
+          <template v-for="item of themeOptions" :key="item.key">
+            <NButton
+              size="small"
+              :type="item.key === theme ? 'primary' : undefined"
+              @click="appStore.setTheme(item.key)"
+            >
+              <template #icon>
+                <SvgIcon :icon="item.icon" />
+              </template>
+            </NButton>
+          </template>
+        </div>
+      </div>
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.language') }}</span>
+        <div class="flex flex-wrap items-center gap-4">
+          <NSelect
+            style="width: 140px"
+            :value="language"
+            :options="languageOptions"
+            @update-value="value => appStore.setLanguage(value)"
+          />
+        </div>
+      </div>
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.resetUserInfo') }}</span>
+        <NButton size="small" @click="handleReset">
+          {{ $t('common.reset') }}
+        </NButton>
+      </div>
+    </div>
+  </div>
+</template> -->

src/components/common/Setting/InviteUsers.vue

@@ -0,0 +1,62 @@
+<script setup lang='ts'>
+import { onMounted, ref } from 'vue'
+import { NButton, NInput, NInputGroup, NSpin } from 'naive-ui'
+import { useClipboard } from '@vueuse/core'
+import { getReferralCode as getReferralCodeApi } from '@/api/system/user'
+// import { copyText } from '@/utils/format'
+
+const loading = ref(false)
+
+const referralCode = ref<string>('')
+const url = ref<string>('')
+const copyButtonText = ref<string>('')
+
+async function getReferralCode() {
+  try {
+    loading.value = true
+    const { data } = await getReferralCodeApi<User.GetReferralCodeResponse>()
+    referralCode.value = data.referralCode
+    url.value = `${getCurrentDomain()}/#/register?referralCode=${referralCode.value}`
+  }
+  finally {
+    loading.value = false
+  }
+}
+
+function getCurrentDomain() {
+  return `${location.protocol}//${location.hostname}${location.port === '' ? '' : (`:${location.port}`)}`
+}
+
+function handleCopy() {
+  const { copy } = useClipboard()
+  //   copyText({ text: urlCopy })
+  copy(url.value)
+  copyButtonText.value = '复制完成！'
+  setInterval(() => {
+    copyButtonText.value = '复制链接'
+  }, 3000)
+}
+
+onMounted(() => {
+  getReferralCode()
+  copyButtonText.value = '复制链接'
+})
+</script>
+
+<template>
+  <NSpin :show="loading">
+    <div class="p-4 space-y-4">
+      <h2 class="text-xl ">
+        您的专属推荐链接
+      </h2>
+      <div>
+        <NInputGroup>
+          <NInput v-model:value="url" readonly type="text" />
+          <NButton type="primary" ghost @click="handleCopy">
+            {{ copyButtonText }}
+          </NButton>
+        </NInputGroup>
+      </div>
+    </div>
+  </NSpin>
+</template>

src/components/common/Setting/UserInfo.vue

@@ -0,0 +1,227 @@
+<script lang="ts" setup>
+import { computed, ref } from 'vue'
+import type { UploadFileInfo } from 'naive-ui'
+import { NAvatar, NButton, NInput, NUpload, useDialog, useMessage } from 'naive-ui'
+// import type { Language, Theme } from '@/store/modules/app/helper'
+import type { Theme } from '@/store/modules/app/helper'
+import { SvgIcon } from '@/components/common'
+import { useAppStore, useAuthStore, useUserStore } from '@/store'
+import type { UserInfo } from '@/store/modules/user/helper'
+import { t } from '@/locales'
+import { UserUpdateInfo, logout } from '@/api'
+import { router } from '@/router'
+
+// import defaultAvatar from '@/assets/userDefaultAvatar.png'
+
+const appStore = useAppStore()
+const userStore = useUserStore()
+const authStore = useAuthStore()
+
+const ms = useMessage()
+const dialog = useDialog()
+
+const theme = computed(() => appStore.theme)
+
+const userInfo = computed(() => userStore.userInfo)
+
+const avatar = ref(userInfo.value.headImage ?? '')
+
+const name = ref(userInfo.value.name ?? '')
+
+// const description = ref(userInfo.value.description ?? '')
+
+// const language = computed({
+//   get() {
+//     return appStore.language
+//   },
+//   set(value: Language) {
+//     appStore.setLanguage(value)
+//   },
+// })
+
+const themeOptions: { label: string; key: Theme; icon: string }[] = [
+  {
+    label: 'Auto',
+    key: 'auto',
+    icon: 'ri:contrast-line',
+  },
+  {
+    label: 'Light',
+    key: 'light',
+    icon: 'ri:sun-foggy-line',
+  },
+  {
+    label: 'Dark',
+    key: 'dark',
+    icon: 'ri:moon-foggy-line',
+  },
+]
+
+// const languageOptions: { label: string; key: Language; value: Language }[] = [
+//   { label: '简体中文', key: 'zh-CN', value: 'zh-CN' },
+//   { label: '繁體中文', key: 'zh-TW', value: 'zh-TW' },
+//   { label: 'English', key: 'en-US', value: 'en-US' },
+//   { label: '한국어', key: 'ko-KR', value: 'ko-KR' },
+// ]
+
+function updateUserInfo(options: Partial<UserInfo>) {
+  userStore.updateUserInfo({
+    headImage: userInfo.value.headImage,
+    name: options.name as string,
+  })
+  UserUpdateInfo(userInfo.value.headImage as string, options.name as string)
+  ms.success(t('common.success'))
+}
+
+// function uploadHeadImage(options: Partial<UserInfo>) {
+
+// }
+
+function onLogoutClick() {
+  dialog.warning({
+    title: '警告',
+    content: '你确定要退出登录',
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: () => {
+      logoutApi()
+    },
+  })
+}
+
+async function logoutApi() {
+  await logout()
+  userStore.resetUserInfo()
+  authStore.removeToken()
+  ms.success('您已经安全退出，期待与你再次相见！')
+  router.push({ path: '/login' })
+}
+
+const handleFinish = ({
+  file,
+  event,
+}: {
+  file: UploadFileInfo
+  event?: ProgressEvent
+}) => {
+  const res = JSON.parse((event?.target as XMLHttpRequest).response)
+  // {
+  //     "code": 0,
+  //     "data": {
+  //         "imageUrl": "/uploads/2023/5/12/c94306cfdf37fe7844753cd98fd57aaf.jpg"
+  //     },
+  //     "msg": "OK"
+  // }
+  const imageUrl = res.data.imageUrl
+  userStore.updateUserInfo({
+    headImage: imageUrl,
+    name: userInfo.value.name,
+  })
+  avatar.value = imageUrl
+  UserUpdateInfo(imageUrl, userInfo.value.name || '')
+
+  return file
+}
+</script>
+
+<template>
+  <div class="p-4 space-y-5 min-h-[200px]">
+    <div class="space-y-6">
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">账号/邮箱</span>
+        <div class="w-[200px]">
+          <NInput v-model:value="userInfo.username" :disabled="true" readonly placeholder="" />
+        </div>
+      </div>
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">密码</span>
+        <div class="w-[200px]">
+          <NButton @click="router.push({ path: '/resetPassword', query: { u: userInfo.username } })">
+            重置密码
+          </NButton>
+        </div>
+      </div>
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.avatar') }}</span>
+        <div class="w-[50px]">
+          <NAvatar
+            round
+            :size="48"
+            :src="avatar ? avatar : ''"
+          />
+        </div>
+        <NUpload
+          action="/api/file/uploadImg"
+          name="imgfile"
+          :headers="{
+            token: authStore.token as string,
+          }"
+          @finish="handleFinish"
+        >
+          <NButton size="tiny" text type="primary">
+            上传文件
+          </NButton>
+        </NUpload>
+        <!-- <NButton size="tiny" text type="primary" @click="uploadHeadImage({ avatar })">
+          选择文件
+        </NButton> -->
+      </div>
+      <!-- <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.avatarLink') }}</span>
+        <div class="flex-1">
+          <NInput v-model:value="avatar" placeholder="" />
+        </div>
+        <NButton size="tiny" text type="primary" @click="updateUserInfo({ avatar })">
+          {{ $t('common.save') }}
+        </NButton>
+      </div> -->
+
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.name') }}</span>
+        <div class="w-[200px]">
+          <NInput v-model:value="name" placeholder="" />
+        </div>
+        <NButton size="tiny" text type="primary" @click="updateUserInfo({ name })">
+          {{ $t('common.save') }}
+        </NButton>
+      </div>
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.theme') }}</span>
+        <div class="flex flex-wrap items-center gap-4">
+          <template v-for="item of themeOptions" :key="item.key">
+            <NButton
+              size="small"
+              :type="item.key === theme ? 'primary' : undefined"
+              @click="appStore.setTheme(item.key)"
+            >
+              <template #icon>
+                <SvgIcon :icon="item.icon" />
+              </template>
+            </NButton>
+          </template>
+        </div>
+      </div>
+      <!-- <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.language') }}</span>
+        <div class="flex flex-wrap items-center gap-4">
+          <NSelect
+            style="width: 140px"
+            :value="language"
+            :options="languageOptions"
+            @update-value="value => appStore.setLanguage(value)"
+          />
+        </div>
+      </div> -->
+
+      <div class="flex items-center space-x-4">
+        <span class="flex-shrink-0 w-[100px]" />
+        <NButton size="small" type="error" strong secondary @click="onLogoutClick">
+          <template #icon>
+            <SvgIcon icon="oi:account-logout" />
+          </template>
+          安全退出账号
+        </NButton>
+      </div>
+    </div>
+  </div>
+</template>

src/components/common/Setting/index.vue

@@ -0,0 +1,80 @@
+<script setup lang='ts'>
+import { computed, ref } from 'vue'
+import { NModal, NTabPane, NTabs } from 'naive-ui'
+import UserInfo from './UserInfo.vue'
+// import Advanced from './Advanced.vue'
+import About from './About.vue'
+import InviteUsers from './InviteUsers.vue'
+
+// import { useAuthStore } from '@/store'
+import { SvgIcon } from '@/components/common'
+
+interface Props {
+  visible: boolean
+}
+
+interface Emit {
+  (e: 'update:visible', visible: boolean): void
+}
+
+const props = defineProps<Props>()
+
+const emit = defineEmits<Emit>()
+
+// const authStore = useAuthStore()
+
+// const isChatGPTAPI = computed<boolean>(() => !!authStore.isChatGPTAPI)
+
+const active = ref('General')
+
+const show = computed({
+  get() {
+    return props.visible
+  },
+  set(visible: boolean) {
+    emit('update:visible', visible)
+  },
+})
+</script>
+
+<template>
+  <NModal v-model:show="show" :auto-focus="false" preset="card" style="width: 95%; max-width: 640px">
+    <div>
+      <NTabs v-model:value="active" type="line" animated>
+        <NTabPane name="General" tab="General">
+          <template #tab>
+            <SvgIcon class="text-lg" icon="ri:file-user-line" />
+            <span class="ml-2">设置</span>
+          </template>
+          <div class="min-h-[100px]">
+            <UserInfo />
+          </div>
+        </NTabPane>
+        <!-- <NTabPane v-if="isChatGPTAPI" name="Advanced" tab="Advanced">
+          <template #tab>
+            <SvgIcon class="text-lg" icon="ri:equalizer-line" />
+            <span class="ml-2">{{ $t('setting.advanced') }}</span>
+          </template>
+          <div class="min-h-[100px]">
+            <Advanced />
+          </div>
+        </NTabPane> -->
+        <NTabPane name="InviteUsers" tab="InviteUsers">
+          <template #tab>
+            <SvgIcon class="text-lg" icon="mdi:invite" />
+            <span class="ml-2">邀请新用户</span>
+          </template>
+          <InviteUsers />
+        </NTabPane>
+
+        <NTabPane name="About" tab="about">
+          <template #tab>
+            <SvgIcon class="text-lg" icon="mdi:about-circle-outline" />
+            <span class="ml-2">关于</span>
+          </template>
+          <About />
+        </NTabPane>
+      </NTabs>
+    </div>
+  </NModal>
+</template>

src/components/common/SvgIcon/index.vue

@@ -0,0 +1,21 @@
+<script setup lang='ts'>
+import { computed, useAttrs } from 'vue'
+import { Icon } from '@iconify/vue'
+
+interface Props {
+  icon?: string
+}
+
+defineProps<Props>()
+
+const attrs = useAttrs()
+
+const bindAttrs = computed<{ class: string; style: string }>(() => ({
+  class: (attrs.class as string) || '',
+  style: (attrs.style as string) || '',
+}))
+</script>
+
+<template>
+  <Icon :icon="icon ?? ''" v-bind="bindAttrs" />
+</template>

src/components/common/Verification/index.vue

@@ -0,0 +1,72 @@
+<script setup lang='ts'>
+import { computed, ref, watch } from 'vue'
+import { NButton, NInput, NModal, useMessage } from 'naive-ui'
+import { Captcha } from '@/components/common'
+
+const props = defineProps<{
+  visible: boolean
+  verificationId: string
+  loading?: boolean
+  title?: string
+}>()
+const emit = defineEmits<{
+  (e: 'update:visible', visible: boolean): void
+  (e: 'update:loading', loading: boolean): void
+  (e: 'done', id: number): void// 创建完成
+  (e: 'onSubmit', verificationId: string, vCode: string, obj: { refresh: () => void }): void // 提交
+}>()
+const ms = useMessage()
+const vCode = ref<string>('')
+const captchaRef = ref()
+
+// 更新值父组件传来的值
+const show = computed({
+  get: () => props.visible,
+  set: (visible: boolean) => {
+    emit('update:visible', visible)
+  },
+})
+
+watch(show, (newValue, oldValue) => {
+  if (newValue === true) {
+    captchaRef.value?.refresh()
+    vCode.value = ''
+    emit('update:loading', false)
+  }
+})
+
+// 提交
+function handleSubmit() {
+  if (vCode.value === '') {
+    ms.warning('验证码必须填写')
+    return
+  }
+
+  if (!props.loading) {
+    emit('onSubmit', props.verificationId, vCode.value, {
+      refresh() {
+        captchaRef.value?.refresh()
+        vCode.value = ''
+      },
+    })
+  }
+}
+</script>
+
+<template>
+  <div>
+    <NModal v-model:show="show" preset="card" style="width: 400px" :title="title ?? '请输入验证码继续'" :mask-closable="false">
+      <Captcha ref="captchaRef" class="rounded border" :src="`/api/captcha/getImageByCaptchaId/${verificationId}/200/60?0`" />
+      <div class="flex">
+        <div class="flex w-[80%]">
+          <NInput v-model:value="vCode" placeholder="输入图中字母或数字后继续" @keydown.enter="handleSubmit" />
+        </div>
+        <div class="flex ml-[auto]">
+          <NButton type="info" :loading="loading" :disabled="loading" @click="handleSubmit">
+            继续
+          </NButton>
+        </div>
+      </div>
+    </NModal>
+  </div>
+</template>

src/components/common/index.ts

@@ -0,0 +1,19 @@
+import HoverButton from './HoverButton/index.vue'
+import SvgIcon from './SvgIcon/index.vue'
+import Setting from './Setting/index.vue'
+import Captcha from './Captcha/index.vue'
+import Verification from './Verification/index.vue'
+import ItemIcon from './ItemIcon/index.vue'
+import NaiveProvider from './NaiveProvider/index.vue'
+import RoundCardModal from './RoundCardModal/index.vue'
+
+export {
+  Verification,
+  HoverButton,
+  SvgIcon,
+  Setting,
+  Captcha,
+  ItemIcon,
+  NaiveProvider,
+  RoundCardModal,
+}

src/components/custom/GithubSite.vue

@@ -0,0 +1,8 @@
+<template>
+  <div class="text-neutral-400">
+    <span>Star on</span>
+    <a href="https://github.com/Chanzhaoyu/chatgpt-bot" target="_blank" class="text-blue-500">
+      GitHub
+    </a>
+  </div>
+</template>

src/components/custom/index.ts

@@ -0,0 +1,3 @@
+import GithubSite from './GithubSite.vue'
+
+export { GithubSite }

src/components/deskModule/Clock/index.vue

@@ -0,0 +1,74 @@
+<script setup lang="ts">
+import { onBeforeUnmount, onMounted, ref } from 'vue'
+
+const props = defineProps<{
+  hideSecond?: boolean
+}>()
+
+interface CurrentDate {
+  time: string
+  date: string
+  week: string
+}
+
+const currentDate = ref<CurrentDate>({
+  time: '--:--',
+  date: '------',
+  week: '--',
+})
+
+function updateCurrentDate() {
+  const now = new Date()
+  const hours = String(now.getHours()).padStart(2, '0')
+  const minutes = String(now.getMinutes()).padStart(2, '0')
+
+  if (!props.hideSecond) {
+    const seconds = String(now.getSeconds()).padStart(2, '0')
+    currentDate.value.time = `${hours}:${minutes}:${seconds}`
+  }
+  else {
+    currentDate.value.time = `${hours}:${minutes}`
+  }
+
+  // 获取当前的日期
+  const day = now.getDate()
+  const month = now.getMonth() + 1 // 月份从0开始，所以要加1
+  // const year = now.getFullYear()
+
+  const daysOfWeek = ['日', '一', '二', '三', '四', '五', '六']
+  // const daysOfWeek = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']
+  currentDate.value.week = daysOfWeek[now.getDay()]
+  currentDate.value.date = `${month}-${day}`
+}
+
+const updateClock = () => {
+  updateCurrentDate()
+}
+
+const intervalId = setInterval(updateClock, 1000)
+
+onMounted(() => {
+  updateClock()
+  updateCurrentDate()
+})
+
+onBeforeUnmount(() => {
+  clearInterval(intervalId)
+})
+</script>
+
+<template>
+  <div class="w-full text-center">
+    <span class="text-3xl font-[600]">
+      {{ currentDate.time }}
+    </span>
+    <div>
+      <span>
+        {{ currentDate.date }}
+      </span>
+      <span>
+        星期{{ currentDate.week }}
+      </span>
+    </div>
+  </div>
+</template>

src/components/deskModule/SearchBox/index.vue

@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import { NInput } from 'naive-ui'
+import { SvgIcon } from '@/components/common'
+</script>
+
+<template>
+  <div class="w-full">
+    <NInput size="large" class="background" round placeholder="输入搜索内容">
+      <template #prefix>
+        百度
+      </template>
+      <template #suffix>
+        <SvgIcon icon="iconamoon:search-fill" />
+      </template>
+    </NInput>
+  </div>
+</template>
+
+<style scoped>
+.background{
+  background-color: #ffffff78;
+}
+</style>

src/components/deskModule/index.ts

@@ -0,0 +1,4 @@
+import Clock from './Clock/index.vue'
+import SearchBox from './SearchBox/index.vue'
+
+export { Clock, SearchBox }

src/enum.ts

@@ -0,0 +1,11 @@
+export enum PanelStateNetworkModeEnum {
+  // 局域网
+  'lan' = 0,
+  // 互联网
+  'wan' = 1,
+}
+
+export enum PanelPanelConfigStyleEnum {
+  'icon' = 0, // 图标风格
+  'info' = 1, // 详情风格
+}

src/hooks/useBasicLayout.ts

@@ -0,0 +1,8 @@
+import { breakpointsTailwind, useBreakpoints } from '@vueuse/core'
+
+export function useBasicLayout() {
+  const breakpoints = useBreakpoints(breakpointsTailwind)
+  const isMobile = breakpoints.smaller('sm')
+
+  return { isMobile }
+}

src/hooks/useIconRender.ts

@@ -0,0 +1,36 @@
+import { h } from 'vue'
+import { SvgIcon } from '@/components/common'
+
+export const useIconRender = () => {
+  interface IconConfig {
+    icon?: string
+    color?: string
+    fontSize?: number
+  }
+
+  interface IconStyle {
+    color?: string
+    fontSize?: string
+  }
+
+  const iconRender = (config: IconConfig) => {
+    const { color, fontSize, icon } = config
+
+    const style: IconStyle = {}
+
+    if (color)
+      style.color = color
+
+    if (fontSize)
+      style.fontSize = `${fontSize}px`
+
+    if (!icon)
+      window.console.warn('iconRender: icon is required')
+
+    return () => h(SvgIcon, { icon, style })
+  }
+
+  return {
+    iconRender,
+  }
+}

src/hooks/useLanguage.ts

@@ -0,0 +1,30 @@
+import { computed } from 'vue'
+import { enUS, koKR, zhCN, zhTW } from 'naive-ui'
+import { useAppStore } from '@/store'
+import { setLocale } from '@/locales'
+
+export function useLanguage() {
+  const appStore = useAppStore()
+
+  const language = computed(() => {
+    switch (appStore.language) {
+      case 'en-US':
+        setLocale('en-US')
+        return enUS
+      case 'ko-KR':
+        setLocale('ko-KR')
+        return koKR
+      case 'zh-CN':
+        setLocale('zh-CN')
+        return zhCN
+      case 'zh-TW':
+        setLocale('zh-TW')
+        return zhTW
+      default:
+        setLocale('zh-CN')
+        return zhCN
+    }
+  })
+
+  return { language }
+}

src/hooks/useTheme.ts

@@ -0,0 +1,43 @@
+import type { GlobalThemeOverrides } from 'naive-ui'
+import { computed, watch } from 'vue'
+import { darkTheme, useOsTheme } from 'naive-ui'
+import { useAppStore } from '@/store'
+
+export function useTheme() {
+  const appStore = useAppStore()
+
+  const OsTheme = useOsTheme()
+
+  const isDark = computed(() => {
+    if (appStore.theme === 'auto')
+      return OsTheme.value === 'dark'
+    else
+      return appStore.theme === 'dark'
+  })
+
+  const theme = computed(() => {
+    return isDark.value ? darkTheme : undefined
+  })
+
+  const themeOverrides = computed<GlobalThemeOverrides>(() => {
+    if (isDark.value) {
+      return {
+        common: {},
+      }
+    }
+    return {}
+  })
+
+  watch(
+    () => isDark.value,
+    (dark) => {
+      if (dark)
+        document.documentElement.classList.add('dark')
+      else
+        document.documentElement.classList.remove('dark')
+    },
+    { immediate: true },
+  )
+
+  return { theme, themeOverrides }
+}

src/locales/en-US.ts

@@ -0,0 +1,94 @@
+export default {
+  common: {
+    add: 'Add',
+    addSuccess: 'Add Success',
+    edit: 'Edit',
+    editSuccess: 'Edit Success',
+    delete: 'Delete',
+    deleteSuccess: 'Delete Success',
+    save: 'Save',
+    saveSuccess: 'Save Success',
+    reset: 'Reset',
+    action: 'Action',
+    export: 'Export',
+    exportSuccess: 'Export Success',
+    import: 'Import',
+    importSuccess: 'Import Success',
+    clear: 'Clear',
+    clearSuccess: 'Clear Success',
+    yes: 'Yes',
+    no: 'No',
+    confirm: 'Confirm',
+    download: 'Download',
+    noData: 'No Data',
+    wrong: 'Something went wrong, please try again later.',
+    success: 'Success',
+    failed: 'Failed',
+    verify: 'Verify',
+    unauthorizedTips: 'Unauthorized, please verify first.',
+  },
+  chat: {
+    newChatButton: 'New Chat',
+    placeholder: 'Ask me anything...(Shift + Enter = line break, "/" to trigger prompts)',
+    placeholderMobile: 'Ask me anything...',
+    copy: 'Copy',
+    copied: 'Copied',
+    copyCode: 'Copy Code',
+    clearChat: 'Clear Chat',
+    clearChatConfirm: 'Are you sure to clear this chat?',
+    exportImage: 'Export Image',
+    exportImageConfirm: 'Are you sure to export this chat to png?',
+    exportSuccess: 'Export Success',
+    exportFailed: 'Export Failed',
+    usingContext: 'Context Mode',
+    turnOnContext: 'In the current mode, sending messages will carry previous chat records.',
+    turnOffContext: 'In the current mode, sending messages will not carry previous chat records.',
+    deleteMessage: 'Delete Message',
+    deleteMessageConfirm: 'Are you sure to delete this message?',
+    deleteHistoryConfirm: 'Are you sure to clear this history?',
+    clearHistoryConfirm: 'Are you sure to clear chat history?',
+    preview: 'Preview',
+    showRawText: 'Show as raw text',
+  },
+  setting: {
+    setting: 'Setting',
+    general: 'General',
+    advanced: 'Advanced',
+    config: 'Config',
+    avatarLink: 'Avatar Link',
+    name: 'Name',
+    description: 'Description',
+    role: 'Role',
+    temperature: 'Temperature',
+    top_p: 'Top_p',
+    resetUserInfo: 'Reset UserInfo',
+    chatHistory: 'ChatHistory',
+    theme: 'Theme',
+    language: 'Language',
+    api: 'API',
+    reverseProxy: 'Reverse Proxy',
+    timeout: 'Timeout',
+    socks: 'Socks',
+    httpsProxy: 'HTTPS Proxy',
+    balance: 'API Balance',
+    monthlyUsage: 'Monthly Usage',
+  },
+  store: {
+    siderButton: 'Prompt Store',
+    local: 'Local',
+    online: 'Online',
+    title: 'Title',
+    description: 'Description',
+    clearStoreConfirm: 'Whether to clear the data?',
+    importPlaceholder: 'Please paste the JSON data here',
+    addRepeatTitleTips: 'Title duplicate, please re-enter',
+    addRepeatContentTips: 'Content duplicate: {msg}, please re-enter',
+    editRepeatTitleTips: 'Title conflict, please revise',
+    editRepeatContentTips: 'Content conflict {msg} , please re-modify',
+    importError: 'Key value mismatch',
+    importRepeatTitle: 'Title repeatedly skipped: {msg}',
+    importRepeatContent: 'Content is repeatedly skipped: {msg}',
+    onlineImportWarning: 'Note: Please check the JSON file source!',
+    downloadError: 'Please check the network status and JSON file validity',
+  },
+}

src/locales/index.ts

@@ -0,0 +1,38 @@
+import type { App } from 'vue'
+import { createI18n } from 'vue-i18n'
+import enUS from './en-US'
+import koKR from './ko-KR'
+import zhCN from './zh-CN'
+import zhTW from './zh-TW'
+import ruRU from './ru-RU'
+import { useAppStoreWithOut } from '@/store/modules/app'
+import type { Language } from '@/store/modules/app/helper'
+
+const appStore = useAppStoreWithOut()
+
+const defaultLocale = appStore.language || 'zh-CN'
+
+const i18n = createI18n({
+  locale: defaultLocale,
+  fallbackLocale: 'en-US',
+  allowComposition: true,
+  messages: {
+    'en-US': enUS,
+    'ko-KR': koKR,
+    'zh-CN': zhCN,
+    'zh-TW': zhTW,
+    'ru-RU': ruRU,
+  },
+})
+
+export const t = i18n.global.t
+
+export function setLocale(locale: Language) {
+  i18n.global.locale = locale
+}
+
+export function setupI18n(app: App) {
+  app.use(i18n)
+}
+
+export default i18n

src/locales/ko-KR.ts

@@ -0,0 +1,93 @@
+export default {
+  common: {
+    add: '추가',
+    addSuccess: '추가 성공',
+    edit: '편집',
+    editSuccess: '편집 성공',
+    delete: '삭제',
+    deleteSuccess: '삭제 성공',
+    save: '저장',
+    saveSuccess: '저장 성공',
+    reset: '초기화',
+    action: '액션',
+    export: '내보내기',
+    exportSuccess: '내보내기 성공',
+    import: '가져오기',
+    importSuccess: '가져오기 성공',
+    clear: '비우기',
+    clearSuccess: '비우기 성공',
+    yes: '예',
+    no: '아니오',
+    confirm: '확인',
+    download: '다운로드',
+    noData: '데이터 없음',
+    wrong: '문제가 발생했습니다. 나중에 다시 시도하십시오.',
+    success: '성공',
+    failed: '실패',
+    verify: '검증',
+    unauthorizedTips: '인증되지 않았습니다. 먼저 확인하십시오.',
+  },
+  chat: {
+    newChatButton: '새로운 채팅',
+    placeholder: '무엇이든 물어보세요...(Shift + Enter = 줄바꿈, "/"를 눌러서 힌트를 보세요)',
+    placeholderMobile: '무엇이든 물어보세요...',
+    copy: '복사',
+    copied: '복사됨',
+    copyCode: '코드 복사',
+    clearChat: '채팅 비우기',
+    clearChatConfirm: '이 채팅을 비우시겠습니까?',
+    exportImage: '이미지 내보내기',
+    exportImageConfirm: '이 채팅을 png로 내보내시겠습니까?',
+    exportSuccess: '내보내기 성공',
+    exportFailed: '내보내기 실패',
+    usingContext: '컨텍스트 모드',
+    turnOnContext: '현재 모드에서는 이전 대화 기록을 포함하여 메시지를 보낼 수 있습니다.',
+    turnOffContext: '현재 모드에서는 이전 대화 기록을 포함하지 않고 메시지를 보낼 수 있습니다.',
+    deleteMessage: '메시지 삭제',
+    deleteMessageConfirm: '이 메시지를 삭제하시겠습니까?',
+    deleteHistoryConfirm: '이 기록을 삭제하시겠습니까?',
+    clearHistoryConfirm: '채팅 기록을 삭제하시겠습니까?',
+    preview: '미리보기',
+    showRawText: '원본 텍스트로 보기',
+  },
+  setting: {
+    setting: '설정',
+    general: '일반',
+    advanced: '고급',
+    config: '설정',
+    avatarLink: '아바타 링크',
+    name: '이름',
+    description: '설명',
+    role: '역할',
+    temperature: '온도',
+    top_p: 'Top_p',
+    resetUserInfo: '사용자 정보 초기화',
+    chatHistory: '채팅 기록',
+    theme: '테마',
+    language: '언어',
+    api: 'API',
+    reverseProxy: '리버스 프록시',
+    timeout: '타임아웃',
+    socks: 'Socks',
+    httpsProxy: 'HTTPS 프록시',
+    balance: 'API 잔액',
+    monthlyUsage: '월 사용량',
+  },
+  store: {
+    siderButton: '프롬프트 저장소',
+    local: '로컬',
+    online: '온라인',
+    title: '제목',
+    description: '설명',
+    clearStoreConfirm: '데이터를 삭제하시겠습니까?',
+    importPlaceholder: '여기에 JSON 데이터를 붙여넣으십시오',
+    addRepeatTitleTips: '제목 중복됨, 다시 입력하십시오',
+    addRepeatContentTips: '내용 중복됨: {msg}, 다시 입력하십시오',
+    editRepeatTitleTips: '제목 충돌, 수정하십시오',
+    editRepeatContentTips: '내용 충돌 {msg} , 수정하십시오',
+    importError: '키 값 불일치',
+    importRepeatTitle: '제목이 반복되어 건너뜀: {msg}',
+    importRepeatContent: '내용이 반복되어 건너뜀: {msg}',
+    onlineImportWarning: '참고: JSON 파일 소스를 확인하십시오!',
+  },
+}

src/locales/ru-RU.ts

@@ -0,0 +1,94 @@
+export default {
+  common: {
+    add: 'Добавить',
+    addSuccess: 'Добавлено успешно',
+    edit: 'Редактировать',
+    editSuccess: 'Изменено успешно',
+    delete: 'Удалить',
+    deleteSuccess: 'Удалено успешно',
+    save: 'Сохранить',
+    saveSuccess: 'Сохранено успешно',
+    reset: 'Сбросить',
+    action: 'Действие',
+    export: 'Экспортировать',
+    exportSuccess: 'Экспорт выполнен успешно',
+    import: 'Импортировать',
+    importSuccess: 'Импорт выполнен успешно',
+    clear: 'Очистить',
+    clearSuccess: 'Очищено успешно',
+    yes: 'Да',
+    no: 'Нет',
+    confirm: 'Подтвердить',
+    download: 'Загрузить',
+    noData: 'Нет данных',
+    wrong: 'Что-то пошло не так, пожалуйста, повторите попытку позже.',
+    success: 'Успех',
+    failed: 'Не удалось',
+    verify: 'Проверить',
+    unauthorizedTips: 'Не авторизован, сначала подтвердите свою личность.',
+  },
+  chat: {
+    newChatButton: 'Новый чат',
+    placeholder: 'Спросите меня о чем-нибудь ... (Shift + Enter = перенос строки, "/" для вызова подсказок)',
+    placeholderMobile: 'Спросите меня о чем-нибудь ...',
+    copy: 'Копировать',
+    copied: 'Скопировано',
+    copyCode: 'Копировать код',
+    clearChat: 'Очистить чат',
+    clearChatConfirm: 'Вы уверены, что хотите очистить этот чат?',
+    exportImage: 'Экспорт в изображение',
+    exportImageConfirm: 'Вы уверены, что хотите экспортировать этот чат в формате PNG?',
+    exportSuccess: 'Экспортировано успешно',
+    exportFailed: 'Не удалось выполнить экспорт',
+    usingContext: 'Режим контекста',
+    turnOnContext: 'В текущем режиме отправка сообщений будет включать предыдущие записи чата.',
+    turnOffContext: 'В текущем режиме отправка сообщений не будет включать предыдущие записи чата.',
+    deleteMessage: 'Удалить сообщение',
+    deleteMessageConfirm: 'Вы уверены, что хотите удалить это сообщение?',
+    deleteHistoryConfirm: 'Вы уверены, что хотите очистить эту историю?',
+    clearHistoryConfirm: 'Вы уверены, что хотите очистить историю чата?',
+    preview: 'Предварительный просмотр',
+    showRawText: 'Показать как обычный текст',
+  },
+  setting: {
+    setting: 'Настройки',
+    general: 'Общее',
+    advanced: 'Дополнительно',
+    config: 'Конфигурация',
+    avatarLink: 'Ссылка на аватар',
+    name: 'Имя',
+    description: 'Описание',
+    role: 'Роль',
+    temperature: 'Температура',
+    top_p: 'Top_p',
+    resetUserInfo: 'Сбросить информацию о пользователе',
+    chatHistory: 'История чата',
+    theme: 'Тема',
+    language: 'Язык',
+    api: 'API',
+    reverseProxy: 'Обратный прокси-сервер',
+    timeout: 'Время ожидания',
+    socks: 'Socks',
+    httpsProxy: 'HTTPS-прокси',
+    balance: 'Баланс API',
+    monthlyUsage: 'Ежемесячное использование',
+  },
+  store: {
+    siderButton: 'Хранилище подсказок',
+    local: 'Локальное',
+    online: 'Онлайн',
+    title: 'Название',
+    description: 'Описание',
+    clearStoreConfirm: 'Вы действительно хотите очистить данные?',
+    importPlaceholder: 'Пожалуйста, вставьте здесь JSON-данные',
+    addRepeatTitleTips: 'Дубликат названия, пожалуйста, введите другое название',
+    addRepeatContentTips: 'Дубликат содержимого: {msg}, пожалуйста, введите другой текст',
+    editRepeatTitleTips: 'Конфликт названий, пожалуйста, измените название',
+    editRepeatContentTips: 'Конфликт содержимого {msg}, пожалуйста, измените текст',
+    importError: 'Не совпадает ключ-значение',
+    importRepeatTitle: 'Название повторяющееся, пропускается: {msg}',
+    importRepeatContent: 'Содержание повторяющееся, пропускается: {msg}',
+    onlineImportWarning: 'Внимание! Проверьте источник JSON-файла!',
+    downloadError: 'Проверьте состояние сети и правильность JSON-файла',
+  },
+}

src/locales/zh-CN.ts

@@ -0,0 +1,96 @@
+export default {
+  common: {
+    appName: 'Sun-Panel',
+    add: '添加',
+    addSuccess: '添加成功',
+    edit: '编辑',
+    editSuccess: '编辑成功',
+    delete: '删除',
+    deleteSuccess: '删除成功',
+    save: '保存',
+    saveSuccess: '保存成功',
+    reset: '重置',
+    action: '操作',
+    export: '导出',
+    exportSuccess: '导出成功',
+    import: '导入',
+    importSuccess: '导入成功',
+    clear: '清空',
+    clearSuccess: '清空成功',
+    yes: '是',
+    no: '否',
+    confirm: '确定',
+    download: '下载',
+    noData: '暂无数据',
+    wrong: '好像出错了，请稍后再试。',
+    success: '操作成功',
+    failed: '操作失败',
+    verify: '验证',
+    unauthorizedTips: '未经授权，请先进行验证。',
+  },
+  chat: {
+    newChatButton: '新建对话',
+    placeholder: '来说点什么吧...（Shift + Enter = 换行）',
+    placeholderMobile: '来说点什么...',
+    copy: '复制',
+    copied: '复制成功',
+    copyCode: '复制代码',
+    clearChat: '清空会话',
+    clearChatConfirm: '是否清空会话?',
+    exportImage: '保存会话到图片',
+    exportImageConfirm: '是否将会话保存为图片?',
+    exportSuccess: '保存成功',
+    exportFailed: '保存失败',
+    usingContext: '上下文模式',
+    turnOnContext: '当前模式下, 发送消息会携带之前的聊天记录',
+    turnOffContext: '当前模式下, 发送消息不会携带之前的聊天记录',
+    deleteMessage: '删除消息',
+    deleteMessageConfirm: '是否删除此消息?',
+    deleteHistoryConfirm: '确定删除此记录?',
+    clearHistoryConfirm: '确定清空聊天记录?',
+    preview: '预览',
+    showRawText: '显示原文',
+  },
+  setting: {
+    setting: '设置',
+    general: '总览',
+    advanced: '高级',
+    config: '配置',
+    avatarLink: '头像链接',
+    avatar: '头像',
+    name: '名称',
+    description: '描述',
+    role: '角色设定',
+    temperature: 'Temperature',
+    top_p: '回答多样性',
+    resetUserInfo: '重置用户信息',
+    chatHistory: '聊天记录',
+    theme: '主题',
+    language: '语言',
+    api: 'API',
+    reverseProxy: '反向代理',
+    timeout: '超时',
+    socks: 'Socks',
+    httpsProxy: 'HTTPS Proxy',
+    balance: 'API余额',
+    monthlyUsage: '本月使用量',
+  },
+  store: {
+    siderButton: '提示词商店',
+    local: '本地',
+    online: '在线',
+    title: '标题',
+    description: '描述',
+    clearStoreConfirm: '是否清空数据？',
+    importPlaceholder: '请粘贴 JSON 数据到此处',
+    addRepeatTitleTips: '标题重复，请重新输入',
+    addRepeatContentTips: '内容重复：{msg}，请重新输入',
+    editRepeatTitleTips: '标题冲突，请重新修改',
+    editRepeatContentTips: '内容冲突{msg} ，请重新修改',
+    importError: '键值不匹配',
+    importRepeatTitle: '标题重复跳过：{msg}',
+    importRepeatContent: '内容重复跳过：{msg}',
+    onlineImportWarning: '注意：请检查 JSON 文件来源！',
+    downloadError: '请检查网络状态与 JSON 文件有效性',
+  },
+}

src/locales/zh-TW.ts

@@ -0,0 +1,94 @@
+export default {
+  common: {
+    add: '新增',
+    addSuccess: '新增成功',
+    edit: '編輯',
+    editSuccess: '編輯成功',
+    delete: '刪除',
+    deleteSuccess: '刪除成功',
+    save: '儲存',
+    saveSuccess: '儲存成功',
+    reset: '重設',
+    action: '操作',
+    export: '匯出',
+    exportSuccess: '匯出成功',
+    import: '匯入',
+    importSuccess: '匯入成功',
+    clear: '清除',
+    clearSuccess: '清除成功',
+    yes: '是',
+    no: '否',
+    confirm: '確認',
+    download: '下載',
+    noData: '目前無資料',
+    wrong: '發生錯誤，請稍後再試。',
+    success: '操作成功',
+    failed: '操作失敗',
+    verify: '驗證',
+    unauthorizedTips: '未經授權，請先進行驗證。',
+  },
+  chat: {
+    newChatButton: '新增對話',
+    placeholder: '來說點什麼...（Shift + Enter = 換行，"/" 觸發提示詞）',
+    placeholderMobile: '來說點什麼...',
+    copy: '複製',
+    copied: '複製成功',
+    copyCode: '複製代碼',
+    clearChat: '清除對話',
+    clearChatConfirm: '是否清空對話?',
+    exportImage: '儲存對話為圖片',
+    exportImageConfirm: '是否將對話儲存為圖片?',
+    exportSuccess: '儲存成功',
+    exportFailed: '儲存失敗',
+    usingContext: '上下文模式',
+    turnOnContext: '啟用上下文模式，在此模式下，發送訊息會包含之前的聊天記錄。',
+    turnOffContext: '關閉上下文模式，在此模式下，發送訊息不會包含之前的聊天記錄。',
+    deleteMessage: '刪除訊息',
+    deleteMessageConfirm: '是否刪除此訊息?',
+    deleteHistoryConfirm: '確定刪除此紀錄?',
+    clearHistoryConfirm: '確定清除紀錄?',
+    preview: '預覽',
+    showRawText: '顯示原文',
+  },
+  setting: {
+    setting: '設定',
+    general: '總覽',
+    advanced: '進階',
+    config: '設定',
+    avatarLink: '頭貼連結',
+    name: '名稱',
+    description: '描述',
+    role: '角色設定',
+    temperature: 'Temperature',
+    top_p: 'Top_p',
+    resetUserInfo: '重設使用者資訊',
+    chatHistory: '紀錄',
+    theme: '主題',
+    language: '語言',
+    api: 'API',
+    reverseProxy: '反向代理',
+    timeout: '逾時',
+    socks: 'Socks',
+    httpsProxy: 'HTTPS Proxy',
+    balance: 'API Credit 餘額',
+    monthlyUsage: '本月使用量',
+  },
+  store: {
+    siderButton: '提示詞商店',
+    local: '本機',
+    online: '線上',
+    title: '標題',
+    description: '描述',
+    clearStoreConfirm: '是否清除資料？',
+    importPlaceholder: '請將 JSON 資料貼在此處',
+    addRepeatTitleTips: '標題重複，請重新輸入',
+    addRepeatContentTips: '內容重複：{msg}，請重新輸入',
+    editRepeatTitleTips: '標題衝突，請重新修改',
+    editRepeatContentTips: '內容衝突{msg} ，請重新修改',
+    importError: '鍵值不符合',
+    importRepeatTitle: '因標題重複跳過：{msg}',
+    importRepeatContent: '因內容重複跳過：{msg}',
+    onlineImportWarning: '注意：請檢查 JSON 檔案來源！',
+    downloadError: '請檢查網路狀態與 JSON 檔案有效性',
+  },
+}

src/main.ts

@@ -0,0 +1,22 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+import { setupI18n } from './locales'
+import { setupAssets, setupScrollbarStyle } from './plugins'
+import { setupStore } from './store'
+import { setupRouter } from './router'
+
+async function bootstrap() {
+  const app = createApp(App)
+  setupAssets()
+
+  setupScrollbarStyle()
+
+  setupStore(app)
+
+  setupI18n(app)
+
+  await setupRouter(app)
+  app.mount('#app')
+}
+
+bootstrap()

src/plugins/assets.ts

@@ -0,0 +1,18 @@
+import 'katex/dist/katex.min.css'
+import '@/styles/lib/tailwind.css'
+import '@/styles/lib/highlight.less'
+import '@/styles/lib/github-markdown.less'
+import '@/styles/global.less'
+
+/** Tailwind's Preflight Style Override */
+function naiveStyleOverride() {
+  const meta = document.createElement('meta')
+  meta.name = 'naive-ui-style'
+  document.head.appendChild(meta)
+}
+
+function setupAssets() {
+  naiveStyleOverride()
+}
+
+export default setupAssets

src/plugins/index.ts

@@ -0,0 +1,4 @@
+import setupAssets from './assets'
+import setupScrollbarStyle from './scrollbarStyle'
+
+export { setupAssets, setupScrollbarStyle }

src/plugins/scrollbarStyle.ts

@@ -0,0 +1,28 @@
+import { darkTheme, lightTheme } from 'naive-ui'
+
+const setupScrollbarStyle = () => {
+  const style = document.createElement('style')
+  const styleContent = `
+    ::-webkit-scrollbar {
+      background-color: transparent;
+      width: ${lightTheme.Scrollbar.common?.scrollbarWidth};
+    }
+    ::-webkit-scrollbar-thumb {
+      background-color: ${lightTheme.Scrollbar.common?.scrollbarColor};
+      border-radius: ${lightTheme.Scrollbar.common?.scrollbarBorderRadius};
+    }
+    html.dark ::-webkit-scrollbar {
+      background-color: transparent;
+      width: ${darkTheme.Scrollbar.common?.scrollbarWidth};
+    }
+    html.dark ::-webkit-scrollbar-thumb {
+      background-color: ${darkTheme.Scrollbar.common?.scrollbarColor};
+      border-radius: ${darkTheme.Scrollbar.common?.scrollbarBorderRadius};
+    }
+  `
+
+  style.innerHTML = styleContent
+  document.head.appendChild(style)
+}
+
+export default setupScrollbarStyle

src/router/index.ts

@@ -0,0 +1,66 @@
+import type { App } from 'vue'
+import type { RouteRecordRaw } from 'vue-router'
+import { createRouter, createWebHashHistory } from 'vue-router'
+import { setupPageGuard } from './permission'
+
+const routes: RouteRecordRaw[] = [
+  {
+    path: '/',
+    name: 'Home',
+    // component: () => import('@/views/home/Layout.vue'),
+    component: () => import('@/views/home/index.vue'),
+    // children: [
+
+    //   {
+    //     path: '/edit/:noteId?',
+    //     name: 'EditNote',
+    //     component: () => import('@/views/home/index.vue'),
+    //   },
+    // ],
+  },
+
+  {
+    path: '/login',
+    name: 'login',
+    component: () => import('@/views/login/index.vue'),
+  },
+
+  {
+    path: '/404',
+    name: '404',
+    component: () => import('@/views/exception/404/index.vue'),
+  },
+
+  {
+    path: '/500',
+    name: '500',
+    component: () => import('@/views/exception/500/index.vue'),
+  },
+
+  {
+    path: '/:pathMatch(.*)*',
+    name: 'notFound',
+    redirect: '/404',
+  },
+
+  {
+    path: '/test',
+    name: 'test',
+    component: () => import('@/views/exception/test/index.vue'),
+  },
+
+  // adminRouter,
+]
+
+export const router = createRouter({
+  history: createWebHashHistory(),
+  routes,
+  scrollBehavior: () => ({ left: 0, top: 0 }),
+})
+
+setupPageGuard(router)
+
+export async function setupRouter(app: App) {
+  app.use(router)
+  await router.isReady()
+}

src/router/permission.ts

@@ -0,0 +1,36 @@
+import type { Router } from 'vue-router'
+import { useUserStore } from '@/store/modules/user'
+
+export function setupPageGuard(router: Router) {
+  router.beforeEach(async (to, from, next) => {
+    // const authStore = useAuthStoreWithout()
+    const userStore = useUserStore()
+    // 非管理员路由拦截
+    if (userStore.userInfo.role !== 1 && to.path.includes('admin'))
+      next({ name: '404' })
+
+    else
+      next()
+
+    // if (!authStore.session) {
+    //   try {
+    //     const data = await authStore.getSession()
+    //     if (String(data.auth) === 'false' && authStore.token)
+    //       authStore.removeToken()
+    //     if (to.path === '/500')
+    //       next({ name: 'Root' })
+    //     else
+    //       next()
+    //   }
+    //   catch (error) {
+    //     if (to.path !== '/500')
+    //       next({ name: '500' })
+    //     else
+    //       next()
+    //   }
+    // }
+    // else {
+    //   next()
+    // }
+  })
+}

src/store/index.ts

@@ -0,0 +1,10 @@
+import type { App } from 'vue'
+import { createPinia } from 'pinia'
+
+export const store = createPinia()
+
+export function setupStore(app: App) {
+  app.use(store)
+}
+
+export * from './modules'

src/store/modules/admin/helper.ts

@@ -0,0 +1,26 @@
+// import { ss } from '@/utils/storage'
+
+// const LOCAL_NAME = 'appSetting'
+
+export type Theme = 'light' | 'dark' | 'auto'
+
+export type Language = 'zh-CN' | 'zh-TW' | 'en-US' | 'ko-KR'
+
+export interface AdminState {
+  siderCollapsed: boolean
+  theme: Theme
+  language: Language
+}
+
+export function defaultSetting(): AdminState {
+  return { siderCollapsed: false, theme: 'light', language: 'zh-CN' }
+}
+
+// export function getLocalSetting(): AdminState {
+//   const localSetting: AdminState | undefined = ss.get(LOCAL_NAME)
+//   return { ...defaultSetting(), ...localSetting }
+// }
+
+// export function setLocalSetting(setting: AdminState): void {
+//   ss.set(LOCAL_NAME, setting)
+// }

src/store/modules/admin/index.ts

@@ -0,0 +1,34 @@
+import { defineStore } from 'pinia'
+import type { AdminState, Language, Theme } from './helper'
+import { defaultSetting } from './helper'
+import { store } from '@/store'
+
+export const useAdminStore = defineStore('admin-store', {
+  // state: (): AdminState => getLocalSetting(),
+  state: (): AdminState => defaultSetting(),
+  actions: {
+    setSiderCollapsed(collapsed: boolean) {
+      this.siderCollapsed = collapsed
+      // this.recordState()
+    },
+
+    setTheme(theme: Theme) {
+      this.theme = theme
+      // this.recordState()
+    },
+
+    setLanguage(language: Language) {
+      if (this.language !== language)
+        this.language = language
+        // this.recordState()
+    },
+
+    // recordState() {
+    //   setLocalSetting(this.$state)
+    // },
+  },
+})
+
+export function useAdminStoreWithOut() {
+  return useAdminStore(store)
+}

src/store/modules/app/helper.ts

@@ -0,0 +1,26 @@
+import { ss } from '@/utils/storage'
+
+const LOCAL_NAME = 'appSetting'
+
+export type Theme = 'light' | 'dark' | 'auto'
+
+export type Language = 'zh-CN' | 'zh-TW' | 'en-US' | 'ko-KR'
+
+export interface AppState {
+  siderCollapsed: boolean
+  theme: Theme
+  language: Language
+}
+
+export function defaultSetting(): AppState {
+  return { siderCollapsed: false, theme: 'light', language: 'zh-CN' }
+}
+
+export function getLocalSetting(): AppState {
+  const localSetting: AppState | undefined = ss.get(LOCAL_NAME)
+  return { ...defaultSetting(), ...localSetting }
+}
+
+export function setLocalSetting(setting: AppState): void {
+  ss.set(LOCAL_NAME, setting)
+}

src/store/modules/app/index.ts

@@ -0,0 +1,34 @@
+import { defineStore } from 'pinia'
+import type { AppState, Language, Theme } from './helper'
+import { getLocalSetting, setLocalSetting } from './helper'
+import { store } from '@/store'
+
+export const useAppStore = defineStore('app-store', {
+  state: (): AppState => getLocalSetting(),
+  actions: {
+    setSiderCollapsed(collapsed: boolean) {
+      this.siderCollapsed = collapsed
+      this.recordState()
+    },
+
+    setTheme(theme: Theme) {
+      this.theme = theme
+      this.recordState()
+    },
+
+    setLanguage(language: Language) {
+      if (this.language !== language) {
+        this.language = language
+        this.recordState()
+      }
+    },
+
+    recordState() {
+      setLocalSetting(this.$state)
+    },
+  },
+})
+
+export function useAppStoreWithOut() {
+  return useAppStore(store)
+}

src/store/modules/auth/helper.ts

@@ -0,0 +1,24 @@
+import { ss } from '@/utils/storage'
+
+const LOCAL_NAME = 'SECRET_TOKEN'
+
+export function getToken() {
+  return ss.get(LOCAL_NAME)
+}
+
+export function setToken(token: string) {
+  return ss.set(LOCAL_NAME, token)
+}
+
+export function setUserInfo(userInfo: User.Info) {
+  return ss.set(LOCAL_NAME, userInfo)
+}
+
+export function getUserInfo() {
+  return ss.get(LOCAL_NAME)
+}
+
+export function removeToken() {
+  // ss.clear()
+  return ss.remove(LOCAL_NAME)
+}

src/store/modules/auth/index.ts

@@ -0,0 +1,63 @@
+import { defineStore } from 'pinia'
+import { getToken, getUserInfo, removeToken, setToken } from './helper'
+import { store } from '@/store'
+import { fetchSession } from '@/api'
+
+interface SessionResponse {
+  auth: boolean
+  model: 'ChatGPTAPI' | 'ChatGPTUnofficialProxyAPI'
+}
+
+export interface AuthState {
+  token: string | undefined
+  userInfo: User.Info | undefined
+  session: SessionResponse | null
+
+}
+
+export const useAuthStore = defineStore('auth-store', {
+  state: (): AuthState => ({
+    userInfo: getUserInfo(),
+    token: getToken(),
+    session: null,
+  }),
+
+  getters: {
+    isChatGPTAPI(state): boolean {
+      return state.session?.model === 'ChatGPTAPI'
+    },
+  },
+
+  actions: {
+    async getSession() {
+      try {
+        const { data } = await fetchSession<SessionResponse>()
+        this.session = { ...data }
+        return Promise.resolve(data)
+      }
+      catch (error) {
+        return Promise.reject(error)
+      }
+    },
+
+    setToken(token: string) {
+      this.token = token
+      setToken(token)
+    },
+
+    setUserInfo(userInfo: User.Info) {
+      this.userInfo = userInfo
+      this.setUserInfo(userInfo)
+    },
+
+    // 清除所有的本地储存
+    removeToken() {
+      this.token = undefined
+      removeToken()
+    },
+  },
+})
+
+export function useAuthStoreWithout() {
+  return useAuthStore(store)
+}

src/store/modules/index.ts

@@ -0,0 +1,7 @@
+export * from './app'
+export * from './user'
+export * from './settings'
+export * from './auth'
+export * from './admin'
+export * from './notice'
+export * from './panel'

src/store/modules/notice/helper.ts

@@ -0,0 +1,21 @@
+import { ss } from '@/utils/storage'
+
+const LOCAL_NAME = 'noticeStore'
+
+export interface NoticeStore {
+  global: number[]
+  username: { [key: string]: number[] }
+}
+
+export function defaultSetting(): NoticeStore {
+  return { global: [], username: {} }
+}
+
+export function getLocalSetting(): NoticeStore {
+  const localSetting: NoticeStore | undefined = ss.get(LOCAL_NAME)
+  return { ...defaultSetting(), ...localSetting }
+}
+
+export function setLocalSetting(setting: NoticeStore): void {
+  ss.set(LOCAL_NAME, setting)
+}

src/store/modules/notice/index.ts

@@ -0,0 +1,40 @@
+import { defineStore } from 'pinia'
+import type { NoticeStore } from './helper'
+import { getLocalSetting, setLocalSetting } from './helper'
+import { store } from '@/store'
+
+export const useNoticeStore = defineStore('notice-store', {
+  state: (): NoticeStore => getLocalSetting(),
+  actions: {
+
+    // 设置已读
+    setReadByGlobal(noticeId: number) {
+      console.log('设置全局已读', noticeId)
+      this.global.push(noticeId)
+      this.recordState()
+    },
+
+    // 设置用户已读
+    setReadByUsername(username: string, noticeId: number) {
+      if (!this.username[username])
+        this.username[username] = []
+      this.username[username].push(noticeId)
+      this.recordState()
+    },
+
+    // 判断是否为已读通知
+    getReadByNoticeId(noticeId: number, username?: string): boolean {
+      if (!this.global.includes(noticeId) && (!username || (!this.username[username] || !this.username[username].includes(noticeId))))
+        return false
+      return true
+    },
+
+    recordState() {
+      setLocalSetting(this.$state)
+    },
+  },
+})
+
+export function useNoticeStoreWithOut() {
+  return useNoticeStore(store)
+}

src/store/modules/panel/helper.ts

@@ -0,0 +1,38 @@
+import { ss } from '@/utils/storage'
+import { PanelPanelConfigStyleEnum, PanelStateNetworkModeEnum } from '@/enum'
+import defaultBackground from '@/assets/defaultBackground.webp'
+const LOCAL_NAME = 'panelStorage'
+
+export function defaultStatePanelConfig(): Panel.panelConfig {
+  return {
+    backgroundImageSrc: defaultBackground,
+    backgroundBlur: 0,
+    iconStyle: PanelPanelConfigStyleEnum.icon,
+    iconTextColor: '#ffffff',
+    logoText: 'Sun-Panel',
+    logoImageSrc: '',
+    clockShowSecond: false,
+  }
+}
+
+export function defaultState(): Panel.State {
+  return {
+    rightSiderCollapsed: false,
+    leftSiderCollapsed: false,
+    networkMode: PanelStateNetworkModeEnum.wan,
+    panelConfig: { ...defaultStatePanelConfig() },
+  }
+}
+
+export function getLocalState(): Panel.State {
+  const localState = ss.get(LOCAL_NAME)
+  return { ...defaultState(), ...localState }
+}
+
+export function setLocalState(state: Panel.State) {
+  ss.set(LOCAL_NAME, state)
+}
+
+export function removeLocalState() {
+  ss.remove(LOCAL_NAME)
+}

src/store/modules/panel/index.ts

@@ -0,0 +1,67 @@
+import { defineStore } from 'pinia'
+import { defaultState, defaultStatePanelConfig, getLocalState, removeLocalState, setLocalState } from './helper'
+import { router } from '@/router'
+import type { PanelStateNetworkModeEnum } from '@/enum'
+import { get as getUserConfig } from '@/api/panel/userConfig'
+export const usePanelState = defineStore('panel', {
+  state: (): Panel.State => getLocalState() || defaultState(),
+
+  getters: {
+    // getChatHistoryByCurrentActive(state: AiApplet.State) {
+    //   const index = state.history.findIndex(item => item.id === state.active)
+    //   if (index !== -1)
+    //     return state.history[index]
+    //   return null
+    // },
+
+  },
+
+  actions: {
+    setLeftSiderCollapsed(Collapsed: boolean) {
+      this.leftSiderCollapsed = Collapsed
+      // this.recordState()
+    },
+
+    setRightSiderCollapsed(Collapsed: boolean) {
+      this.rightSiderCollapsed = Collapsed
+      // this.recordState()
+    },
+
+    setNetworkMode(mode: PanelStateNetworkModeEnum) {
+      this.networkMode = mode
+      this.recordState()
+    },
+
+    // 获取云端的面板配置
+    updatePanelConfigByCloud() {
+      getUserConfig<Panel.userConfig>().then((res) => {
+        if (res.code === 0)
+          this.panelConfig = res.data.panel
+        this.recordState()
+      })
+    },
+
+    resetPanelConfig() {
+      this.panelConfig = defaultStatePanelConfig()
+    },
+
+    // async refreshSpaceNoteList(spaceId: string) {
+    //   await getListBySpaceNoteId<Common.ListResponse<SNote.InfoTree[]>>(spaceId).then((res) => {
+    //     this.notesList = res.data.list
+    //   })
+    // },
+
+    async reloadRoute(id?: number) {
+      // this.recordState()
+      await router.push({ name: 'AppletDialog', params: { aiAppletId: id } })
+    },
+
+    recordState() {
+      setLocalState(this.$state)
+    },
+
+    removeState() {
+      removeLocalState()
+    },
+  },
+})

src/store/modules/settings/helper.ts

@@ -0,0 +1,30 @@
+import { ss } from '@/utils/storage'
+
+const LOCAL_NAME = 'settingsStorage'
+
+export interface SettingsState {
+  systemMessage: string
+  temperature: number
+  top_p: number
+}
+
+export function defaultSetting(): SettingsState {
+  return {
+    systemMessage: 'You are ChatGPT, a large language model trained by OpenAI. Follow the user\'s instructions carefully. Respond using markdown.',
+    temperature: 0.8,
+    top_p: 1,
+  }
+}
+
+export function getLocalState(): SettingsState {
+  const localSetting: SettingsState | undefined = ss.get(LOCAL_NAME)
+  return { ...defaultSetting(), ...localSetting }
+}
+
+export function setLocalState(setting: SettingsState): void {
+  ss.set(LOCAL_NAME, setting)
+}
+
+export function removeLocalState() {
+  ss.remove(LOCAL_NAME)
+}

src/store/modules/settings/index.ts

@@ -0,0 +1,22 @@
+import { defineStore } from 'pinia'
+import type { SettingsState } from './helper'
+import { defaultSetting, getLocalState, removeLocalState, setLocalState } from './helper'
+
+export const useSettingStore = defineStore('setting-store', {
+  state: (): SettingsState => getLocalState(),
+  actions: {
+    updateSetting(settings: Partial<SettingsState>) {
+      this.$state = { ...this.$state, ...settings }
+      this.recordState()
+    },
+
+    resetSetting() {
+      this.$state = defaultSetting()
+      removeLocalState()
+    },
+
+    recordState() {
+      setLocalState(this.$state)
+    },
+  },
+})

src/store/modules/user/helper.ts

@@ -0,0 +1,32 @@
+import { ss } from '@/utils/storage'
+// import userDefaultAvatar from '@/assets/userDefaultAvatar.png'
+
+const LOCAL_NAME = 'userStorage'
+
+export interface UserInfo extends User.Info {
+  // name: string
+  // description: string
+}
+
+export interface UserState {
+  userInfo: UserInfo
+}
+
+export function defaultSetting(): UserState {
+  return {
+    userInfo: {
+      // headImage: userDefaultAvatar,
+      name: '-- --',
+      // description: 'Star on <a href="https://github.com/Chanzhaoyu/chatgpt-bot" class="text-blue-500" target="_blank" >GitHub</a>',
+    },
+  }
+}
+
+export function getLocalState(): UserState {
+  const localSetting: UserState | undefined = ss.get(LOCAL_NAME)
+  return { ...defaultSetting(), ...localSetting }
+}
+
+export function setLocalState(setting: UserState): void {
+  ss.set(LOCAL_NAME, setting)
+}

src/store/modules/user/index.ts

@@ -0,0 +1,27 @@
+import { defineStore } from 'pinia'
+import type { UserState } from './helper'
+import { defaultSetting, getLocalState, setLocalState } from './helper'
+
+export const useUserStore = defineStore('user-store', {
+  state: (): UserState => getLocalState(),
+  actions: {
+    updateUserInfo(userInfo: User.Info) {
+      this.userInfo = { ...this.userInfo, ...userInfo }
+      this.recordState()
+    },
+
+    // updateUserHeadImage(userInfo: User.Info) {
+    //   this.userInfo = { ...this.userInfo, ...userInfo }
+    //   this.recordState()
+    // },
+
+    resetUserInfo() {
+      this.userInfo = { ...defaultSetting().userInfo }
+      this.recordState()
+    },
+
+    recordState() {
+      setLocalState(this.$state)
+    },
+  },
+})

src/styles/global.less

@@ -0,0 +1,10 @@
+html,
+body,
+#app {
+	height: 100%;
+}
+
+body {
+	padding-bottom: constant(safe-area-inset-bottom);
+	padding-bottom: env(safe-area-inset-bottom);
+}

src/styles/lib/highlight.less

@@ -0,0 +1,206 @@
+html.dark {
+	pre code.hljs {
+		display: block;
+		overflow-x: auto;
+		padding: 1em
+	}
+
+	code.hljs {
+		padding: 3px 5px
+	}
+
+	.hljs {
+		color: #abb2bf;
+		background: #282c34
+	}
+
+	.hljs-keyword,
+	.hljs-operator,
+	.hljs-pattern-match {
+		color: #f92672
+	}
+
+	.hljs-function,
+	.hljs-pattern-match .hljs-constructor {
+		color: #61aeee
+	}
+
+	.hljs-function .hljs-params {
+		color: #a6e22e
+	}
+
+	.hljs-function .hljs-params .hljs-typing {
+		color: #fd971f
+	}
+
+	.hljs-module-access .hljs-module {
+		color: #7e57c2
+	}
+
+	.hljs-constructor {
+		color: #e2b93d
+	}
+
+	.hljs-constructor .hljs-string {
+		color: #9ccc65
+	}
+
+	.hljs-comment,
+	.hljs-quote {
+		color: #b18eb1;
+		font-style: italic
+	}
+
+	.hljs-doctag,
+	.hljs-formula {
+		color: #c678dd
+	}
+
+	.hljs-deletion,
+	.hljs-name,
+	.hljs-section,
+	.hljs-selector-tag,
+	.hljs-subst {
+		color: #e06c75
+	}
+
+	.hljs-literal {
+		color: #56b6c2
+	}
+
+	.hljs-addition,
+	.hljs-attribute,
+	.hljs-meta .hljs-string,
+	.hljs-regexp,
+	.hljs-string {
+		color: #98c379
+	}
+
+	.hljs-built_in,
+	.hljs-class .hljs-title,
+	.hljs-title.class_ {
+		color: #e6c07b
+	}
+
+	.hljs-attr,
+	.hljs-number,
+	.hljs-selector-attr,
+	.hljs-selector-class,
+	.hljs-selector-pseudo,
+	.hljs-template-variable,
+	.hljs-type,
+	.hljs-variable {
+		color: #d19a66
+	}
+
+	.hljs-bullet,
+	.hljs-link,
+	.hljs-meta,
+	.hljs-selector-id,
+	.hljs-symbol,
+	.hljs-title {
+		color: #61aeee
+	}
+
+	.hljs-emphasis {
+		font-style: italic
+	}
+
+	.hljs-strong {
+		font-weight: 700
+	}
+
+	.hljs-link {
+		text-decoration: underline
+	}
+}
+
+html {
+	pre code.hljs {
+		display: block;
+		overflow-x: auto;
+		padding: 1em
+	}
+
+	code.hljs {
+		padding: 3px 5px;
+		&::-webkit-scrollbar {
+			height: 4px;
+		}
+	}
+
+	.hljs {
+		color: #383a42;
+		background: #fafafa
+	}
+
+	.hljs-comment,
+	.hljs-quote {
+		color: #a0a1a7;
+		font-style: italic
+	}
+
+	.hljs-doctag,
+	.hljs-formula,
+	.hljs-keyword {
+		color: #a626a4
+	}
+
+	.hljs-deletion,
+	.hljs-name,
+	.hljs-section,
+	.hljs-selector-tag,
+	.hljs-subst {
+		color: #e45649
+	}
+
+	.hljs-literal {
+		color: #0184bb
+	}
+
+	.hljs-addition,
+	.hljs-attribute,
+	.hljs-meta .hljs-string,
+	.hljs-regexp,
+	.hljs-string {
+		color: #50a14f
+	}
+
+	.hljs-attr,
+	.hljs-number,
+	.hljs-selector-attr,
+	.hljs-selector-class,
+	.hljs-selector-pseudo,
+	.hljs-template-variable,
+	.hljs-type,
+	.hljs-variable {
+		color: #986801
+	}
+
+	.hljs-bullet,
+	.hljs-link,
+	.hljs-meta,
+	.hljs-selector-id,
+	.hljs-symbol,
+	.hljs-title {
+		color: #4078f2
+	}
+
+	.hljs-built_in,
+	.hljs-class .hljs-title,
+	.hljs-title.class_ {
+		color: #c18401
+	}
+
+	.hljs-emphasis {
+		font-style: italic
+	}
+
+	.hljs-strong {
+		font-weight: 700
+	}
+
+	.hljs-link {
+		text-decoration: underline
+	}
+}

src/styles/lib/tailwind.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

src/typings/admin/adminUserManage.d.ts

@@ -0,0 +1,7 @@
+declare namespace AdminUserManage {
+    interface GetListRequest{
+        page:number
+        limit:number
+        keyWord?:string
+    }
+}

src/typings/common.d.ts

@@ -0,0 +1,31 @@
+declare namespace Common {
+    interface ListResponse<T> {	
+        list:T
+        count:number
+    }
+
+    interface ListRequest{	
+        limit:number
+        page:number
+        keyword?:string
+    }
+
+    interface InfoBase{	
+        createTime?:string
+        updateTime?:string
+        id?:number
+    }
+
+    // 请求-带有弹窗验证数据结构
+    interface VerificationRequest{
+        codeId?:string
+        vCode?:string
+    }
+
+    // 响应-带有弹窗验证数据结构
+    interface VerificationResponse{
+        codeId?:string
+        result?:boolean
+        message?:string
+    }
+}

src/typings/env.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="vite/client" />
+
+interface ImportMetaEnv {
+	readonly VITE_GLOB_API_URL: string;
+	readonly VITE_APP_API_BASE_URL: string;
+	readonly VITE_GLOB_OPEN_LONG_REPLY: string;
+	readonly VITE_GLOB_APP_PWA: string;
+}

src/typings/global.d.ts

@@ -0,0 +1,6 @@
+interface Window {
+  $loadingBar?: import('naive-ui').LoadingBarProviderInst;
+  $dialog?: import('naive-ui').DialogProviderInst;
+  $message?: import('naive-ui').MessageProviderInst;
+  $notification?: import('naive-ui').NotificationProviderInst;
+}

src/typings/homePage.d.ts

@@ -0,0 +1,27 @@
+declare namespace HomePage{
+
+
+    interface State{
+        active:string
+        spaceId:number // 空间的id
+        notesList:Info[]
+    }
+
+}
+
+declare namespace HomePage.quest{
+
+    interface LoginReqest{
+        username:string 
+        password:string
+        vcode?:string
+    }
+
+	interface LoginResponse extends User.Info{
+		token :string
+	}
+
+    interface ResetPasswordByVCodeReqest extends System.Register.SendRegisterVcodeRquest{
+    }
+
+}

src/typings/login.d.ts

@@ -0,0 +1,16 @@
+declare namespace Login{
+
+    interface LoginReqest{
+        username:string 
+        password:string
+        vcode?:string
+    }
+
+	interface LoginResponse extends User.Info{
+		token :string
+	}
+
+    interface ResetPasswordByVCodeReqest extends System.Register.SendRegisterVcodeRquest{
+    }
+
+}

src/typings/notice.d.ts

@@ -0,0 +1,13 @@
+declare namespace Notice{
+
+    interface NoticeInfo extends Common.InfoBase{
+        title:string 
+        content:string
+        displayType:number
+        oneRead:number
+        url:string
+        isLogin:number
+    }
+
+
+}

src/typings/openness/openness.d.ts

@@ -0,0 +1,12 @@
+declare namespace Openness.open {
+
+    interface LoginConfigRegister {
+        emailSuffix  :string   // 注册邮箱后缀
+        openRegister :boolean    // 开放注册
+    }
+    
+    interface LoginVcodeResponse{
+        loginCaptcha: boolean
+        register:LoginConfigRegister
+    }
+}

src/typings/panel.d.ts

@@ -0,0 +1,47 @@
+declare namespace Panel {
+
+    interface Info extends ItemInfo {
+
+    }
+
+    interface ItemInfo extends Common.InfoBase {
+        icon: ItemIcon |null
+        title: string
+        url: string
+        lanUrl?: string
+        description?: string
+        openMethod: number
+    }
+
+    interface ItemIcon {
+        itemType: number
+        src ?: string
+        text ?: string
+        bgColor ?: string
+    }
+
+    interface State {
+        rightSiderCollapsed: boolean
+        leftSiderCollapsed: boolean
+        networkMode:PanelStateNetworkModeEnum | null
+        panelConfig:panelConfig
+    }
+
+    interface panelConfig{
+        backgroundImageSrc?:string
+        backgroundBlur?:number
+        iconStyle?:PanelPanelConfigStyleEnum
+        iconTextColor?:string
+        logoText?:string
+        logoImageSrc?:string
+        clockShowSecond?:boolean
+        clockColor?:string
+
+    }
+
+    interface userConfig{
+        panel:panelConfig
+        searchEngine?:any
+    }
+}
+

src/typings/register.d.ts

@@ -0,0 +1,16 @@
+declare namespace System.Register{
+    interface SendRegisterVcodeRquest {
+        email     ?:string 
+	    username  ?:string 
+	    password    ?:string 
+	    vcode     ?:string 
+	    emailVCode ?:string 
+		verification?:Common.VerificationRequest
+		referralCode?:string
+    }
+
+	interface CommitRquest extends SendRegisterVcodeRquest {
+		
+    }
+	
+}

src/typings/user.d.ts

@@ -0,0 +1,24 @@
+declare namespace User{
+
+	interface Info{
+		id?:number
+		name ?:string
+		createTime?:string
+		username?:string
+		password?:string
+		headImage?:string
+		status?:number
+		role?:number
+		mail?:string
+		// userId?:string // id代替
+		token?:string
+		isAdmin?:number
+	}
+
+	interface GetReferralCodeResponse{
+		referralCode:string
+	}
+
+
+	
+}

src/utils/cmn/index.ts

@@ -0,0 +1,144 @@
+import moment from 'moment'
+import { h } from 'vue'
+import type { NotificationReactive } from 'naive-ui'
+import { NButton, createDiscreteApi } from 'naive-ui'
+import { useNoticeStore, useUserStore } from '@/store'
+import { getInfo as getUserInfo } from '@/api/system/user'
+import { getListByDisplayType as getListByDisplayTypeApi } from '@/api/notice'
+
+const noticeStore = useNoticeStore()
+const userStore = useUserStore()
+
+const { notification } = createDiscreteApi(['notification'])
+
+/**
+ * 生成指定时间格式
+ * @param format 时间格式 默认：'YYYY-MM-DD HH:mm:ss'
+ * @returns string
+ */
+export function buildTimeString(format?: string): string {
+  if (!format)
+    format = 'YYYY-MM-DD HH:mm:ss'
+
+  return moment().format(format)
+}
+
+export function timeFormat(timeString?: string) {
+  return moment(timeString).format('YYYY-MM-DD HH:mm:ss')
+}
+
+/**
+ * 创建新的公告
+ * @param timeString
+ */
+export function noticeCreate(info: Notice.NoticeInfo) {
+  const option: any = {
+    title: info.title,
+    content: info.content,
+    meta: info.createTime ? timeFormat(info.createTime) : '',
+  }
+
+  const btns: any = []
+
+  let n: NotificationReactive
+  // 链接按钮
+  if (info.url !== '') {
+    btns.push(
+      h(
+        NButton,
+        {
+          text: true,
+          type: 'info',
+          onClick: () => {
+            window.open(info.url, '_blank')
+            n.destroy()
+          },
+        },
+        {
+          default: () => '打开链接',
+        },
+      ),
+    )
+  }
+  if (info.oneRead === 1) {
+    btns.push(
+      h(
+        NButton,
+        {
+          text: true,
+          type: 'primary',
+          style: { marginLeft: '20px' },
+          onClick: () => {
+            if (info.id) {
+              if (info.isLogin === 1 && userStore.userInfo.username) {
+                noticeStore.setReadByUsername(userStore.userInfo.username, info.id)
+                console.log('设置用户已读', info.id)
+              }
+              else {
+                noticeStore.setReadByGlobal(info.id)
+                console.log('设置全局已读', info.id)
+              }
+            }
+            n.destroy()
+          },
+        },
+        {
+          default: () => '不再提醒',
+        },
+      ),
+    )
+  }
+  option.action = () => btns
+  n = notification.create(option)
+}
+
+export function setTitle(titile: string) {
+  document.title = titile
+}
+
+export function getTitle(titile: string) {
+  document.title = titile
+}
+
+//
+export async function updateLocalUserInfo() {
+  const { data } = await getUserInfo<User.Info>()
+
+  userStore.updateUserInfo({ headImage: data.headImage, name: data.name })
+}
+
+export async function getNotice(displayType: number | number[]) {
+  let param: number[]
+  if (typeof displayType === 'number')
+    param = [displayType]
+  else
+    param = displayType
+
+  const { data } = await getListByDisplayTypeApi<Common.ListResponse<Notice.NoticeInfo[]>>(param)
+
+  for (let i = 0; i < data.list.length; i++) {
+    const element = data.list[i]
+    if (element.id && !noticeStore.getReadByNoticeId(element.id, userStore.userInfo.username))
+      noticeCreate(element)
+  }
+}
+
+/**
+ * @description: 获取随机码
+ * @param {number} size
+ * @param {array} seed ["a","b"m"c]
+ * @return {string}
+ */
+export function randomCode(size: number, seed?: Array<string>) {
+  seed = seed || ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z',
+    'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'm', 'n', 'p', 'Q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z',
+    '2', '3', '4', '5', '6', '7', '8', '9',
+  ]// 数组
+  const seedlength = seed.length// 数组长度
+  let createPassword = ''
+  for (let i = 0; i < size; i++) {
+    const j = Math.floor(Math.random() * seedlength)
+    createPassword += seed[j]
+  }
+  return createPassword
+}

src/utils/crypto/index.ts

@@ -0,0 +1,18 @@
+import CryptoJS from 'crypto-js'
+
+const CryptoSecret = '__CRYPTO_SECRET__'
+
+export function enCrypto(data: any) {
+  const str = JSON.stringify(data)
+  return CryptoJS.AES.encrypt(str, CryptoSecret).toString()
+}
+
+export function deCrypto(data: string) {
+  const bytes = CryptoJS.AES.decrypt(data, CryptoSecret)
+  const str = bytes.toString(CryptoJS.enc.Utf8)
+
+  if (str)
+    return JSON.parse(str)
+
+  return null
+}

src/utils/format/index.ts

@@ -0,0 +1,44 @@
+/**
+ * 转义 HTML 字符
+ * @param source
+ */
+export function encodeHTML(source: string) {
+  return source
+    .replace(/&/g, '&')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;')
+}
+
+/**
+ * 判断是否为代码块
+ * @param text
+ */
+export function includeCode(text: string | null | undefined) {
+  const regexp = /^(?:\s{4}|\t).+/gm
+  return !!(text?.includes(' = ') || text?.match(regexp))
+}
+
+/**
+ * 复制文本
+ * @param options
+ */
+export function copyText(options: { text: string; origin?: boolean }) {
+  const props = { origin: true, ...options }
+
+  let input: HTMLInputElement | HTMLTextAreaElement
+
+  if (props.origin)
+    input = document.createElement('textarea')
+  else
+    input = document.createElement('input')
+
+  input.setAttribute('readonly', 'readonly')
+  input.value = props.text
+  document.body.appendChild(input)
+  input.select()
+  if (document.execCommand('copy'))
+    document.execCommand('copy')
+  document.body.removeChild(input)
+}

src/utils/functions/debounce.ts

@@ -0,0 +1,18 @@
+type CallbackFunc<T extends unknown[]> = (...args: T) => void
+
+export function debounce<T extends unknown[]>(
+  func: CallbackFunc<T>,
+  wait: number,
+): (...args: T) => void {
+  let timeoutId: ReturnType<typeof setTimeout> | undefined
+
+  return (...args: T) => {
+    const later = () => {
+      clearTimeout(timeoutId)
+      func(...args)
+    }
+
+    clearTimeout(timeoutId)
+    timeoutId = setTimeout(later, wait)
+  }
+}

src/utils/functions/index.ts

@@ -0,0 +1,7 @@
+export function getCurrentDate() {
+  const date = new Date()
+  const day = date.getDate()
+  const month = date.getMonth() + 1
+  const year = date.getFullYear()
+  return `${year}-${month}-${day}`
+}

src/utils/is/index.ts

@@ -0,0 +1,55 @@
+export function isNumber<T extends number>(value: T | unknown): value is number {
+  return Object.prototype.toString.call(value) === '[object Number]'
+}
+
+export function isString<T extends string>(value: T | unknown): value is string {
+  return Object.prototype.toString.call(value) === '[object String]'
+}
+
+export function isBoolean<T extends boolean>(value: T | unknown): value is boolean {
+  return Object.prototype.toString.call(value) === '[object Boolean]'
+}
+
+export function isNull<T extends null>(value: T | unknown): value is null {
+  return Object.prototype.toString.call(value) === '[object Null]'
+}
+
+export function isUndefined<T extends undefined>(value: T | unknown): value is undefined {
+  return Object.prototype.toString.call(value) === '[object Undefined]'
+}
+
+export function isObject<T extends object>(value: T | unknown): value is object {
+  return Object.prototype.toString.call(value) === '[object Object]'
+}
+
+export function isArray<T extends any[]>(value: T | unknown): value is T {
+  return Object.prototype.toString.call(value) === '[object Array]'
+}
+
+export function isFunction<T extends (...args: any[]) => any | void | never>(value: T | unknown): value is T {
+  return Object.prototype.toString.call(value) === '[object Function]'
+}
+
+export function isDate<T extends Date>(value: T | unknown): value is T {
+  return Object.prototype.toString.call(value) === '[object Date]'
+}
+
+export function isRegExp<T extends RegExp>(value: T | unknown): value is T {
+  return Object.prototype.toString.call(value) === '[object RegExp]'
+}
+
+export function isPromise<T extends Promise<any>>(value: T | unknown): value is T {
+  return Object.prototype.toString.call(value) === '[object Promise]'
+}
+
+export function isSet<T extends Set<any>>(value: T | unknown): value is T {
+  return Object.prototype.toString.call(value) === '[object Set]'
+}
+
+export function isMap<T extends Map<any, any>>(value: T | unknown): value is T {
+  return Object.prototype.toString.call(value) === '[object Map]'
+}
+
+export function isFile<T extends File>(value: T | unknown): value is T {
+  return Object.prototype.toString.call(value) === '[object File]'
+}

src/utils/request/axios.ts

@@ -0,0 +1,32 @@
+import axios, { type AxiosResponse } from 'axios'
+import { useAuthStore } from '@/store'
+
+const service = axios.create({
+  baseURL: import.meta.env.VITE_GLOB_API_URL,
+})
+
+service.interceptors.request.use(
+  (config) => {
+    const token = useAuthStore().token
+    if (token)
+      config.headers.Authorization = `Bearer ${token}`
+    return config
+  },
+  (error) => {
+    return Promise.reject(error.response)
+  },
+)
+
+service.interceptors.response.use(
+  (response: AxiosResponse): AxiosResponse => {
+    if (response.status === 200)
+      return response
+
+    throw new Error(response.status.toString())
+  },
+  (error) => {
+    return Promise.reject(error)
+  },
+)
+
+export default service

src/utils/request/index.ts

@@ -0,0 +1,120 @@
+import type { AxiosProgressEvent, AxiosResponse, GenericAbortSignal } from 'axios'
+import { createDiscreteApi } from 'naive-ui'
+import request from './axios'
+import { useAuthStore } from '@/store'
+import { router } from '@/router'
+
+const { message } = createDiscreteApi(['message'])
+
+export interface HttpOption {
+  url: string
+  data?: any
+  method?: string
+  headers?: any
+  onDownloadProgress?: (progressEvent: AxiosProgressEvent) => void
+  signal?: GenericAbortSignal
+  beforeRequest?: () => void
+  afterRequest?: () => void
+}
+
+export interface Response<T = any> {
+  data: T
+  // message: string | null
+  // status: string
+  msg: string
+  code: number
+}
+
+function http<T = any>(
+  { url, data, method, headers, onDownloadProgress, signal, beforeRequest, afterRequest }: HttpOption,
+) {
+  const authStore = useAuthStore()
+  const successHandler = (res: AxiosResponse<Response<T>>) => {
+    if (res.data.code === 0 || typeof res.data === 'string')
+      return res.data
+
+    if (res.data.code === 1001) {
+      message.warning('登录过期,请重新登录')
+      router.push({ path: '/login' })
+      authStore.removeToken()
+      return res.data
+    }
+
+    if (res.data.code === 1000) {
+      router.push({ path: '/login' })
+      authStore.removeToken()
+      return res.data
+    }
+
+    if (res.data.code === 1005) {
+      message.warning(res.data.msg)
+      return res.data
+    }
+
+    if (res.data.code === -1) {
+      message.warning(res.data.msg)
+      // router.push({ path: '/login' })
+      // authStore.removeToken()
+      return res.data
+    }
+
+    // 验证码相关错误
+    if (res.data.code > 1100 && res.data.code < 1200)
+      return res.data
+
+    return Promise.reject(res.data)
+  }
+
+  const failHandler = (error: Response<Error>) => {
+    afterRequest?.()
+    // message.error('网络错误，请稍后重试', {
+    //   duration: 50000,
+    //   closable: true,
+    // })
+    throw new Error(error?.msg || 'Error')
+  }
+
+  beforeRequest?.()
+
+  method = method || 'GET'
+
+  const params = Object.assign(typeof data === 'function' ? data() : data ?? {}, {})
+  if (!headers)
+    headers = {}
+
+  headers.token = authStore.token
+  return method === 'GET'
+    ? request.get(url, { params, signal, onDownloadProgress }).then(successHandler, failHandler)
+    : request.post(url, params, { headers, signal, onDownloadProgress }).then(successHandler, failHandler)
+}
+
+export function get<T = any>(
+  { url, data, method = 'GET', onDownloadProgress, signal, beforeRequest, afterRequest }: HttpOption,
+): Promise<Response<T>> {
+  return http<T>({
+    url,
+    method,
+    data,
+    onDownloadProgress,
+    signal,
+    beforeRequest,
+    afterRequest,
+  })
+}
+
+export function post<T = any>(
+  { url, data, method = 'POST', headers, onDownloadProgress, signal, beforeRequest, afterRequest }: HttpOption,
+): Promise<Response<T>> {
+  return http<T>({
+    url,
+    method,
+    data,
+    headers,
+    onDownloadProgress,
+    signal,
+    beforeRequest,
+    afterRequest,
+  })
+}
+
+export default post

src/utils/storage/index.ts

@@ -0,0 +1 @@
+export * from './local'

src/utils/storage/local.ts

@@ -0,0 +1,70 @@
+import { deCrypto, enCrypto } from '../crypto'
+
+interface StorageData<T = any> {
+  data: T
+  expire: number | null
+}
+
+export function createLocalStorage(options?: { expire?: number | null; crypto?: boolean }) {
+  const DEFAULT_CACHE_TIME = 60 * 60 * 24 * 7
+
+  const { expire, crypto } = Object.assign(
+    {
+      expire: DEFAULT_CACHE_TIME,
+      crypto: true,
+    },
+    options,
+  )
+
+  function set<T = any>(key: string, data: T) {
+    const storageData: StorageData<T> = {
+      data,
+      expire: expire !== null ? new Date().getTime() + expire * 1000 : null,
+    }
+
+    const json = crypto ? enCrypto(storageData) : JSON.stringify(storageData)
+    window.localStorage.setItem(key, json)
+  }
+
+  function get(key: string) {
+    const json = window.localStorage.getItem(key)
+    if (json) {
+      let storageData: StorageData | null = null
+
+      try {
+        storageData = crypto ? deCrypto(json) : JSON.parse(json)
+      }
+      catch {
+        // Prevent failure
+      }
+
+      if (storageData) {
+        const { data, expire } = storageData
+        if (expire === null || expire >= Date.now())
+          return data
+      }
+
+      remove(key)
+      return null
+    }
+  }
+
+  function remove(key: string) {
+    window.localStorage.removeItem(key)
+  }
+
+  function clear() {
+    window.localStorage.clear()
+  }
+
+  return {
+    set,
+    get,
+    remove,
+    clear,
+  }
+}
+
+export const ls = createLocalStorage()
+
+export const ss = createLocalStorage({ expire: null, crypto: false })

src/views/components/UserInfoFooter/index.vue

@@ -0,0 +1,24 @@
+<script setup lang='ts'>
+import { defineAsyncComponent, ref } from 'vue'
+import { HoverButton, SvgIcon } from '@/components/common'
+
+const Setting = defineAsyncComponent(() => import('@/components/common/Setting/index.vue'))
+
+const show = ref(false)
+</script>
+
+<template>
+  <footer class="flex items-center justify-between min-w-0 p-4 overflow-hidden border-t dark:border-neutral-800">
+    <div class="flex-1 flex-shrink-0 overflow-hidden">
+      <!-- <UserAvatar /> -->
+    </div>
+
+    <HoverButton @click="show = true">
+      <span class="text-xl text-[#4f555e] dark:text-white">
+        <SvgIcon icon="ri:settings-4-line" />
+      </span>
+    </HoverButton>
+
+    <Setting v-if="show" v-model:visible="show" />
+  </footer>
+</template>

src/views/components/index.ts

@@ -0,0 +1,3 @@
+import UserInfoFooter from './UserInfoFooter/index.vue'
+
+export { UserInfoFooter }

src/views/exception/404/index.vue

@@ -0,0 +1,33 @@
+<script lang="ts" setup>
+import { NButton } from 'naive-ui'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+
+function goHome() {
+  router.push('/')
+}
+</script>
+
+<template>
+  <div class="flex h-full">
+    <div class="px-4 m-auto space-y-4 text-center max-[400px]">
+      <h1 class="text-4xl text-slate-800 dark:text-neutral-200">
+        <!-- Sorry, page not found! -->
+        页面不存在
+      </h1>
+      <p class="text-base text-slate-500 dark:text-neutral-400">
+        <!-- Sorry, we couldn’t find the page you’re looking for. Perhaps you’ve mistyped the URL? Be sure to check your spelling. -->
+      </p>
+      <div class="flex items-center justify-center text-center">
+        <div class="w-[300px]">
+          <img src="../../../icons/404.svg" alt="404">
+        </div>
+      </div>
+      <NButton type="primary" @click="goHome">
+        <!-- Go to Home -->
+        返回首页
+      </NButton>
+    </div>
+  </div>
+</template>

src/views/exception/500/index.vue

@@ -0,0 +1,34 @@
+<script lang="ts" setup>
+import { NButton } from 'naive-ui'
+import { useRouter } from 'vue-router'
+import Icon500 from '@/icons/500.vue'
+
+const router = useRouter()
+
+function goHome() {
+  router.push('/')
+}
+</script>
+
+<template>
+  <div class="flex h-full dark:bg-neutral-800">
+    <div class="px-4 m-auto space-y-4 text-center max-[400px]">
+      <header class="space-y-2">
+        <h2 class="text-2xl font-bold text-center text-slate-800 dark:text-neutral-200">
+          500
+        </h2>
+        <p class="text-base text-center text-slate-500 dark:text-slate-500">
+          <!-- Server error -->
+          服务器错误
+        </p>
+        <div class="flex items-center justify-center text-center">
+          <Icon500 class="w-[300px]" />
+        </div>
+      </header>
+      <NButton type="primary" @click="goHome">
+        <!-- Go to Home -->
+        返回首页
+      </NButton>
+    </div>
+  </div>
+</template>