sohelp-eleplus 1.1.21 → 1.1.22

package/sohelp-pro-form/util.js

@@ -1,16 +1,7 @@
 /**
  * 表单数据类型为字符串的组件类型
  */
-export const stringTypes = [
-  'input',
-  'textarea',
-  'date',
-  'datetime',
-  'time',
-  'timeSelect',
-  'autocomplete',
-  'editor'
-];
+export const stringTypes = ['input', 'textarea', 'date', 'datetime', 'time', 'timeSelect', 'autocomplete', 'editor'];
 
 /**
  * 表单数据类型为数字的组件类型
@@ -25,7 +16,8 @@ export const numberTypes = [
   'inputNumber',
   'rate',
   'slider',
-  'tableSelect'
+  'tableSelect',
+  'SohelpDict'
 ];
 
 /**
@@ -53,7 +45,7 @@ export const arrayTypes = [
 /**
  * 表单验证规则使用blur触发的组件类型
  */
-export const blurTypes = ['input', 'textarea'];
+export const blurTypes = ['input', 'textarea', 'SohelpDict'];
 
 /**
  * 选择类型的组件类型
@@ -89,7 +81,8 @@ export const selectTypes = [
   'dictSelect',
   'dictCheckbox',
   'dictMultipleSelect',
-  'regions'
+  'regions',
+  'SohelpDict'
 ];
 
 /**

package/sohelp-pro-layout/README.md

@@ -0,0 +1,7 @@
+# SohelpProLayout 高级布局组件
+
+基于 `EleProLayout` 的封装。
+
+## 描述
+
+继承自 `EleProLayout`，提供后台管理系统的整体布局框架。

package/sohelp-pro-table/README.md

@@ -0,0 +1,13 @@
+# SohelpProTable 高级表格组件
+
+基于 `ele-pro-table` 的封装，透传了所有属性和插槽。
+
+## 基础用法
+
+```html
+<sohelp-pro-table :request="requestApi" :columns="columns" />
+```
+
+## 描述
+
+用于快速构建带有搜索、分页、工具栏的复杂表格页面。

package/sohelp-process/README.md

@@ -0,0 +1,24 @@
+# SohelpProcess 进度条组件
+
+可拖拽的进度条组件，支持只读模式和动画效果。
+
+## 基础用法
+
+```html
+<sohelp-process v-model="percent" :color="'#35b558'" />
+```
+
+## 属性 (Props)
+
+| 属性名 | 类型 | 默认值 | 说明 |
+| modelValue | Number | 0 | 进度值 (0-100) |
+| readonly | Boolean | false | 是否只读（不可拖拽） |
+| height | Number | 8 | 进度条高度 |
+| color | String | '#35b558' | 进度条颜色 |
+| animate | Boolean | false | 是否启用动画 |
+| showPercent | Boolean | false | 是否显示百分比文字 |
+
+## 事件 (Events)
+
+| 事件名 | 说明 | 回调参数 |
+| update:modelValue | 拖拽改变进度时触发 | (value: Number) |

package/sohelp-rate/README.md

@@ -0,0 +1,23 @@
+# SohelpRate 评分组件
+
+支持两种模式：星星评分和下拉选择评分。
+
+## 基础用法
+
+```html
+<!-- 星星模式 -->
+<sohelp-rate v-model="score" />
+
+<!-- 下拉模式 -->
+<sohelp-rate v-model="score" type="select" />
+```
+
+## 属性 (Props)
+
+| 属性名 | 类型 | 默认值 | 说明 |
+| modelValue | Number/String | - | 评分值 |
+| type | String | 'rate' | 显示模式：'rate' (星星) 或 'select' (下拉) |
+
+## 其他
+
+支持 `el-rate` 或 `sohelp-select` 的相关属性。

package/sohelp-relation/README.md

@@ -0,0 +1,7 @@
+# SohelpRelation 外键关联组件
+
+*当前版本仅为占位组件。*
+
+## 描述
+
+预留用于处理外键关联数据的输入组件。

package/sohelp-rich-text/README.md

@@ -0,0 +1,23 @@
+# SohelpRichText 富文本编辑器
+
+基于 TinyMCE 封装的富文本编辑器，支持暗黑模式自动切换。
+
+## 基础用法
+
+```html
+<sohelp-rich-text v-model="content" />
+```
+
+## 属性 (Props)
+
+| 属性名 | 类型 | 默认值 | 说明 |
+| modelValue | String | - | 绑定的 HTML 内容 |
+| disabled | Boolean | false | 是否禁用（只读） |
+| inline | Boolean | false | 是否开启内联模式 |
+| init | Object | - | TinyMCE 初始化配置对象 |
+| autoTheme | Boolean | true | 是否跟随系统主题自动切换 |
+
+## 公开方法 (Expose)
+
+- `editorIns`: 获取 TinyMCE 编辑器实例。
+- `alert(option)`: 弹出提示框。

package/sohelp-richtext/README.md

@@ -0,0 +1,3 @@
+# SohelpRichtext 富文本组件 (Legacy)
+
+*当前版本仅为占位组件，请使用 `sohelp-rich-text`。*

package/sohelp-role-select/README.md

@@ -0,0 +1,20 @@
+# SohelpRoleSelect 角色选择器
+
+基于 `sohelp-dyn-select` 封装，预设了角色列表的接口地址。
+
+## 基础用法
+
+```html
+<sohelp-role-select v-model="roleId" />
+```
+
+## 属性 (Props)
+
+| 属性名 | 类型 | 默认值 | 说明 |
+| url | String | '/engine/web/role/list' | 数据接口地址 |
+| labelField | String | 'role_name' | 显示文本字段 |
+| valueField | String | 'id' | 值字段 |
+
+## 其他
+
+支持 `sohelp-dyn-select` 的所有属性。

package/sohelp-search/README.md

@@ -0,0 +1,7 @@
+# SohelpSearch 搜索组件
+
+集成了筛选表单和表格的搜索组件示例。
+
+## 描述
+
+包含一个可折叠的筛选表单和一个 `sohelp-vxe-grid` 表格。

package/sohelp-search-pro-form/README.md

@@ -0,0 +1,3 @@
+# SohelpSearchProForm 高级搜索表单
+
+*当前版本仅为占位组件。*

package/sohelp-select/README.md

@@ -0,0 +1,51 @@
+# SohelpSelect
+
+A flexible select component that supports various data sources (Array, Function, Promise), i18n labeling, and multiple selection.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `datasource` | `Array`, `Function`, `Promise` | Required | The data source for options. Can be a static array, a function returning data, or a promise. |
+| `labelField` | `String` | `'label'` | The field name to use for the option label. |
+| `valueField` | `String` | `'value'` | The field name to use for the option value. |
+| `multiple` | `Boolean` | `false` | Whether to allow selecting multiple options. |
+| `modelValue` | `String`, `Number`, `Boolean`, `Array` | Required | The value of the select (v-model). |
+| `...` | - | - | Supports all `el-select` props. |
+
+## Events
+
+| Name | Parameters | Description |
+| :--- | :--- | :--- |
+| `update:modelValue` | `(value: any)` | Triggered when the selected value changes. |
+| `change` | `(value: any)` | Triggered when the selection changes. |
+| `optionClick` | `(value: any)` | Triggered when an option is clicked. |
+
+## Slots
+
+| Name | Description |
+| :--- | :--- |
+| `footer` | Custom content for the footer of the dropdown menu. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-select
+    v-model="value"
+    :datasource="options"
+    label-field="name"
+    value-field="id"
+  />
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const value = ref('');
+const options = [
+  { id: 1, name: 'Option 1' },
+  { id: 2, name: 'Option 2' }
+];
+</script>
+```

package/sohelp-split-panel/README.md

@@ -0,0 +1,31 @@
+# SohelpSplitPanel
+
+A wrapper component for `ele-split-panel` that simplifies usage and passes through slots and attributes.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `...` | - | - | Supports all `ele-split-panel` props. |
+
+## Slots
+
+| Name | Description |
+| :--- | :--- |
+| `default` | Content to be placed inside the split panel. |
+| `...` | - | Passes through all slots supported by `ele-split-panel`. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-split-panel>
+    <template #left>
+      <div>Left Content</div>
+    </template>
+    <template #right>
+      <div>Right Content</div>
+    </template>
+  </sohelp-split-panel>
+</template>
+```

package/sohelp-switch/README.md

@@ -0,0 +1,33 @@
+# SohelpSwitch
+
+A switch component that supports readonly mode and customizable active/inactive values. In readonly mode, it displays a text label instead of the switch control.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `readonly` | `Boolean` | `false` | If `true`, displays the value as text instead of a switch. |
+| `modelValue` | `String`, `Number`, `Boolean` | - | The value of the switch (v-model). |
+| `activeValue` | `String`, `Number`, `Boolean` | `true` | Value when the switch is on. |
+| `inactiveValue` | `String`, `Number`, `Boolean` | `false` | Value when the switch is off. |
+| `...` | - | - | Supports all `el-switch` props. |
+
+## Events
+
+| Name | Parameters | Description |
+| :--- | :--- | :--- |
+| `update:modelValue` | `(value: any)` | Triggered when the switch value changes. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-switch v-model="value" />
+  <sohelp-switch v-model="value" readonly />
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const value = ref(true);
+</script>
+```

package/sohelp-table/README.md

@@ -0,0 +1,36 @@
+# SohelpTable
+
+A powerful table component wrapper around `ele-pro-table` that integrates with `moduleCache` for configuration loading and supports remote data fetching.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `refid` | `String` | Required | The configuration ID for the grid layout. |
+| `url` | `String` | `""` | The data source URL for fetching table data. |
+| `where` | `Object` | `{}` | Additional query parameters for the data request. |
+| `...` | - | - | Supports all `ele-pro-table` props. |
+
+## Slots
+
+| Name | Description |
+| :--- | :--- |
+| `toolbar` | Custom content for the table toolbar. Scope: `{ row }`. |
+| `action` | Custom content for the action column. Scope: `{ row }`. |
+| `...` | - | Passes through all slots supported by `ele-pro-table`. |
+
+## Methods
+
+| Name | Description |
+| :--- | :--- |
+| `reload(param)` | Reloads the table data. |
+| `getData()` | Returns the current table data. |
+| `getTableRef()` | Returns the underlying table reference. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-table refid="user_grid_config" url="/api/users" />
+</template>
+```

package/sohelp-tenant-select/README.md

@@ -0,0 +1,31 @@
+# SohelpTenantSelect
+
+A component for selecting tenants using a grid view (`sohelp-vxe-grid-select`). Fetches tenant data from the server.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `url` | `String` | `'/engine/web/tenant/page'` | The API URL to fetch tenant data. |
+| `title` | `String` | `'选择租户'` | The title of the selection dialog. |
+| `...` | - | - | Supports all `sohelp-vxe-grid-select` props. |
+
+## Events
+
+| Name | Parameters | Description |
+| :--- | :--- | :--- |
+| `confirm` | `(rows: Array)` | Triggered when the user confirms the selection. Returns the selected rows. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-tenant-select @confirm="handleConfirm" />
+</template>
+
+<script setup>
+const handleConfirm = (rows) => {
+  console.log('Selected tenants:', rows);
+};
+</script>
+```

package/sohelp-text/README.md

@@ -0,0 +1,17 @@
+# SohelpText
+
+A simple text display component that wraps `ele-text` and enables word limit display.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `...` | - | - | Supports all `ele-text` props. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-text>Some text content</sohelp-text>
+</template>
+```

package/sohelp-textarea-input/README.md

@@ -0,0 +1,24 @@
+# SohelpTextareaInput
+
+A textarea input component based on `el-input` with auto-focus capability and character limit.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `autoFocus` | `Boolean` | `false` | Whether to automatically focus the input on mount. |
+| `maxlength` | `Number` | `250` | The maximum number of characters allowed. |
+| `...` | - | - | Supports all `el-input` props (type is fixed to 'textarea'). |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-textarea-input v-model="text" :autoFocus="true" />
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const text = ref('');
+</script>
+```

package/sohelp-textarea-input/index.vue

@@ -1,25 +1,31 @@
 <template>
-  <el-input v-bind="$attrs" :maxlength="maxlength" :rows="$attrs.rows" ref="inputRef" type="textarea" show-word-limit clearable ></el-input>
+  <el-input
+    v-bind="$attrs"
+    v-model="modelValue"
+    clearable
+    ref="inputRef"
+    type="textarea"
+    show-word-limit
+    :disabled="$attrs?.disabled || $attrs?.readonly"
+  >
+    <template v-for="(_, slot) in $slots" #[slot]="slotProps">
+      <slot :name="slot" v-bind="slotProps" />
+    </template>
+  </el-input>
 </template>
 <script setup>
   import { nextTick, onMounted, ref } from 'vue';
 
+  const emit = defineEmits(['update:modelValue']);
+  const modelValue = defineModel('modelValue');
   const props = defineProps({
     autoFocus: {
       type: Boolean,
       default: false
-    },
-    maxlength: {
-      type: Number,
-      default: 250
-    },
+    }
   });
 
-  const modelValue = ref('');
-
-
   const inputRef = ref(null);
-
   onMounted(() => {
     nextTick(() => {
       if (props.autoFocus) {
@@ -33,4 +39,3 @@
     name: 'SohelpTextareaInput'
   };
 </script>
-<style></style>

package/sohelp-time/README.md

@@ -0,0 +1,22 @@
+# SohelpTime
+
+A time picker component wrapping `el-time-picker` with a default value format of `HH:mm:ss`.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `...` | - | - | Supports all `el-time-picker` props. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-time v-model="time" />
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const time = ref('');
+</script>
+```

package/sohelp-tree/README.md

@@ -0,0 +1,32 @@
+# SohelpTree
+
+A wrapper component for `el-tree` that includes a loading state by default.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `data` | `Object` | Required | The data source for the tree. |
+| `...` | - | - | Supports all `el-tree` props. |
+
+## Events
+
+| Name | Parameters | Description |
+| :--- | :--- | :--- |
+| `node-click` | `(data, node, el)` | Triggered when a tree node is clicked. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-tree :data="treeData" @node-click="handleNodeClick" />
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const treeData = ref([{ label: 'Node 1', children: [] }]);
+const handleNodeClick = (data) => {
+  console.log(data);
+};
+</script>
+```

package/sohelp-tree-select/README.md

@@ -0,0 +1,18 @@
+# SohelpTreeSelect
+
+A wrapper component for `ele-tree-select` that integrates with global configuration for size.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `modelValue` | `String`, `Number`, `Array` | `""` | The selected value (v-model). |
+| `...` | - | - | Supports all `ele-tree-select` props. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-tree-select v-model="value" :data="treeData" />
+</template>
+```

package/sohelp-user-select/README.md

@@ -0,0 +1,22 @@
+# SohelpUserSelect
+
+A specialized selection component for selecting users, built on top of `sohelp-dyn-select`.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `datasource` | `Array`, `Function`, `Promise` | Required | The data source for user options. |
+| `url` | `String` | `'/engine/web/user/list'` | The default URL for fetching user data. |
+| `labelField` | `String` | `'user_name'` | The field name for the user label. |
+| `valueField` | `String` | `'id'` | The field name for the user value. |
+| `modelValue` | `String`, `Number`, `Array` | `""` | The selected value (v-model). |
+| `...` | - | - | Supports all `sohelp-dyn-select` props. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-user-select v-model="userId" :datasource="users" />
+</template>
+```

package/sohelp-user-tag/README.md

@@ -0,0 +1,15 @@
+# SohelpUserTag
+
+A component to display user information (Avatar + Nickname). Falls back to default company LOGO if no info is provided.
+
+## Description
+
+Displays user avatar and nickname. Currently a placeholder/simple implementation.
+
+## Usage
+
+```vue
+<template>
+  <sohelp-user-tag />
+</template>
+```

package/sohelp-user-tree/README.md

@@ -0,0 +1,15 @@
+# SohelpUserTree
+
+A specialized tree component for displaying users, inheriting from `SohelpTree`.
+
+## Description
+
+Intended for user selection in a tree structure. Currently a wrapper/placeholder inheriting from `SohelpTree`.
+
+## Usage
+
+```vue
+<template>
+  <sohelp-user-tree :data="userData" />
+</template>
+```

package/sohelp-vform-drawer/README.md

@@ -0,0 +1,25 @@
+# SohelpVformDrawer
+
+A drawer component that renders a VForm based on configuration, wrapping `sohelp-vform-eleplus`.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `refid` | `String` | Required | The configuration ID for the form. |
+| `...` | - | - | Supports all `sohelp-drawer` props. |
+
+## Methods
+
+| Name | Description |
+| :--- | :--- |
+| `getFormJson()` | Returns the form JSON configuration. |
+| `getFormData()` | Returns the current form data. |
+
+## Usage
+
+```vue
+<template>
+  <sohelp-vform-drawer refid="form_config_id" v-model="visible" />
+</template>
+```

package/sohelp-vform-eleplus/README.md

@@ -0,0 +1,39 @@
+# SohelpVformEleplus
+
+A core component for rendering dynamic forms using VForm and `moduleCache`. Supports toolbars, dynamic loading, and integration with the global configuration.
+
+## Props
+
+| Name | Type | Default | Description |
+| :--- | :--- | :--- | :--- |
+| `refid` | `String` | `''` | The configuration ID for the form layout. |
+| `moduleType` | `String` | `'tab'` | The display mode/style (e.g., 'tab'). |
+| `title` | `String` | `''` | The title of the form/page. |
+| `modelValue` | `Object` | `{}` | The form data object (v-model). |
+| `data` | `Object` | `{}` | Additional data context. |
+
+## Methods
+
+| Name | Description |
+| :--- | :--- |
+| `loadConfig(refid)` | Loads the form configuration by ID. |
+| `setFormJson(json)` | Sets the form JSON configuration manually. |
+| `setFormData(data)` | Sets the form data. |
+| `setModelValue(value)` | Sets the model value. |
+| `getFormData(validate)` | Retrieves the form data, optionally validating it. |
+| `toolbarButtonClick(config)` | Handles toolbar button clicks and executes configured handlers. |
+
+## Features
+
+- **Dynamic Configuration**: Loads form layout and toolbar from `moduleCache`.
+- **Toolbar Support**: Renders a toolbar with customizable buttons and handlers.
+- **VForm Integration**: Wraps `VFormRender` for powerful form capabilities.
+- **Global Config**: Respects global size settings.
+
+## Usage
+
+```vue
+<template>
+  <sohelp-vform-eleplus refid="my_form_config" v-model="formData" />
+</template>
+```