docs(section): add document of section component

packages/ui-vue/docs/.vitepress/theme/index.ts

@@ -2,6 +2,7 @@
 import Accordion from '../../../components/accordion';
 import Button from '../../../components/button';
 import ButtonEdit from '../../../components/button-edit';
+import Section from '../../../components/section';
 import Switch from '../../../components/switch';
 // import DefaultTheme from 'vitepress/theme';
 import FarrisTheme from '../farris-theme';
@@ -14,7 +15,7 @@ export default {
     // ...DefaultTheme,
     ...FarrisTheme,
     enhanceApp({ app }) {
-        app.use(Accordion).use(Button).use(ButtonEdit).use(Switch);
+        app.use(Accordion).use(Button).use(ButtonEdit).use(Section).use(Switch);
         registerComponents(app);
     }
 };

packages/ui-vue/docs/components/section/index.md

@@ -1 +1,72 @@
-# Section
+# Section 面板
+
+Section 组件为开发者提供了一个具有标题的组件容器。
+
+## 基本用法
+
+:::demo
+
+```vue
+<script setup lang="ts">
+import { ref } from 'vue';
+</script>
+<template>
+    <f-section main-title="This is a section title">
+        <div>
+            <span>This is setion content.</span>
+        </div>
+    </f-section>
+</template>
+```
+
+:::
+
+## 类型
+
+```typescript
+export interface ButtonAppearance {
+    class: string;
+}
+
+export interface ButtonConfig {
+    id: string;
+    disable: boolean;
+    title: string;
+    click: any;
+    appearance: ButtonAppearance;
+    visible?: boolean;
+}
+
+export interface ToolbarConfig {
+    position: string;
+    contents: ButtonConfig[];
+}
+```
+
+## 属性
+
+| 属性名                | 类型                      | 默认值 | 说明                           |
+| :-------------------- | :------------------------ | :----- | :----------------------------- |
+| customClass           | `string`                  | --     | 组件自定义样式                 |
+| maxStatus             | `boolean`                 | false  | 组件最大化状态                 |
+| enableCollapse        | `boolean`                 | true   | 是否允许收折                   |
+| mainTitle             | `string`                  | --     | 面板标题                       |
+| subTitle              | `string`                  | --     | 面板副标题                     |
+| showHeader            | `boolean`                 | true   | 是否显示标题面板               |
+| enableMaximize        | `boolean`                 | false  | 是否显示最大化按钮             |
+| fill                  | `boolean`                 | false  | 是否允许填充显示               |
+| expandStatus          | `boolean`                 | true   | 组件展开状态                   |
+| context               | `object`                  | --     | 组件上下文                     |
+| index                 | `number`                  | --     | 索引号                         |
+| toolbarPosition       | `string`                  | --     | 工具栏位置                     |
+| toolbarButtons        | `object[]`                | []     | 工具栏按钮                     |
+| toolbar               | `object as ToolbarConfig` | {}     | 工具栏配置对象                 |
+| showToolbarMoreButton | `boolean`                 | true   | 是否显示工具栏的更多按钮       |
+| clickThrottleTime     | `number`                  | 350    | 鼠标重复点击按钮触发事件的阈值 |
+| headerClass           | `string`                  | ''     | 标题面板自定义样式             |
+
+## 插槽
+
+::: tip
+暂无内容
+:::