diff --git a/src/dashboard/src/pages/ChainCode/ChainCode.js b/src/dashboard/src/pages/ChainCode/ChainCode.js index 176665a0..019f3cf6 100644 --- a/src/dashboard/src/pages/ChainCode/ChainCode.js +++ b/src/dashboard/src/pages/ChainCode/ChainCode.js @@ -9,8 +9,8 @@ import PageHeaderWrapper from '@/components/PageHeaderWrapper'; import StandardTable from '@/components/StandardTable'; import { Form } from 'antd/lib/index'; import ApproveForm from '@/pages/ChainCode/forms/ApproveForm'; +import CommitForm from './forms/CommitForm'; import styles from './styles.less'; -import InstallForm from './forms/InstallForm'; const FormItem = Form.Item; @@ -159,6 +159,7 @@ const UploadChainCode = props => { loadingChainCodes: loading.effects['chainCode/listChainCode'], uploading: loading.effects['chainCode/uploadChainCode'], approving: loading.effects['chainCode/approveChainCode'], + committing: loading.effects['chainCode/commitChainCode'], })) class ChainCode extends PureComponent { state = { @@ -166,8 +167,8 @@ class ChainCode extends PureComponent { formValues: {}, newFile: '', modalVisible: false, - installModalVisible: false, approveModalVisible: false, + commitModalVisible: false, }; componentDidMount() { @@ -219,21 +220,15 @@ class ChainCode extends PureComponent { }); }; - handleInstallModalVisible = visible => { - this.setState({ - installModalVisible: !!visible, - }); - }; - handleApproveModalVisible = visible => { this.setState({ approveModalVisible: !!visible, }); }; - setOperatedRow = row => { + handleCommitModalVisible = visible => { this.setState({ - operatedRow: row, + commitModalVisible: !!visible, }); }; @@ -254,21 +249,6 @@ class ChainCode extends PureComponent { }); }; - handleInstall = (values, callback) => { - const { dispatch } = this.props; - const { operatedRow } = this.state; - const { node } = values; - const formData = new FormData(); - formData.append('peer_uuid', node); - formData.append('chaincode_package', operatedRow.package_id); - - dispatch({ - type: 'chainCode/installChainCode', - payload: formData, - callback, - }); - }; - onUploadChainCode = () => { this.handleModalVisible(true); }; @@ -283,16 +263,15 @@ class ChainCode extends PureComponent { modalVisible, newFile, approveModalVisible, - installModalVisible, - operatedRow, + commitModalVisible, } = this.state; const { chainCode: { chainCodes, paginations }, loadingChainCodes, intl, uploading, - installing, approving, + committing, } = this.props; const formProps = { @@ -306,15 +285,6 @@ class ChainCode extends PureComponent { intl, }; - const installFormProps = { - installModalVisible, - handleInstallModalVisible: this.handleInstallModalVisible, - fetchChainCodes: this.fetchChainCodes, - installing, - operatedRow, - handleInstall: this.handleInstall, - }; - const approveFormProps = { approveModalVisible, handleApproveModalVisible: this.handleApproveModalVisible, @@ -324,6 +294,15 @@ class ChainCode extends PureComponent { intl, }; + const commitFormProps = { + commitModalVisible, + handleCommitModalVisible: this.handleCommitModalVisible, + fetchChainCodes: this.fetchChainCodes, + committing, + selectedRows: [], + intl, + }; + const menu = record => ( @@ -359,7 +338,7 @@ class ChainCode extends PureComponent { id: 'app.chainCode.table.header.packageID', defaultMessage: 'PackageID', }), - dataIndex: 'package_id', + dataIndex: 'packageID', ellipsis: true, }, { @@ -391,12 +370,7 @@ class ChainCode extends PureComponent { // eslint-disable-next-line no-unused-vars render: (text, record) => ( - { - this.handleInstallModalVisible(true); - this.setOperatedRow(record); - }} - > + {intl.formatMessage({ id: 'app.chainCode.table.operate.install', defaultMessage: 'Install', @@ -410,7 +384,7 @@ class ChainCode extends PureComponent { })} - + this.handleCommitModalVisible(true)}> {intl.formatMessage({ id: 'app.chainCode.table.operate.commit', defaultMessage: 'Commit', @@ -425,14 +399,7 @@ class ChainCode extends PureComponent { // TODO: remove dummy data after API is connected const dummyList = [ { - package_id: 'cc1v1:cc7bb5f50a53c207f68d37e9423c32f968083282e5ffac00d41ffc5768dc1873', - description: 'chaincode demo', - version: 'v1', - language: 'golang', - approve: false, - }, - { - package_id: 'cc2v1:cc7bb5f50a53c207f68d37e9423c32f968083282e5ffac00d41ffc5768dc1873', + packageID: 'cc1v1:cc7bb5f50a53c207f68d37e9423c32f968083282e5ffac00d41ffc5768dc1873', description: 'chaincode demo', version: 'v1', language: 'golang', @@ -479,9 +446,9 @@ class ChainCode extends PureComponent { /> - - + + ); } diff --git a/src/dashboard/src/pages/ChainCode/forms/CommitForm.js b/src/dashboard/src/pages/ChainCode/forms/CommitForm.js new file mode 100644 index 00000000..85d5db6d --- /dev/null +++ b/src/dashboard/src/pages/ChainCode/forms/CommitForm.js @@ -0,0 +1,259 @@ +import React, { useState, useEffect } from 'react'; +import { injectIntl, useIntl } from 'umi'; +import { Modal, message, Select, Form, Tag, Checkbox } from 'antd'; +import StandardTable from '@/components/StandardTable'; +// import { listChannel } from '@/services/channel' +import { listOrganization } from '@/services/organization'; +// import { listApprovedChaincode } from '@/services/chaincode'; +import styles from '../styles.less'; + +const FormItem = Form.Item; +// const initialState = [ +// { label: 'mychannel1', value: 'mychannel1', disabled: true }, +// { label: 'mychannel2', value: 'mychannel2' }, +// { label: 'mychannel3', value: 'mychannel3' }, +// ]; + +const CommitForm = props => { + const [form] = Form.useForm(); + const intl = useIntl(); + const [orgs, setOrgs] = useState(); + const [approvedOrgs, setApprovedOrgs] = useState(); + // const [channels, setChannels] = useState(); + const { + chaincodeName = '', + commitModalVisible, + handleCommit, + handleCommitModalVisible, + Committing, + fetchChainCodes, + selectedRows, + initFlagChange, + } = props; + + useEffect(() => { + async function fecthData() { + // const channelResponse = await listChannel(); + // setChannels(channelResponse.data.data); + const orgResponse = await listOrganization(); + setOrgs(orgResponse.data.data); + } + fecthData(); + }, []); + + const commitCallback = response => { + if (response.status !== 'successful') { + message.error( + intl.formatMessage({ + id: 'app.operator.chainCode.form.commit.fail', + defaultMessage: 'Commit chaincode failed', + }) + ); + } else { + message.success( + intl.formatMessage({ + id: 'app.operator.chainCode.form.commit.success', + defaultMessage: 'Commit chaincode succeed', + }) + ); + form.resetFields(); + handleCommitModalVisible(); + fetchChainCodes(); + } + }; + + const onSubmit = () => { + form.submit(); + }; + + const onFinish = values => { + handleCommit(values, commitCallback); + }; + + const formItemLayout = { + labelCol: { + xs: { span: 24 }, + sm: { span: 11 }, + }, + wrapperCol: { + xs: { span: 24 }, + sm: { span: 12 }, + md: { span: 10 }, + }, + }; + + // eslint-disable-next-line no-shadow + const tagRender = props => { + const { label, closable, onClose } = props; + const onPreventMouseDown = event => { + event.preventDefault(); + event.stopPropagation(); + }; + return ( + + {label} + + ); + }; + + const handleTableChange = pagination => { + const { dispatch } = props; + const { current, pageSize } = pagination; + const params = { + page: current, + per_page: pageSize, + }; + dispatch({ + type: 'chainCode/listChainCode', + payload: params, + }); + }; + + const handleChannelChange = () => { + const filteredOrgs = orgs.map(org => { + // const response = await listApprovedChaincode({ channels_name: value[0], org_name: org["name"] }); + // const chaincode_names = response.data.chaincode_names; + const chaincodeNames = []; + return chaincodeName in chaincodeNames + ? { + name: org.name, + status: 'Approved', + } + : { + name: org.name, + status: 'Unapproved', + }; + }); + setApprovedOrgs(filteredOrgs); + }; + + // const dummyList = [ + // { + // name: 'org1.cello.com', + // status: 'Approved', + // }, + // { + // name: 'org2.cello.com', + // status: 'Approved', + // }, + // { + // name: 'org3.cello.com', + // status: 'Unapproved', + // }, + // ]; + + const dummyChannel = [ + { + id: '89cab0f6-47a8-4335-b217-7ec39cfcf65f', + name: 'channel1', + network: { + id: 'bfb3484d-dc5c-4cc4-8be0-0251eefd2c57', + name: 'test1', + }, + organizations: [ + { + id: '76ebf68b-019f-45ff-abef-67e3a3d1752f', + name: 'org1.cello.com', + }, + ], + create_ts: '2021-12-10T05:52:30.931971Z', + }, + ]; + + const dummyPagination = { + total: 0, + current: 1, + pageSize: 10, + }; + + const columns = [ + { + title: intl.formatMessage({ + id: 'app.operator.chainCode.form.commit.header.name', + defaultMessage: 'Organization Name', + }), + dataIndex: 'name', + }, + { + title: intl.formatMessage({ + id: 'app.operator.chainCode.form.commit.header.status', + defaultMessage: 'Approvement Status', + }), + dataIndex: 'status', + }, + ]; + + return ( + handleCommitModalVisible(false)} + > +
+ +