xrk-components 0.3.0 → 0.3.1

package/lib/packages/xrk/search/types/type.d.ts

@@ -1,61 +0,0 @@
-import { Component, CSSProperties } from 'vue';
-import { BaseInputProps } from '../../../base/input';
-import { BaseDatePickerProps } from '../../../base/date-picker';
-import { BaseSelectProps, SelectOptionType, SelectValueType } from '../../../base/select';
-import { FormItemRule } from 'element-plus';
-declare type AnyObject = Record<string, any>;
-export declare type BaseSelectListener = {
-    onChange?: (value: SelectValueType, selectOptions: Array<SelectOptionType>, searchValue: AnyObject) => void;
-    onRemoveTag?: (value: SelectValueType, searchValue: AnyObject) => void;
-    onVisibleChange?: (visibleStatus: boolean, searchValue: AnyObject) => void;
-    onClear?: (searchValue: AnyObject) => void;
-};
-export declare type BaseInputListener = {
-    onBlur?: (events: Event, searchValue: AnyObject) => void;
-    onFocus?: (events: Event, searchValue: AnyObject) => void;
-    onKeyup?: (events: Event, searchValue: AnyObject) => void;
-    onChange?: (value: string | number | KeyboardEvent, searchValue: AnyObject) => void;
-    onInput?: (value: string | number | KeyboardEvent, searchValue: AnyObject) => void;
-    onClear?: (searchValue: AnyObject) => void;
-};
-export declare type BaseDatePickerListener = {
-    onChange?: (value: any, searchValue: AnyObject) => void;
-    onVisibleChange?: (visibleStatus: boolean, searchValue: AnyObject) => void;
-    onCalendarChange?: (val: [Date, Date | null], searchValue: AnyObject) => void;
-};
-export interface ComponentsType {
-    input: Component;
-    select: Component;
-    datePicker: Component;
-}
-export declare type SerachColumnBaseType<T, S> = {
-    type?: keyof ComponentsType;
-    label?: string;
-    style?: CSSProperties;
-    defaultValue?: any;
-    prop: string;
-    rules?: FormItemRule | Array<FormItemRule>;
-    disabled?: boolean | ((searchValue: AnyObject) => Promise<boolean> | boolean);
-    config?: T;
-    listener?: S;
-};
-export declare type SerachColumnType = SerachColumnBaseType<BaseInputProps | BaseSelectProps | BaseDatePickerProps, BaseInputListener | BaseSelectListener | BaseDatePickerListener>;
-export declare type SearchBtnType = {
-    text?: string;
-    show?: boolean;
-    beforeSearch?: (searchValue: AnyObject) => AnyObject | Promise<AnyObject>;
-    afterSearch?: (searchValue: AnyObject) => void | AnyObject | Promise<AnyObject>;
-};
-export declare type ResetBtnType = {
-    text?: string;
-    show?: boolean;
-    beforeReset?: (searchValue: AnyObject) => AnyObject | Promise<AnyObject>;
-    afterReset?: (searchValue: AnyObject) => void | AnyObject | Promise<AnyObject>;
-};
-export interface ComponentRender {
-    render: (renderInfo: {
-        columns: Array<SerachColumnType>;
-        searchValue: Record<string, any>;
-    }) => Component;
-}
-export {};

package/lib/packages/xrk/table/hooks/use-table.d.ts

@@ -1,6 +0,0 @@
-export declare const useTable: (config: any) => {
-    pageIsLoading: import("vue").Ref<boolean>;
-    pageAllData: import("vue").Ref<any[]>;
-    paginationTotal: import("vue").Ref<number>;
-    getList: (query: any) => Promise<void>;
-};

package/lib/packages/xrk/table/index.d.ts

@@ -1,3 +0,0 @@
-import { DefineComponent } from 'vue';
-import { XrkTableProps } from './types/type';
-export declare const XrkTable: DefineComponent<XrkTableProps, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<XrkTableProps>, {}>;

package/lib/packages/xrk/table/table.d.ts

