|
1 | 1 | import React, { useState, useEffect } from 'react'; |
2 | 2 | import { injectIntl, useIntl } from 'umi'; |
3 | | -import { Modal, message, Select, Form, Tag, Checkbox } from 'antd'; |
4 | | -import StandardTable from '@/components/StandardTable'; |
5 | | -// import { listChannel } from '@/services/channel' |
6 | | -import { listOrganization } from '@/services/organization'; |
7 | | -// import { listApprovedChaincode } from '@/services/chaincode'; |
| 3 | +import { Modal, message, Select, Form, Tag, Checkbox, Input } from 'antd'; |
| 4 | +import { listChannel } from '@/services/channel'; |
8 | 5 | import styles from '../styles.less'; |
9 | 6 |
|
10 | 7 | const FormItem = Form.Item; |
11 | | -// const initialState = [ |
12 | | -// { label: 'mychannel1', value: 'mychannel1', disabled: true }, |
13 | | -// { label: 'mychannel2', value: 'mychannel2' }, |
14 | | -// { label: 'mychannel3', value: 'mychannel3' }, |
15 | | -// ]; |
16 | 8 |
|
17 | 9 | const CommitForm = props => { |
18 | 10 | const [form] = Form.useForm(); |
19 | 11 | const intl = useIntl(); |
20 | | - const [orgs, setOrgs] = useState(); |
21 | | - const [approvedOrgs, setApprovedOrgs] = useState(); |
22 | | - // const [channels, setChannels] = useState(); |
| 12 | + const [channels, setChannels] = useState(); |
23 | 13 | const { |
24 | | - chaincodeName = '', |
25 | 14 | commitModalVisible, |
26 | 15 | handleCommit, |
27 | 16 | handleCommitModalVisible, |
28 | | - Committing, |
| 17 | + committing, |
29 | 18 | fetchChainCodes, |
30 | | - selectedRows, |
31 | 19 | initFlagChange, |
32 | 20 | } = props; |
33 | 21 |
|
34 | 22 | useEffect(() => { |
35 | | - async function fecthData() { |
36 | | - // const channelResponse = await listChannel(); |
37 | | - // setChannels(channelResponse.data.data); |
38 | | - const orgResponse = await listOrganization(); |
39 | | - setOrgs(orgResponse.data.data); |
| 23 | + async function fetchData() { |
| 24 | + try { |
| 25 | + const response = await listChannel(); |
| 26 | + const newChannels = Object.keys(response.data.data).map(item => ({ |
| 27 | + label: response.data.data[item].name, |
| 28 | + value: response.data.data[item].name, |
| 29 | + })); |
| 30 | + setChannels(newChannels); |
| 31 | + } catch (error) { |
| 32 | + console.error('Failed to fetch data:', error); |
| 33 | + } |
40 | 34 | } |
41 | | - fecthData(); |
| 35 | + fetchData(); |
42 | 36 | }, []); |
43 | 37 |
|
44 | 38 | const commitCallback = response => { |
@@ -102,155 +96,146 @@ const CommitForm = props => { |
102 | 96 | ); |
103 | 97 | }; |
104 | 98 |
|
105 | | - const handleTableChange = pagination => { |
106 | | - const { dispatch } = props; |
107 | | - const { current, pageSize } = pagination; |
108 | | - const params = { |
109 | | - page: current, |
110 | | - per_page: pageSize, |
111 | | - }; |
112 | | - dispatch({ |
113 | | - type: 'chainCode/listChainCode', |
114 | | - payload: params, |
115 | | - }); |
116 | | - }; |
117 | | - |
118 | | - const handleChannelChange = () => { |
119 | | - const filteredOrgs = orgs.map(org => { |
120 | | - // const response = await listApprovedChaincode({ channels_name: value[0], org_name: org["name"] }); |
121 | | - // const chaincode_names = response.data.chaincode_names; |
122 | | - const chaincodeNames = []; |
123 | | - return chaincodeName in chaincodeNames |
124 | | - ? { |
125 | | - name: org.name, |
126 | | - status: 'Approved', |
127 | | - } |
128 | | - : { |
129 | | - name: org.name, |
130 | | - status: 'Unapproved', |
131 | | - }; |
132 | | - }); |
133 | | - setApprovedOrgs(filteredOrgs); |
134 | | - }; |
135 | | - |
136 | | - // const dummyList = [ |
137 | | - // { |
138 | | - // name: 'org1.cello.com', |
139 | | - // status: 'Approved', |
140 | | - // }, |
141 | | - // { |
142 | | - // name: 'org2.cello.com', |
143 | | - // status: 'Approved', |
144 | | - // }, |
145 | | - // { |
146 | | - // name: 'org3.cello.com', |
147 | | - // status: 'Unapproved', |
148 | | - // }, |
149 | | - // ]; |
150 | | - |
151 | | - const dummyChannel = [ |
152 | | - { |
153 | | - id: '89cab0f6-47a8-4335-b217-7ec39cfcf65f', |
154 | | - name: 'channel1', |
155 | | - network: { |
156 | | - id: 'bfb3484d-dc5c-4cc4-8be0-0251eefd2c57', |
157 | | - name: 'test1', |
158 | | - }, |
159 | | - organizations: [ |
160 | | - { |
161 | | - id: '76ebf68b-019f-45ff-abef-67e3a3d1752f', |
162 | | - name: 'org1.cello.com', |
163 | | - }, |
164 | | - ], |
165 | | - create_ts: '2021-12-10T05:52:30.931971Z', |
166 | | - }, |
167 | | - ]; |
168 | | - |
169 | | - const dummyPagination = { |
170 | | - total: 0, |
171 | | - current: 1, |
172 | | - pageSize: 10, |
173 | | - }; |
174 | | - |
175 | | - const columns = [ |
176 | | - { |
177 | | - title: intl.formatMessage({ |
178 | | - id: 'app.operator.chainCode.form.commit.header.name', |
179 | | - defaultMessage: 'Organization Name', |
180 | | - }), |
181 | | - dataIndex: 'name', |
182 | | - }, |
183 | | - { |
184 | | - title: intl.formatMessage({ |
185 | | - id: 'app.operator.chainCode.form.commit.header.status', |
186 | | - defaultMessage: 'Approvement Status', |
187 | | - }), |
188 | | - dataIndex: 'status', |
189 | | - }, |
190 | | - ]; |
191 | | - |
192 | 99 | return ( |
193 | 100 | <Modal |
194 | 101 | destroyOnClose |
195 | 102 | title={intl.formatMessage({ |
196 | 103 | id: 'app.operator.chainCode.form.commit.header.title', |
197 | 104 | defaultMessage: 'Commit Chaincode', |
198 | 105 | })} |
199 | | - confirmLoading={Committing} |
| 106 | + confirmLoading={committing} |
200 | 107 | open={commitModalVisible} |
201 | 108 | onOk={onSubmit} |
202 | 109 | onCancel={() => handleCommitModalVisible(false)} |
203 | 110 | > |
204 | | - <Form onFinish={onFinish} form={form} preserve={false}> |
| 111 | + <Form |
| 112 | + onFinish={onFinish} |
| 113 | + form={form} |
| 114 | + preserve={false} |
| 115 | + initialValues={{ |
| 116 | + initFlag: false, |
| 117 | + }} |
| 118 | + > |
205 | 119 | <FormItem |
206 | 120 | {...formItemLayout} |
207 | 121 | label={intl.formatMessage({ |
208 | 122 | id: 'app.operator.chainCode.form.commit.channels', |
209 | | - defaultMessage: 'Please select channels', |
| 123 | + defaultMessage: 'Please select channel', |
210 | 124 | })} |
211 | | - name="channels" |
| 125 | + name="channel" |
| 126 | + rules={[ |
| 127 | + { |
| 128 | + required: true, |
| 129 | + message: intl.formatMessage({ |
| 130 | + id: 'app.operator.chainCode.form.commit.channels', |
| 131 | + defaultMessage: 'Please select channel', |
| 132 | + }), |
| 133 | + }, |
| 134 | + ]} |
212 | 135 | > |
213 | 136 | <Select |
214 | | - mode="multiple" |
215 | | - // options={channels} |
216 | | - onChange={handleChannelChange} |
217 | | - options={dummyChannel.map(c => { |
218 | | - return { |
219 | | - value: c.name, |
220 | | - label: c.name, |
221 | | - }; |
222 | | - })} |
| 137 | + options={channels} |
223 | 138 | tagRender={tagRender} |
224 | 139 | dropdownClassName={styles.dropdownClassName} |
225 | 140 | /> |
226 | 141 | </FormItem> |
227 | 142 | <FormItem |
228 | 143 | {...formItemLayout} |
229 | 144 | label={intl.formatMessage({ |
230 | | - id: 'app.operator.chainCode.form.initFlag', |
| 145 | + id: 'app.chainCode.form.approve.specifyName', |
| 146 | + defaultMessage: 'Name for chaincode', |
| 147 | + })} |
| 148 | + name="name" |
| 149 | + rules={[ |
| 150 | + { |
| 151 | + required: true, |
| 152 | + message: intl.formatMessage({ |
| 153 | + id: 'app.chainCode.form.approve.specifyName', |
| 154 | + defaultMessage: 'Name for chaincode', |
| 155 | + }), |
| 156 | + }, |
| 157 | + ]} |
| 158 | + > |
| 159 | + <Input |
| 160 | + placeholder={intl.formatMessage({ |
| 161 | + id: 'app.chainCode.form.approve.name', |
| 162 | + defaultMessage: 'Name', |
| 163 | + })} |
| 164 | + /> |
| 165 | + </FormItem> |
| 166 | + <FormItem |
| 167 | + {...formItemLayout} |
| 168 | + label={intl.formatMessage({ |
| 169 | + id: 'app.chainCode.form.approve.version', |
| 170 | + defaultMessage: 'Version', |
| 171 | + })} |
| 172 | + name="version" |
| 173 | + rules={[ |
| 174 | + { |
| 175 | + required: true, |
| 176 | + message: intl.formatMessage({ |
| 177 | + id: 'app.chainCode.form.approve.version.required', |
| 178 | + defaultMessage: 'Please input version', |
| 179 | + }), |
| 180 | + }, |
| 181 | + ]} |
| 182 | + > |
| 183 | + <Input |
| 184 | + placeholder={intl.formatMessage({ |
| 185 | + id: 'app.chainCode.form.approve.version.placeholder', |
| 186 | + defaultMessage: 'Version', |
| 187 | + })} |
| 188 | + /> |
| 189 | + </FormItem> |
| 190 | + <FormItem |
| 191 | + {...formItemLayout} |
| 192 | + label={intl.formatMessage({ |
| 193 | + id: 'app.chainCode.form.approve.sequence', |
| 194 | + defaultMessage: 'Sequence', |
| 195 | + })} |
| 196 | + name="sequence" |
| 197 | + rules={[ |
| 198 | + { |
| 199 | + required: true, |
| 200 | + message: intl.formatMessage({ |
| 201 | + id: 'app.chainCode.form.approve.sequence.required', |
| 202 | + defaultMessage: 'Please input sequence', |
| 203 | + }), |
| 204 | + }, |
| 205 | + ]} |
| 206 | + > |
| 207 | + <Input |
| 208 | + placeholder={intl.formatMessage({ |
| 209 | + id: 'app.chainCode.form.approve.sequence.placeholder', |
| 210 | + defaultMessage: 'Sequence', |
| 211 | + })} |
| 212 | + /> |
| 213 | + </FormItem> |
| 214 | + <FormItem |
| 215 | + {...formItemLayout} |
| 216 | + label={intl.formatMessage({ |
| 217 | + id: 'app.chainCode.form.approve.endorsement_policy', |
| 218 | + defaultMessage: 'Endorsement Policy', |
| 219 | + })} |
| 220 | + name="policy" |
| 221 | + > |
| 222 | + <Input |
| 223 | + placeholder={intl.formatMessage({ |
| 224 | + id: 'app.chainCode.form.approve.policy.placeholder', |
| 225 | + defaultMessage: 'Policy (optional)', |
| 226 | + })} |
| 227 | + /> |
| 228 | + </FormItem> |
| 229 | + <FormItem |
| 230 | + {...formItemLayout} |
| 231 | + label={intl.formatMessage({ |
| 232 | + id: 'app.chainCode.form.initFlag', |
231 | 233 | defaultMessage: '--init-required flag', |
232 | 234 | })} |
233 | 235 | name="initFlag" |
234 | 236 | > |
235 | 237 | <Checkbox onChange={initFlagChange} /> |
236 | 238 | </FormItem> |
237 | | - <div className={styles.tableList}> |
238 | | - <StandardTable |
239 | | - selectedRows={selectedRows} |
240 | | - rowKey="id" |
241 | | - // data={{ |
242 | | - // list: chainCodes, |
243 | | - // pagination, |
244 | | - // }} |
245 | | - data={{ |
246 | | - // list: dummyList, |
247 | | - list: approvedOrgs, |
248 | | - pagination: dummyPagination, |
249 | | - }} |
250 | | - columns={columns} |
251 | | - onChange={handleTableChange} |
252 | | - /> |
253 | | - </div> |
254 | 239 | </Form> |
255 | 240 | </Modal> |
256 | 241 | ); |
|
0 commit comments