优化：初步优化全局代码样式

2023-02-25 20:36:27 +08:00
parent a0358e1079
commit 57e1051a01
26 changed files with 433 additions and 453 deletions
--- a/docs/.vitepress/theme/MyLayout.vue
+++ b/docs/.vitepress/theme/MyLayout.vue
@@ -15,23 +15,21 @@
 </template>

 <script lang="ts" setup>
-import { computed } from 'vue'
-import DefaultTheme from 'vitepress/theme'
-import { useData } from 'vitepress'
-import md5 from 'blueimp-md5'
-import Copyright from './components/layout/Copyright.vue'
-import Comment from './components/layout/Comment.vue'
-import Footer from './components/layout/Footer.vue'
+  import { computed } from 'vue';
+  import DefaultTheme from 'vitepress/theme';
+  import { useData } from 'vitepress';
+  import md5 from 'blueimp-md5';
+  import Copyright from './components/layout/Copyright.vue';
+  import Comment from './components/layout/Comment.vue';
+  import Footer from './components/layout/Footer.vue';

-const { Layout } = DefaultTheme
-const { page, theme, frontmatter } = useData()
-const hasSidebar = computed(() => {
-  return (
-    frontmatter.value.aside !== false &&
-    frontmatter.value.layout !== 'home'
-  )
-})
+  const { Layout } = DefaultTheme;
+  const { page, theme, frontmatter } = useData();
+  const hasSidebar = computed(() => {
+    return (
+      frontmatter.value.aside !== false && frontmatter.value.layout !== 'home'
+    )
+  });
 </script>

-<style scoped>
-</style>
+<style scoped></style>
--- a/docs/.vitepress/theme/api/config.js
+++ b/docs/.vitepress/theme/api/config.js
@@ -1,24 +1,24 @@
-import axios from 'axios'
+import axios from 'axios';

 const createBaseInstance = () => {
-    const instance = axios.create({
-      baseURL: 'https://api.charles7c.top/blog',
-      timeout: 3000
-    })
-    instance.interceptors.request.use(handleRequest, handleError)
-    instance.interceptors.response.use(handleResponse, handleError)
-    return instance
+  const instance = axios.create({
+    baseURL: 'https://api.charles7c.top/blog',
+    timeout: 3000,
+  });
+  instance.interceptors.request.use(handleRequest, handleError);
+  instance.interceptors.response.use(handleResponse, handleError);
+  return instance;
 }
-export const request = createBaseInstance()
+export const request = createBaseInstance();

 function handleError(e) {
-    throw e
+  throw e;
 }

 function handleRequest(request) {
-    return request;
+  return request;
 }

 function handleResponse(response) {
-    return response.data
+  return response.data;
 }
--- a/docs/.vitepress/theme/api/index.js
+++ b/docs/.vitepress/theme/api/index.js
@@ -1,3 +1,3 @@
-export * from './interface'
+export * from './interface';

-export { default } from './interface'
+export { default } from './interface';
--- a/docs/.vitepress/theme/api/interface.js
+++ b/docs/.vitepress/theme/api/interface.js
@@ -1,17 +1,17 @@
-import { request } from './config'
+import { request } from './config';

 export const getArticleViewCount = (id, pageUrl, call) => {
-    request.get(`/article/view/${id}?pageUrl=${pageUrl}`, {}).then(result => {
-        call(process(result))
-    })
-}
+  request.get(`/article/view/${id}?pageUrl=${pageUrl}`, {}).then(result => {
+    call(process(result));
+  });
+};

 function process(result) {
-    if (result.code === 200) {
-        return result.data
-    } else {
-        console.log(result.msg)
-    }
+  if (result.code === 200) {
+    return result.data;
+  } else {
+    console.log(result.msg);
+  }
 }

 export default { getArticleViewCount }
--- a/docs/.vitepress/theme/components/Archive.vue
+++ b/docs/.vitepress/theme/components/Archive.vue
@@ -79,142 +79,97 @@
 </template>

 <script lang="ts" setup>
