@flecblog/core-nuxt 0.1.0

package/app.vue

@@ -0,0 +1,172 @@
+<script setup lang="ts">
+import { getCategories } from '@/composables/api/category';
+import { getTags } from '@/composables/api/tag';
+import { getSiteStats } from '@/composables/api/stats';
+import { getSettingGroup } from '@/composables/api/sysconfig';
+import { getActiveThemeSchema } from '@/composables/api/theme';
+
+// 全局数据
+const { basicConfig, oauthConfig, uploadConfig } = useSysConfig();
+const { menus } = useMenus();
+const { categories, total: categoriesTotal } = useCategories();
+const { tags, total: tagsTotal } = useTags();
+const { siteStats } = useStats();
+const { theme } = useTheme();
+
+const { data: globalData } = await useAsyncData('global-data', async () => {
+  const [basicData, oauthData, uploadData, categoriesData, tagsData, statsData, themeData] =
+    await Promise.all([
+      getSettingGroup('basic'),
+      getSettingGroup('oauth'),
+      getSettingGroup('upload'),
+      getCategories(),
+      getTags(),
+      getSiteStats(),
+      getActiveThemeSchema(),
+    ]);
+
+  return {
+    basicConfig: basicData,
+    oauthConfig: oauthData,
+    uploadConfig: uploadData,
+    menus: themeData.menus || {},
+    categories: categoriesData.list,
+    categoriesTotal: categoriesData.total,
+    tags: tagsData.list,
+    tagsTotal: tagsData.total,
+    stats: statsData,
+    theme: themeData,
+  };
+});
+
+// 初始化全局数据
+watchEffect(() => {
+  if (globalData.value) {
+    basicConfig.value = globalData.value.basicConfig;
+    oauthConfig.value = globalData.value.oauthConfig;
+    uploadConfig.value = globalData.value.uploadConfig;
+    menus.value = globalData.value.menus;
+    categories.value = globalData.value.categories;
+    tags.value = globalData.value.tags;
+    siteStats.value = globalData.value.stats;
+    if (globalData.value.categoriesTotal !== undefined) {
+      categoriesTotal.value = globalData.value.categoriesTotal;
+    }
+    if (globalData.value.tagsTotal !== undefined) {
+      tagsTotal.value = globalData.value.tagsTotal;
+    }
+    if (globalData.value.theme) {
+      theme.value = {
+        slug: globalData.value.theme.slug,
+        name: globalData.value.theme.name || globalData.value.theme.slug,
+        schema: globalData.value.theme.schema,
+        config: globalData.value.theme.config ?? {},
+        loaded: true,
+      };
+    }
+    initMarkdownRenderer();
+  }
+});
+
+// 刷新时恢复滚动位置
+onMounted(() => {
+  const key = 'scroll-y';
+  const nav = performance.getEntriesByType('navigation')[0] as PerformanceNavigationTiming;
+  if (nav?.type === 'reload') {
+    const y = +(sessionStorage.getItem(key) || 0);
+    if (y > 0) setTimeout(() => window.scrollTo(0, y), 100);
+  }
+  let t: ReturnType<typeof setTimeout>;
+  const save = () => sessionStorage.setItem(key, '' + window.scrollY);
+  window.addEventListener(
+    'scroll',
+    () => {
+      clearTimeout(t);
+      t = setTimeout(save, 200);
+    },
+    { passive: true }
+  );
+  window.addEventListener('pagehide', save);
+});
+
+// SEO Meta
+useSeoMeta({
+  description: () => basicConfig.value.description,
+  keywords: () => basicConfig.value.keywords,
+  author: () => basicConfig.value.author,
+  // Open Graph
+  ogTitle: () => basicConfig.value.title,
+  ogDescription: () => basicConfig.value.description,
+  ogImage: () => basicConfig.value.favicon,
+  ogType: 'website',
+  ogSiteName: () => basicConfig.value.title,
+  // Twitter Card
+  twitterCard: 'summary_large_image',
+  twitterTitle: () => basicConfig.value.title,
+  twitterDescription: () => basicConfig.value.description,
+  twitterImage: () => basicConfig.value.favicon,
+});
+
+// 页面标题模板和 favicon
+const route = useRoute();
+const siteTitle = computed(() => basicConfig.value.title);
+
+useHead({
+  titleTemplate: (title): string | null => {
+    // 首页特殊处理：显示"网站标题 - 网站副标题"
+    if (route.path === '/') {
+      const subtitle = basicConfig.value.subtitle;
+      return subtitle ? `${siteTitle.value} - ${subtitle}` : siteTitle.value || null;
+    }
+
+    // 其他页面：显示"页面标题 | 网站标题"
+    const pageTitle = title || (route.meta.title as string);
+    if (pageTitle) return `${pageTitle} | ${siteTitle.value}`;
+    return siteTitle.value || null;
+  },
+  link: [
+    { rel: 'icon', href: basicConfig.value.favicon || '/favicon.ico' },
+    // PWA Manifest
+    { rel: 'manifest', href: '/manifest.json' },
+    // RSS/Atom 订阅
+    {
+      rel: 'alternate',
+      type: 'application/rss+xml',
+      title: `${basicConfig.value.title} - RSS 2.0 Feed`,
+      href: '/rss.xml',
+    },
+    {
+      rel: 'alternate',
+      type: 'application/atom+xml',
+      title: `${basicConfig.value.title} - Atom Feed`,
+      href: '/atom.xml',
+    },
+  ],
+  meta: computed(() => [
+    { name: 'description', content: basicConfig.value.description },
+    { name: 'keywords', content: basicConfig.value.keywords },
+    { name: 'author', content: basicConfig.value.author },
+    // PWA 主题色
+    { name: 'theme-color', content: '#f7f7f7' },
+    { name: 'mobile-web-app-capable', content: 'yes' },
+    { name: 'apple-mobile-web-app-status-bar-style', content: 'default' },
+  ]),
+  script: [
+    {
+      type: 'application/ld+json',
+      innerHTML: JSON.stringify({
+        '@context': 'https://schema.org',
+        '@type': 'WebSite',
+        name: basicConfig.value.title,
+        description: basicConfig.value.description,
+      }),
+    },
+  ],
+});
+</script>
+
+<template>
+  <NuxtLayout>
+    <NuxtPage />
+  </NuxtLayout>
+</template>