@@ -1,63 +0,0 @@
-declare const _default: import("vue").DefineComponent<{
-    requestNow: {
-        type: BooleanConstructor;
-        required: false;
-        default: boolean;
-    };
-    getListAjax: {
-        type: FunctionConstructor;
-        required: true;
-    };
-    searchConfig: {
-        type: ObjectConstructor;
-        required: true;
-    };
-    tableConfig: {
-        type: ObjectConstructor;
-        required: true;
-    };
-    paginationConfig: {
-        type: ObjectConstructor;
-        required: false;
-        default: () => {
-            pageNoKey: string;
-            pageSizeKey: string;
-            paginationPageSize: number;
-            paginationCurrentPage: number;
-        };
-    };
-}, (_ctx: any, _cache: any) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    requestNow: {
-        type: BooleanConstructor;
-        required: false;
-        default: boolean;
-    };
-    getListAjax: {
-        type: FunctionConstructor;
-        required: true;
-    };
-    searchConfig: {
-        type: ObjectConstructor;
-        required: true;
-    };
-    tableConfig: {
-        type: ObjectConstructor;
-        required: true;
-    };
-    paginationConfig: {
-        type: ObjectConstructor;
-        required: false;
-        default: () => {
-            pageNoKey: string;
-            pageSizeKey: string;
-            paginationPageSize: number;
-            paginationCurrentPage: number;
-        };
-    };
-}>>, {
-    requestNow: boolean;
-    paginationConfig: Record<string, any>;
-}>;
-export default _default;

package/lib/packages/xrk/table/types/type.d.ts

@@ -1,21 +0,0 @@
-import { BaseTableColumnProps } from '../../../base/table/types/type';
-import { ComponentRender, ResetBtnType, SearchBtnType, SerachColumnType } from '../../search/types/type';
-export declare type XrkTableProps = {
-    requestNow?: boolean;
-    getListAjax: (...args: any) => Promise<any> | any;
-    searchConfig: {
-        searchColumns: Array<SerachColumnType>;
-        searchBtn?: SearchBtnType;
-        resetBtn?: ResetBtnType;
-        othertComponents?: Array<ComponentRender>;
-    };
-    tableConfig: {
-        tableColumns: Array<BaseTableColumnProps>;
-    };
-    paginationConfig?: {
-        pageNoKey?: string;
-        pageSizeKey?: string;
-        paginationPageSize: number;
-        paginationCurrentPage: number;
-    };
-};

package/lib/tools/check.d.ts

@@ -1 +0,0 @@
-export declare function isFunction<T = Function>(val: unknown): val is T;

package/packages/base/button/button.vue

@@ -1,83 +0,0 @@
-<!--
- * @Description: 
- * @Date: 2022-06-21 11:14:09
--->
-<template>
-  <el-button
-    @click="handleClick"
-    :loading="isLoading"
-    :size="size"
-    :type="type"
-    :plain="plain"
-    :round="round"
-    :circle="circle"
-    :disabled="disabled"
-    :autofocus="autofocus"
-    :autoInsertSpace="autoInsertSpace"
-    :nativeType="nativeType"
-    :loadingIcon="loadingIcon"
-    :icon="icon"
-  >
-    <slot></slot>
-  </el-button>
-</template>
-
-<script lang="tsx">
-export default {
-  name: 'base-button'
-};
-</script>
-
-<script lang="tsx" setup>
-import { Component, computed, ref } from 'vue';
-import { ElButton } from 'element-plus';
-import { BaseButtonProps } from './index';
-
-const _props = withDefaults(
-  defineProps<{
-    click?: any; // 自定义方法 ， 用于事件同步执行
-    loading?: boolean; // 是否为加载中状态
-    loadingIcon?: any; // 自定义加载中状态图标组件
-    size?: 'large' | 'default' | 'small'; // 尺寸
-    type?: 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'text';
-    plain?: boolean; // 是否为朴素按钮
-    round?: boolean; // 是否为圆角按钮
-    circle?: boolean; // 是否为圆形按钮
-    disabled?: boolean; // 按钮是否为禁用状态
-    autofocus?: boolean; // 原生 autofocus 属性
-    autoInsertSpace?: boolean; // 自动在两个中文字符之间插入空格
-    nativeType?: 'button' | 'submit' | 'reset'; // 原生 type 属性
-    icon?: any; // 图标组件
-  }>(),
-  {
-    type: 'primary',
-    size: 'default'
-  }
-);
-
-const props = _props as Readonly<BaseButtonProps>;
-
-const { handleClick, isLoading } = (() => {
-  const _loading = ref<boolean>(false);
-  const isLoading = computed(() => {
-    return props.loading || _loading.value;
-  });
-  return {
-    isLoading: isLoading,
-    handleClick: (props.click
-      ? async () => {
-          _loading.value = true;
-          try {
-            await props.click?.();
-            _loading.value = false;
-          } catch (error) {
-            console.warn(error);
-            _loading.value = false;
-          }
-        }
-      : undefined) as ((evt: MouseEvent) => any) | undefined
-  };
-})();
-</script>
-
-<style lang="scss" scoped></style>

