From 1f986c8d70298ba367285d872b19fb1765cbd9c5 Mon Sep 17 00:00:00 2001 From: liuxiran Date: Mon, 7 Sep 2020 21:06:01 +0800 Subject: [PATCH 1/7] feat(route): add publish and offline to route --- src/pages/Route/Create.tsx | 11 ++- src/pages/Route/List.tsx | 99 ++++++++++++++----- src/pages/Route/components/Step1/MetaView.tsx | 13 ++- src/pages/Route/components/Step1/index.tsx | 2 +- src/pages/Route/locales/en-US.ts | 17 ++++ src/pages/Route/locales/zh-CN.ts | 17 ++++ src/pages/Route/service.ts | 2 + src/pages/Route/transform.ts | 8 ++ src/pages/Route/typing.d.ts | 5 + 9 files changed, 141 insertions(+), 33 deletions(-) diff --git a/src/pages/Route/Create.tsx b/src/pages/Route/Create.tsx index dcc21b1e82..a385b4af64 100644 --- a/src/pages/Route/Create.tsx +++ b/src/pages/Route/Create.tsx @@ -14,8 +14,8 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import React, { useState, useEffect } from 'react'; -import { Card, Steps, Form } from 'antd'; +import React, { useEffect, useState } from 'react'; +import { Card, Form, Steps } from 'antd'; import { PageHeaderWrapper } from '@ant-design/pro-layout'; import { history, useIntl } from 'umi'; import { transformer as chartTransformer } from '@api7-dashboard/pluginchart'; @@ -23,13 +23,13 @@ import { transformer as chartTransformer } from '@api7-dashboard/pluginchart'; import ActionBar from '@/components/ActionBar'; import { + checkHostWithSSL, + checkUniqueName, create, fetchItem, - update, - checkUniqueName, fetchUpstreamItem, - checkHostWithSSL, fetchRouteGroupItem, + update, } from './service'; import Step1 from './components/Step1'; import Step2 from './components/Step2'; @@ -143,6 +143,7 @@ const Page: React.FC = (props) => { } setStep1Data({ ...form1.getFieldsValue(), ...step1Data, ...params }); }} + isEdit={props.route.path.indexOf('edit') > 0} /> ); } diff --git a/src/pages/Route/List.tsx b/src/pages/Route/List.tsx index e37d043d33..018ef8334a 100644 --- a/src/pages/Route/List.tsx +++ b/src/pages/Route/List.tsx @@ -17,12 +17,12 @@ import React, { useRef, useState } from 'react'; import { PageHeaderWrapper } from '@ant-design/pro-layout'; import ProTable, { ProColumns, ActionType } from '@ant-design/pro-table'; -import { Button, Popconfirm, notification, Tag, Input } from 'antd'; +import { Button, Popconfirm, notification, Tag, Input, Space } from 'antd'; import { PlusOutlined } from '@ant-design/icons'; import moment from 'moment'; import { history, useIntl } from 'umi'; -import { fetchList, remove } from './service'; +import { fetchList, offline, publish, remove } from './service'; const Page: React.FC = () => { const ref = useRef(); @@ -66,6 +66,19 @@ const Page: React.FC = () => { title: formatMessage({ id: 'route.list.group.name' }), dataIndex: 'route_group_name', }, + { + title: formatMessage({ id: 'route.list.status' }), + dataIndex: 'status', + render: (_, record) => ( + <> + {record.status ? ( + {formatMessage({ id: 'route.list.status.publish' })} + ) : ( + {formatMessage({ id: 'route.list.status.offline' })} + )} + + ), + }, { title: formatMessage({ id: 'route.list.edit.time' }), dataIndex: 'update_time', @@ -76,31 +89,67 @@ const Page: React.FC = () => { valueType: 'option', render: (_, record) => ( <> - - { - remove(record.id!).then(() => { - notification.success({ - message: formatMessage({ id: 'route.list.delete.success' }), + + + - + { + offline(record.id!).then(() => { + notification.success({ + message: formatMessage({ id: 'route.list.offline.success' }), + }); + /* eslint-disable no-unused-expressions */ + ref.current?.reload(); + }); + }} + okText={formatMessage({ id: 'route.list.offline' })} + cancelText={formatMessage({ id: 'route.list.cancel' })} + > + + + { + remove(record.id!).then(() => { + notification.success({ + message: formatMessage({ id: 'route.list.delete.success' }), + }); + /* eslint-disable no-unused-expressions */ + ref.current?.reload(); + }); + }} + okText={formatMessage({ id: 'route.list.confirm' })} + cancelText={formatMessage({ id: 'route.list.cancel' })} + > + + + ), }, diff --git a/src/pages/Route/components/Step1/MetaView.tsx b/src/pages/Route/components/Step1/MetaView.tsx index afa1b90f94..7fc3a3f8f3 100644 --- a/src/pages/Route/components/Step1/MetaView.tsx +++ b/src/pages/Route/components/Step1/MetaView.tsx @@ -16,7 +16,7 @@ */ import React, { useEffect, useState } from 'react'; import Form from 'antd/es/form'; -import { Input, Select } from 'antd'; +import { Input, Select, Switch } from 'antd'; import { useIntl } from 'umi'; import { PanelSection } from '@api7-dashboard/ui'; @@ -24,7 +24,7 @@ import { fetchRouteGroupList } from '@/pages/Route/service'; interface Props extends RouteModule.Data {} -const MetaView: React.FC = ({ data, disabled, onChange }) => { +const MetaView: React.FC = ({ data, disabled, onChange, isEdit }) => { const { step1Data } = data; const { formatMessage } = useIntl(); const routeGroupDisabled = disabled || !!step1Data.route_group_id; @@ -90,6 +90,15 @@ const MetaView: React.FC = ({ data, disabled, onChange }) => { disabled={routeGroupDisabled} /> + {!isEdit ? ( + + + + ) : null} = (props) => { const { data, form, onChange } = props; - return ( <>
{ }; export const remove = (rid: number) => request(`/routes/${rid}`, { method: 'DELETE' }); +export const offline = (rid: number) => request(`/offlineroutes/${rid}`, { method: 'PUT' }); +export const publish = (rid: number) => request(`/publishroutes/${rid}`, { method: 'PUT' }); export const checkUniqueName = (name = '', exclude = '') => request('/notexist/routes', { diff --git a/src/pages/Route/transform.ts b/src/pages/Route/transform.ts index e3c2b4ea0b..efdb28cd00 100644 --- a/src/pages/Route/transform.ts +++ b/src/pages/Route/transform.ts @@ -53,11 +53,17 @@ export const transformStepData = ({ protocols = protocols.concat('websocket'); } + let { status } = step1Data; + if (step1Data.status === undefined) { + status = false; + } + const data: Partial = { ...step1Data, ...step2Data, ...step3Data, protocols, + status, uris: step1Data.paths, redirect, vars: step1Data.advancedMatchingRules.map((rule) => { @@ -166,6 +172,7 @@ export const transformRouteData = (data: RouteModule.Body) => { hosts, vars, redirect, + status, } = data; const step1Data: Partial = { @@ -173,6 +180,7 @@ export const transformRouteData = (data: RouteModule.Body) => { route_group_id, route_group_name, desc, + status, protocols: protocols.filter((item) => item !== 'websocket'), websocket: protocols.includes('websocket'), hosts, diff --git a/src/pages/Route/typing.d.ts b/src/pages/Route/typing.d.ts index 409f4cc275..6e30b3235a 100644 --- a/src/pages/Route/typing.d.ts +++ b/src/pages/Route/typing.d.ts @@ -36,11 +36,13 @@ declare namespace RouteModule { desc: string; uris: string[]; hosts: string[]; + status: boolean; }; type Step1Data = { name: string; desc: string; + status: boolean; priority: number; protocols: RequestProtocol[]; websocket: boolean; @@ -69,6 +71,7 @@ declare namespace RouteModule { step3Data: Step3Data; }; onChange(data: T): void; + isEdit?: boolean; } type UpstreamHost = { @@ -117,6 +120,8 @@ declare namespace RouteModule { id?: number; route_group_id?: string; route_group_name: string; + env: string; + status: boolean; name: string; desc: string; priority?: number; From 7561b49d945097d67b6f53651aac0e8a5690bb6e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=90=9A=E8=87=B4=E8=BF=9C?= Date: Wed, 9 Sep 2020 08:50:21 +0800 Subject: [PATCH 2/7] feat: trigger redeploy --- src/pages/Route/Create.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/Route/Create.tsx b/src/pages/Route/Create.tsx index a385b4af64..d61273abda 100644 --- a/src/pages/Route/Create.tsx +++ b/src/pages/Route/Create.tsx @@ -23,13 +23,13 @@ import { transformer as chartTransformer } from '@api7-dashboard/pluginchart'; import ActionBar from '@/components/ActionBar'; import { - checkHostWithSSL, - checkUniqueName, create, fetchItem, fetchUpstreamItem, fetchRouteGroupItem, update, + checkUniqueName, + checkHostWithSSL } from './service'; import Step1 from './components/Step1'; import Step2 from './components/Step2'; From 3618172fa0aa0813f2a5cb27f5f19ccc1592e3a1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=90=9A=E8=87=B4=E8=BF=9C?= Date: Wed, 9 Sep 2020 09:08:16 +0800 Subject: [PATCH 3/7] feat: trigger redeploy --- src/pages/Route/Create.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/Route/Create.tsx b/src/pages/Route/Create.tsx index d61273abda..efa1fa9a4b 100644 --- a/src/pages/Route/Create.tsx +++ b/src/pages/Route/Create.tsx @@ -14,7 +14,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import React, { useEffect, useState } from 'react'; +import React, { useState, useEffect } from 'react'; import { Card, Form, Steps } from 'antd'; import { PageHeaderWrapper } from '@ant-design/pro-layout'; import { history, useIntl } from 'umi'; From 804b9a54f97d3015a65e6ffa38b2b0ad8371429a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=90=9A=E8=87=B4=E8=BF=9C?= Date: Wed, 9 Sep 2020 09:25:43 +0800 Subject: [PATCH 4/7] Update Create.tsx --- src/pages/Route/Create.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/Route/Create.tsx b/src/pages/Route/Create.tsx index efa1fa9a4b..fc767d242c 100644 --- a/src/pages/Route/Create.tsx +++ b/src/pages/Route/Create.tsx @@ -15,7 +15,7 @@ * limitations under the License. */ import React, { useState, useEffect } from 'react'; -import { Card, Form, Steps } from 'antd'; +import { Card, Steps, Form } from 'antd'; import { PageHeaderWrapper } from '@ant-design/pro-layout'; import { history, useIntl } from 'umi'; import { transformer as chartTransformer } from '@api7-dashboard/pluginchart'; From 8afc906973c443b3d18184978d90b131d32c03c5 Mon Sep 17 00:00:00 2001 From: liuxiran Date: Wed, 9 Sep 2020 09:44:12 +0800 Subject: [PATCH 5/7] fix: update refer to the code review --- src/pages/Route/components/Step1/MetaView.tsx | 4 ++-- src/pages/Route/service.ts | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/pages/Route/components/Step1/MetaView.tsx b/src/pages/Route/components/Step1/MetaView.tsx index 7fc3a3f8f3..3ecb961052 100644 --- a/src/pages/Route/components/Step1/MetaView.tsx +++ b/src/pages/Route/components/Step1/MetaView.tsx @@ -90,7 +90,7 @@ const MetaView: React.FC = ({ data, disabled, onChange, isEdit }) => { disabled={routeGroupDisabled} /> - {!isEdit ? ( + {!isEdit && ( = ({ data, disabled, onChange, isEdit }) => { > - ) : null} + )} { }; export const remove = (rid: number) => request(`/routes/${rid}`, { method: 'DELETE' }); -export const offline = (rid: number) => request(`/offlineroutes/${rid}`, { method: 'PUT' }); -export const publish = (rid: number) => request(`/publishroutes/${rid}`, { method: 'PUT' }); +export const offline = (rid: number) => request(`/routes/${rid}/offline`, { method: 'PUT' }); +export const publish = (rid: number) => request(`/routes/${rid}/publish`, { method: 'PUT' }); export const checkUniqueName = (name = '', exclude = '') => request('/notexist/routes', { From 672be2096260a1ab1066b073b966a6855bcc94cf Mon Sep 17 00:00:00 2001 From: liuxiran Date: Wed, 9 Sep 2020 10:00:34 +0800 Subject: [PATCH 6/7] fix: init status default value --- src/pages/Route/constants.ts | 1 + src/pages/Route/transform.ts | 6 ------ 2 files changed, 1 insertion(+), 6 deletions(-) diff --git a/src/pages/Route/constants.ts b/src/pages/Route/constants.ts index cc0e05b20d..bf23e596d0 100644 --- a/src/pages/Route/constants.ts +++ b/src/pages/Route/constants.ts @@ -45,6 +45,7 @@ export const DEFAULT_STEP_1_DATA: RouteModule.Step1Data = { route_group_name: '', name: '', desc: '', + status: false, priority: 0, protocols: ['http', 'https'], websocket: false, diff --git a/src/pages/Route/transform.ts b/src/pages/Route/transform.ts index efdb28cd00..048f3d3151 100644 --- a/src/pages/Route/transform.ts +++ b/src/pages/Route/transform.ts @@ -53,17 +53,11 @@ export const transformStepData = ({ protocols = protocols.concat('websocket'); } - let { status } = step1Data; - if (step1Data.status === undefined) { - status = false; - } - const data: Partial = { ...step1Data, ...step2Data, ...step3Data, protocols, - status, uris: step1Data.paths, redirect, vars: step1Data.advancedMatchingRules.map((rule) => { From 29b6ee548c249ecdf16f01b991ca9eaf0f962423 Mon Sep 17 00:00:00 2001 From: liuxiran Date: Wed, 9 Sep 2020 14:41:49 +0800 Subject: [PATCH 7/7] fix: add a help msg to status Form.Item --- src/pages/Route/Create.less | 5 +++++ src/pages/Route/components/Step1/MetaView.tsx | 1 + src/pages/Route/locales/en-US.ts | 11 ++--------- src/pages/Route/locales/zh-CN.ts | 10 +--------- src/pages/Route/typing.d.ts | 1 - 5 files changed, 9 insertions(+), 19 deletions(-) diff --git a/src/pages/Route/Create.less b/src/pages/Route/Create.less index 14ad36a869..5d39f4cc2f 100644 --- a/src/pages/Route/Create.less +++ b/src/pages/Route/Create.less @@ -114,6 +114,11 @@ .stepForm { max-width: 700px; margin: 40px auto 0; + :global { + .ant-form-item-with-help { + margin-bottom: 24px; + } + } } :global { diff --git a/src/pages/Route/components/Step1/MetaView.tsx b/src/pages/Route/components/Step1/MetaView.tsx index 3ecb961052..a90faac6bf 100644 --- a/src/pages/Route/components/Step1/MetaView.tsx +++ b/src/pages/Route/components/Step1/MetaView.tsx @@ -95,6 +95,7 @@ const MetaView: React.FC = ({ data, disabled, onChange, isEdit }) => { label={formatMessage({ id: 'route.list.publish' })} name="status" valuePropName="checked" + help={formatMessage({ id: 'page.route.form.itemHelp.status' })} > diff --git a/src/pages/Route/locales/en-US.ts b/src/pages/Route/locales/en-US.ts index 8f0b946688..0304290291 100644 --- a/src/pages/Route/locales/en-US.ts +++ b/src/pages/Route/locales/en-US.ts @@ -174,13 +174,6 @@ export default { 'page.route.radio.static': 'Static', 'page.route.radio.regx': 'Regx', 'page.route.form.itemLabel.from': 'From', - 'route.publish.env': 'Publish Environment', - 'route.publish.env.head': 'Publish API', - 'route.publish.env.comment': 'Please enter the comment about changes', - 'route.publish.env.testing': 'testing', - 'route.publish.env.pre': 'pre', - 'route.publish.env.release': 'release', - 'route.publish.ok': 'Publish', - 'route.publish.env.click': 'Please select one env', - 'route.publish.env.input.desc': 'Can not more than 200 characters', + 'page.route.form.itemHelp.status': + 'Whether a route can be used after it is created, the default value is false.', }; diff --git a/src/pages/Route/locales/zh-CN.ts b/src/pages/Route/locales/zh-CN.ts index 06b153b3cf..bcef793ab4 100644 --- a/src/pages/Route/locales/zh-CN.ts +++ b/src/pages/Route/locales/zh-CN.ts @@ -169,13 +169,5 @@ export default { 'page.route.radio.static': '静态重写', 'page.route.radio.regx': '正则重写', 'page.route.form.itemLabel.from': '原路径', - 'route.publish.env': '发布环境', - 'route.publish.env.head': '发布路由', - 'route.publish.env.comment': '请填写变更备注', - 'route.publish.env.testing': '测试', - 'route.publish.env.pre': '预发布', - 'route.publish.env.release': '线上', - 'route.publish.ok': '发布', - 'route.publish.env.click': '请选择发布环境', - 'route.publish.env.input.desc': '变更备注长度在0-200字符', + 'page.route.form.itemHelp.status': '路由创建后是否可以使用， 默认值为 false', }; diff --git a/src/pages/Route/typing.d.ts b/src/pages/Route/typing.d.ts index 6e30b3235a..ed4e3c4461 100644 --- a/src/pages/Route/typing.d.ts +++ b/src/pages/Route/typing.d.ts @@ -120,7 +120,6 @@ declare namespace RouteModule { id?: number; route_group_id?: string; route_group_name: string; - env: string; status: boolean; name: string; desc: string;