perf: refine system settings form

Signed-off-by: Ryan Wang <i@ryanc.cc>
2022-08-25 15:21:16 +08:00 · 2022-08-25 15:21:16 +08:00 · 066cbce120
parent 714f61dfc2
commit 066cbce120
10 changed files with 212 additions and 13 deletions
--- a/packages/shared/src/layouts/index.ts
+++ b/packages/shared/src/layouts/index.ts
@ -1,4 +1,3 @@
 export { default as BlankLayout } from "./BlankLayout.vue";
 export { default as BasicLayout } from "./BasicLayout.vue";
-export { default as SystemSettingsLayout } from "./SystemSettingsLayout.vue";
 export { default as PluginLayout } from "./PluginLayout.vue";
--- a/src/modules/system/settings/CodeInjectSettings.vue
+++ b/src/modules/system/settings/CodeInjectSettings.vue
@ -0,0 +1,29 @@
+<script lang="ts" setup>
+import { VButton } from "@halo-dev/components";
+</script>
+<template>
+  <div class="w-1/3">
+    <FormKit type="form">
+      <FormKit
+        help="插入代码到所有页面的 head 标签部分"
+        label="全局 head"
+        type="textarea"
+      ></FormKit>
+      <FormKit
+        help="插入代码到文章页面和自定义页面的 head 标签部分"
+        label="内容页 head"
+        type="textarea"
+      ></FormKit>
+      <FormKit
+        help="插入代码到所有页面的页脚部分"
+        label="页脚"
+        type="textarea"
+      ></FormKit>
+    </FormKit>
+  </div>
+  <div class="pt-5">
+    <div class="flex justify-start">
+      <VButton type="secondary"> 保存</VButton>
+    </div>
+  </div>
+</template>
--- a/src/modules/system/settings/CommentSettings.vue
+++ b/src/modules/system/settings/CommentSettings.vue
@ -0,0 +1,41 @@
+<script lang="ts" setup>
+import { VButton } from "@halo-dev/components";
+</script>
+<template>
+  <div class="w-1/3">
+    <FormKit :actions="false" type="form">
+      <FormKit
+        :options="[
+          { label: '启用', value: true },
+          { label: '禁用', value: false },
+        ]"
+        :value="true"
+        label="启用评论"
+        type="radio"
+      ></FormKit>
+      <FormKit
+        :options="[
+          { label: '是', value: true },
+          { label: '否', value: false },
+        ]"
+        :value="true"
+        label="新评论审核"
+        type="radio"
+      ></FormKit>
+      <FormKit
+        :options="[
+          { label: '是', value: true },
+          { label: '否', value: false },
+        ]"
+        :value="true"
+        label="仅限注册用户评论"
+        type="radio"
+      ></FormKit>
+    </FormKit>
+  </div>
+  <div class="pt-5">
+    <div class="flex justify-start">
+      <VButton type="secondary"> 保存</VButton>
+    </div>
+  </div>
+</template>
--- a/src/modules/system/settings/GeneralSettings.vue
+++ b/src/modules/system/settings/GeneralSettings.vue
@ -4,7 +4,6 @@ import { VButton } from "@halo-dev/components";
 <template>
  <div class="w-1/3">
    <FormKit :actions="false" type="form">
-      <FormKit label="站点地址" type="url"></FormKit>
      <FormKit label="站点标题" type="text"></FormKit>
      <FormKit label="站点副标题" type="text"></FormKit>
      <FormKit label="Logo" type="url"></FormKit>
--- a/src/modules/system/settings/NotificationSettings.vue
+++ b/src/modules/system/settings/NotificationSettings.vue
@ -2,15 +2,7 @@
 import { VButton } from "@halo-dev/components";
 </script>
 <template>
-  <div class="w-1/3">
-    <FormKit :actions="false" type="form">
-      <FormKit label="站点地址" type="url"></FormKit>
-      <FormKit label="站点标题" type="text"></FormKit>
-      <FormKit label="站点副标题" type="text"></FormKit>
-      <FormKit label="Logo" type="url"></FormKit>
-      <FormKit label="Favicon" type="url"></FormKit>
-    </FormKit>
-  </div>
+  <div class="w-1/3">// TODO</div>
  <div class="pt-5">
    <div class="flex justify-start">
      <VButton type="secondary"> 保存</VButton>