package/packages/base/button/index.ts

@@ -1,26 +0,0 @@
-/*
- * @Description:
- * @Date: 2022-06-30 22:57:42
- */
-import { Component, DefineComponent } from 'vue';
-import _BaseButton from './button.vue';
-
-export type BaseButtonProps = {
-  click?: (...preload: Array<any>) => Promise<any> | void | any; // 自定义方法 ， 用于事件同步执行
-  loading?: boolean; // 是否为加载中状态
-  loadingIcon?: string | Component; // 自定义加载中状态图标组件
-  size?: 'large' | 'default' | 'small'; // 尺寸
-  type?: 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'text';
-  plain?: boolean; // 是否为朴素按钮
-  round?: boolean; // 是否为圆角按钮
-  circle?: boolean; // 是否为圆形按钮
-  disabled?: boolean; // 按钮是否为禁用状态
-  autofocus?: boolean; // 原生 autofocus 属性
-  autoInsertSpace?: boolean; // 自动在两个中文字符之间插入空格
-  nativeType?: 'button' | 'submit' | 'reset'; // 原生 type 属性
-  icon?: string | Component; // 图标组件
-
-  onClick?: Function;
-};
-
-export const BaseButton = _BaseButton as DefineComponent<BaseButtonProps>;

package/packages/base/checkbox/checkbox-button.vue

@@ -1,54 +0,0 @@
-<!--
- * @Description: 
- * @Date: 2022-06-21 11:16:37
--->
-<template>
-  <el-checkbox-button
-    :model-value="modelValue"
-    :size="size"
-    :name="name"
-    :label="label"
-    :disabled="disabled"
-    :border="border"
-    :true-label="trueLabel"
-    :false-label="falseLabel"
-    :checked="checked"
-    @change="handleChange"
-  >
-    <slot></slot>
-  </el-checkbox-button>
-</template>
-
-<script lang="tsx">
-export default {
-  name: 'base-checkbox-button'
-};
-</script>
-
-<script lang="tsx" setup>
-import { ElCheckboxButton } from 'element-plus';
-
-defineProps<{
-  modelValue?: string | number | boolean; // 选中项绑定值
-  size?: 'large' | 'default' | 'small'; // Checkbox 的尺寸
-  name?: string; // 原生 name 属性
-  label?: string | number | boolean; // 选中状态的值（只有在checkbox-group或者绑定对象类型为array时有效）
-  disabled?: boolean; // 	是否禁用
-  border?: boolean; // 	是否显示边框
-  trueLabel?: string | number; // 选中时的值
-  falseLabel?: string | number; // 没有选中时的值
-  checked?: boolean; // 当前是否勾选
-}>();
-
-const emits = defineEmits<{
-  (event: 'change', activeValue: any): void;
-  (event: 'update:modelValue', activeValue: any): void;
-}>();
-
-const handleChange = (activeValue: any) => {
-  emits('update:modelValue', activeValue);
-  emits('change', activeValue);
-};
-</script>
-
-<style lang="scss" scoped></style>

package/packages/base/checkbox/checkbox-group.vue