package/assets/css/base.scss

@@ -0,0 +1,96 @@
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+}
+
+html {
+  scroll-behavior: smooth;
+  color-scheme: light dark;
+  max-width: 100%;
+  overflow-x: clip;
+}
+
+body {
+  margin: 0;
+  padding: 0;
+  line-height: 2;
+  max-width: 100%;
+  overflow-x: clip;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  margin: 0;
+  line-height: 1.3;
+  font-weight: inherit;
+}
+
+p {
+  margin: 0;
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+  transition: all 0.2s;
+}
+
+img {
+  max-width: 100%;
+  height: auto;
+  display: block;
+}
+
+ul,
+ol {
+  list-style: none;
+}
+
+button {
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: 0;
+  font-family: inherit;
+}
+
+input,
+textarea,
+select {
+  font-family: inherit;
+  font-size: inherit;
+  color: inherit;
+}
+
+::selection {
+  background: var(--theme-color);
+  color: #fff;
+}
+
+:focus-visible {
+  outline: 2px solid var(--theme-color);
+  outline-offset: 2px;
+}
+
+::-webkit-scrollbar {
+  width: 5px;
+  height: 5px;
+}
+
+::-webkit-scrollbar-thumb {
+  background: var(--theme-color);
+  border-radius: 5px;
+  cursor: pointer;
+}
+
+:where([class^='ri-']),
+:where([class*=' ri-']) {
+  font-size: 1.15em;
+  display: inline-block;
+}

package/composables/api/article.ts

@@ -0,0 +1,25 @@
+import type { Article, ArticleQuery } from '@@/types/article';
+import type { PaginationData } from '@@/types/request';
+import { createApi } from './createApi';
+
+const articleApi = createApi<Article>('/articles');
+
+/** 获取文章列表 */
+export const getArticlesForWeb = async (params: ArticleQuery = {}) => {
+  return articleApi.getList(params);
+};
+
+/** 获取文章详情 */
+export const getArticleBySlug = async (slug: string) => {
+  return articleApi.getOne(slug);
+};
+
+/** 搜索文章 */
+export const searchArticles = async (keyword: string, params: Partial<ArticleQuery> = {}) => {
+  return articleApi.get<PaginationData<Article>>('/search', { keyword, ...params });
+};
+
+/** 随机文章 slug */
+export const getRandomArticleSlug = async () => {
+  return articleApi.get<string>('/random');
+};

package/composables/api/category.ts

