tachybase_todo/packages/plugins/import/src/client/useShared.ts
katherinehhh 22498d8fc6
fix( importable-field): incorrect display when moving sort handle (#1613)
* fix: importable-field incorrect display when moving sort

* fix: cascader

---------

Co-authored-by: chenos <chenlinxh@gmail.com>
2023-03-29 00:12:39 +08:00

131 lines
3.9 KiB
TypeScript

import { css } from '@emotion/css';
import type { VoidField } from '@formily/core';
import { useCollection, Cascader } from '@nocobase/client';
import { useTranslation } from 'react-i18next';
import { NAMESPACE } from './constants';
import { useFields } from './useFields';
const INCLUDE_FILE_TYPE = [
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
'application/vnd.ms-excel',
];
export const useShared = () => {
const { t } = useTranslation(NAMESPACE);
const { name } = useCollection();
const fields = useFields(name);
return {
importSettingsSchema: {
type: 'void',
'x-component': 'Grid',
properties: {
explain: {
type: 'string',
title: `{{ t("Import explain", {ns: "${NAMESPACE}"}) }}`,
'x-decorator': 'FormItem',
'x-component': 'Input.TextArea',
},
importColumns: {
type: 'array',
'x-component': 'ArrayItems',
'x-decorator': 'FormItem',
items: {
type: 'object',
properties: {
space: {
type: 'void',
'x-component': 'Space',
'x-component-props': {
className: css`
width: 100%;
& .ant-space-item:nth-child(2) {
flex: 1;
}
`,
},
properties: {
sort: {
type: 'void',
'x-decorator': 'FormItem',
'x-component': 'ArrayItems.SortHandle',
},
dataIndex: {
type: 'array',
'x-decorator': 'FormItem',
'x-component': Cascader,
required: true,
enum: fields,
'x-component-props': {
fieldNames: {
label: 'title',
value: 'name',
children: 'children',
},
changeOnSelect: false,
},
},
remove: {
type: 'void',
'x-decorator': 'FormItem',
'x-component': 'ArrayItems.Remove',
},
},
},
},
},
properties: {
add: {
type: 'void',
title: `{{ t("Add importable field", {ns: "${NAMESPACE}"}) }}`,
'x-component': 'ArrayItems.Addition',
'x-component-props': {
className: css`
border-color: rgb(241, 139, 98);
color: rgb(241, 139, 98);
&.ant-btn-dashed:hover {
border-color: rgb(241, 139, 98);
color: rgb(241, 139, 98);
}
`,
},
},
},
},
},
},
beforeUploadHandler() {
return false;
},
uploadValidator(value, rule) {
if (value.length > 1) {
return {
type: 'error',
message: t('Only one file is allowed to be uploaded'),
};
}
const file = value[0] ?? {};
if (file.size > 10 * 1024 * 1024) {
return {
type: 'error',
message: t('File size cannot exceed 10M'),
};
}
if (!INCLUDE_FILE_TYPE.includes(file.type)) {
return {
type: 'error',
message: t('Please upload the file of Excel'),
};
}
return '';
},
validateUpload(form, submitField: VoidField, deps) {
const [upload] = deps;
submitField.disabled = upload?.length === 0;
submitField.componentProps = {
...submitField.componentProps,
disabled: upload?.length === 0 || form.errors?.length > 0,
};
},
};
};