@@ -1,85 +0,0 @@
-<!--
- * @Description: 
- * @Date: 2022-06-21 11:16:37
--->
-<template>
-  <el-checkbox-group
-    class="base-checkbox-group"
-    :model-value="modelValue"
-    :size="size"
-    :disabled="disabled"
-    :text-color="textColor"
-    :fill="fill"
-    :label="label"
-    :min="min"
-    :max="max"
-    @change="handleChange"
-  >
-    <div style="display: inline-block" v-loading="_loading">
-      <slot></slot>
-    </div>
-  </el-checkbox-group>
-</template>
-
-<script lang="tsx">
-export default {
-  name: 'base-checkbox-group'
-};
-</script>
-
-<script lang="tsx" setup>
-import { ref } from 'vue';
-import { ElCheckboxGroup, vLoading as _vLoading } from 'element-plus';
-import { isFunction } from '../../../tools/check';
-
-const vLoading = _vLoading;
-const props = defineProps<{
-  modelValue?: Array<any>; // 绑定值
-  size?: 'large' | 'default' | 'small'; // 多选框组尺寸
-  disabled?: boolean; // 是否禁用
-  textColor?: string; // 当按钮为活跃状态时的字体颜色
-  fill?: string; // 当按钮为活跃状态时的边框和背景颜色
-  label?: string; // 为屏幕阅读器准备的标签
-  min?: number; // 可被勾选的 checkbox 的最小数量
-  max?: number; // 可被勾选的 checkbox 的最大数量
-
-  checkBefore?: (activeValue: any, done: Function) => void;
-}>();
-
-const emits = defineEmits<{
-  (event: 'change', activeValue: any): void;
-  (event: 'update:modelValue', activeValue: any): void;
-}>();
-
-const _loading = ref(false);
-
-const handleChange = async (activeValue: any) => {
-  if (_loading.value) return;
-  _loading.value = true;
-  try {
-    if (
-      (props.modelValue?.length || 0) < activeValue?.length &&
-      isFunction(props.checkBefore)
-    ) {
-      await props.checkBefore(activeValue, () => {
-        emits('update:modelValue', activeValue);
-        emits('change', activeValue);
-      });
-    } else {
-      emits('update:modelValue', activeValue);
-      emits('change', activeValue);
-    }
-  } catch (error) {}
-  _loading.value = false;
-};
-</script>
-
-<style lang="scss" scoped>
-.base-checkbox-group {
-  ::v-deep {
-    .xrk-loading-spinner .circular {
-      width: 20px;
-    }
-  }
-}
-</style>

package/packages/base/checkbox/checkbox.vue

@@ -1,85 +0,0 @@
-<!--
- * @Description: 
- * @Date: 2022-06-21 11:16:37
--->
-<template>
-  <el-checkbox
-    class="base-checkbox"
-    :model-value="modelValue"
-    :size="size"
-    :name="name"
-    :label="label"
-    :disabled="disabled"
-    :border="border"
-    :true-label="trueLabel"
-    :false-label="falseLabel"
-    :checked="checked"
-    :indeterminate="indeterminate"
-    v-loading="_loading"
-    @change="handleChange"
-  >
-    <slot></slot>
-  </el-checkbox>
-</template>
-
-<script lang="tsx">
-export default {
-  name: 'base-checkbox'
-};
-</script>
-
-<script lang="tsx" setup>
-import { ref } from 'vue';
-import { ElCheckbox, vLoading as _vLoading } from 'element-plus';
-import { isFunction } from '../../../tools/check';
-
-const vLoading = _vLoading;
-const props = defineProps<{
-  modelValue?: string | number | boolean; // 选中项绑定值
-  size?: 'large' | 'default' | 'small'; // Checkbox 的尺寸
-  name?: string; // 原生 name 属性
-  label?: string | number | boolean; // 选中状态的值（只有在checkbox-group或者绑定对象类型为array时有效）
-  disabled?: boolean; // 	是否禁用
-  border?: boolean; // 	是否显示边框
-  trueLabel?: string | number; // 选中时的值
-  falseLabel?: string | number; // 没有选中时的值
-  checked?: boolean; // 当前是否勾选
-  indeterminate?: boolean; // 设置 indeterminate 状态，只负责样式控制
-
-  checkBefore?: (activeValue: any, done: Function) => void;
-}>();
-
-const emits = defineEmits<{
-  (event: 'change', activeValue: any): void;
-  (event: 'update:modelValue', activeValue: any): void;
-}>();
-
-const _loading = ref(false);
-
-const handleChange = async (activeValue: any) => {
-  if (_loading.value) return;
-  _loading.value = true;
-  try {
-    if (activeValue && isFunction(props.checkBefore)) {
-      await props.checkBefore(activeValue, () => {
-        emits('update:modelValue', activeValue);
-        emits('change', activeValue);
-      });
-    } else {
-      emits('update:modelValue', activeValue);
-      emits('change', activeValue);
-    }
-  } catch (error) {}
-  _loading.value = false;
-};
-</script>
-
-<style lang="scss" scoped>
-.base-checkbox {
-  ::v-deep {
-    .xrk-loading-spinner .circular {
-      width: 20px;
-    }
-  }
-}
-</style>

