sohelp-eleplus 1.1.26 → 1.1.28

package/sohelp-org-select/index.vue

@@ -1,30 +1,47 @@
 <template>
-  <sohelp-dyn-select
-    v-bind="$attrs"
-    :url="url"
-    :labelField="labelField"
-    :valueField="valueField"
-  ></sohelp-dyn-select>
+  <div class="sohelp-org-select">
+    <sohelp-dyn-select
+      v-bind="$attrs"
+      :url="url"
+      :labelField="labelField"
+      :valueField="valueField"
+      :datasource="datasource"
+      v-model="modelValue"
+    ></sohelp-dyn-select>
+  </div>
 </template>
+<script setup>
+  import SohelpDynSelect from '../sohelp-dyn-select/index.vue';
+
+  const modelValue = defineModel('modelValue', { type: [String, Number, Array], default: '' });
+
+  const props = defineProps({
+    datasource: {
+      type: [Array, Function, Promise],
+      required: false
+    },
+    url: {
+      type: String,
+      default: '/engine/web/org/list'
+    },
+    labelField: {
+      type: String,
+      default: 'org_name'
+    },
+    valueField: {
+      type: String,
+      default: 'id'
+    }
+  });
+  defineExpose({});
+</script>
 <script>
   export default {
-    name: 'SohelpOrgSelect',
-    components: {},
-    props: {
-      url: {
-        type: String,
-        default: '/engine/web/org/list'
-      },
-      labelField: {
-        type: String,
-        default: 'org_name'
-      },
-      valueField: {
-        type: String,
-        default: 'id'
-      }
-    },
-    setup(props, { emit, attrs }) {}
+    name: 'SohelpOrgSelect'
   };
 </script>
-<style></style>
+<style>
+  .sohelp-org-select{
+    width: 100%;
+  }
+</style>

package/sohelp-org-tree/README.md

@@ -1,18 +1,30 @@
 # SohelpOrgTree 组织机构树
 
-基于 `sohelp-dyn-tree` 封装，预设了组织机构列表的接口地址，用于展示组织机构树形结构。
+基于 `sohelp-dyn-tree` 封装，预设组织机构列表接口地址，用于展示组织机构树形结构。
 
 ## 基础用法
 
-```html
-<sohelp-org-tree @node-click="handleNodeClick" />
+```vue
+<template>
+  <sohelp-org-tree @node-click="handleNodeClick" />
+</template>
+
+<script setup>
+const handleNodeClick = (data, node, el) => {
+  console.log('选中组织:', data);
+};
+</script>
 ```
 
 ## 属性 (Props)
 
-| 属性名 | 类型 | 默认值 | 说明 |
-| url | String | '/engine/web/org/list' | 数据接口地址 |
+| 属性名 | 类型 | 默认值 | 必填 | 说明 |
+| :--- | :--- | :--- | :--- | :--- |
+| url | String | `/engine/web/org/list` | 否 | 组织机构数据接口地址 |
+| ...attrs | - | - | 否 | 支持所有 `sohelp-dyn-tree` 属性透传 |
 
-## 其他
+## 事件 (Events)
 
-支持 `sohelp-dyn-tree` 的所有属性和事件。
+| 事件名 | 回调参数 | 说明 |
+| :--- | :--- | :--- |
+| node-click | `(data, node, el)` | 节点被点击时触发（透传自 `sohelp-dyn-tree`） |

package/sohelp-org-tree/index.vue

@@ -8,8 +8,7 @@
     props: {
       url: {
         type: String,
-        default: '/engine/web/org/list',
-        required: true
+        default: '/engine/web/org/list'
       }
     }
   };

package/sohelp-org-tree-select/README.md

@@ -1,22 +1,33 @@
 # SohelpOrgTreeSelect 组织机构树选择器
 
-用于选择组织机构的树形下拉组件。自动从接口加载平铺数据并转换为树形结构展示。
+基于 `sohelp-tree-select` 封装的组织机构下拉树选择组件。自动从接口加载扁平数据并转换为树形结构，支持只读模式和自定义数据源。
 
 ## 基础用法
 
-```html
-<sohelp-org-tree-select v-model="orgId" />
+```vue
+<template>
+  <sohelp-org-tree-select v-model="orgId" />
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const orgId = ref('');
+</script>
 ```
 
 ## 属性 (Props)
 