@@ -0,0 +1,19 @@
+import type { Category } from '@@/types/category';
+import { createApi } from './createApi';
+
+const categoryApi = createApi<Category>('/categories');
+
+/** 获取分类列表 */
+export const getCategories = async () => {
+  return categoryApi.getList();
+};
+
+/** 获取分类详情（By ID） */
+export const getCategoryById = async (id: number) => {
+  return categoryApi.getOne(id);
+};
+
+/** 获取分类详情（By Slug） */
+export const getCategoryBySlug = async (slug: string) => {
+  return categoryApi.getOne(slug);
+};

package/composables/api/comment.ts

@@ -0,0 +1,25 @@
+import type { Comment, CommentTargetType, CreateCommentParams } from '@@/types/comment';
+import type { PaginationQuery } from '@@/types/request';
+import { createApi } from './createApi';
+
+interface GetCommentsParams extends PaginationQuery {
+  target_type: CommentTargetType;
+  target_key: string | number;
+}
+
+const commentApi = createApi<Comment>('/comments', { stringifyTargetKey: true });
+
+/** 获取评论列表 */
+export const getComments = async (params: GetCommentsParams) => {
+  return commentApi.getList(params);
+};
+
+/** 创建评论 */
+export const createComment = async (params: CreateCommentParams) => {
+  return commentApi.create(params);
+};
+
+/** 删除评论（仅可删除自己的评论） */
+export const deleteComment = async (id: number) => {
+  return commentApi.delete(id);
+};

package/composables/api/createApi.ts