--- a/src/modules/system/settings/PostSettings.vue
+++ b/src/modules/system/settings/PostSettings.vue
@ -0,0 +1,34 @@
+<script lang="ts" setup>
+import { VButton } from "@halo-dev/components";
+</script>
+<template>
+  <div class="w-1/3">
+    <FormKit type="form">
+      <FormKit
+        :options="[
+          { label: '发布时间', value: '' },
+          { label: '更新时间', value: '' },
+          { label: '浏览量', value: '' },
+        ]"
+        label="默认排序方式"
+        type="select"
+      ></FormKit>
+      <FormKit label="默认显示条数" type="number"></FormKit>
+      <FormKit
+        :options="[
+          { label: '是', value: true },
+          { label: '否', value: false },
+        ]"
+        :value="false"
+        label="新文章审核"
+        help="用户发布文章是否需要管理员审核"
+        type="radio"
+      ></FormKit>
+    </FormKit>
+  </div>
+  <div class="pt-5">
+    <div class="flex justify-start">
+      <VButton type="secondary"> 保存</VButton>
+    </div>
+  </div>
+</template>
--- a/src/modules/system/settings/SeoSettings.vue
+++ b/src/modules/system/settings/SeoSettings.vue
@ -0,0 +1,25 @@
+<script lang="ts" setup>
+import { VButton } from "@halo-dev/components";
+</script>
+<template>
+  <div class="w-1/3">
+    <FormKit type="form">
+      <FormKit
+        :options="[
+          { label: '是', value: true },
+          { label: '否', value: false },
+        ]"
+        :value="false"
+        label="屏蔽搜索引擎"
+        type="radio"
+      ></FormKit>
+      <FormKit label="站点关键词" type="textarea"></FormKit>
+      <FormKit label="站点描述" type="textarea"></FormKit>
+    </FormKit>
+  </div>
+  <div class="pt-5">
+    <div class="flex justify-start">
+      <VButton type="secondary"> 保存</VButton>
+    </div>
+  </div>
+</template>
--- a/src/modules/system/settings/UserSettings.vue
+++ b/src/modules/system/settings/UserSettings.vue
@ -0,0 +1,24 @@
+<script lang="ts" setup>
+import { VButton } from "@halo-dev/components";
+</script>
+<template>
+  <div class="w-1/3">
+    <FormKit type="form">
+      <FormKit
+        :options="[
+          { label: '是', value: true },
+          { label: '否', value: false },
+        ]"
+        :value="false"
+        label="是否公开注册"
+        type="radio"
+      ></FormKit>
+      <FormKit label="默认角色" type="select"></FormKit>
+    </FormKit>
+  </div>
+  <div class="pt-5">
+    <div class="flex justify-start">
+      <VButton type="secondary"> 保存</VButton>
+    </div>
+  </div>
+</template>
--- a/src/modules/system/settings/layouts/SystemSettingsLayout.vue
+++ b/src/modules/system/settings/layouts/SystemSettingsLayout.vue
@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { BasicLayout } from "./index";
+import { BasicLayout } from "@halo-dev/admin-shared";
 import {
  IconSettings,
  VButton,
@ -16,6 +16,31 @@ const SettingTabs = [
    label: "基本设置",
    routeName: "GeneralSettings",
  },
+  {
+    id: "user",
+    label: "用户设置",
+    routeName: "UserSettings",
+  },
+  {
+    id: "post",
+    label: "文章设置",
+    routeName: "PostSettings",
+  },
+  {
+    id: "seo",
+    label: "SEO 设置",
+    routeName: "SeoSettings",
+  },
+  {
+    id: "comment",
+    label: "评论设置",
+    routeName: "CommentSettings",
+  },
+  {
+    id: "code-inject",
+    label: "代码注入",
+    routeName: "CodeInjectSettings",
+  },
  {
    id: "notification",
    label: "通知设置",
--- a/src/modules/system/settings/module.ts
+++ b/src/modules/system/settings/module.ts
@ -1,5 +1,11 @@
-import { definePlugin, SystemSettingsLayout } from "@halo-dev/admin-shared";
+import { definePlugin } from "@halo-dev/admin-shared";
+import SystemSettingsLayout from "./layouts/SystemSettingsLayout.vue";
 import GeneralSettings from "./GeneralSettings.vue";
+import UserSettings from "./UserSettings.vue";
+import PostSettings from "./PostSettings.vue";
+import SeoSettings from "./SeoSettings.vue";
+import CommentSettings from "./CommentSettings.vue";
+import CodeInjectSettings from "./CodeInjectSettings.vue";
 import NotificationSettings from "./NotificationSettings.vue";
 import { IconSettings } from "@halo-dev/components";

@ -17,6 +23,31 @@ export default definePlugin({
          name: "GeneralSettings",
          component: GeneralSettings,
        },
+        {
+          path: "user",
+          name: "UserSettings",
+          component: UserSettings,
+        },
+        {
+          path: "post",
+          name: "PostSettings",
+          component: PostSettings,
+        },
+        {
+          path: "seo",
+          name: "SeoSettings",
+          component: SeoSettings,
+        },
+        {
+          path: "comment",
+          name: "CommentSettings",
+          component: CommentSettings,
+        },
+        {
+          path: "code-inject",
+          name: "CodeInjectSettings",
+          component: CodeInjectSettings,
+        },
        {
          path: "notification",
          name: "NotificationSettings",