diff --git a/.DS_Store b/.DS_Store
deleted file mode 100644
index ea4d6d3fc9cd20f1d3fa774edd8bd61f838d772a..0000000000000000000000000000000000000000
Binary files a/.DS_Store and /dev/null differ
diff --git a/src/components/detail/index.tsx b/src/components/detail/index.tsx
index 3df4864a4cb704dbbb96d219d0a0513f385edc23..7c5371a4fbe88bfda485ce74f5ee569c9310a469 100644
--- a/src/components/detail/index.tsx
+++ b/src/components/detail/index.tsx
@@ -6,6 +6,7 @@ import ImportSubformField from './importSubform'
import InfoDetail from './detailInfo'
import ColorDetail from './detailColor'
import CustomFieldComponent from './custom'
+import TableFieldComponent from './table'
export default {
text: TextField,
@@ -15,5 +16,6 @@ export default {
import_subform: ImportSubformField,
detail_info: InfoDetail,
detail_color: ColorDetail,
- custom: CustomFieldComponent
+ custom: CustomFieldComponent,
+ table: TableFieldComponent
}
diff --git a/src/components/detail/table/index.less b/src/components/detail/table/index.less
new file mode 100644
index 0000000000000000000000000000000000000000..6eb2abab27933a985d5de22128ba508fa5f981de
--- /dev/null
+++ b/src/components/detail/table/index.less
@@ -0,0 +1,23 @@
+.ccms-antd-table {
+ &>.ccms-antd-table-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 16px;
+ &>.ccms-antd-table-title {
+ color: #000000d9;
+ font-weight: 500;
+ font-size: 16px;
+ display: flex;
+ &>.ccms-antd-table-title-explain {
+ margin-left: 16px;
+ font-size: 14px;
+ color: #abb7c4;
+ margin-top: 2px;
+ }
+ }
+ &>.ccms-antd-table-tableOperation {
+ margin-left: 16px;
+ }
+ }
+ }
diff --git a/src/components/detail/table/index.tsx b/src/components/detail/table/index.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..568cdbff85756db8746b9b4584c58e0b7b329a51
--- /dev/null
+++ b/src/components/detail/table/index.tsx
@@ -0,0 +1,142 @@
+import React from 'react'
+import { DetailTableField } from 'ccms'
+import {
+ ITableField, TableFieldConfig, ITableColumn,
+ ITableDetailOperationConfirm, ITableDetailOperationModal, ITableDetailRowOperation, ITableDetailRowOperationButton, ITableDetailRowOperationGroup, ITableDetailRowOperationGroupItem, ITableDetailTableOperation, ITableDetailTableOperationButton, ITableDetailTableOperationGroup, ITableDetailTableOperationGroupItem
+} from 'ccms/dist/src/components/detail/table'
+import { Table, Dropdown, Menu, Modal, Space } from 'antd'
+import getALLComponents from '../../tableColumns'
+import CCMS from '../../../main'
+import InterfaceHelper from '../../../util/interface'
+import styles from './index.less'
+
+export const PropsType = (props: TableFieldConfig) => { }
+
+export default class TableFieldComponent extends DetailTableField {
+ CCMS = CCMS
+ getALLComponents = (type: any) => getALLComponents[type]
+ interfaceHelper = new InterfaceHelper()
+
+ renderOperationConfirm = (props: ITableDetailOperationConfirm) => {
+ Modal.confirm({
+ getContainer: () => document.getElementById('ccms-antd') || document.body,
+ title: props.title,
+ okText: props.okText,
+ cancelText: props.cancelText,
+ onOk: () => { props.onOk() },
+ onCancel: () => { props.onCancel() }
+ })
+ }
+
+ renderComponent = (props: ITableField) => {
+ const {
+ title,
+ primary,
+ tableColumns,
+ data,
+ pagination,
+ description
+ } = props
+
+ return (
+
+
({
+ key: index,
+ dataIndex: column.field,
+ title: column.label,
+ align: column.align,
+ render: (value: any, record: { [field: string]: any }, index: number) => column.render(value, record, index)
+ }))}
+ dataSource={data}
+ scroll={{ x: 1000 }}
+ size="middle"
+ pagination={pagination === undefined ? false : {
+ current: pagination.current,
+ pageSize: pagination.pageSize,
+ total: pagination.total,
+ onChange: (page, pageSize) => pagination.onChange(page, pageSize || pagination.pageSize),
+ showSizeChanger: true,
+ showTotal: (total, range) => `第 ${range[0]} - ${range[1]} 条 / 共 ${total} 条`,
+ locale: {
+ items_per_page: '条/页'
+ }
+ }}
+ />
+
+ )
+ }
+
+ renderRowOperationComponent = (props: ITableDetailRowOperation) => {
+ const {
+ children
+ } = props
+ return (
+
+ {children}
+
+ )
+ }
+
+ renderRowOperationButtonComponent = (props: ITableDetailRowOperationButton) => {
+ const {
+ label,
+ onClick
+ } = props
+
+ return onClick()}>{label}
+ }
+
+ renderRowOperationDropdownComponent = (props: ITableDetailRowOperationGroup) => {
+ const {
+ label,
+ children
+ } = props
+ return (
+ node.parentElement || document.body}
+ overlay={(
+
+ )}
+ >
+ {label}
+
+ )
+ }
+
+ renderRowOperationDropdownItemComponent = (props: ITableDetailRowOperationGroupItem) => {
+ const {
+ label,
+ disabled,
+ onClick
+ } = props
+ return (
+ onClick()}>{label}
+ )
+ }
+
+ renderOperationModal = (props: ITableDetailOperationModal) => {
+ const {
+ title,
+ visible,
+ children,
+ onClose
+ } = props
+
+ return (
+
+ {children}
+
+ )
+ }
+}
diff --git a/src/components/detail/table/props-types.tsx b/src/components/detail/table/props-types.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..1826364adf2cd5bd7e009f96b452ac57235d0406
--- /dev/null
+++ b/src/components/detail/table/props-types.tsx
@@ -0,0 +1,3 @@
+import { ITable, ITableColumn, ITableStepOperationColumn, ITableStepOperationColumnButton, ITableStepOperationColumnGroup, ITableStepOperationColumnGroupItem, ITableStepOperationColumnConfirm, ITableStepOperationModal } from 'ccms/dist/src/steps/table'
+
+export const PropsType = (props: ITable ) => { };
diff --git a/src/components/detail/text/index.tsx b/src/components/detail/text/index.tsx
index 8a6d3911f904d5ff5c807b0b63c093bfdd9331de..4d55a5d559dd7bfdac42583f16842e73776b81af 100644
--- a/src/components/detail/text/index.tsx
+++ b/src/components/detail/text/index.tsx
@@ -2,7 +2,7 @@ import React from 'react'
import { DetailTextField } from 'ccms'
import { ITextField, TextFieldConfig } from 'ccms/dist/src/components/detail/text'
-export const PropsType = (props: TextFieldConfig) => {}
+export const PropsType = (props: TextFieldConfig) => { }
export default class TextFieldComponent extends DetailTextField {
renderComponent = (props: ITextField) => {
diff --git a/src/components/formFields/select/multiple/index.tsx b/src/components/formFields/select/multiple/index.tsx
index 991e5bdf214b5faec93980fd0c5af53892f2c182..c8069ad4cd947a8b7108a4c969f1da557ea988c8 100644
--- a/src/components/formFields/select/multiple/index.tsx
+++ b/src/components/formFields/select/multiple/index.tsx
@@ -5,7 +5,7 @@ import { ISelectMultipleField, SelectMultipleFieldConfig } from 'ccms/dist/src/c
import InterfaceHelper from '../../../../util/interface'
export default class SelectSingleFieldComponent extends SelectMultipleField {
interfaceHelper = new InterfaceHelper()
-
+
renderDorpdownComponent = (props: ISelectMultipleField) => {
const {
value,
@@ -16,13 +16,15 @@ export default class SelectSingleFieldComponent extends SelectMultipleField {
readonly,
placeholder
} = props
-
+
return (
)
diff --git a/src/index.tsx b/src/index.tsx
index 99c688d96eebb91a2df556c0a8c43ef628d93e8b..375c4af431f513a3b2f45e5090f93ce85bbe33ac 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -13,4 +13,5 @@ export { default as Table } from './steps/table'
export { default as Fetch } from './steps/fetch'
export { default as DetailStep } from './steps/detail'
export { default as DetailGroupField } from './components/detail/group'
-export { default as DetailTextField } from './components/detail/text'
\ No newline at end of file
+export { default as DetailTextField } from './components/detail/text'
+export { default as DetailTableField } from './components/detail/table'