Skip to content

Commit

Permalink
Merge pull request #589 from xichen1/chaincode-django-model
Browse files Browse the repository at this point in the history
Add Install CC UI and API Call
  • Loading branch information
yeasy authored Jan 17, 2024
2 parents ebc0a62 + 17e6dc7 commit ab4b60f
Show file tree
Hide file tree
Showing 6 changed files with 214 additions and 9 deletions.
4 changes: 2 additions & 2 deletions src/dashboard/src/locales/en-US/Chaincode.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,8 @@ export default {
'app.chainCode.form.install.fail': 'Install chaincode failed',
'app.chainCode.form.install.success': 'Install chaincode succeed',
'app.chainCode.form.install.header.title': 'Install Chaincode',
'app.chaincode.form.install.nodes': 'Please select nodes',
'app.chaincode.form.install.checkNodes': 'Please select nodes',
'app.chainCode.form.install.nodes': 'Please select nodes',
'app.chainCode.form.install.checkNodes': 'Please select nodes',
'app.chainCode.form.approve.fail': 'Approve chaincode failed',
'app.chainCode.form.approve.success': 'Approve chaincode succeed',
'app.chainCode.form.approve.header.title': 'Approve Chaincode',
Expand Down
4 changes: 2 additions & 2 deletions src/dashboard/src/locales/zh-CN/Chaincode.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,8 @@ export default {
'app.chainCode.form.install.fail': '安装链码失败',
'app.chainCode.form.install.success': '安装链码成功',
'app.chainCode.form.install.header.title': '安装链码',
'app.chaincode.form.install.nodes': '请选择节点',
'app.chaincode.form.install.checkNodes': '请选择节点',
'app.chainCode.form.install.nodes': '请选择节点',
'app.chainCode.form.install.checkNodes': '请选择节点',
'app.chainCode.form.approve.fail': '批准链码失败',
'app.chainCode.form.approve.success': '批准链码成功',
'app.chainCode.form.approve.header.title': '批准链码',
Expand Down
8 changes: 7 additions & 1 deletion src/dashboard/src/models/chaincode.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { listChainCode, uploadChainCode } from '@/services/chaincode';
import { listChainCode, uploadChainCode, installChainCode } from '@/services/chaincode';

export default {
namespace: 'chainCode',
Expand Down Expand Up @@ -36,6 +36,12 @@ export default {
callback(response);
}
},
*installChainCode({ payload, callback }, { call }) {
const response = yield call(installChainCode, payload);
if (callback) {
callback(response);
}
},
},
reducers: {
save(state, { payload }) {
Expand Down
67 changes: 63 additions & 4 deletions src/dashboard/src/pages/ChainCode/ChainCode.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import StandardTable from '@/components/StandardTable';
import { Form } from 'antd/lib/index';
import ApproveForm from '@/pages/ChainCode/forms/ApproveForm';
import styles from './styles.less';
import InstallForm from './forms/InstallForm';

const FormItem = Form.Item;

Expand Down Expand Up @@ -165,6 +166,7 @@ class ChainCode extends PureComponent {
formValues: {},
newFile: '',
modalVisible: false,
installModalVisible: false,
approveModalVisible: false,
};

Expand Down Expand Up @@ -217,12 +219,24 @@ class ChainCode extends PureComponent {
});
};

handleInstallModalVisible = visible => {
this.setState({
installModalVisible: !!visible,
});
};

handleApproveModalVisible = visible => {
this.setState({
approveModalVisible: !!visible,
});
};

setOperatedRow = row => {
this.setState({
operatedRow: row,
});
};

handleUpload = (values, callback) => {
const { dispatch } = this.props;
const formData = new FormData();
Expand All @@ -240,6 +254,21 @@ 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);
};
Expand All @@ -249,12 +278,20 @@ class ChainCode extends PureComponent {
};