-| 属性名 | 类型 | 默认值 | 说明 |
-| modelValue | String/Number/Array | - | 绑定的值 |
-| data | Object | {} | 绑定的完整数据对象 |
-| url | String | '/engine/web/org/list' | 数据接口地址 |
-| datasource | Array/Function/Promise | - | 数据源，优先级高于 url |
-| readonly | Boolean | false | 是否只读 |
+| 属性名 | 类型 | 默认值 | 必填 | 说明 |
+| :--- | :--- | :--- | :--- | :--- |
+| modelValue (v-model) | String / Number / Array | `""` | 否 | 绑定值 |
+| data (v-model:data) | Object | `{}` | 否 | 当前选中项的完整数据对象 |
+| url | String | `/engine/web/org/list` | 否 | 数据接口地址 |
+| datasource | Array / Function / Object | - | 否 | 自定义数据源，优先级高于 url；支持数组、返回数组的函数或 Promise |
+| readonly | Boolean | `false` | 否 | 是否只读模式（只读时显示 `org_name` 文本） |
+| ...attrs | - | - | 否 | 支持所有 `sohelp-tree-select` 属性透传 |
 
-## 内部逻辑
+## 公开方法 (Expose)
 
-组件挂载时会自动请求数据，并根据 `id` 和 `parent_id` 字段将扁平数据转换为树形结构 (`treeProps.data`) 传递给内部的 `sohelp-tree-select`。
+- `treeProps` - 树形配置对象（含 data 数组）
+- `modelValue` - 当前选中值
+- `dataMap` - 以 id 为 key 的扁平数据映射

package/sohelp-org-tree-select/index.vue