@@ -0,0 +1,242 @@
+import { $fetch } from 'ofetch';
+import type { FetchOptions } from 'ofetch';
+import { accessToken, setAccessToken, logout } from '../useAuth';
+import type { ApiResponse, PaginationData, PaginationQuery } from '@@/types/request';
+
+// ========== HTTP 请求基础设施 ==========
+
+type HttpMethod =
+  | 'GET'
+  | 'HEAD'
+  | 'PATCH'
+  | 'POST'
+  | 'PUT'
+  | 'DELETE'
+  | 'CONNECT'
+  | 'OPTIONS'
+  | 'TRACE';
+
+// Token 刷新状态
+let isRefreshing = false;
+let refreshPromise: Promise<boolean> | null = null;
+
+// 刷新 Token
+const doRefreshToken = async (): Promise<boolean> => {
+  try {
+    const res = await $fetch<ApiResponse<{ access_token: string }>>('/auth/refresh', {
+      method: 'POST',
+      baseURL: useRuntimeConfig().public.apiUrl as string,
+      credentials: 'include',
+    });
+    if (res.code === 0 && res.data) {
+      setAccessToken(res.data.access_token);
+      return true;
+    }
+    return false;
+  } catch {
+    return false;
+  }
+};
+
+// 封装请求，支持自动 Token 注入和 401 刷新
+/* eslint-disable @typescript-eslint/no-explicit-any -- 通用请求封装，返回类型由调用方指定 */
+async function apiRequest<T = any>(
+  url: string,
+  options: Omit<FetchOptions, 'method'> & { method?: HttpMethod; _retry?: boolean } = {}
+): Promise<T> {
+  const config = useRuntimeConfig();
+  const headers: Record<string, string> = {
+    ...((options.headers as Record<string, string>) || {}),
+  };
+
+  if (accessToken.value && url !== '/auth/refresh') {
+    headers['Authorization'] = `Bearer ${accessToken.value}`;
+  }
+
+  try {
+    const response = await $fetch<T>(url, {
+      ...options,
+      baseURL: config.public.apiUrl,
+      headers,
+      credentials: 'include',
+    } as any);
+
+    // 后端返回 HTTP 200 但业务 code 非 0 时，视为错误
+    if (
+      response &&
+      typeof response === 'object' &&
+      'code' in response &&
+      (response as any).code !== 0
+    ) {
+      const err = new Error((response as any).message || '请求失败') as any;
+      err.response = { data: response };
+      throw err;
+    }
+
+    return response;
+  } catch (error: any) {
+    // 401 自动刷新 token
+    if (error?.response?.status === 401 && !options._retry) {
+      if (!isRefreshing) {
+        isRefreshing = true;
+        refreshPromise = doRefreshToken().finally(() => {
+          isRefreshing = false;
+        });
+      }
+
+      const success = await refreshPromise;
+      if (success) {
+        return apiRequest<T>(url, { ...options, _retry: true });
+      }
+      logout();
+    }
+    throw error;
+  }
+}
+/* eslint-enable @typescript-eslint/no-explicit-any */
+
+/* eslint-disable @typescript-eslint/no-explicit-any -- 通用请求封装，返回类型/请求体由调用方指定 */
+async function get<T = any>(url: string, options: Omit<FetchOptions, 'method'> = {}): Promise<T> {
+  return await apiRequest<T>(url, { ...options, method: 'GET' });
+}
+
+async function post<T = any>(
+  url: string,
+  body?: any,
+  options: Omit<FetchOptions, 'method'> = {}
+): Promise<T> {
+  return await apiRequest<T>(url, { ...options, method: 'POST', body });
+}
+
+async function put<T = any>(
+  url: string,
+  body?: any,
+  options: Omit<FetchOptions, 'method'> = {}
+): Promise<T> {
+  return await apiRequest<T>(url, { ...options, method: 'PUT', body });
+}
+
+async function patch<T = any>(
+  url: string,
+  body?: any,
+  options: Omit<FetchOptions, 'method'> = {}
+): Promise<T> {
+  return await apiRequest<T>(url, { ...options, method: 'PATCH', body });
+}
+
+async function del<T = any>(url: string, options: Omit<FetchOptions, 'method'> = {}): Promise<T> {
+  return await apiRequest<T>(url, { ...options, method: 'DELETE' });
+}
+/* eslint-enable @typescript-eslint/no-explicit-any */
+
+// ========== API 工厂 ==========
+
+interface ApiFactoryOptions {
+  stringifyTargetKey?: boolean;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- 转换函数，输入输出类型由调用方决定
+  transformParams?: (params: any) => any;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- 转换函数，输入输出类型由调用方决定
+  transformBody?: (body: any) => any;
+}
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- 处理任意数据结构
+function processData(data: any, options: ApiFactoryOptions, isBody: boolean) {
+  let processed = { ...data };
+
+  if (options.stringifyTargetKey && processed.target_key !== undefined) {
+    processed.target_key = String(processed.target_key);
+  }
+
+  const transformFn = isBody ? options.transformBody : options.transformParams;
+  if (transformFn) {
+    processed = transformFn(processed);
+  }
+
+  return processed;
+}
+
+export function createApi<T>(endpoint: string, options: ApiFactoryOptions = {}) {
+  return {
+    getList: async (params?: Partial<PaginationQuery>): Promise<PaginationData<T>> => {
+      const response = await get<ApiResponse<PaginationData<T>>>(endpoint, {
+        params: processData(params, options, false),
+      });
+      return response.data;
+    },
+
+    getOne: async (id: number | string): Promise<T> => {
+      const response = await get<ApiResponse<T>>(`${endpoint}/${id}`);
+      return response.data;
+    },
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- 数据类型由调用方决定
+    create: async (data: any): Promise<T> => {
+      const response = await post<ApiResponse<T>>(endpoint, processData(data, options, true));
+      return response.data;
+    },
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- 数据类型由调用方决定
+    update: async (id: number | string, data: any): Promise<T> => {
+      const response = await put<ApiResponse<T>>(
+        `${endpoint}/${id}`,
+        processData(data, options, true)
+      );
+      return response.data;
+    },
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- 数据类型由调用方决定
+    patch: async (id: number | string, data: any): Promise<T> => {
+      const response = await patch<ApiResponse<T>>(
+        `${endpoint}/${id}`,
+        processData(data, options, true)
+      );
+      return response.data;
+    },
+
+    delete: async (id: number | string): Promise<void> => {
+      await del(`${endpoint}/${id}`);
+    },
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- 参数类型由调用方决定
+    get: async <R = T>(url: string, params?: any): Promise<R> => {
+      const response = await get<ApiResponse<R>>(`${endpoint}${url}`, {
+        params: processData(params, options, false),
+      });
+      return response.data;
+    },
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- 数据类型由调用方决定
+    post: async <R = T>(url: string, data?: any): Promise<R> => {
+      const response = await post<ApiResponse<R>>(
+        `${endpoint}${url}`,
+        processData(data, options, true)
+      );
+      return response.data;
+    },
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- 数据类型由调用方决定
+    put: async <R = T>(url: string, data?: any): Promise<R> => {
+      const response = await put<ApiResponse<R>>(
+        `${endpoint}${url}`,
+        processData(data, options, true)
+      );
+      return response.data;
+    },
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- 数据类型由调用方决定
+    patchRequest: async <R = T>(url: string, data?: any): Promise<R> => {
+      const response = await patch<ApiResponse<R>>(
+        `${endpoint}${url}`,
+        processData(data, options, true)
+      );
+      return response.data;
+    },
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- 数据类型由调用方决定
+    deleteRequest: async (url: string, data?: any): Promise<void> => {
+      await del(`${endpoint}${url}`, {
+        body: processData(data, options, true),
+      });
+    },
+  };
+}

