From 68c364ec33754d857796dbba3b00c14496140f05 Mon Sep 17 00:00:00 2001 From: zjt Date: Wed, 13 Apr 2022 18:10:20 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E8=AF=A6=E6=83=85=E5=A2=9E=E5=8A=A0?= =?UTF-8?q?=E8=A1=A8=E6=A0=BC=E5=B1=95=E7=A4=BA=E9=A1=B9&=E8=A1=A8?= =?UTF-8?q?=E5=8D=95=E9=A1=B9=E5=A4=9A=E9=80=89=E6=94=AF=E6=8C=81=E9=80=9A?= =?UTF-8?q?=E8=BF=87label=E6=90=9C=E7=B4=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .DS_Store | Bin 12292 -> 0 bytes src/components/detail/index.tsx | 4 +- src/components/detail/table/index.less | 23 +++ src/components/detail/table/index.tsx | 142 ++++++++++++++++++ src/components/detail/table/props-types.tsx | 3 + src/components/detail/text/index.tsx | 2 +- .../formFields/select/multiple/index.tsx | 8 +- src/index.tsx | 3 +- 8 files changed, 179 insertions(+), 6 deletions(-) delete mode 100644 .DS_Store create mode 100644 src/components/detail/table/index.less create mode 100644 src/components/detail/table/index.tsx create mode 100644 src/components/detail/table/props-types.tsx diff --git a/.DS_Store b/.DS_Store deleted file mode 100644 index ea4d6d3fc9cd20f1d3fa774edd8bd61f838d772a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 12292 zcmeHNU2GIp6h3F$%1oEG(+YI?>n2di;0?GjPV7}y)(PaPC?>}BFs(Z zp1J3qbMHN8zS%qH+yww^%P0*1H2@&c#i%r!s;2>BVWOVG`q?$36c7jLT1*$+O8^$w zUAmb{>Sl6=^h`#GSWLf=UkYeGeHyT!h5Bl)^FnuZpnwUfK)+|wRlzYj6G7>&Dh%Ax$HgDUn3&-&RXJTG)lpY5C% zb7|bAQx4^-q{CH-I;!Y~80e@IKgPs~#$7t)P)8lmQ3rHqMmIu1K0E2fxHw?kp+OyZ zAn?FU50nwBz=^6okvogL&r{Eh$U7&+VsAITznC1+HOsEA{{}+^g+=$x5`?tdyRl<*{y;rCX!zj=iCGvi5$LwO1?-hf5-xx;Aaz(mfza z8B5)v>awkksvWYeS_4vSZ3O8=Y#cYG`=HM!RFXL!j!FDYT6_}@Ht@OhKZ0>H^vbT?@MsE75M?_&a>uFUKRS~MQP^gZxBp4NLa&^4k zX-RBnS`78j2AkmkjKDaYgwyaUybBlLJ@_2Hf-7(pet@6h7x)#f!5@ei!U8P9Qmn+K z_y8`)8f?HuY{G|e6L#Td?8ZlN5AMZ%cmPwV<1iXHf}{92PT>>yB%Z_<@D!fL7x6Vb zk8k2z_%?ou7x7EHgjaAHui}sR6aMC`Fq8%MR;Qh<@prnrfnxWq4V}6D-|!=o2~9CHq+IM}jaazGxLzhL2_a8-0C!B9Qw ze=)Kzj5Lb@PMBuWOQO|Li6KpxUbtX>B)UAhLLmH0$a^28wiKebfr+k;HiV@D!oA3w zYr<=zQV~Ji>1_^g2up?Z4miCV!||weAEDjpZ4Y;bC17u(cw4ysEm$wX*YG_7^-s7? z@GQm(0%(i?T90dSBgU~6JFpYCVGqGGfxWn&;CT>b4p9S5g6KF-;Bh=bKz#k z&*K?_=}Y)BzJjmg8+eWb_5!|-AK*v$F@Azy;ANclLA5&zQitNz8&Dlhqz&CP28qLf zT?&UmWr<-*{-!ATYrr8&6c1ACFj)CpR^fb-_ikCm&<$PC4xO+K5>(g0Fev#tuz_^W z<`T>R<@AcnG}95P2WjS2ptF=SwfT%}1-=o^`9_%S8{rmuSn1OfVF#_T6*^$+&DV-g z`84MGG;A0m-=t|fAK+_9lh?*?W;I^(jZ{D$PD3i+GM;?*`o@*Y?vm{Bl+YB`%m*{m zO(EGgB{hQ*cp&gV;DNvcfd>K){3jkLp;-&*6M>(r=WqYOK5V?7Q#rZ2GY60}FZ+GN z9!QQEFL7oh5_q8P9ggW8qJ#houvOB!l^zSLy?V@$L7L0^uQ+x<#gYzQx#FxG zPi+_!J*PpNEeg&j4oE_o~uyBkK>8*<9MR{IG(6`ioylsuFjN0 Xsh7&X{zm|Q6cz0M!Tx`5@Be=ROBgB@ diff --git a/src/components/detail/index.tsx b/src/components/detail/index.tsx index 3df4864..7c5371a 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 0000000..6eb2aba --- /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 0000000..568cdbf --- /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={( + + {children} + + )} + > + {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 0000000..1826364 --- /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 8a6d391..4d55a5d 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 991e5bd..c8069ad 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 99c688d..375c4af 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' -- Gitee