@@ -21,8 +21,7 @@ const props = defineProps({
     default: "/engine/web/org/list"
   },
   datasource: {
-    type: [Array, Function, Promise],
-    required: true
+    type: [Array, Function, Object]
   },
   readonly: {
     type: Boolean,

package/sohelp-org-user-tree/README.md

@@ -1,18 +1,30 @@
 # SohelpOrgUserTree 组织人员树
 
-用于展示组织机构和人员混合树形结构的组件，基于 `sohelp-dyn-tree` 封装。
+基于 `sohelp-dyn-tree` 封装，预设组织人员列表接口地址，用于展示组织机构及人员的树形结构。
 
 ## 基础用法
 
-```html
-<sohelp-org-user-tree @node-click="handleNodeClick" />
+```vue
+<template>
+  <sohelp-org-user-tree @node-click="handleNodeClick" />
+</template>
+
+<script setup>
+const handleNodeClick = (data, node, el) => {
+  console.log('选中节点:', data);
+};
+</script>
 ```
 
 ## 属性 (Props)
 
-| 属性名 | 类型 | 默认值 | 说明 |
-| url | String | '/engine/web/org/list' | 数据接口地址 |
+| 属性名 | 类型 | 默认值 | 必填 | 说明 |
+| :--- | :--- | :--- | :--- | :--- |
+| url | String | `/engine/web/org/list` | 否 | 数据接口地址 |
+| ...attrs | - | - | 否 | 支持所有 `sohelp-dyn-tree` 属性透传 |
 
-## 其他
+## 事件 (Events)
 
-支持 `sohelp-dyn-tree` 的所有属性和事件。
+| 事件名 | 回调参数 | 说明 |
+| :--- | :--- | :--- |
+| node-click | `(data, node, el)` | 节点被点击时触发（透传自 `sohelp-dyn-tree`） |

package/sohelp-org-user-tree/index.vue

@@ -10,8 +10,7 @@ export default {
   props: {
     url: {
       type: String,
-      default: "/engine/web/org/list",
-      required: true
+      default: "/engine/web/org/list"
     }
   },
   setup(props, {emit}) {

package/sohelp-org-user-tree-select/README.md

@@ -1,7 +1,12 @@
 # SohelpOrgUserTreeSelect 组织人员树选择器
 
-*当前版本仅为占位组件。*
+组织人员树选择器组件，用于在下拉面板中选择组织机构下的用户。当前版本为占位组件，功能待实现。
 
-## 描述
+## 基础用法
 
-用于选择组织机构下的用户，结合了树形展示和选择功能。继承自 `SohelpOrgUserTree` 和 `SohelpSelect` 的逻辑。
+```vue
+<template>
+  <!-- 当前版本为占位组件，功能待实现 -->
+  <sohelp-org-user-tree-select />
+</template>
+```

package/sohelp-org-user-tree-select/index.vue

@@ -1,11 +1,12 @@
 <template>
-<div>SohelpOrgUserTreeModal是继承SohelpOrgUserTree和SohelpSelect</div>
+  <div class="sohelp-org-user-tree-select">
+    <!-- TODO: 待实现 - 组织用户树选择器（继承SohelpOrgUserTree和SohelpSelect） -->
+    <el-empty description="组织用户树选择器 - 待实现" />
+  </div>
 </template>
+<script setup>
+  // TODO: 待实现
+</script>
 <script>
-export default {
-  name: "SohelpOrgUserTreeModal"
-}
+  export default { name: 'SohelpOrgUserTreeSelect' };
 </script>
-<style scoped>
-
-</style>

package/sohelp-page/README.md

@@ -1,21 +1,30 @@
-# SohelpPage 页面布局组件
+# SohelpPage 页面容器
 
-基于 `ele-page` 的封装，用于构建标准的页面结构，包含头部、内容区域等。
+基于 `ele-page` 封装的页面容器组件，默认启用弹性表格布局并隐藏页脚。
 
 ## 基础用法
 
-```html
-<sohelp-page title="页面标题">
-  页面内容
-</sohelp-page>
+```vue
+<template>
+  <sohelp-page>
+    <div>页面内容</div>
+  </sohelp-page>
+</template>
 ```
 
 ## 属性 (Props)
 
-| 属性名 | 类型 | 默认值 | 说明 |
-| flex-table | Boolean | true | 是否开启 Flex 布局适配表格高度 |
-| hide-footer | Boolean | true | 是否隐藏底部区域 |
+组件透传所有属性到内部 `ele-page`，并设置以下默认值：
 
-## 其他
+| 属性名 | 类型 | 默认值 | 必填 | 说明 |
+| --- | --- | --- | --- | --- |
+| flex-table | Boolean | `true` | 否 | 启用弹性表格布局 |
+| hide-footer | Boolean | `true` | 否 | 隐藏页脚区域 |
 
-支持 `ele-page` 的所有属性和事件。
+> 支持 `ele-page` 的所有属性，通过 `$attrs` 透传。
+
+## 插槽 (Slots)
+
+| 插槽名 | 说明 |
+| --- | --- |
+| default | 页面主体内容 |

package/sohelp-page/index.vue

@@ -3,7 +3,7 @@
 </script>
 
 <template>
-  <ele-page :flex-table="true" :hide-footer="true" v-bind="$attrs" v-on="$attrs">
+  <ele-page :flex-table="true" :hide-footer="true" v-bind="$attrs">
     <slot></slot>
   </ele-page>
 </template>

package/sohelp-pagination/README.md

@@ -1,13 +1,21 @@
-# SohelpPagination 分页组件
+# SohelpPagination 分页
 
-基于 `ElePagination` 的封装组件。
+继承 `ElePagination` 的分页组件。
 
 ## 基础用法
 
-```html
-<sohelp-pagination :total="100" v-model:currentPage="page" v-model:pageSize="limit" />
+```vue
+<template>
+  <sohelp-pagination :total="100" v-model:currentPage="page" v-model:pageSize="limit" />
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const page = ref(1);
+const limit = ref(10);
+</script>
 ```
 
-## 描述
+## 属性 (Props)
 
-继承自 `ElePagination`，提供标准的分页功能。
+继承 `ElePagination` 的所有属性，请参考 ElePagination 文档。

package/sohelp-pagination/index.vue

@@ -3,7 +3,7 @@
 </template>
 <script>
 export default {
-  name: "SohelpPagination是继承ElePagination"
+  name: "SohelpPagination"
 }
 </script>
 <style scoped>

package/sohelp-power/README.md

@@ -1,27 +1,42 @@
-# SohelpPower 数据权限选择组件
+# SohelpPower 数据查看范围选择器
 
-用于选择数据查看范围（如“全部数据”、“本部门数据”等），支持自定义选择特定用户。
+基于 `sohelp-select` 封装的数据权限范围选择组件，支持预设的多种查看范围，包括自定义用户选择。
 
 ## 基础用法
 
-```html
-<sohelp-power @change="handlePowerChange" />
+```vue
+<template>
+  <sohelp-power @change="onPowerChange" />
+</template>
+
+<script setup>
+const onPowerChange = (val) => {
+  console.log('查看范围:', val);
+};
+</script>
 ```
 
+## 属性 (Props)
+
+组件无自定义 props，内部默认选中"全部数据"（值为 `"0"`）。
+
+预设查看范围选项：
+
+| 值 | 说明 |
+| --- | --- |
+| 0 | 全部数据 |
+| 1 | 我负责的 |
+| 2 | 下属负责的 |
+| 3 | 仅限本部门 |
+| 4 | 本公司 |
+| 5 | 下属部门 |
+| 6 | 本人及下属 |
+| 7 | 本部门及下属部门 |
+| 8 | 仅限本岗位 |
+| 9 | 自定义（弹出用户选择） |
+
 ## 事件 (Events)
 
-| 事件名 | 说明 | 回调参数 |
-| change | 权限范围改变时触发 | (value: String/Object) |
-
-## 数据选项
-
-- 0: 全部数据
-- 1: 我负责的
-- 2: 下属负责的
-- 3: 仅限本部门
-- 4: 本公司
-- 5: 下属部门
-- 6: 本人及下属
-- 7: 本部门及下属部门
-- 8: 仅限本岗位
-- 9: 自定义 (弹出用户选择框)
+| 事件名 | 回调参数 | 说明 |
+| --- | --- | --- |
+| change | `value: string \| { power: 9, powerUsers: Array }` | 选择查看范围后触发；选择"自定义"时返回对象包含用户列表 |

package/sohelp-power/index.vue

@@ -64,8 +64,8 @@ const PowerList = [{
   value: "9"
 }];
 
-const emits = defineEmits("change");
-const value = ref(0);
+const emits = defineEmits(["change"]);
+const value = ref("0");
 //显示用户选择弹窗
 const powerUserVisible = ref(false);
 //显示用户

package/sohelp-pro-form/README.md

@@ -1,35 +1,78 @@
-# SohelpProForm 高级表单组件
+# SohelpProForm 高级表单
 
-配置化表单组件，支持栅格布局、表单验证、动态表单项等功能。
+基于 Element Plus `ElForm` 封装的配置化高级表单组件，支持栅格布局、表单验证、动态表单项和底栏操作按钮。
 
 ## 基础用法
 
-```html
-<sohelp-pro-form 
-  :model="formData" 
-  :items="formItems" 
-  @submit="handleSubmit" 
-/>
+```vue
+<template>
+  <sohelp-pro-form
+    :model="formData"
+    :items="formItems"
+    :footer="true"
+    @submit="handleSubmit"
+    @reset="handleReset"
+  />
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const formData = ref({ name: '', age: '' });
+const formItems = [
+  { prop: 'name', type: 'SohelpInput', label: '姓名', required: true },
+  { prop: 'age', type: 'SohelpNumberInput', label: '年龄' }
+];
+const handleSubmit = (model) => { console.log(model); };
+const handleReset = () => {};
+</script>
 ```
 
 ## 属性 (Props)
 
-| 属性名 | 类型 | 默认值 | 说明 |
-| model | Object | - | 必填，表单数据对象 |
-| items | Array | - | 必填，表单项配置数组 |
-| rules | Object | - | 验证规则 |
-| labelWidth | String/Number | '80px' | 标签宽度 |
-| grid | Boolean/Object | - | 是否开启栅格布局 |
-| footer | Boolean | - | 是否显示底部按钮 |
-| readonly | Boolean | false | 是否只读 |
+| 属性名 | 类型 | 默认值 | 必填 | 说明 |
+| --- | --- | --- | --- | --- |
+| model | Object | - | 是 | 表单数据对象 |
+| items | Array | - | 是 | 表单项配置数组 |
+| data | Object | - | 否 | 表单关联数据对象 |
+| rules | Object | - | 否 | 表单验证规则 |
+| labelWidth | String / Number | '80px' | 否 | 标签宽度 |
+| statusIcon | Boolean | - | 否 | 是否显示校验结果图标 |
+| size | String | - | 否 | 表单尺寸 |
+| disabled | Boolean | - | 否 | 是否禁用表单 |
+| readonly | Boolean | false | 否 | 是否只读 |
+| grid | Boolean / Object | - | 否 | 栅格布局配置，true 默认 span=12，或传入 ElCol 属性对象 |
+| rowProps | Object | - | 否 | ElRow 属性，仅在 grid 模式下生效 |
+| footer | Boolean | - | 否 | 是否显示底栏提交/重置按钮 |
+| footerProps | Object | - | 否 | 底栏 ElFormItem 属性 |
+| footerSlots | Object | - | 否 | 底栏 ElFormItem 插槽 |
+| footerColProps | Object | { span: 24 } | 否 | 底栏 ElCol 属性 |
+| submitText | String | '提交' | 否 | 提交按钮文本 |
+| resetText | String | '重置' | 否 | 重置按钮文本 |
+| saveParams | Object | {} | 否 | 保存时附加参数 |
 
 ## 事件 (Events)
 
-| 事件名 | 说明 | 回调参数 |
-| submit | 表单提交且验证通过时触发 | (model) |
-| reset | 表单重置时触发 | - |
-| updateValue | 表单项值更新时触发 | (prop, value) |
+| 事件名 | 回调参数 | 说明 |
+| --- | --- | --- |
+| updateValue | (prop: string, value: any) | 表单项值更新时触发 |
+| submit | (model: Object) | 表单提交且验证通过时触发 |
+| reset | - | 表单重置时触发 |
+
+## 插槽 (Slots)
+
+| 插槽名 | 说明 |
+| --- | --- |
+| topExtra | 表单顶部额外内容 |
+| bottomExtra | 表单底部额外内容 |
+| footer | 自定义底栏内容 |
+| [动态插槽] | 透传至 ProFormItem 的自定义字段插槽 |
 
 ## 公开方法 (Expose)
 
-- `getRef(prop)`: 获取指定字段的表单项组件实例。
+- `formRef` - 内部 ElForm 实例引用
+- `validate()` - 验证整个表单，返回 Promise
+- `validateField(props, callback)` - 验证指定字段
+- `resetFields(props?)` - 重置表单字段
+- `scrollToField(prop)` - 滚动到指定字段
+- `clearValidate(props?)` - 清除验证信息
+- `getRef(propName)` - 获取指定字段的 ProFormItem 组件实例

package/sohelp-pro-layout/README.md

@@ -1,7 +1,13 @@
-# SohelpProLayout 高级布局组件
+# SohelpProLayout 界面布局
 
-基于 `EleProLayout` 的封装。
+基于 `EleProLayout` 的界面布局组件（待实现）。
 
-## 描述
+## 基础用法
 
-继承自 `EleProLayout`，提供后台管理系统的整体布局框架。
+```vue
+<template>
+  <sohelp-pro-layout />
+</template>
+```
+
+> 该组件当前为占位状态，功能待实现。

package/sohelp-pro-layout/index.vue

@@ -1,11 +1,12 @@
 <template>
-  <div>界面布局SohelpProLayout是继承EleProLayout</div>
+  <div class="sohelp-pro-layout">
+    <!-- TODO: 待实现 - 界面布局（继承EleProLayout） -->
+    <el-empty description="界面布局 - 待实现" />
+  </div>
 </template>
+<script setup>
+  // TODO: 待实现
+</script>
 <script>
-export default {
-  name: "SohelpProLayout"
-}
+  export default { name: 'SohelpProLayout' };
 </script>
-<style scoped>
-
-</style>

package/sohelp-pro-table/README.md

@@ -1,13 +1,37 @@
-# SohelpProTable 高级表格组件
+# SohelpProTable 专业表格
 
-基于 `ele-pro-table` 的封装，透传了所有属性和插槽。
+基于 ele-pro-table 的透传封装组件。将所有属性（`$attrs`）和插槽（`$slots`）直接透传到 ele-pro-table，提供统一的组件命名入口。
 
 ## 基础用法
 
-```html
-<sohelp-pro-table :request="requestApi" :columns="columns" />
+```vue
+<template>
+  <sohelp-pro-table
+    :columns="columns"
+    :datasource="datasource"
+    row-key="id"
+  >
+    <template #action="{ row }">
+      <el-button size="small" @click="handleEdit(row)">编辑</el-button>
+    </template>
+  </sohelp-pro-table>
+</template>
+
+<script setup>
+const columns = [
+  { prop: 'name', label: '名称' },
+  { prop: 'status', label: '状态' }
+];
+const datasource = async ({ page, limit, where }) => {
+  // 返回 { total, results } 格式数据
+};
+</script>
 ```
 
-## 描述
+## 属性 (Props)
+
+所有属性透传到 ele-pro-table，请参考 ele-pro-table 文档。
+
+## 插槽 (Slots)
 
-用于快速构建带有搜索、分页、工具栏的复杂表格页面。
+所有插槽透传到 ele-pro-table，请参考 ele-pro-table 文档。