render() {
const { selectedRows, modalVisible, newFile, approveModalVisible } = this.state;
const {
selectedRows,
modalVisible,
newFile,
approveModalVisible,
installModalVisible,
operatedRow,
} = this.state;
const {
chainCode: { chainCodes, paginations },
loadingChainCodes,
intl,
uploading,
installing,
approving,
} = this.props;

Expand All @@ -269,6 +306,15 @@ 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,
Expand Down Expand Up @@ -313,7 +359,7 @@ class ChainCode extends PureComponent {
id: 'app.chainCode.table.header.packageID',
defaultMessage: 'PackageID',
}),
dataIndex: 'packageID',
dataIndex: 'package_id',
ellipsis: true,
},
{
Expand Down Expand Up @@ -345,7 +391,12 @@ class ChainCode extends PureComponent {
// eslint-disable-next-line no-unused-vars
render: (text, record) => (
<Fragment>
<a>
<a
onClick={() => {
this.handleInstallModalVisible(true);
this.setOperatedRow(record);
}}
>
{intl.formatMessage({
id: 'app.chainCode.table.operate.install',
defaultMessage: 'Install',
Expand Down Expand Up @@ -374,7 +425,14 @@ class ChainCode extends PureComponent {
// TODO: remove dummy data after API is connected
const dummyList = [
{
packageID: 'cc1v1:cc7bb5f50a53c207f68d37e9423c32f968083282e5ffac00d41ffc5768dc1873',
package_id: 'cc1v1:cc7bb5f50a53c207f68d37e9423c32f968083282e5ffac00d41ffc5768dc1873',
description: 'chaincode demo',
version: 'v1',
language: 'golang',
approve: false,
},
{
package_id: 'cc2v1:cc7bb5f50a53c207f68d37e9423c32f968083282e5ffac00d41ffc5768dc1873',
description: 'chaincode demo',
version: 'v1',
language: 'golang',
Expand Down Expand Up @@ -421,6 +479,7 @@ class ChainCode extends PureComponent {
/>
</div>
</Card>
<InstallForm {...installFormProps} />
<ApproveForm {...approveFormProps} />
<UploadChainCode {...formProps} />
</PageHeaderWrapper>
Expand Down
133 changes: 133 additions & 0 deletions src/dashboard/src/pages/ChainCode/forms/InstallForm.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,133 @@
import React, { useState, useEffect } from 'react';
import { injectIntl, useIntl } from 'umi';
import { Modal, message, Select, Form, Tag } from 'antd';
import { listNode } from '@/services/node';
import styles from '../styles.less';

const FormItem = Form.Item;

const InstallForm = props => {
const [form] = Form.useForm();
const intl = useIntl();
const [nodes, setNodes] = useState();

const {
installModalVisible,
handleInstallModalVisible,
installing,
fetchChainCodes,
handleInstall,
} = props;

useEffect(() => {
async function fecthData() {
const response = await listNode();
setNodes(response.data.data.map(node => ({ label: node.name, value: node.id })));
}
fecthData();
}, []);

const installCallback = response => {
if (response.status !== 'successful') {
message.error(
intl.formatMessage({
id: 'app.chainCode.form.install.fail',
defaultMessage: 'Install chaincode failed',
})
);
} else {
message.success(
intl.formatMessage({
id: 'app.chainCode.form.install.success',
defaultMessage: 'Install chaincode succeed',
})
);
form.resetFields();
handleInstallModalVisible(false);
fetchChainCodes();
}
};

const onSubmit = () => {
form.submit();
};

const onFinish = values => {
handleInstall(values, installCallback);
};

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 (
<Tag
color="cyan"
onMouseDown={onPreventMouseDown}
closable={closable}
onClose={onClose}
style={{ marginRight: 3 }}
>
{label}
</Tag>
);
};

return (
<Modal
destroyOnClose
title={intl.formatMessage({
id: 'app.chainCode.form.install.header.title',
defaultMessage: 'Install Chaincode',
})}
confirmLoading={installing}
open={installModalVisible}
onOk={onSubmit}
onCancel={() => handleInstallModalVisible(false)}
>
<Form onFinish={onFinish} form={form} preserve={false}>
<FormItem
{...formItemLayout}
label={intl.formatMessage({
id: 'app.chainCode.form.install.nodes',
defaultMessage: 'Please select node',
})}
name="node"
rules={[
{
required: true,
message: intl.formatMessage({
id: 'app.chainCode.form.install.nodes',
defaultMessage: 'Please select node',
}),
},
]}
>
<Select
options={nodes}
tagRender={tagRender}
initialvalues={[]}
popupClassName={styles.dropdownClassName}
/>
</FormItem>
</Form>
</Modal>
);
};

export default injectIntl(InstallForm);
7 changes: 7 additions & 0 deletions src/dashboard/src/services/chaincode.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,3 +12,10 @@ export async function uploadChainCode(params) {
body: params,
});
}

export async function installChainCode(params) {
return request('/api/v1/chaincodes/installation', {
method: 'POST',
body: params,
});
}

0 comments on commit ab4b60f

Please sign in to comment.