flame-plus 0.1.9 → 0.1.12

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "flame-plus",
-  "version": "0.1.9",
+  "version": "0.1.12",
   "private": false,
   "description": "基于 element-plus 的组件库",
-  "main": "lib/flame-plus.umd.min.js",
+  "main": "packages/index.ts",
   "types": [
     "lib/flame-plus.umd.min.d.ts"
   ],

package/packages/components/complex/flmForm/flmForm.vue

@@ -27,7 +27,7 @@ import {
   flmTimePicker,
   flmTimeSelect,
   flmTransfer,
-} from '@/components'
+} from '../../index'
 import {
   ControlTypes,
   ControlConfig,
@@ -37,8 +37,8 @@ import {
   FormItemConfig,
   FormButtonConfig,
   formDefaultConfig
-} from '@/model/flmComponentConfig'
-import { filterConfig, isValidKey } from '@/utils'
+} from '../../../model/flmComponentConfig'
+import { filterConfig, isValidKey } from '../../../utils'
 
 export default defineComponent({
   components: {

package/packages/components/complex/flmSearch/flmSearch.vue

@@ -38,15 +38,9 @@
 
 <script lang="ts" setup>
 import { defineProps, PropType, ref, Ref, computed, ComputedRef } from 'vue'
-import { ElMessage } from 'element-plus'
-import { flmForm } from '@/components'
-import {
-  ElementSize,
-  ControlTypes,
-  FormConfig,
-} from '@/model/flmComponentConfig'
-import { isValidKey } from '@/utils'
-import { nextTick } from 'process'
+import { flmForm } from '../../index'
+import { FormConfig, FormItemConfig } from '../../../model/flmComponentConfig'
+import { isValidKey } from '../../../utils'
 
 const emit = defineEmits(['searchSubmit', 'searchCancel', 'searchCustomEvent'])
 const props = defineProps({

package/packages/components/complex/flmTable/flmTable.vue

@@ -5,8 +5,8 @@ import {
   TableColumnConfig,
   tableDefaultConfig,
   tableColumnDefaultConfig
-} from '@/model/flmComponentConfig'
-import { filterConfig } from '@/utils'
+} from '../../../model/flmComponentConfig'
+import { filterConfig } from '../../../utils'
 
 export default defineComponent({
   emits: [

package/packages/components/complex/flmToolbar/flmToolbar.vue

@@ -29,8 +29,8 @@
 
 <script lang="ts" setup>
 import { defineEmits, defineProps, PropType, computed, ComputedRef } from 'vue'
-import { flmButton } from '@/components'
-import { ToolbarConfig, ToolbarButtonConfig } from '@/model/flmComponentConfig'
+import { flmButton } from '../../index'
+import { ToolbarConfig, ToolbarButtonConfig } from '../../../model/flmComponentConfig'
 
 const emit = defineEmits(['toolbarClick'])
 const props = defineProps({

package/packages/components/page/flmReportPage/flmReportPage.vue

@@ -72,15 +72,15 @@ import {
   flmTable,
   flmPagination,
   flmDialog
-} from '@/components'
+} from '../../index'
 import {
   ControlTypes,
   FormItemConfig,
   FormConfig,
   TableColumnConfig,
   ReportPageSetting,
-} from '@/model/flmComponentConfig'
-import { isValidKey } from '@/utils'
+} from '../../../model/flmComponentConfig'
+import { isValidKey } from '../../../utils'
 
 const emit = defineEmits(['customEvent'])
 const reportPageRef = ref()

package/packages/model/flmComponentConfig/base/flmTransfer.ts

@@ -0,0 +1,51 @@
+/** @transfer 穿梭框 */
+
+// 右侧排序方式
+export enum TargetSort {
+  'original' = 'original',  // 和原始数据一致
+  'push' = 'push',          // 新元素在最后
+  'unshift' = 'unshift',    // 新元素在最前
+}
+
+// 数据单项格式
+export interface TransferItem {
+  key?: any
+  label?: any
+  disabled?: any
+}
+
+// 穿梭框设置（https://element-plus.gitee.io/zh-CN/component/transfer.html）
+export interface TransferConfig {
+  // 默认属性
+  'model-value'?: Array<TransferItem>
+  'data'?: Array<TransferItem>
+  'filterable'?: boolean
+  'filter-placeholder'?: string
+  'filter-method'?: Function
+  'target-order'?: TargetSort
+  'titles'?: Array<string>
+  'button-texts'?: Array<string>
+  'render-content'?: Function
+  'format'?: { 'noChecked'?: string, 'hasChecked'?: string }
+  'props'?: TransferItem
+  'left-default-checked'?: Array<any>
+  'right-default-checked'?: Array<any>
+}
+// 穿梭框默认事件
+export interface TransferDefaultEvent {
+  onChange: (value: TransferConfig['model-value']) => void
+  onLeftCheckChange: (value: TransferConfig['model-value']) => void
+  onRightCheckChange: (value: TransferConfig['model-value']) => void
+}
+// 穿梭框默认设置
+export const transferDefaultConfig: TransferConfig = {
+  'data': [],
+  'filterable': false,
+  'filter-placeholder': 'Enter keyword',
+  'target-order': TargetSort['original'],
+  'titles': ['List 1', 'List 2'],
+  'button-texts': [],
+  'format': { 'noChecked': '${checked}/${total}', 'hasChecked': '${checked}/${total}' },
+  'left-default-checked': [],
+  'right-default-checked': [],
+}

package/packages/model/flmComponentConfig/complex/flmForm.ts

@@ -0,0 +1,146 @@
+import { XOR } from 'ts-xor'
+import {
+  ElementSize,
+  ButtonConfig,
+  CascaderConfig,
+  CheckboxConfig,
+  ColorPickerConfig,
+  DatePickerConfig,
+  InputConfig,
+  InputNumberConfig,
+  RadioGroupConfig,
+  RateConfig,
+  ReadConfig,
+  SelectConfig,
+  SliderConfig,
+  SwitchConfig,
+  TimePickerConfig,
+  TimeSelectConfig,
+  TransferConfig,
+} from '@/model/flmComponentConfig'
+
+/** @form 表单 */
+
+// 表单控件类型
+export enum ControlTypes {
+  'flmCascader' = 'flmCascader',
+  'flmCheckbox' = 'flmCheckbox',
+  'flmColorPicker' = 'flmColorPicker',
+  'flmDatePicker' = 'flmDatePicker',
+  'flmInput' = 'flmInput',
+  'flmInputNumber' = 'flmInputNumber',
+  'flmRadio' = 'flmRadio',
+  'flmRate' = 'flmRate',
+  'flmRead' = 'flmRead',
+  'flmSelect' = 'flmSelect',
+  'flmSlider' = 'flmSlider',
+  'flmSwitch' = 'flmSwitch',
+  'flmTimePicker' = 'flmTimePicker',
+  'flmTimeSelect' = 'flmTimeSelect',
+  'flmTransfer' = 'flmTransfer',
+}
+
+// 表单控件配置
+export type ControlConfig = CascaderConfig
+  | CheckboxConfig
+  | ColorPickerConfig
+  | DatePickerConfig
+  | InputConfig
+  | InputNumberConfig
+  | RadioGroupConfig
+  | RateConfig
+  | ReadConfig
+  | SelectConfig
+  | SliderConfig
+  | SwitchConfig
+  | TimePickerConfig
+  | TimeSelectConfig
+  | TransferConfig
+
+// 表单model
+export type FormModel = Record<string, any>
+
+// 表单设置（https://element-plus.gitee.io/zh-CN/component/button.html）
+export interface FormConfig {
+  // 默认属性
+  'model'?:	FormModel
+  'rules'?:	Record<string, Array<FormRule>>
+  'inline'?: boolean
+  'label-position'?: 'left' | 'right' | 'top'
+  'label-width'?:	string | number
+  'label-suffix'?: string
+  'hide-required-asterisk'?: boolean
+  'show-message'?: boolean
+  'inline-message'?: boolean
+  'status-icon'?: boolean
+  'validate-on-rule-change'?: boolean
+  'size'?: ElementSize
+  'disabled'?: boolean
+  // 自定义属性
+  'items'?: Array<FormItemConfig>      // 表单项
+  'buttons'?: Array<FormButtonConfig>  // 表单按钮
+}
+
+// 表单项设置
+export type FormItemConfig = XOR<SlotItemConfig, ControlItemConfig>
+// 表单项默认属性
+export interface FormItemDefaultConfig {
+  'prop'?: string | Array<string>
+  'label'?:	string
+  'label-width'?: string | number
+  'required'?: boolean
+  'rules'?:	any
+  'error'?: string
+  'show-message'?: boolean
+  'inline-message'?: boolean
+  'size'?: ElementSize
+}
+
+// 插槽项属性
+interface SlotItemConfig extends FormItemDefaultConfig {
+  'isSlot': boolean  // 是否为插槽
+}
+
+// 控件项属性
+interface ControlItemConfig extends FormItemDefaultConfig {
+  'controlType': ControlTypes,    // 控件类型
+  'controlConfig': ControlConfig  // 控件设置
+}
+
+// 表单校验规则
+interface FormRule {
+  'required'?: true,
+  'min'?: number
+  'max'?: number
+  'message'?: string
+  'trigger'?: 'change' | 'blur'
+  'validator'?: Function
+}
+
+// 表单默认方法
+export enum FormEvent {
+  'submit' = 'submit',  // 提交
+  'cancel' = 'cancel',  // 取消
+}
+
+// 表单按钮属性，增加属性(event - 方法名)
+export interface FormButtonConfig extends ButtonConfig {
+  'event': FormEvent | string
+}
+
+// 表单默认设置
+export const formDefaultConfig: FormConfig = {
+  'inline': false,
+  'label-position': 'right',
+  'hide-required-asterisk': false,
+  'show-message': true,
+  'inline-message': false,
+  'status-icon': false,
+  'validate-on-rule-change': true,
+  'disabled': false,
+}
+
+// 是否为输入框组件
+export const isInputControl = (control: ControlItemConfig['controlConfig']): control is InputConfig => {
+  return (control as InputConfig)['modelValue'] !== undefined
+}

package/packages/model/flmComponentConfig/complex/flmTable.ts

@@ -0,0 +1,110 @@
+import { ElementSize } from '@/model/flmComponentConfig'
+
+/** @table 表格 */
+
+// 表格设置（https://element-plus.gitee.io/zh-CN/component/table.html）
+export interface TableConfig {
+  // 默认属性
+  'data'?: Array<any>
+  'height'?: string | number
+  'max-height'?: string | number
+  'stripe'?: boolean
+  'border'?: boolean
+  'size'?: ElementSize
+  'fit'?: boolean
+  'show-header'?: boolean
+  'highlight-current-row'?: boolean
+  'current-row-key'?: string | number
+  'row-class-name'?: Function | string
+  'row-style'?: Function | object
+  'cell-class-name'?: Function | string
+  'cell-style'?: Function | object
+  'header-row-class-name'?: Function | string
+  'header-row-style'?:  Function | object
+  'header-cell-class-name'?: Function | string
+  'header-cell-style'?:  Function | object
+  'row-key'?:	Function | string
+  'empty-text'?: string
+  'default-expand-all'?: boolean
+  'expand-row-keys'?: Array<any>
+  'default-sort'?: { prop: any, order: 'ascending' | 'descending' }
+  'tooltip-effect'?: 'dark' | 'light'
+  'show-summary'?: boolean
+  'sum-text'?: string
+  'summary-method'?: Function
+  'span-method'?:	Function
+  'select-on-indeterminate'?: boolean
+  'indent'?: number
+  'lazy'?: boolean
+  'load'?: Function
+  'tree-props'?: { hasChildren: string, children: string }
+  'table-layout'?: 'fixed' | 'auto'
+  'scrollbar-always-on'?: boolean
+  // 自定义属性
+  'columns'?: Array<TableColumnConfig>
+}
+
+// 表格列设置
+export interface TableColumnConfig {
+  // 默认属性
+  'type'?: 'selection' | 'index' | 'expand'
+  'index'?:	number | Function
+  'label'?: string
+  'column-key'?: string
+  'prop'?: string
+  'width'?: string | number
+  'min-width'?:	string | number
+  'fixed'?: true | 'left' | 'right'
+  'render-header'?: Function
+  'sortable'?: true | false | 'custom'
+  'sort-method'?: Function
+  'sort-by'?:Function
+  'sort-orders'?: Array<'ascending' | 'descending' | null>
+  'resizable'?: boolean
+  'formatter'?: Function
+  'show-overflow-tooltip'?: boolean
+  'align'?: 'left' | 'center' | 'right'
+  'header-align'?: 'left' | 'center' | 'right'
+  'class-name'?: string
+  'label-class-name'?: string
+  'selectable'?: Function
+  'reserve-selection'?: boolean
+  'filters'?: Array<{ text: string, value: string }>
+  'filter-placement'?: string
+  'filter-multiple'?: boolean
+  'filter-method'?: Function
+  'filtered-value'?: Array<any>
+  // 自定义属性
+  'isSlot'?: boolean
+  'columns'?: Array<TableColumnConfig>
+}
+
+// 表格默认设置
+export const tableDefaultConfig: TableConfig = {
+  'stripe': false,
+  'border': false,
+  'fit': true,
+  'show-header': true,
+  'highlight-current-row': false,
+  'empty-text': '暂无数据',
+  'default-expand-all': false,
+  'tooltip-effect': 'dark',
+  'show-summary': false,
+  'sum-text': '合计',
+  'select-on-indeterminate': true,
+  'indent': 16,
+  'tree-props': { hasChildren: 'hasChildren', children: 'children' },
+  'table-layout': 'fixed',
+  'scrollbar-always-on': false,
+}
+
+// 表格列默认设置
+export const tableColumnDefaultConfig: TableColumnConfig = {
+  'sortable': false,
+  'sort-orders': ['ascending', 'descending', null],
+  'resizable': false,
+  'show-overflow-tooltip': false,
+  'align': 'left',
+  'reserve-selection': false,
+  'filter-multiple': true,
+}

package/packages/model/flmComponentConfig/complex/flmToolbar.ts

@@ -0,0 +1,13 @@
+import { ButtonConfig } from '@/model/flmComponentConfig'
+
+// 工具栏按钮设置
+export interface ToolbarButtonConfig extends ButtonConfig {
+  'event': string  // 需要补充页面函数枚举
+}
+
+// 工具栏设置
+export interface ToolbarConfig {
+  'publicConfig': ButtonConfig           // 按钮公共设置
+  'maxButton': number                    // 最大按钮数（不包含展开按钮）
+  'buttons': Array<ToolbarButtonConfig>  // 按钮列表
+}

package/packages/model/flmComponentConfig/page/flmReportPage.ts

@@ -0,0 +1,22 @@
+import {
+  FormConfig,
+  ToolbarConfig,
+  TableConfig,
+  PaginationConfig,
+  DialogConfig
+} from '@/model/flmComponentConfig'
+
+// 报表页面设置
+export interface ReportPageSetting {
+  'search': FormConfig
+  'toolbar': ToolbarConfig
+  'table': TableConfig
+  'tableAction': ToolbarConfig
+  'pagination': PaginationConfig
+  'readDialog': DialogConfig
+  'readForm': FormConfig
+  'addDialog': DialogConfig
+  'addForm': FormConfig
+  'editDialog': DialogConfig
+  'editForm': FormConfig
+}