package/packages/base/checkbox/index.ts

@@ -1,62 +0,0 @@
-/*
- * @Description:
- * @Date: 2022-07-01 10:29:26
- */
-import { DefineComponent } from 'vue';
-import _BaseCheckboxButton from './checkbox-button.vue';
-import _BaseCheckboxGroup from './checkbox-group.vue';
-import _BaseCheckbox from './checkbox.vue';
-
-export type BaseCheckboxButtonProps = {
-  modelValue?: string | number | boolean; // 选中项绑定值
-  size?: 'large' | 'default' | 'small'; // Checkbox 的尺寸
-  name?: string; // 原生 name 属性
-  label?: string | number | boolean; // 选中状态的值（只有在checkbox-group或者绑定对象类型为array时有效）
-  disabled?: boolean; // 	是否禁用
-  border?: boolean; // 	是否显示边框
-  trueLabel?: string | number; // 选中时的值
-  falseLabel?: string | number; // 没有选中时的值
-  checked?: boolean; // 当前是否勾选
-
-  onChange?: (activeValue: any) => void;
-  onClick?: (payload?: MouseEvent) => void;
-};
-
-export type BaseCheckboxGroupProps = {
-  modelValue?: Array<any>; // 绑定值
-  size?: 'large' | 'default' | 'small'; // 多选框组尺寸
-  disabled?: boolean; // 是否禁用
-  textColor?: string; // 当按钮为活跃状态时的字体颜色
-  fill?: string; // 当按钮为活跃状态时的边框和背景颜色
-  label?: string; // 为屏幕阅读器准备的标签
-  min?: number; // 可被勾选的 checkbox 的最小数量
-  max?: number; // 可被勾选的 checkbox 的最大数量
-  checkBefore?: (activeValue: any, done: Function) => void;
-
-  onChange?: (activeValue: any) => void;
-};
-
-export type BaseCheckboxProps = {
-  modelValue?: string | number | boolean; // 选中项绑定值
-  size?: 'large' | 'default' | 'small'; // Checkbox 的尺寸
-  name?: string; // 原生 name 属性
-  label?: string | number | boolean; // 选中状态的值（只有在checkbox-group或者绑定对象类型为array时有效）
-  disabled?: boolean; // 	是否禁用
-  border?: boolean; // 	是否显示边框
-  trueLabel?: string | number; // 选中时的值
-  falseLabel?: string | number; // 没有选中时的值
-  checked?: boolean; // 当前是否勾选
-  indeterminate?: boolean; // 设置 indeterminate 状态，只负责样式控制
-  checkBefore?: (activeValue: any, done: Function) => void;
-
-  onChange?: (activeValue: any) => void;
-  onClick?: (payload?: MouseEvent) => void;
-};
-
-export const BaseCheckboxButton =
-  _BaseCheckboxButton as DefineComponent<BaseCheckboxButtonProps>;
-
-export const BaseCheckboxGroup =
-  _BaseCheckboxGroup as DefineComponent<BaseCheckboxGroupProps>;
-
-export const BaseCheckbox = _BaseCheckbox as DefineComponent<BaseCheckboxProps>;