@fmdevui/fm-dev/lib/core/ui/components/inpttable/index.vue.d.ts

Page level components developed based on Element Plus.

import { DefineComponent, ExtractPropTypes, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
declare function __VLS_template(): {
    attrs: Partial<{}>;
    slots: {
        queryForm?(_: {
            query: {
                [x: string]: any;
                page?: number | undefined;
                pageSize?: number | undefined;
            };
            handleQuery: () => void;
        }): any;
        columns?(_: {}): any;
    };
    refs: {
        selectRef: unknown;
        tableRef: unknown;
    };
    rootEl: any;
};
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
declare const __VLS_component: DefineComponent<ExtractPropTypes<{
    /**
     * 使用示例：
     *
     * 单选模式：
     * <pulldown-selecter
     *      v-model="state.ruleForm.userId"
     *      :defaultOptions="[ id: state.ruleForm.userId, realName: state.ruleForm.realName ]"
     *      :fetch-options="handleSysUserTable"
     *      :queryParams="state.queryParams"
     *      :dropdown-width="dropdownWidth"
     *      :placeholder="placeholder"
     *      :label-prop="realName"
     *      :value-prop="id"
     *      @@change="handelChange"
     *      filterable
     *      clearable
     *      class="w100"
     *  >
     *
     * 多选模式：
     * <pulldown-selecter
     *      v-model="state.ruleForm.userIds"
     *      :defaultOptions="state.ruleForm.defaultUsers"
     *      :fetch-options="handleSysUserTable"
     *      :queryParams="state.queryParams"
     *      :dropdown-width="dropdownWidth"
     *      :placeholder="placeholder"
     *      :label-prop="realName"
     *      :value-prop="id"
     *      @@change="handelChange"
     *      multiple
     *      filterable
     *      clearable
     *      class="w100"
     *  >
     *
     * 查询条件表单插槽：
     *     <template #queryForm="{ query, handleQuery }">
     *       <el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
     *         <el-form-item label="姓名" prop="realName">
     *           <el-input v-model="query.realName" placeholder="请输入姓名" class="w100" clearable @keydown.enter.native="handleQuery()" />
     *         </el-form-item>
     *       </el-col>
     *       <el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
     *         <el-form-item label="电话" prop="phone">
     *           <el-input v-model="query.phone" placeholder="请输入电话" class="w100" clearable @keydown.enter.native="handleQuery()" />
     *         </el-form-item>
     *       </el-col>
     *    </template>
     *
     * 表格列插槽：
     *    <template #columns>
     *      <el-table-column prop="realName" label="姓名" />
     *      <el-table-column prop="account" label="账号" width="160"/ >
     *      <el-table-column prop="idCardNo" label="身份证号" width="140" />
     *      <el-table-column prop="cardNo" label="卡号" width="140" />
     *      <el-table-column prop="gender" label="性别" width="85">
     *        <template #default="{ row }">
     *          <g-sys-dict v-model="row.gender" code="GenderEnum" />
     *        </template>
     *      </el-table-column>
     *      <el-table-column prop="birthday" label="生日">
     *        <template #default="{ row, $index }">
     *          {{ commonFun.dateFormatYMD(row, $index, row.birthday) }}
     *        </template>
     *      </el-table-column>
     *      <el-table-column prop="phone" label="联系电话" width="100" />
     *    </template>
     *  </pulldown-selecter>
     */
    modelValue: (StringConstructor | ArrayConstructor | NumberConstructor | null)[];
    /**
     * 获取表格数据的异步方法（必填）
     * @example
     * const handleSysUserTable = (params: any) => {
     *  return getAPI(SysUserApi).apiSysUserPagePost(params);
     * };
     */
    fetchOptions: {
        type: FunctionConstructor;
    };
    islocalData: {
        type: BooleanConstructor;
        default: boolean;
    };
    localdataList: {
        type: {
            (arrayLength: number): any[];
            (...items: any[]): any[];
            new (arrayLength: number): any[];
            new (...items: any[]): any[];
            isArray(arg: any): arg is any[];
            readonly prototype: any[];
            from<T>(arrayLike: ArrayLike<T>): T[];
            from<T, U>(arrayLike: ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
            from<T>(iterable: Iterable<T> | ArrayLike<T>): T[];
            from<T, U>(iterable: Iterable<T> | ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
            of<T>(...items: T[]): T[];
            readonly [Symbol.species]: ArrayConstructor;
        };
        default: never[];
    };
    /**
* api service name
*/
    apiService: {
        type: StringConstructor;
        default: string;
    };
    /**
    * api service 下的方法
    */
    apiAction: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 基础编码 自动获取数据
     */
    method: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 选中记录后绑定值的属性名
     * 默认为'id'，即选中某行后，会取该行数据的id字段作为值
     */
    valueProp: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 选中记录后显示文本的属性名
     * 默认为'name'，即在下拉框中显示的文本取自该字段
     */
    labelProp: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 显示值的格式化方法
     * 可以自定义选中后在输入框中显示的文本格式
     * @example
     * :labelFormat="(item: any) => `${item.realName}(${item.account})`"
     */
    labelFormat: {
        type: FunctionConstructor;
        default: (item: any) => undefined;
    };
    /**
     * 默认查询条件的属性名
     * 在输入框中输入的关键词会赋值给该字段
     */
    keywordProp: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 下拉框的宽度
     */
    dropdownWidth: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 下拉框的高度
     */
    dropdownHeight: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 输入框的占位符文本
     */
    placeholder: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 默认选项，用于回显已选中的数据
     * 当数据不在当前页时，通过该属性提供数据进行回显
     */
    defaultOptions: {
        type: {
            (arrayLength: number): any[];
            (...items: any[]): any[];
            new (arrayLength: number): any[];
            new (...items: any[]): any[];
            isArray(arg: any): arg is any[];
            readonly prototype: any[];
            from<T>(arrayLike: ArrayLike<T>): T[];
            from<T, U>(arrayLike: ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
            from<T>(iterable: Iterable<T> | ArrayLike<T>): T[];
            from<T, U>(iterable: Iterable<T> | ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
            of<T>(...items: T[]): T[];
            readonly [Symbol.species]: ArrayConstructor;
        };
        default: never[];
    };
    /**
     * 查询表单的高度偏移量
     * 用于计算表格高度时减去查询表单占用的高度
     */
    queryHeightOffset: {
        type: NumberConstructor;
        default: number;
    };
    /**
     * 查询表单标签的宽度
     */
    queryLabelWidth: {
        type: StringConstructor;
    };
    /**
     * 查询参数对象
     * 父组件传入的额外查询条件，会与组件内部的查询条件合并
     */
    queryParams: {
        type: ObjectConstructor;
        default: () => {};
    };
    /**
     * 是否显示分页组件
     */
    pagination: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 是否禁用组件
     */
    disabled: BooleanConstructor;
    /**
     * 是否多选模式
     */
    multiple: BooleanConstructor;
    /**
     * 是否可清空
     */
    clearable: BooleanConstructor;
}>, {
    setValue: (option: any | any[], row?: any) => void;
    handleQuery: (clearKeyword?: boolean) => void;
    setQueryParams: (query: any, append?: boolean) => void;
    setDefaultOptions: (options: any[]) => void;
}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
    change: (...args: any[]) => void;
    "update:modelValue": (...args: any[]) => void;
}, string, PublicProps, Readonly< ExtractPropTypes<{
    /**
     * 使用示例：
     *
     * 单选模式：
     * <pulldown-selecter
     *      v-model="state.ruleForm.userId"
     *      :defaultOptions="[ id: state.ruleForm.userId, realName: state.ruleForm.realName ]"
     *      :fetch-options="handleSysUserTable"
     *      :queryParams="state.queryParams"
     *      :dropdown-width="dropdownWidth"
     *      :placeholder="placeholder"
     *      :label-prop="realName"
     *      :value-prop="id"
     *      @@change="handelChange"
     *      filterable
     *      clearable
     *      class="w100"
     *  >
     *
     * 多选模式：
     * <pulldown-selecter
     *      v-model="state.ruleForm.userIds"
     *      :defaultOptions="state.ruleForm.defaultUsers"
     *      :fetch-options="handleSysUserTable"
     *      :queryParams="state.queryParams"
     *      :dropdown-width="dropdownWidth"
     *      :placeholder="placeholder"
     *      :label-prop="realName"
     *      :value-prop="id"
     *      @@change="handelChange"
     *      multiple
     *      filterable
     *      clearable
     *      class="w100"
     *  >
     *
     * 查询条件表单插槽：
     *     <template #queryForm="{ query, handleQuery }">
     *       <el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
     *         <el-form-item label="姓名" prop="realName">
     *           <el-input v-model="query.realName" placeholder="请输入姓名" class="w100" clearable @keydown.enter.native="handleQuery()" />
     *         </el-form-item>
     *       </el-col>
     *       <el-col class="mb5" :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
     *         <el-form-item label="电话" prop="phone">
     *           <el-input v-model="query.phone" placeholder="请输入电话" class="w100" clearable @keydown.enter.native="handleQuery()" />
     *         </el-form-item>
     *       </el-col>
     *    </template>
     *
     * 表格列插槽：
     *    <template #columns>
     *      <el-table-column prop="realName" label="姓名" />
     *      <el-table-column prop="account" label="账号" width="160"/ >
     *      <el-table-column prop="idCardNo" label="身份证号" width="140" />
     *      <el-table-column prop="cardNo" label="卡号" width="140" />
     *      <el-table-column prop="gender" label="性别" width="85">
     *        <template #default="{ row }">
     *          <g-sys-dict v-model="row.gender" code="GenderEnum" />
     *        </template>
     *      </el-table-column>
     *      <el-table-column prop="birthday" label="生日">
     *        <template #default="{ row, $index }">
     *          {{ commonFun.dateFormatYMD(row, $index, row.birthday) }}
     *        </template>
     *      </el-table-column>
     *      <el-table-column prop="phone" label="联系电话" width="100" />
     *    </template>
     *  </pulldown-selecter>
     */
    modelValue: (StringConstructor | ArrayConstructor | NumberConstructor | null)[];
    /**
     * 获取表格数据的异步方法（必填）
     * @example
     * const handleSysUserTable = (params: any) => {
     *  return getAPI(SysUserApi).apiSysUserPagePost(params);
     * };
     */
    fetchOptions: {
        type: FunctionConstructor;
    };
    islocalData: {
        type: BooleanConstructor;
        default: boolean;
    };
    localdataList: {
        type: {
            (arrayLength: number): any[];
            (...items: any[]): any[];
            new (arrayLength: number): any[];
            new (...items: any[]): any[];
            isArray(arg: any): arg is any[];
            readonly prototype: any[];
            from<T>(arrayLike: ArrayLike<T>): T[];
            from<T, U>(arrayLike: ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
            from<T>(iterable: Iterable<T> | ArrayLike<T>): T[];
            from<T, U>(iterable: Iterable<T> | ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
            of<T>(...items: T[]): T[];
            readonly [Symbol.species]: ArrayConstructor;
        };
        default: never[];
    };
    /**
* api service name
*/
    apiService: {
        type: StringConstructor;
        default: string;
    };
    /**
    * api service 下的方法
    */
    apiAction: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 基础编码 自动获取数据
     */
    method: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 选中记录后绑定值的属性名
     * 默认为'id'，即选中某行后，会取该行数据的id字段作为值
     */
    valueProp: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 选中记录后显示文本的属性名
     * 默认为'name'，即在下拉框中显示的文本取自该字段
     */
    labelProp: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 显示值的格式化方法
     * 可以自定义选中后在输入框中显示的文本格式
     * @example
     * :labelFormat="(item: any) => `${item.realName}(${item.account})`"
     */
    labelFormat: {
        type: FunctionConstructor;
        default: (item: any) => undefined;
    };
    /**
     * 默认查询条件的属性名
     * 在输入框中输入的关键词会赋值给该字段
     */
    keywordProp: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 下拉框的宽度
     */
    dropdownWidth: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 下拉框的高度
     */
    dropdownHeight: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 输入框的占位符文本
     */
    placeholder: {
        type: StringConstructor;
        default: string;
    };
    /**
     * 默认选项，用于回显已选中的数据
     * 当数据不在当前页时，通过该属性提供数据进行回显
     */
    defaultOptions: {
        type: {
            (arrayLength: number): any[];
            (...items: any[]): any[];
            new (arrayLength: number): any[];
            new (...items: any[]): any[];
            isArray(arg: any): arg is any[];
            readonly prototype: any[];
            from<T>(arrayLike: ArrayLike<T>): T[];
            from<T, U>(arrayLike: ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
            from<T>(iterable: Iterable<T> | ArrayLike<T>): T[];
            from<T, U>(iterable: Iterable<T> | ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
            of<T>(...items: T[]): T[];
            readonly [Symbol.species]: ArrayConstructor;
        };
        default: never[];
    };
    /**
     * 查询表单的高度偏移量
     * 用于计算表格高度时减去查询表单占用的高度
     */
    queryHeightOffset: {
        type: NumberConstructor;
        default: number;
    };
    /**
     * 查询表单标签的宽度
     */
    queryLabelWidth: {
        type: StringConstructor;
    };
    /**
     * 查询参数对象
     * 父组件传入的额外查询条件，会与组件内部的查询条件合并
     */
    queryParams: {
        type: ObjectConstructor;
        default: () => {};
    };
    /**
     * 是否显示分页组件
     */
    pagination: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 是否禁用组件
     */
    disabled: BooleanConstructor;
    /**
     * 是否多选模式
     */
    multiple: BooleanConstructor;
    /**
     * 是否可清空
     */
    clearable: BooleanConstructor;
}>> & Readonly<{
    onChange?: ((...args: any[]) => any) | undefined;
    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
}>, {
    disabled: boolean;
    placeholder: string;
    clearable: boolean;
    method: string;
    apiService: string;
    apiAction: string;
    islocalData: boolean;
    localdataList: any[];
    valueProp: string;
    labelProp: string;
    labelFormat: Function;
    keywordProp: string;
    dropdownWidth: string;
    dropdownHeight: string;
    defaultOptions: any[];
    queryHeightOffset: number;
    queryParams: Record<string, any>;
    pagination: boolean;
    multiple: boolean;
}, {}, {}, {}, string, ComponentProvideOptions, true, {
    selectRef: unknown;
    tableRef: unknown;
}, any>;
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
export default _default;
type __VLS_WithTemplateSlots<T, S> = T & {
    new (): {
        $slots: S;
    };
};