-import articleData from '../../../../article-data.json'
-import { formatDate, getQueryParam, goToLink } from '../utils.ts'
+  import articleData from '../../../../article-data.json';
+  import { getQueryParam, goToLink } from '../utils.ts';

-// 文章原始数据和归档数据
-let $articleData
-let archiveData
+  // 文章原始数据和归档数据
+  let $articleData;
+  let archiveData;

-// 要筛选的分类、标签、年份
-let $category
-let $tag
-let $year
+  // 要筛选的分类、标签、年份
+  let $category;
+  let $tag;
+  let $year;

-initTimeline()
+  /**
+   * 初始化时间轴
+   */
+  function initTimeline() {
+    $articleData = [];
+    archiveData = {};

-/**
- * 初始化时间轴
- */
-function initTimeline() {
-  $articleData = []
-  archiveData = {}
-
-  // 如果URL路径有category或tag或year参数, 默认筛选出指定category或tag或year的文章数据
-  // 例如: /archives?category=Bug万象集
-  // 例如: /archives?tag=JVM
-  // 例如: /archives?year=2020
-  $category = getQueryParam('category')
-  $tag = getQueryParam('tag')
-  $year = getQueryParam('year')
-  if ($category && $category.trim() != '') {
-    for (let i = 0; i < articleData.length; i++) {
-      let article = articleData[i]
-      if (article.categories && article.categories.includes($category)) {
-        $articleData.push(article)
+    // 如果URL路径有category或tag或year参数, 默认筛选出指定category或tag或year的文章数据
+    // 例如: /archives?category=Bug万象集
+    // 例如: /archives?tag=JVM
+    // 例如: /archives?year=2020
+    $category = getQueryParam('category');
+    $tag = getQueryParam('tag');
+    $year = getQueryParam('year');
+    if ($category && $category.trim() != '') {
+      for (let i = 0; i < articleData.length; i++) {
+        let article = articleData[i];
+        if (article.categories && article.categories.includes($category)) {
+          $articleData.push(article);
+        }
      }
-    }
-  } else if ($tag && $tag.trim() != '') {
-    for (let i = 0; i < articleData.length; i++) {
-      let article = articleData[i]
-      if (article.tags && article.tags.includes($tag)) {
-        $articleData.push(article)
+    } else if ($tag && $tag.trim() != '') {
+      for (let i = 0; i < articleData.length; i++) {
+        let article = articleData[i];
+        if (article.tags && article.tags.includes($tag)) {
+          $articleData.push(article);
+        }
      }
-    }
-  } else if ($year && $year.trim() != '') {
-    for (let i = 0; i < articleData.length; i++) {
-      let article = articleData[i]
-      if (article.date && new Date(article.date).getFullYear() == $year) {
-        $articleData.push(article)
+    } else if ($year && $year.trim() != '') {
+      for (let i = 0; i < articleData.length; i++) {
+        let article = articleData[i];
+        if (article.date && new Date(article.date).getFullYear() == $year) {
+          $articleData.push(article);
+        }
      }
+    } else {
+      $articleData.push(...articleData);
    }
-  } else {
-    $articleData.push(...articleData)
+
+    // 文章数据归档处理
+    // 1.对文章数据进行降序排序
+    $articleData.sort((a, b) => b.date.localeCompare(a.date));
+    // 2.按年、月进行归档
+    for (let i = 0; i < $articleData.length; i++) {
+      const article = $articleData[i];
+      let year = (new Date(article.date).getFullYear()) + '年';
+      let month = (new Date(article.date).getMonth() + 1) + '月';
+
+      if (!archiveData[year]) {
+        archiveData[year] = {};
+      }
+      if (!(archiveData[year][month])) {
+        archiveData[year][month] = [];
+      }
+
+      archiveData[year][month].push(article);
+    }
+  }
+  initTimeline();
+
+  /**
+   * 获取生肖图标
+   *
+   * @param year 年份
+   */
+  function getChineseZodiac(year) {
+    const arr = ['monkey', 'rooster', 'dog', 'pig', 'rat', 'ox', 'tiger', 'rabbit', 'dragon', 'snake', 'horse', 'goat'];
+    return arr[year % 12];
  }

-  // 文章数据归档处理
-  // 1.对文章数据进行降序排序
-  $articleData.sort((a, b) => b.date.localeCompare(a.date))
-  // 2.按年、月进行归档
-  for (let i = 0; i < $articleData.length; i++) {
-    const article = $articleData[i]
-    let year = (new Date(article.date).getFullYear()) + '年'
-    let month = (new Date(article.date).getMonth() + 1) + '月'
-
-    if (!archiveData[year]) {
-      archiveData[year] = {}
-    }
-    if (!(archiveData[year][month])) {
-      archiveData[year][month] = []
-    }
-    
-    archiveData[year][month].push(article)
-  } 
-}
-
-/**
- * 获取生肖
- */
-function getChineseZodiac(year) {
-  switch(year % 12){
-    case 0:
-      return 'monkey'
-    case 1:
-      return 'rooster'
-    case 2:
-      return 'dog'
-    case 3:
-      return 'pig'
-    case 4:
-      return 'rat'
-    case 5:
-      return 'ox'
-    case 6:
-      return 'tiger'
-    case 7:
-      return 'rabbit'
-    case 8:
-      return 'dragon'
-    case 9:
-      return 'snake'
-    case 10:
-      return 'horse'
-    case 11:
-      return 'goat'
+  /**
+   * 获取生肖名称
+   *
+   * @param year 年份
+   */
+  function getChineseZodiacAlias(year) {
+    const arr = ['猴年', '鸡年', '狗年', '猪年', '鼠年', '牛年', '虎年', '兔年', '龙年', '蛇年', '马年', '羊年'];
+    return arr[year % 12];
  }
-}
-
-/**
- * 获取生肖名称
- */
-function getChineseZodiacAlias(year) {
-  switch(year % 12){
-    case 0:
-      return '猴年'
-    case 1:
-      return '鸡年'
-    case 2:
-      return '狗年'
-    case 3:
-      return '猪年'
-    case 4:
-      return '鼠年'
-    case 5:
-      return '牛年'
-    case 6:
-      return '虎年'
-    case 7:
-      return '兔年'
-    case 8:
-      return '龙年'
-    case 9:
-      return '蛇年'
-    case 10:
-      return '马年'
-    case 11:
-      return '羊年'
-  }
-}
 </script>

 <style scoped>
--- a/docs/.vitepress/theme/components/ArticleMetadata.vue
+++ b/docs/.vitepress/theme/components/ArticleMetadata.vue
@@ -68,49 +68,49 @@
 </template>

 <script lang="ts" setup>
-import { reactive, toRefs, onMounted } from 'vue'
-import { useData } from 'vitepress'
-import md5 from 'blueimp-md5'
-import dayjs from 'dayjs'
-import 'dayjs/locale/zh-cn'
-import relativeTime from 'dayjs/plugin/relativeTime'
-import { goToLink } from '../utils.ts'
+  import { reactive, toRefs, onMounted } from 'vue';
+  import { useData } from 'vitepress';
+  import md5 from 'blueimp-md5';
+  import dayjs from 'dayjs';
+  import 'dayjs/locale/zh-cn';
+  import relativeTime from 'dayjs/plugin/relativeTime';
+  import { goToLink } from '../utils.ts';

-dayjs.extend(relativeTime)
-dayjs.locale('zh-cn')
+  dayjs.extend(relativeTime);
+  dayjs.locale('zh-cn');

-// 定义文章属性
-const props = defineProps({
-  article: Object,
-  showCategory: {
-    type: Boolean,
-    default: true
+  // 定义文章属性
+  const props = defineProps({
+    article: Object,
+    showCategory: {
+      type: Boolean,
+      default: true,
+    },
+  });
+
+  // 初始化文章元数据信息
+  const { theme, page } = useData();
+  const data = reactive({
+    isOriginal: props.article?.isOriginal ?? true,
+    author: props.article?.author ?? theme.value.articleMetadataConfig.author,
+    authorLink: props.article?.authorLink ?? theme.value.articleMetadataConfig.authorLink,
+    showViewCount: theme.value.articleMetadataConfig?.showViewCount ?? false,
+    viewCount: 0,
+    date: new Date(props.article.date),
+    categories: props.article?.categories ?? [],
+    tags: props.article?.tags ?? [],
+    showCategory: props.showCategory
+  });
+  const { isOriginal, author, authorLink, showViewCount, viewCount, date, toDate, categories, tags, showCategory } = toRefs(data);
+
+  if (data.showViewCount) {
+    // 记录并获取文章阅读数（使用文章标题 + 发布时间生成 MD5 值，作为文章的唯一标识）
+    onMounted(() => {
+      $api.getArticleViewCount(md5(props.article.title + props.article.date), location.href, function(viewCountData) {
+        data.viewCount = viewCountData;
+      });
+    });
  }
-})
-
-// 初始化文章元数据信息
-const { theme, page } = useData()
-const data = reactive({
-  isOriginal: props.article?.isOriginal ?? true,
-  author: props.article?.author ?? theme.value.articleMetadataConfig.author,
-  authorLink: props.article?.authorLink ?? theme.value.articleMetadataConfig.authorLink,
-  showViewCount: theme.value.articleMetadataConfig?.showViewCount ?? false,
-  viewCount: 0,
-  date: new Date(props.article.date),
-  categories: props.article?.categories ?? [],
-  tags: props.article?.tags ?? [],
-  showCategory: props.showCategory
-})
-const { isOriginal, author, authorLink, showViewCount, viewCount, date, toDate, categories, tags, showCategory } = toRefs(data)
-
-if (data.showViewCount) {
-  // 记录并获取文章阅读数（使用文章标题 + 发布时间生成 MD5 值，作为文章的唯一标识）
-  onMounted(() => {
-    $api.getArticleViewCount(md5(props.article.title + props.article.date), location.href, function(viewCountData) {
-      data.viewCount = viewCountData
-    })
-  })
-}
 </script>

 <style scoped>
--- a/docs/.vitepress/theme/components/Tag.vue
+++ b/docs/.vitepress/theme/components/Tag.vue
@@ -58,63 +58,63 @@
 </template>

 <script lang="ts" setup>
-import { computed, ref, onMounted } from 'vue'
-import md5 from 'blueimp-md5'
-import articleData from '../../../../article-data.json'
-import { formatDate, getQueryParam } from '../utils.ts'
+  import { computed, ref } from 'vue';
+  import md5 from 'blueimp-md5';
+  import articleData from '../../../../article-data.json';
+  import { getQueryParam } from '../utils.ts';

-const tags = computed(() => initTags(articleData))
-/**
- * 初始化标签数据
- * {tagTitle1: [article1, article2, ...}
- */
-function initTags(articleData) {
-  const tags: any = {}
-  for (let i = 0; i < articleData.length; i++) {
-    const article = articleData[i]
-    const articleTags = article.tags
-    if (Array.isArray(articleTags)) {
-      articleTags.forEach((articleTag) => {
-        if (!tags[articleTag]) {
-          tags[articleTag] = []
-        }
-        tags[articleTag].push(article)
-        // 文章按发布时间降序排序
-        tags[articleTag].sort((a, b) => b.date.localeCompare(a.date))
-      })
+  const tags = computed(() => initTags(articleData));
+  /**
+   * 初始化标签数据
+   * {tagTitle1: [article1, article2, ...}
+   */
+  function initTags(articleData) {
+    const tags: any = {};
+    for (let i = 0; i < articleData.length; i++) {
+      const article = articleData[i];
+      const articleTags = article.tags;
+      if (Array.isArray(articleTags)) {
+        articleTags.forEach((articleTag) => {
+          if (!tags[articleTag]) {
+            tags[articleTag] = [];
+          }
+          tags[articleTag].push(article);
+          // 文章按发布时间降序排序
+          tags[articleTag].sort((a, b) => b.date.localeCompare(a.date));
+        });
+      }
+    }
+    return tags;
+  }
+
+  // 点击指定Tag后进行选中
+  let selectTag = ref('');
+  const toggleTag = (tagTitle: string) => {
+    if (selectTag.value && selectTag.value == tagTitle) {
+      selectTag.value = null;
+    } else {
+      selectTag.value = tagTitle;
    }
  }
-  return tags
-}

-// 点击指定Tag后进行选中
-let selectTag = ref('')
-const toggleTag = (tagTitle: string) => {
-  if (selectTag.value && selectTag.value == tagTitle) {
-    selectTag.value = null
-  } else {
-    selectTag.value = tagTitle
+  // 如果URL路径有tag参数, 默认选中指定Tag, 例如: /tags?tag=Git
+  let tag = getQueryParam('tag');
+  if (tag && tag.trim() != '') {
+    toggleTag(tag);
  }
-}

-// 如果URL路径有tag参数, 默认选中指定Tag, 例如: /tags?tag=Git
-let tag = getQueryParam('tag')
-if (tag && tag.trim() != '') {
-  toggleTag(tag)
-}
-
-const dataList = computed(() => initWordCloud(tags))
-/**
- * 初始化词云数据
- * [{"name": xx, "value": xx}]
- */
-function initWordCloud(tags) {
-  const dataList = []
-  for (let tag in tags.value) {
-    dataList.push({"name": tag, "value": tags.value[tag].length})
+  const dataList = computed(() => initWordCloud(tags));
+  /**
+   * 初始化词云数据
+   * [{"name": xx, "value": xx}]
+   */
+  function initWordCloud(tags) {
+    const dataList = [];
+    for (let tag in tags.value) {
+      dataList.push({"name": tag, "value": tags.value[tag].length});
+    }
+    return dataList;
  }
-  return dataList
-}
 </script>

 <style scoped>
--- a/docs/.vitepress/theme/components/layout/Comment.vue
+++ b/docs/.vitepress/theme/components/layout/Comment.vue
@@ -3,79 +3,78 @@
 </template>

 <script lang="ts" setup>
-import { reactive, toRefs, onMounted } from 'vue'
-import { useData } from 'vitepress'
-import md5 from 'blueimp-md5'
-import $ from 'jquery'
-import { Message } from '@arco-design/web-vue'
-import '@arco-design/web-vue/es/message/style/css.js'
-import Gitalk from 'gitalk'
-import '../../styles/components/gitalk.css'
+  import { reactive, toRefs, onMounted } from 'vue';
+  import { useData } from 'vitepress';
+  import md5 from 'blueimp-md5';
+  import $ from 'jquery';
+  import { Message } from '@arco-design/web-vue';
+  import '@arco-design/web-vue/es/message/style/css.js';
+  import Gitalk from 'gitalk';
+  import '../../styles/components/gitalk.css';

-// 定义属性
-const props = defineProps({
-  commentConfig: Object
-})
+  // 定义属性
+  const props = defineProps({
+    commentConfig: Object,
+  });

-const data = reactive({
-  type: props.commentConfig?.type ?? 'gitalk'
-})
-const { type } = toRefs(data)
-
-// 初始化评论组件配置
-const { page } = useData()
-let gitalk
-if (type.value && type.value == 'gitalk') {
-  gitalk = new Gitalk({
-    clientID: '1de126ce1fbdbe049709',
-    clientSecret: '035fe49874a43e5cefc28a99b7e40b1925319c62',
-    repo: 'charles7c.github.io',
-    owner: 'Charles7c',
-    admin: ['Charles7c'],
-    id: md5(page.value.relativePath),
-    language: 'zh-CN',
-    distractionFreeMode: false,
-    // 默认: https://cors-anywhere.azm.workers.dev/https://github.com/login/oauth/access_token
-    proxy: 'https://vercel.charles7c.top/github_access_token'
+  const data = reactive({
+    type: props.commentConfig?.type ?? 'gitalk',
  })
-}
+  const { type } = toRefs(data);

-// 渲染评论组件
-onMounted(() => {
+  // 初始化评论组件配置
+  const { page } = useData();
+  let gitalk;
  if (type.value && type.value == 'gitalk') {
-    gitalk.render('comment-container')
-
-    // 如果点赞，先判断有没有登录
-    let $gc = $('#comment-container');
-    $gc.on('click', '.gt-comment-like', function () {
-      if (!window.localStorage.getItem('GT_ACCESS_TOKEN')) {
-        Message.warning({
-          content:'点赞前，请您先进行登录',
-          closable: true
-        })
- 
-        return false
-      }
-      return true
-    })
-    // 提交评论后输入框高度没有重置bug
-    $gc.on('click', '.gt-header-controls .gt-btn-public', function () {
-      let $gt = $('.gt-header-textarea')
-      $gt.css('height', '72px')
-    })
-    // 点击预览时，隐藏评论按钮
-    $gc.on('click', '.gt-header-controls .gt-btn-preview', function () {
-      let pl = $('.gt-header-controls .gt-btn-public');
-      if (pl.hasClass('hide')) {
-        pl.removeClass('hide')
-      } else {
-        // 隐藏
-        pl.addClass('hide')
-      }
-    })
+    gitalk = new Gitalk({
+      clientID: '1de126ce1fbdbe049709',
+      clientSecret: '035fe49874a43e5cefc28a99b7e40b1925319c62',
+      repo: 'charles7c.github.io',
+      owner: 'Charles7c',
+      admin: ['Charles7c'],
+      id: md5(page.value.relativePath),
+      language: 'zh-CN',
+      distractionFreeMode: false,
+      // 默认: https://cors-anywhere.azm.workers.dev/https://github.com/login/oauth/access_token
+      proxy: 'https://vercel.charles7c.top/github_access_token',
+    });
  }
-})
+
+  // 渲染评论组件
+  onMounted(() => {
+    if (type.value && type.value == 'gitalk') {
+      gitalk.render('comment-container')
+
+      // 如果点赞，先判断有没有登录
+      let $gc = $('#comment-container');
+      $gc.on('click', '.gt-comment-like', function () {
+        if (!window.localStorage.getItem('GT_ACCESS_TOKEN')) {
+          Message.warning({
+            content: '点赞前，请您先进行登录',
+            closable: true
+          })
+
+          return false
+        }
+        return true
+      })
+      // 提交评论后输入框高度没有重置bug
+      $gc.on('click', '.gt-header-controls .gt-btn-public', function () {
+        let $gt = $('.gt-header-textarea')
+        $gt.css('height', '72px')
+      })
+      // 点击预览时，隐藏评论按钮
+      $gc.on('click', '.gt-header-controls .gt-btn-preview', function () {
+        let pl = $('.gt-header-controls .gt-btn-public');
+        if (pl.hasClass('hide')) {
+          pl.removeClass('hide')
+        } else {
+          // 隐藏
+          pl.addClass('hide')
+        }
+      })
+    }
+  })
 </script>

-<style scoped>
-</style>
+<style scoped></style>
--- a/docs/.vitepress/theme/components/layout/Copyright.vue
+++ b/docs/.vitepress/theme/components/layout/Copyright.vue
@@ -43,18 +43,18 @@
 </template>

 <script lang="ts" setup>
-import { reactive, toRefs } from 'vue'
-import { useData } from 'vitepress'
-const { theme, frontmatter } = useData()
+  import { reactive, toRefs } from 'vue';
+  import { useData } from 'vitepress';
+  const { theme, frontmatter } = useData();

-const data = reactive({
-  isOriginal: frontmatter.value?.isOriginal ?? true,
-  author: frontmatter.value?.author ?? theme.value.articleMetadataConfig.author,
-  authorLink: frontmatter.value?.authorLink ?? theme.value.articleMetadataConfig.authorLink,
-  articleTitle: frontmatter.value?.articleTitle ?? frontmatter.value.title,
-  articleLink: frontmatter.value?.articleLink ?? decodeURI(window.location.href)
-})
-const { isOriginal, author, authorLink, articleTitle, articleLink } = toRefs(data)
+  const data = reactive({
+    isOriginal: frontmatter.value?.isOriginal ?? true,
+    author: frontmatter.value?.author ?? theme.value.articleMetadataConfig.author,
+    authorLink: frontmatter.value?.authorLink ?? theme.value.articleMetadataConfig.authorLink,
+    articleTitle: frontmatter.value?.articleTitle ?? frontmatter.value.title,
+    articleLink: frontmatter.value?.articleLink ?? decodeURI(window.location.href),
+  });
+  const { isOriginal, author, authorLink, articleTitle, articleLink } = toRefs(data);
 </script>

 <style scoped>
@@ -68,7 +68,7 @@ const { isOriginal, author, authorLink, articleTitle, articleLink } = toRefs(dat
 }

 .copyright .content {
-  
+
  padding: 13px 16px;
 }

--- a/docs/.vitepress/theme/components/layout/Footer.vue
+++ b/docs/.vitepress/theme/components/layout/Footer.vue
@@ -23,8 +23,8 @@
 </template>

 <script lang="ts" setup>
-import { useData } from 'vitepress'
-const { theme } = useData()
+  import { useData } from 'vitepress';
+  const { theme } = useData();
 </script>

 <style scoped>
--- a/docs/.vitepress/theme/index.ts
+++ b/docs/.vitepress/theme/index.ts
@@ -1,21 +1,21 @@
 import DefaultTheme from 'vitepress/theme'
-import MyLayout from './MyLayout.vue'
-import './styles/vars.css'
-import './styles/custom.css'
-import axios from 'axios'
-import api from './api/index'
+import MyLayout from './MyLayout.vue';
+import './styles/vars.css';
+import './styles/custom.css';
+import axios from 'axios';
+import api from './api/index';

 export default {
  ...DefaultTheme,
  Layout: MyLayout,
  enhanceApp(ctx) {
    // extend default theme custom behaviour.
-    DefaultTheme.enhanceApp(ctx)
+    DefaultTheme.enhanceApp(ctx);

    // 全局挂载 API 接口
    ctx.app.config.globalProperties.$http = axios
    if (typeof window !== 'undefined') {
-        window.$api = api
+        window.$api = api;
    }

    // register your custom global components
--- a/docs/.vitepress/theme/utils.ts
+++ b/docs/.vitepress/theme/utils.ts
@@ -1,36 +1,39 @@
 /**
 * 格式化时间
+ *
 * @param date 待格式化时间
 * @returns 格式化后的时间(YYYY/MM/dd AM hh:mm)
 */
 export function formatDate(date) {
-  const formatDate = new Date(date)
-  return formatDate.toLocaleString('zh', {year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric'})
+  const formatDate = new Date(date);
+  return formatDate.toLocaleString('zh', {year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric'});
 }

 /**
- * 获取URL路径中的指定参数 
+ * 获取 URL 路径中的指定参数
+ *
 * @param paramName 参数名
 * @returns 参数值
 */
 export function getQueryParam(paramName) {
-  const reg = new RegExp("(^|&)"+ paramName +"=([^&]*)(&|$)")
-  let value = decodeURIComponent(window.location.search.substr(1)).match(reg)
+  const reg = new RegExp("(^|&)"+ paramName +"=([^&]*)(&|$)");
+  let value = decodeURIComponent(window.location.search.substr(1)).match(reg);
  if (value != null) {
-    return unescape(value[2])
+    return unescape(value[2]);
  } 
-  return null
+  return null;
 }

 /**
 * 跳转到指定链接
+ *
 * @param paramName 参数名
 * @param paramValue 参数值
 */
 export function goToLink(url, paramName, paramValue) {
  if (paramName) {
-    window.location.href = url + '?' + paramName + '=' + paramValue
+    window.location.href = url + '?' + paramName + '=' + paramValue;
  } else {
-    window.location.href = url
+    window.location.href = url;
  }
 }