This is an automated email from the ASF dual-hosted git repository. juzhiyuan pushed a commit to branch feat-improve in repository https://gitbox.apache.org/repos/asf/apisix-dashboard.git
commit bab7e1d6fc3c3069efd7bf9049d1f4fb0b99dfaf Author: juzhiyuan <[email protected]> AuthorDate: Thu Feb 4 16:40:57 2021 +0800 style: format codes --- web/cypress/fixtures/export-route-dataset.json | 305 +++++++++++---------- web/cypress/fixtures/plugin-list.json | 5 +- .../plugin/create-edit-delete-plugin.spec.js | 20 +- .../integration/plugin/schema-smocktest.spec.js | 2 +- ...an-skip-upstream-when-select-service-id.spec.js | 4 +- .../route/create-route-with-upstream.spec.js | 5 +- .../integration/route/import_export_route.spec.js | 29 +- web/cypress/integration/route/online-debug.spec.js | 4 +- .../service/create-edit-delete-service.spec.js | 4 +- .../settings/settings-smoketest.spec.js | 2 +- web/cypress/support/commands.js | 10 +- web/scripts/verifyCommit.js | 10 +- web/src/components/Upstream/UpstreamForm.tsx | 224 +++++++-------- web/src/helpers.tsx | 3 +- web/src/pages/Route/Create.tsx | 13 +- .../Route/components/CreateStep4/CreateStep4.tsx | 7 +- web/src/pages/Route/components/Step1/MetaView.tsx | 3 +- .../Route/components/Step2/RequestRewriteView.tsx | 2 +- web/src/pages/Service/Create.tsx | 22 +- 19 files changed, 355 insertions(+), 319 deletions(-) diff --git a/web/cypress/fixtures/export-route-dataset.json b/web/cypress/fixtures/export-route-dataset.json index 3e3cb23..46d53c0 100644 --- a/web/cypress/fixtures/export-route-dataset.json +++ b/web/cypress/fixtures/export-route-dataset.json @@ -1,147 +1,160 @@ { - "jsonFile": { - "components": {}, - "info": { - "title": "RoutesExport", - "version": "3.0.0" - }, - "openapi": "3.0.0", - "paths": { - "/{params}": { - "get": { - "operationId": "route_name_0GET", - "parameters": [{ - "description": "params in path", - "in": "path", - "name": "params", - "required": true, - "schema": { - "type": "string" - } - }], - "requestBody": {}, - "responses": { - "default": { - "description": "" - } - }, - "x-apisix-enable_websocket": false, - "x-apisix-plugins": {}, - "x-apisix-priority": 0, - "x-apisix-status": 1, - "x-apisix-upstream": { - "nodes": [{ - "host": "1.1.1.1", - "port": 80, - "weight": 1 - }], - "timeout": { - "connect": 6000, - "read": 6000, - "send": 6000 - }, - "type": "roundrobin", - "pass_host": "pass" - }, - "x-apisix-vars": [] - } - } - } - }, - "yamlFile": { - "components": {}, - "info": { - "title": "RoutesExport", - "version": "3.0.0" - }, - "openapi": "3.0.0", - "paths": { - "/{params}": { - "get": { - "operationId": "route_name_0GET", - "parameters": [{ - "description": "params in path", - "in": "path", - "name": "params", - "required": true, - "schema": { - "type": "string" - } - }], - "requestBody": {}, - "responses": { - "default": { - "description": "" - } - }, - "x-apisix-enable_websocket": false, - "x-apisix-plugins": {}, - "x-apisix-priority": 0, - "x-apisix-status": 1, - "x-apisix-upstream": { - "nodes": [{ - "host": "1.1.1.1", - "port": 80, - "weight": 1 - }], - "timeout": { - "connect": 6000, - "read": 6000, - "send": 6000 - }, - "type": "roundrobin", - "pass_host": "pass" - }, - "x-apisix-vars": [] - } - }, - "/{params}-APISIX-REPEAT-URI-2": { - "get": { - "operationId": "route_name_1GET", - "parameters": [{ - "description": "params in path", - "in": "path", - "name": "params", - "required": true, - "schema": { - "type": "string" - } - }, { - "description": "params in path", - "in": "path", - "name": "params", - "required": true, - "schema": { - "type": "string" - } - }], - "requestBody": {}, - "responses": { - "default": { - "description": "" - } - }, - "x-apisix-enable_websocket": false, - "x-apisix-plugins": {}, - "x-apisix-priority": 0, - "x-apisix-status": 1, - "x-apisix-upstream": { - "nodes": [{ - "host": "2.2.2.2", - "port": 80, - "weight": 1 - }], - "timeout": { - "connect": 6000, - "read": 6000, - "send": 6000 - }, - "type": "roundrobin", - "pass_host": "pass" - }, - "x-apisix-vars": [] - } - } - } - } -} \ No newline at end of file + "jsonFile": { + "components": {}, + "info": { + "title": "RoutesExport", + "version": "3.0.0" + }, + "openapi": "3.0.0", + "paths": { + "/{params}": { + "get": { + "operationId": "route_name_0GET", + "parameters": [ + { + "description": "params in path", + "in": "path", + "name": "params", + "required": true, + "schema": { + "type": "string" + } + } + ], + "requestBody": {}, + "responses": { + "default": { + "description": "" + } + }, + "x-apisix-enable_websocket": false, + "x-apisix-plugins": {}, + "x-apisix-priority": 0, + "x-apisix-status": 1, + "x-apisix-upstream": { + "nodes": [ + { + "host": "1.1.1.1", + "port": 80, + "weight": 1 + } + ], + "timeout": { + "connect": 6000, + "read": 6000, + "send": 6000 + }, + "type": "roundrobin", + "pass_host": "pass" + }, + "x-apisix-vars": [] + } + } + } + }, + "yamlFile": { + "components": {}, + "info": { + "title": "RoutesExport", + "version": "3.0.0" + }, + "openapi": "3.0.0", + "paths": { + "/{params}": { + "get": { + "operationId": "route_name_0GET", + "parameters": [ + { + "description": "params in path", + "in": "path", + "name": "params", + "required": true, + "schema": { + "type": "string" + } + } + ], + "requestBody": {}, + "responses": { + "default": { + "description": "" + } + }, + "x-apisix-enable_websocket": false, + "x-apisix-plugins": {}, + "x-apisix-priority": 0, + "x-apisix-status": 1, + "x-apisix-upstream": { + "nodes": [ + { + "host": "1.1.1.1", + "port": 80, + "weight": 1 + } + ], + "timeout": { + "connect": 6000, + "read": 6000, + "send": 6000 + }, + "type": "roundrobin", + "pass_host": "pass" + }, + "x-apisix-vars": [] + } + }, + "/{params}-APISIX-REPEAT-URI-2": { + "get": { + "operationId": "route_name_1GET", + "parameters": [ + { + "description": "params in path", + "in": "path", + "name": "params", + "required": true, + "schema": { + "type": "string" + } + }, + { + "description": "params in path", + "in": "path", + "name": "params", + "required": true, + "schema": { + "type": "string" + } + } + ], + "requestBody": {}, + "responses": { + "default": { + "description": "" + } + }, + "x-apisix-enable_websocket": false, + "x-apisix-plugins": {}, + "x-apisix-priority": 0, + "x-apisix-status": 1, + "x-apisix-upstream": { + "nodes": [ + { + "host": "2.2.2.2", + "port": 80, + "weight": 1 + } + ], + "timeout": { + "connect": 6000, + "read": 6000, + "send": 6000 + }, + "type": "roundrobin", + "pass_host": "pass" + }, + "x-apisix-vars": [] + } + } + } + } +} diff --git a/web/cypress/fixtures/plugin-list.json b/web/cypress/fixtures/plugin-list.json index 278a750..587b28e 100644 --- a/web/cypress/fixtures/plugin-list.json +++ b/web/cypress/fixtures/plugin-list.json @@ -10,10 +10,7 @@ "max_breaker_sec": 10, "unhealthy": { "failures": 1, - "http_statuses": [ - 500, - 503 - ] + "http_statuses": [500, 503] } } } diff --git a/web/cypress/integration/plugin/create-edit-delete-plugin.spec.js b/web/cypress/integration/plugin/create-edit-delete-plugin.spec.js index 8ee3949..65e642c 100644 --- a/web/cypress/integration/plugin/create-edit-delete-plugin.spec.js +++ b/web/cypress/integration/plugin/create-edit-delete-plugin.spec.js @@ -43,7 +43,7 @@ context('Create and Delete Plugin List', () => { // add test plugins cy.get('@cases').then((cases) => { cy.configurePlugins(cases); - }) + }); }); it('should edit the plugin', () => { @@ -64,17 +64,19 @@ context('Create and Delete Plugin List', () => { it('should delete plugin list', () => { cy.visit('/plugin/list'); cy.get(domSelector.refresh).click(); - cy.get(domSelector.tableCell, { timeout }).should('exist').then(function (rows) { - [...rows].forEach((row) => { - const name = row.innerText; - const cases = this.cases[name] || []; + cy.get(domSelector.tableCell, { timeout }) + .should('exist') + .then(function (rows) { + [...rows].forEach((row) => { + const name = row.innerText; + const cases = this.cases[name] || []; - cases.forEach(() => { - cy.contains(name).siblings().contains('Delete').click({ timeout }); - cy.contains('button', 'Confirm').click(); + cases.forEach(() => { + cy.contains(name).siblings().contains('Delete').click({ timeout }); + cy.contains('button', 'Confirm').click(); + }); }); }); - }); // check if plugin list is empty cy.get(domSelector.empty).should('be.visible'); diff --git a/web/cypress/integration/plugin/schema-smocktest.spec.js b/web/cypress/integration/plugin/schema-smocktest.spec.js index 27e3293..6551052 100644 --- a/web/cypress/integration/plugin/schema-smocktest.spec.js +++ b/web/cypress/integration/plugin/schema-smocktest.spec.js @@ -31,6 +31,6 @@ context('smoke test for plugin schema', () => { cy.get('@cases').then((cases) => { cy.configurePlugins(cases); - }) + }); }); }); diff --git a/web/cypress/integration/route/can-skip-upstream-when-select-service-id.spec.js b/web/cypress/integration/route/can-skip-upstream-when-select-service-id.spec.js index a467e11..c51a516 100644 --- a/web/cypress/integration/route/can-skip-upstream-when-select-service-id.spec.js +++ b/web/cypress/integration/route/can-skip-upstream-when-select-service-id.spec.js @@ -28,7 +28,7 @@ context('Can select service_id skip upstream in route', () => { delete_route_success: 'Delete Route Successfully', submit_success: 'Submit Successfully', delete_success: 'Delete Upstream Successfully', - } + }; const domSelector = { name: '#name', nodes_0_host: '#nodes_0_host', @@ -137,5 +137,3 @@ context('Can select service_id skip upstream in route', () => { cy.get(domSelector.notification).should('contain', data.delete_route_success); }); }); - - diff --git a/web/cypress/integration/route/create-route-with-upstream.spec.js b/web/cypress/integration/route/create-route-with-upstream.spec.js index 9a0f6df..e3a05c6 100644 --- a/web/cypress/integration/route/create-route-with-upstream.spec.js +++ b/web/cypress/integration/route/create-route-with-upstream.spec.js @@ -134,9 +134,6 @@ context('Create Route with Upstream', () => { cy.contains('Upstream').click(); cy.contains(data.upstream_name).siblings().contains('Delete').click(); cy.contains('button', 'Confirm').click(); - cy.get(domSelector.notification).should( - 'contain', - data.delete_upstream_success, - ); + cy.get(domSelector.notification).should('contain', data.delete_upstream_success); }); }); diff --git a/web/cypress/integration/route/import_export_route.spec.js b/web/cypress/integration/route/import_export_route.spec.js index 327be77..72f56c0 100644 --- a/web/cypress/integration/route/import_export_route.spec.js +++ b/web/cypress/integration/route/import_export_route.spec.js @@ -40,7 +40,7 @@ context('import and export routes', () => { 'import-error.txt', ], // Note: export file's name will be end of a timestamp - jsonMask: 'cypress/downloads/*.json', + jsonMask: 'cypress/downloads/*.json', yamlMask: 'cypress/downloads/*.yaml', }; @@ -81,7 +81,7 @@ context('import and export routes', () => { ).should('exist'); } }); - it('should export route: route_name_0, route_name_1', function (){ + it('should export route: route_name_0, route_name_1', function () { cy.visit('/'); cy.contains('Route').click(); @@ -120,7 +120,9 @@ context('import and export routes', () => { cy.log(`found file ${yamlFile}`); cy.log('**confirm downloaded yaml file**'); cy.readFile(yamlFile).then((fileContent) => { - expect(JSON.stringify(yaml.load(fileContent), null, null)).to.equal(JSON.stringify(this.exportFile.yamlFile)); + expect(JSON.stringify(yaml.load(fileContent), null, null)).to.equal( + JSON.stringify(this.exportFile.yamlFile), + ); }); }); }); @@ -128,7 +130,10 @@ context('import and export routes', () => { it('should delete the route', function () { cy.visit('/routes/list'); for (let i = 0; i < 2; i += 1) { - cy.contains(data[`route_name_${i}`]).siblings().contains(componentLocaleUS['component.global.delete']).click(); + cy.contains(data[`route_name_${i}`]) + .siblings() + .contains(componentLocaleUS['component.global.delete']) + .click(); cy.contains('button', componentLocaleUS['component.global.confirm']).click(); cy.get(this.domSelector.notification).should( 'contain', @@ -137,10 +142,10 @@ context('import and export routes', () => { } }); - it('should import route(s) from be test files', function() { + it('should import route(s) from be test files', function () { cy.visit('/'); cy.contains('Route').click(); - + data.uploadRouteFiles.forEach((file) => { // click import button cy.contains(routeLocaleUS['page.route.button.importOpenApi']).click(); @@ -155,15 +160,21 @@ context('import and export routes', () => { // close modal cy.contains(componentLocaleUS['component.global.cancel']).click(); } else { - cy.get(this.domSelector.notification).should('contain', `${routeLocaleUS['page.route.button.importOpenApi']} ${componentLocaleUS['component.status.success']}`); + cy.get(this.domSelector.notification).should( + 'contain', + `${routeLocaleUS['page.route.button.importOpenApi']} ${componentLocaleUS['component.status.success']}`, + ); cy.get(this.domSelector.notificationCloseIcon).click(); // delete route just imported cy.contains(componentLocaleUS['component.global.delete']).click(); cy.contains(componentLocaleUS['component.global.confirm']).click(); // show delete successfully notification - cy.get(this.domSelector.notification).should('contain', `${componentLocaleUS['component.global.delete']} ${menuLocaleUS['menu.routes']} ${componentLocaleUS['component.status.success']}`); + cy.get(this.domSelector.notification).should( + 'contain', + `${componentLocaleUS['component.global.delete']} ${menuLocaleUS['menu.routes']} ${componentLocaleUS['component.status.success']}`, + ); cy.get(this.domSelector.notificationCloseIcon).click(); } - }) + }); }); }); diff --git a/web/cypress/integration/route/online-debug.spec.js b/web/cypress/integration/route/online-debug.spec.js index 1664241..4e063b2 100644 --- a/web/cypress/integration/route/online-debug.spec.js +++ b/web/cypress/integration/route/online-debug.spec.js @@ -35,8 +35,8 @@ context('Online debug', () => { 'localhost:9000/get?search=v1,sd&number=-1', 'localhost:9000/get?search=1+1', 'localhost:9000/api/commands/submit.html#Requirements?test=apisix.com', - 'localhost:9000/js6/main.jsp?sid=pARQZYHABxkSVdeMvXAAEtfJKbWQocOA&df=mail126_mailmaster#module=mbox.ListModule%7C%7B"filter"' - ] + 'localhost:9000/js6/main.jsp?sid=pARQZYHABxkSVdeMvXAAEtfJKbWQocOA&df=mail126_mailmaster#module=mbox.ListModule%7C%7B"filter"', + ], }; const domSelector = { uriInput: '#debugUri', diff --git a/web/cypress/integration/service/create-edit-delete-service.spec.js b/web/cypress/integration/service/create-edit-delete-service.spec.js index ac7eee3..62b6877 100644 --- a/web/cypress/integration/service/create-edit-delete-service.spec.js +++ b/web/cypress/integration/service/create-edit-delete-service.spec.js @@ -34,7 +34,7 @@ context('create and delete service ', () => { create_service_success: 'Create Service Successfully', edit_service_success: 'Edit Service Successfully', delete_service_success: 'Delete Service Successfully', - } + }; beforeEach(() => { cy.login(); @@ -66,7 +66,7 @@ context('create and delete service ', () => { // Confirm whether the created data is saved. cy.get(domSelector.nodes_0_host).should('value', data.ip1); - cy.get(domSelector.desc).should('value', data.desc1) + cy.get(domSelector.desc).should('value', data.desc1); cy.get(domSelector.name).clear().type(data.service_name2); cy.get(domSelector.desc).clear().type(data.desc2); cy.get(domSelector.nodes_0_host).click(); diff --git a/web/cypress/integration/settings/settings-smoketest.spec.js b/web/cypress/integration/settings/settings-smoketest.spec.js index e7c4617..88f305b 100644 --- a/web/cypress/integration/settings/settings-smoketest.spec.js +++ b/web/cypress/integration/settings/settings-smoketest.spec.js @@ -26,7 +26,7 @@ context('settings page smoke test', () => { validURL: 'https://apisix.apache.org/', fetchURL: 'fetchURL', fetch: '@fetchURL', - } + }; const domSelector = { pageContainer: '.ant-pro-page-container', notificationMsg: '.ant-notification-notice-message', diff --git a/web/cypress/support/commands.js b/web/cypress/support/commands.js index 1a4bdfe..2fb03a7 100644 --- a/web/cypress/support/commands.js +++ b/web/cypress/support/commands.js @@ -91,11 +91,13 @@ Cypress.Commands.add('configurePlugins', (cases) => { multiple: true, }); - cy.get(domSelectors.drawer, { timeout }).invoke('show').within(() => { - cy.contains('Cancel').click({ - force: true, + cy.get(domSelectors.drawer, { timeout }) + .invoke('show') + .within(() => { + cy.contains('Cancel').click({ + force: true, + }); }); - }); } }); }); diff --git a/web/scripts/verifyCommit.js b/web/scripts/verifyCommit.js index b59e3c6..01d2741 100644 --- a/web/scripts/verifyCommit.js +++ b/web/scripts/verifyCommit.js @@ -33,11 +33,11 @@ if (!commitRE.test(msg)) { console.log(); console.error( ` ${chalk.bgRed.white(' ERROR ')} ${chalk.red(`invalid commit message format.`)}\n\n` + - chalk.red( - ` Proper commit message format is required for automated changelog generation. Examples:\n\n`, - ) + - ` ${chalk.green(`feat(compiler): add 'comments' option`)}\n` + - ` ${chalk.green(`fix(v-model): handle events on blur (close #28)`)}\n\n` + chalk.red( + ` Proper commit message format is required for automated changelog generation. Examples:\n\n`, + ) + + ` ${chalk.green(`feat(compiler): add 'comments' option`)}\n` + + ` ${chalk.green(`fix(v-model): handle events on blur (close #28)`)}\n\n`, ); process.exit(1); } diff --git a/web/src/components/Upstream/UpstreamForm.tsx b/web/src/components/Upstream/UpstreamForm.tsx index 36b8bf4..20c9097 100644 --- a/web/src/components/Upstream/UpstreamForm.tsx +++ b/web/src/components/Upstream/UpstreamForm.tsx @@ -22,7 +22,7 @@ import type { FormInstance } from 'antd/es/form'; import { PanelSection } from '@api7-dashboard/ui'; import { transformRequest } from '@/pages/Upstream/transform'; -import { DEFAULT_UPSTREAM } from './constant' +import { DEFAULT_UPSTREAM } from './constant'; enum Type { roundrobin = 'roundrobin', @@ -62,7 +62,7 @@ type Props = { showSelector?: boolean; // FIXME: use proper typing ref?: any; - required: boolean, + required: boolean; }; const removeBtnStyle = { @@ -643,7 +643,7 @@ const UpstreamForm: React.FC<Props> = forwardRef( } }} > - {Boolean(!required) && <Select.Option value={'None'} >None</Select.Option>} + {Boolean(!required) && <Select.Option value={'None'}>None</Select.Option>} {[ { name: formatMessage({ id: 'page.upstream.step.select.upstream.select.option' }), @@ -659,118 +659,120 @@ const UpstreamForm: React.FC<Props> = forwardRef( </Form.Item> )} - {!hidenForm && (<> - <Form.Item - label={formatMessage({ id: 'page.upstream.step.type' })} - name="type" - rules={[{ required: true }]} - > - <Select disabled={readonly}> - {Object.entries(Type).map(([label, value]) => { - return ( - <Select.Option value={value} key={value}> - {label} - </Select.Option> - ); - })} - </Select> - </Form.Item> - <Form.Item shouldUpdate noStyle> - {() => { - if (form.getFieldValue('type') === 'chash') { - return <CHash />; - } - return null; - }} - </Form.Item> - {NodeList()} - <Form.Item - label={formatMessage({ id: 'page.upstream.step.pass-host' })} - name="pass_host" - extra={formatMessage({ id: 'page.upstream.step.pass-host.tips' })} - > - <Select disabled={readonly}> - <Select.Option value="pass"> - {formatMessage({ id: 'page.upstream.step.pass-host.pass' })} - </Select.Option> - <Select.Option value="node"> - {formatMessage({ id: 'page.upstream.step.pass-host.node' })} - </Select.Option> - <Select.Option value="rewrite"> - {formatMessage({ id: 'page.upstream.step.pass-host.rewrite' })} - </Select.Option> - </Select> - </Form.Item> - <Form.Item - noStyle - shouldUpdate={(prev, next) => { - return prev.pass_host !== next.pass_host; - }} - > - {() => { - if (form.getFieldValue('pass_host') === 'rewrite') { - return ( - <Form.Item - label={formatMessage({ id: 'page.upstream.step.pass-host.upstream_host' })} - name="upstream_host" - > - <Input disabled={readonly} /> - </Form.Item> - ); - } - return null; - }} - </Form.Item> - - {timeoutFields.map(({ label, name }) => ( - <Form.Item label={label} required key={label}> - <Form.Item - name={name} - noStyle - rules={[ - { - required: true, - message: formatMessage({ id: `page.upstream.step.input.${name[1]}.timeout` }), - }, - ]} - > - <InputNumber disabled={readonly} /> - </Form.Item> - <TimeUnit /> + {!hidenForm && ( + <> + <Form.Item + label={formatMessage({ id: 'page.upstream.step.type' })} + name="type" + rules={[{ required: true }]} + > + <Select disabled={readonly}> + {Object.entries(Type).map(([label, value]) => { + return ( + <Select.Option value={value} key={value}> + {label} + </Select.Option> + ); + })} + </Select> + </Form.Item> + <Form.Item shouldUpdate noStyle> + {() => { + if (form.getFieldValue('type') === 'chash') { + return <CHash />; + } + return null; + }} + </Form.Item> + {NodeList()} + <Form.Item + label={formatMessage({ id: 'page.upstream.step.pass-host' })} + name="pass_host" + extra={formatMessage({ id: 'page.upstream.step.pass-host.tips' })} + > + <Select disabled={readonly}> + <Select.Option value="pass"> + {formatMessage({ id: 'page.upstream.step.pass-host.pass' })} + </Select.Option> + <Select.Option value="node"> + {formatMessage({ id: 'page.upstream.step.pass-host.node' })} + </Select.Option> + <Select.Option value="rewrite"> + {formatMessage({ id: 'page.upstream.step.pass-host.rewrite' })} + </Select.Option> + </Select> + </Form.Item> + <Form.Item + noStyle + shouldUpdate={(prev, next) => { + return prev.pass_host !== next.pass_host; + }} + > + {() => { + if (form.getFieldValue('pass_host') === 'rewrite') { + return ( + <Form.Item + label={formatMessage({ id: 'page.upstream.step.pass-host.upstream_host' })} + name="upstream_host" + > + <Input disabled={readonly} /> + </Form.Item> + ); + } + return null; + }} </Form.Item> - ))} - <PanelSection - title={formatMessage({ id: 'page.upstream.step.healthyCheck.healthy.check' })} - > - {[ - { - label: formatMessage({ id: 'page.upstream.step.healthyCheck.active' }), - name: ['checks', 'active'], - component: <ActiveHealthCheck />, - }, - { - label: formatMessage({ id: 'page.upstream.step.healthyCheck.passive' }), - name: ['checks', 'passive'], - component: <InActiveHealthCheck />, - }, - ].map(({ label, name, component }) => ( - <div key={label}> - <Form.Item label={label} name={name} valuePropName="checked" key={label}> - <Switch disabled={readonly} /> - </Form.Item> - <Form.Item shouldUpdate noStyle> - {() => { - if (form.getFieldValue(name)) { - return component; - } - return null; - }} + {timeoutFields.map(({ label, name }) => ( + <Form.Item label={label} required key={label}> + <Form.Item + name={name} + noStyle + rules={[ + { + required: true, + message: formatMessage({ id: `page.upstream.step.input.${name[1]}.timeout` }), + }, + ]} + > + <InputNumber disabled={readonly} /> </Form.Item> - </div> + <TimeUnit /> + </Form.Item> ))} - </PanelSection> - </>)} + + <PanelSection + title={formatMessage({ id: 'page.upstream.step.healthyCheck.healthy.check' })} + > + {[ + { + label: formatMessage({ id: 'page.upstream.step.healthyCheck.active' }), + name: ['checks', 'active'], + component: <ActiveHealthCheck />, + }, + { + label: formatMessage({ id: 'page.upstream.step.healthyCheck.passive' }), + name: ['checks', 'passive'], + component: <InActiveHealthCheck />, + }, + ].map(({ label, name, component }) => ( + <div key={label}> + <Form.Item label={label} name={name} valuePropName="checked" key={label}> + <Switch disabled={readonly} /> + </Form.Item> + <Form.Item shouldUpdate noStyle> + {() => { + if (form.getFieldValue(name)) { + return component; + } + return null; + }} + </Form.Item> + </div> + ))} + </PanelSection> + </> + )} </Form> ); }, diff --git a/web/src/helpers.tsx b/web/src/helpers.tsx index aee3e76..de5bc4a 100644 --- a/web/src/helpers.tsx +++ b/web/src/helpers.tsx @@ -20,7 +20,6 @@ import type { MenuDataItem } from '@ant-design/pro-layout'; import { history } from 'umi'; import moment from 'moment'; - import { codeMessage } from './constants'; import IconFont from './components/IconFont'; @@ -64,7 +63,7 @@ export const getMenuData = (): MenuDataItem[] => { { name: 'serverinfo', path: '/serverinfo', - icon: <IconFont name="iconinfocircle"/>, + icon: <IconFont name="iconinfocircle" />, }, ]; }; diff --git a/web/src/pages/Route/Create.tsx b/web/src/pages/Route/Create.tsx index 9155a08..0de1d73 100644 --- a/web/src/pages/Route/Create.tsx +++ b/web/src/pages/Route/Create.tsx @@ -135,7 +135,13 @@ const Page: React.FC<Props> = (props) => { ); } - return <Step2 form={form2} upstreamRef={upstreamRef} hasServiceId={form1.getFieldValue('service_id') !== ''} />; + return ( + <Step2 + form={form2} + upstreamRef={upstreamRef} + hasServiceId={form1.getFieldValue('service_id') !== ''} + /> + ); } if (step === 3) { @@ -256,10 +262,11 @@ const Page: React.FC<Props> = (props) => { return ( <> <PageHeaderWrapper - title={`${(props as any).match.params.rid + title={`${ + (props as any).match.params.rid ? formatMessage({ id: 'component.global.edit' }) : formatMessage({ id: 'component.global.create' }) - } ${formatMessage({ id: 'menu.routes' })}`} + } ${formatMessage({ id: 'menu.routes' })}`} > <Card bordered={false}> <Steps current={step - 1} className={styles.steps}> diff --git a/web/src/pages/Route/components/CreateStep4/CreateStep4.tsx b/web/src/pages/Route/components/CreateStep4/CreateStep4.tsx index 9e6f49f..11a1034 100644 --- a/web/src/pages/Route/components/CreateStep4/CreateStep4.tsx +++ b/web/src/pages/Route/components/CreateStep4/CreateStep4.tsx @@ -50,7 +50,12 @@ const CreateStep4: React.FC<Props> = ({ form1, form2, redirect, upstreamRef, ... <h2 style={style}> {formatMessage({ id: 'page.route.steps.stepTitle.defineApiBackendServe' })} </h2> - <Step2 form={form2} upstreamRef={upstreamRef} disabled hasServiceId={form1.getFieldValue('service_id') !== ''} /> + <Step2 + form={form2} + upstreamRef={upstreamRef} + disabled + hasServiceId={form1.getFieldValue('service_id') !== ''} + /> <h2 style={style}> {formatMessage({ id: 'component.global.steps.stepTitle.pluginConfig' })} </h2> diff --git a/web/src/pages/Route/components/Step1/MetaView.tsx b/web/src/pages/Route/components/Step1/MetaView.tsx index ed86282..e0728dc 100644 --- a/web/src/pages/Route/components/Step1/MetaView.tsx +++ b/web/src/pages/Route/components/Step1/MetaView.tsx @@ -134,7 +134,8 @@ const MetaView: React.FC<RouteModule.Step1PassProps> = ({ disabled, form, isEdit <Input.TextArea placeholder={formatMessage({ id: 'component.global.input.placeholder.description' })} disabled={disabled} - showCount maxLength={256} + showCount + maxLength={256} /> </Form.Item> diff --git a/web/src/pages/Route/components/Step2/RequestRewriteView.tsx b/web/src/pages/Route/components/Step2/RequestRewriteView.tsx index 023cac8..2e6a458 100644 --- a/web/src/pages/Route/components/Step2/RequestRewriteView.tsx +++ b/web/src/pages/Route/components/Step2/RequestRewriteView.tsx @@ -23,7 +23,7 @@ const RequestRewriteView: React.FC<RouteModule.Step2PassProps> = ({ form, upstreamRef, disabled, - hasServiceId = false + hasServiceId = false, }) => { const [list, setList] = useState<UpstreamModule.RequestBody[]>([]); useEffect(() => { diff --git a/web/src/pages/Service/Create.tsx b/web/src/pages/Service/Create.tsx index c8ed53f..f0cd496 100644 --- a/web/src/pages/Service/Create.tsx +++ b/web/src/pages/Service/Create.tsx @@ -81,12 +81,13 @@ const Page: React.FC = (props) => { (serviceId ? update(serviceId, data) : create(data)) .then(() => { notification.success({ - message: `${serviceId - ? formatMessage({ id: 'component.global.edit' }) - : formatMessage({ id: 'component.global.create' }) - } ${formatMessage({ id: 'menu.service' })} ${formatMessage({ - id: 'component.status.success', - })}`, + message: `${ + serviceId + ? formatMessage({ id: 'component.global.edit' }) + : formatMessage({ id: 'component.global.create' }) + } ${formatMessage({ id: 'menu.service' })} ${formatMessage({ + id: 'component.status.success', + })}`, }); history.push('/service/list'); }) @@ -114,10 +115,11 @@ const Page: React.FC = (props) => { return ( <> <PageHeaderWrapper - title={`${(props as any).match.params.rid - ? formatMessage({ id: 'component.global.edit' }) - : formatMessage({ id: 'component.global.create' }) - } ${formatMessage({ id: 'menu.service' })}`} + title={`${ + (props as any).match.params.rid + ? formatMessage({ id: 'component.global.edit' }) + : formatMessage({ id: 'component.global.create' }) + } ${formatMessage({ id: 'menu.service' })}`} > <Card bordered={false}> <Steps current={step - 1} style={{ marginBottom: '25px' }}>