package/composables/api/feedback.ts

@@ -0,0 +1,14 @@
+import type { Feedback, SubmitFeedbackParams } from '@@/types/feedback';
+import { createApi } from './createApi';
+
+const feedbackApi = createApi<Feedback>('');
+
+/** 提交反馈 */
+export const submitFeedback = async (data: SubmitFeedbackParams) => {
+  return feedbackApi.post('/feedback', data);
+};
+
+/** 查询反馈状态 */
+export const getFeedbackByTicketNo = async (ticketNo: string) => {
+  return feedbackApi.get(`/feedback/ticket/${ticketNo}`);
+};

package/composables/api/friend.ts

@@ -0,0 +1,14 @@
+import type { FriendGroupedResponse, FriendQueryParams, FriendApplyRequest } from '@@/types/friend';
+import { createApi } from './createApi';
+
+const friendApi = createApi<FriendGroupedResponse>('');
+
+/** 获取友链列表 */
+export const getFriends = async (params?: FriendQueryParams) => {
+  return friendApi.get('/friends', params);
+};
+
+/** 申请友链 */
+export const applyFriend = async (data: FriendApplyRequest) => {
+  return friendApi.post('/friends/apply', data);
+};

package/composables/api/moment.ts

@@ -0,0 +1,10 @@
+import type { Moment } from '@@/types/moment';
+import type { PaginationQuery } from '@@/types/request';
+import { createApi } from './createApi';
+
+const momentApi = createApi<Moment>('/moments');
+
+/** 获取动态列表 */
+export const getMoments = async (params: PaginationQuery = {}) => {
+  return momentApi.getList(params);
+};

package/composables/api/music.ts

@@ -0,0 +1,39 @@
+import type { MusicTrack } from '@@/types/moment';
+
+interface MusicApiResponse {
+  name?: string;
+  title?: string;
+  artist?: string;
+  author?: string;
+  url: string;
+  pic?: string;
+  cover?: string;
+  lrc?: string;
+}
+
+/** 从 Meting API 获取音乐数据 */
+export async function fetchMetingMusic(
+  apiUrl: string,
+  params: { server: string; type: string; id: string }
+): Promise<MusicTrack[]> {
+  const response = await $fetch<MusicApiResponse[] | MusicApiResponse>(
+    `${apiUrl}?server=${params.server}&type=${params.type}&id=${params.id}`
+  );
+  const list = Array.isArray(response) ? response : [response];
+  return list.map(item => ({
+    name: item.name || item.title || '未知歌曲',
+    artist: item.artist || item.author || '未知艺术家',
+    url: item.url,
+    cover: item.pic || item.cover || '',
+    lrc: item.lrc || '',
+  }));
+}
+
+/** 获取歌词文本 */
+export async function fetchLyricsText(lrcUrl: string): Promise<string> {
+  try {
+    return await $fetch<string>(lrcUrl, { responseType: 'text' });
+  } catch {
+    return '';
+  }
+}

package/composables/api/notification.ts

@@ -0,0 +1,19 @@
+import type { NotificationListResponse, GetNotificationsParams } from '@@/types/notification';
+import { createApi } from './createApi';
+
+const notificationApi = createApi<NotificationListResponse>('');
+
+/** 获取通知列表 */
+export const getNotifications = async (params: GetNotificationsParams) => {
+  return notificationApi.get<NotificationListResponse>('/notifications', params);
+};
+
+/** 标记单条通知已读 */
+export const markAsRead = async (id: number) => {
+  await notificationApi.put(`/notifications/${id}/read`);
+};
+
+/** 标记全部通知已读 */
+export const markAllAsRead = async () => {
+  await notificationApi.put('/notifications/read-all');
+};

package/composables/api/stats.ts

@@ -0,0 +1,14 @@
+import type { SiteStats, ArchiveStats } from '@@/types/stats';
+import { createApi } from './createApi';
+
+const statsApi = createApi<SiteStats>('');
+
+/** 获取网站统计信息 */
+export const getSiteStats = async () => {
+  return statsApi.get<SiteStats>('/stats/site');
+};
+
+/** 获取归档统计信息 */
+export const getArchiveStats = async () => {
+  return statsApi.get<ArchiveStats>('/stats/archives');
+};