import debounce from 'lodash/debounce';
import { deepEqual, isJSExpression } from '../utils';
import { mockProTableRow, mockId } from './utils';
import { IProps } from './search';

export const columnsField: IProps = {
    type: 'field',
    name: 'columns',
    title: '数据列',
    extraProps: {
        display: 'accordion',
    },
    setValue: debounce((field, columns) => {
        console.info("setValue", field, columns)
        const _columns = isJSExpression(columns) ? columns.mock : columns;
        if (!_columns || !Array.isArray(_columns) || !_columns.length) {
            return;
        }
        const { node } = field;
        const dataSource = node.getPropValue('dataSource') || [];

        const _dataSource = isJSExpression(dataSource) ? dataSource.mock : dataSource;
        if (!_dataSource || !Array.isArray(_dataSource) || !_dataSource.length) {
            return;
        }
        const primaryKey = node.getPropValue('primaryKey') || 'id';
        console.log(11, field, columns, dataSource, primaryKey)
        const mockRow = mockProTableRow(columns);
        const newData = dataSource.map((item) => ({
            [primaryKey]: mockId(),
            ...mockRow,
            ...item,
        }));
        if (!deepEqual(newData, dataSource)) {
            node.setPropValue('dataSource', newData);
        }
    }),
    setter: {
        componentName: 'ArraySetter',
        props: {
            itemSetter: {
                componentName: 'ObjectSetter',
                props: {
                    config: {
                        items: [
                            {
                                name: 'title',
                                title: { label: 'title', tip: '标题' },
                                display: 'inline',
                                propType: 'string',
                                setter: 'StringSetter',
                                isRequired: true,
                            },
                            {
                                name: 'valueType',
                                title: { label: 'valueType', tip: '数据类型' },
                                display: 'inline',
                                propType: { type: 'oneOfType', value: ['string'] },
                                setter: [{
                                    componentName: 'SelectSetter',
                                    props: {
                                        options: [
                                            { value: 'password', title: '密码输入框' },
                                            { value: 'money', title: '金额输入框' },
                                            { value: 'textarea', title: '文本域' },
                                            { value: 'date', title: '日期' },
                                            { value: 'dateTime', title: '日期时间' },
                                            { value: 'dateWeek', title: '周' },
                                            { value: 'dateMonth', title: '月' },
                                            { value: 'dateQuarter', title: '季度输入' },
                                            { value: 'dateYear', title: '年份输入' },
                                            { value: 'dateRange', title: '日期区间' },
                                            { value: 'dateTimeRange', title: '日期时间区间' },
                                            { value: 'time', title: '时间' },
                                            { value: 'timeRange', title: '时间区间' },
                                            { value: 'text', title: '文本' },
                                            { value: 'select', title: '下拉框' },
                                            { value: 'treeSelect', title: '树形下拉框' },
                                            { value: 'checkbox', title: '多选框' },
                                            { value: 'rate', title: '星级组件' },
                                            { value: 'radio', title: '单选框' },
                                            { value: 'radioButton', title: '按钮单选框' },
                                            { value: 'progress', title: '进度条' },
                                            { value: 'percent', title: '百分比' },
                                            { value: 'digit', title: '数字输入框' },
                                            { value: 'second', title: '秒格式化' },
                                            { value: 'avatar', title: '头像' },
                                            { value: 'code', title: '代码框' },
                                            { value: 'switch', title: '开关' },
                                            { value: 'fromNow', title: '相对于当前时间' },
                                            { value: 'image', title: '图片' },
                                            { value: 'jsonCode', title: '代码框，但是带了json格式化' },
                                            { value: 'color', title: '颜色选择器' },
                                            { value: 'cascader', title: '级联选择器' },
                                            { value: 'segmented', title: '分段器' },
                                            { value: 'group', title: '分组' },
                                            { value: 'formList', title: '表单列表' },
                                            { value: 'formSet', title: '表单集合' },
                                            { value: 'divider', title: '分割线' },
                                            { value: 'dependency', title: '依赖项' },
                                        ],
                                    },
                                    defaultValue: 'text'
                                }],
                                isRequired: true,
                            },
                            {
                                name: 'dataIndex',
                                title: { label: 'dataIndex', tip: '数据字段' },
                                propType: 'string',
                                setter: 'StringSetter',
                                defaultValue: 'dataIndex_',
                                isRequired: true,
                            },
                            {
                                name: 'key',
                                title: { label: 'key', tip: '一般用于dataIndex重复的情况' },
                                propType: 'string',
                                setter: 'StringSetter',
                                defaultValue: 'key_',
                            },
                            {
                                name: 'tooltip',
                                title: { label: 'tooltip', tip: 'title旁边展示icon' },
                                propType: 'string',
                                setter: 'StringSetter',
                            },
                            {
                                name: 'ellipsis',
                                title: { label: 'ellipsis', tip: '是否自动缩略' },
                                propType: 'bool',
                                setter: 'BoolSetter',
                                initialValue: false,
                            },
                            {
                                name: 'copyable',
                                title: { label: 'copyable', tip: '是否支持复制' },
                                propType: 'bool',
                                setter: 'BoolSetter',
                                initialValue: false,
                            },
                            {
                                name: 'valueEnum',
                                title: { label: 'valueEnum' },
                                propType: {
                                    type: 'oneOfType',
                                    value: ['object', 'func'],
                                },
                                setter: ['JsonSetter', 'FunctionSetter', 'VariableSetter'],
                            },
                            {
                                name: 'fieldProps',
                                title: { label: 'fieldProps', tip: '传给渲染组件的props' },
                                propType: 'func',
                                setter: [{
                                    componentName: 'FunctionSetter',
                                    template: '(form, config) => {}'
                                }, 'VariableSetter'],
                            },
                            {
                                name: 'formItemProps',
                                title: { label: 'formItemProps', tip: '传给Form.Item的props' },
                                propType: 'func',
                                setter: [{
                                    componentName: 'FunctionSetter',
                                    template: '(form, config) => {}'
                                }, 'VariableSetter'],
                            },
                            {
                                name: 'renderText',
                                title: { label: 'renderText' },
                                propType: 'func',
                                setter: [{
                                    componentName: 'FunctionSetter',
                                    template: '(text, record, index, action) => {}'
                                }, 'VariableSetter'],
                            },
                            {
                                name: 'render',
                                title: { label: 'render', tip: '自定义只读模式的dom' },
                                propType: 'func',
                                setter: [
                                    {
                                        componentName: 'SlotSetter',
                                        title: '自定义只读模式的dom',
                                        initialValue: {
                                            type: 'JSSlot',
                                            params: ['text', 'record', 'index', 'action'],
                                            value: [],
                                        },
                                    },
                                    {
                                        componentName: 'FunctionSetter',
                                        props: {
                                            template:
                                                'tableExtraRender(text, record, index, action){\n// 自定义只读模式的dom`}',
                                        },
                                    },
                                    'VariableSetter',
                                ],
                            },
                            {
                                name: 'renderFormItem',
                                title: { label: 'renderFormItem', tip: '渲染查询表单的输入组件' },
                                propType: 'func',
                                setter: [
                                    {
                                        componentName: 'SlotSetter',
                                        title: '自定义编辑模式',
                                        initialValue: {
                                            type: 'JSSlot',
                                            params: ['item', '{type, defaultRender, formItemProps, fieldsProps, ..rest}', 'form'],
                                            value: [],
                                        },
                                    },
                                    {
                                        componentName: 'FunctionSetter',
                                        template: '(item, {type, defaultRender, formItemProps, fieldsProps, ..rest}, form) => {}'
                                    }, 'VariableSetter'],
                            },
                            {
                                name: 'request',
                                title: { label: 'request', tip: '从远程请求网络数据，一般用于选择类组件' },
                                propType: 'func',
                                setter: [{
                                    componentName: 'FunctionSetter',
                                    template: '(params, props) => {\nreturn Promise<{label, value}[]>; }'
                                }, 'VariableSetter'],
                            },
                            {
                                name: 'params',
                                title: { label: 'params', tip: '额外传给request的参数' },
                                propType: 'object',
                                setter: ['JsonSetter', 'VariableSetter'],
                            },
                            {
                                name: 'search',
                                title: {
                                    label: 'search',
                                    tip: '搜索相关',
                                },
                                display: 'inline',
                                initialValue: true,
                                propType: {
                                    type: 'oneOfType',
                                    value: ['obejct', 'bool']
                                },
                                setter: ['BoolSetter', 'JsonSetter'],
                            },
                            {
                                name: 'search.transform',
                                title: {
                                    label: 'search.transform',
                                    tip: '转化值的key，一般用于时间区间的转化',
                                },
                                propType: 'func',
                                setter: 'FunctionSetter',
                            },
                            {
                                name: 'editable',
                                title: {
                                    label: 'editable',
                                    tip: '在编辑表格中是否可编辑',
                                },
                                initialValue: false,
                                setter: 'BoolSetter',
                            },
                            {
                                name: 'width',
                                title: { label: 'width', tip: '列宽度' },
                                propType: 'number',
                                setter: 'NumberSetter',
                                initialValue: 48
                            },
                            {
                                name: 'colSize',
                                title: { label: 'colSize', tip: '一个标单项占用的格子数量' },
                                propType: 'number',
                                setter: 'NumberSetter',
                            },
                            {
                                name: 'initialValue',
                                title: { label: 'initialValue', tip: '查询表单初始值' },
                                propType: 'object',
                                setter: ['JsonSetter', 'VariableSetter'],
                            },
                            {
                                name: 'sorter',
                                title: {
                                    label: 'sorter',
                                    tip: '排序函数，本地排序使用一个函数，需要服务端排序可设为 true',
                                },
                                propType: { type: 'oneOfType', value: ['bool', 'func'] },
                                setter: ['BoolSetter', 'FunctionSetter', 'VariableSetter'],
                            },
                            {
                                name: 'hideInTable',
                                title: { label: 'hideInTable', tip: '在Table中不展示此列' },
                                display: 'inline',
                                setter: 'BoolSetter',
                            },
                            {
                                name: 'hideInForm',
                                title: { label: 'hideInForm', tip: '在Form中不展示此列' },
                                display: 'inline',
                                setter: 'BoolSetter',
                            },
                            {
                                name: 'hideInSearch',
                                title: { label: 'hideInSearch', tip: '在查询表单中不展示此列' },
                                display: 'inline',
                                setter: 'BoolSetter',
                            },
                            {
                                name: 'hideInDescriptions',
                                title: { label: 'hideInDescriptions', tip: '在Descriptions中不展示此列' },
                                display: 'inline',
                                setter: 'BoolSetter',
                            },
                            {
                                name: 'filters',
                                title: {
                                    label: 'filters',
                                    tip: '表头的筛选菜单项',
                                },
                                propType: {
                                    type: 'oneOfType',
                                    value: ['bool', 'func'],
                                },
                                setter: ['BoolSetter', 'FunctionSetter', 'VariableSetter'],
                                initialValue: 'false',
                            },
                            {
                                name: 'onFilter',
                                title: {
                                    label: 'onFilter',
                                    tip: '筛选表单',
                                },
                                propType: 'func',
                                setter: ['FunctionSetter', 'VariableSetter'],
                            },
                            {
                                name: 'disable',
                                title: { label: 'disable', tip: '列设置中disabled的状态' },
                                display: 'inline',
                                setter: 'BoolSetter',
                            },
                        ],
                    },
                },
            },
        },
        initialValue: () => {
            return {
                title: '列标题',
                valueType: 'text',
                dataIndex: 'dataIndex',
            };
        },
    },
};