You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@apisix.apache.org by ju...@apache.org on 2022/02/28 01:20:41 UTC

[apisix-dashboard] branch master updated: chore: Create route form optimization (#2336)

This is an automated email from the ASF dual-hosted git repository.

juzhiyuan pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/apisix-dashboard.git


The following commit(s) were added to refs/heads/master by this push:
     new abefe97  chore: Create route form optimization (#2336)
abefe97 is described below

commit abefe97ccb4f4252b1790003acec1fb9a6f5dc05
Author: oil欧呦 <22...@qq.com>
AuthorDate: Mon Feb 28 09:20:37 2022 +0800

    chore: Create route form optimization (#2336)
---
 ...te-route-with-search-service-and-set-priority.spec.js | 16 +++++++++-------
 web/src/components/Upstream/UpstreamForm.tsx             | 11 +++++++++--
 .../components/Upstream/components/UpstreamSelector.tsx  |  9 +++++++--
 web/src/components/Upstream/locales/en-US.ts             |  2 +-
 web/src/pages/Upstream/locales/en-US.ts                  |  2 ++
 web/src/pages/Upstream/locales/zh-CN.ts                  |  2 ++
 6 files changed, 30 insertions(+), 12 deletions(-)

diff --git a/web/cypress/integration/route/create-route-with-search-service-and-set-priority.spec.js b/web/cypress/integration/route/create-route-with-search-service-and-set-priority.spec.js
index 93c51cf..4e7a96e 100644
--- a/web/cypress/integration/route/create-route-with-search-service-and-set-priority.spec.js
+++ b/web/cypress/integration/route/create-route-with-search-service-and-set-priority.spec.js
@@ -32,7 +32,6 @@ context('Create Route with search service name', () => {
     serviceSelector: '[title="None"]',
     upstreamSelector: '#upstream_id',
     deleteAlert: '.ant-modal-body',
-    drawer: '.ant-drawer-content',
   };
 
   const data = {
@@ -52,7 +51,7 @@ context('Create Route with search service name', () => {
     deleteRouteSuccess: 'Delete Route Successfully',
     routeName: 'route_test1',
     searchServiceName: 'service_test2',
-    upstreamName: 'None',
+    upstreamName: 'None (Only available when binding the service)',
   };
 
   beforeEach(() => {
@@ -101,12 +100,15 @@ context('Create Route with search service name', () => {
 
     // set name
     cy.get(selector.name).type(data.routeName);
-    cy.get(selector.serviceSelector).type(data.serviceName2 + '\n');
+    cy.get(selector.serviceSelector).type(`${data.serviceName2}\n`);
     // set priority
     cy.get(selector.priority).type(data.priority);
     cy.contains('Next').click();
     // select upstream with None
-    cy.get(selector.upstreamSelector).type(data.upstreamName + '\n');
+    cy.get('.ant-select-selector')
+      .find(selector.upstreamSelector)
+      .type(`${data.upstreamName}\n`, { force: true });
+
     cy.contains('Next').click();
     cy.contains('Next').click();
     cy.contains('Submit').click();
@@ -117,7 +119,7 @@ context('Create Route with search service name', () => {
     let serviceUuid = '';
     cy.visit('/');
     cy.contains('Service').click();
-    cy.get(selector.name).type(data.serviceName2 + '\n');
+    cy.get(selector.name).type(`${data.serviceName2}\n`);
     cy.contains(data.serviceName2)
       .siblings()
       .first()
@@ -126,7 +128,7 @@ context('Create Route with search service name', () => {
       });
     cy.visit('/');
     cy.contains('Route').click();
-    cy.get(selector.name).type(data.routeName + '\n');
+    cy.get(selector.name).type(`${data.routeName}\n`);
     cy.contains(data.routeName).siblings().contains('More').click();
     cy.contains('View').click();
     cy.get(selector.drawer).should('be.visible');
@@ -139,7 +141,7 @@ context('Create Route with search service name', () => {
   it('should delete the route and services', function () {
     cy.visit('/');
     cy.contains('Route').click();
-    cy.get(selector.name).type(data.routeName + '\n');
+    cy.get(selector.name).type(`${data.routeName}\n`);
     cy.contains(data.routeName).siblings().contains('More').click();
     cy.contains('Delete').click();
     cy.get(selector.deleteAlert)
diff --git a/web/src/components/Upstream/UpstreamForm.tsx b/web/src/components/Upstream/UpstreamForm.tsx
index c12898a..7d1a34d 100644
--- a/web/src/components/Upstream/UpstreamForm.tsx
+++ b/web/src/components/Upstream/UpstreamForm.tsx
@@ -16,7 +16,7 @@
  */
 import { Divider, Form, notification, Switch } from 'antd';
 import React, { useState, forwardRef, useImperativeHandle, useEffect } from 'react';
-import { useIntl } from 'umi';
+import { useIntl, useLocation } from 'umi';
 import type { FormInstance } from 'antd/es/form';
 
 import PanelSection from '@/components/PanelSection';
@@ -67,6 +67,7 @@ const UpstreamForm: React.FC<Props> = forwardRef(
     },
     ref,
   ) => {
+    const location = useLocation();
     const { formatMessage } = useIntl();
     const [readonly, setReadonly] = useState(false);
     const [hiddenForm, setHiddenForm] = useState(false);
@@ -281,7 +282,13 @@ const UpstreamForm: React.FC<Props> = forwardRef(
     };
 
     return (
-      <Form form={form} labelCol={{ span: 3 }}>
+      <Form
+        initialValues={{
+          upstream_id: !required && location.pathname === '/routes/create' ? 'None' : 'Custom',
+        }}
+        form={form}
+        labelCol={{ span: 3 }}
+      >
         {showSelector && (
           <UpstreamSelector
             list={list}
diff --git a/web/src/components/Upstream/components/UpstreamSelector.tsx b/web/src/components/Upstream/components/UpstreamSelector.tsx
index 2bfa4c0..d5eaaca 100644
--- a/web/src/components/Upstream/components/UpstreamSelector.tsx
+++ b/web/src/components/Upstream/components/UpstreamSelector.tsx
@@ -16,7 +16,7 @@
  */
 import React from 'react';
 import { Form, Select } from 'antd';
-import { useIntl } from 'umi';
+import { useIntl, useLocation } from 'umi';
 
 type Upstream = {
   name?: string;
@@ -32,6 +32,7 @@ type Props = {
 
 const UpstreamSelector: React.FC<Props> = ({ onChange, list = [], disabled, required }) => {
   const { formatMessage } = useIntl();
+  const location = useLocation();
 
   return (
     <Form.Item
@@ -50,7 +51,11 @@ const UpstreamSelector: React.FC<Props> = ({ onChange, list = [], disabled, requ
         </Select.Option>
         {[
           {
-            name: formatMessage({ id: 'page.upstream.step.select.upstream.select.option' }),
+            name: formatMessage({
+              id: `page.upstream.step.select.upstream.select.option${
+                !required && location.pathname === '/routes/create' ? '.serviceSelected' : ''
+              }`,
+            }),
             id: 'Custom',
           },
           ...list,
diff --git a/web/src/components/Upstream/locales/en-US.ts b/web/src/components/Upstream/locales/en-US.ts
index b449349..8dcf67b 100644
--- a/web/src/components/Upstream/locales/en-US.ts
+++ b/web/src/components/Upstream/locales/en-US.ts
@@ -147,7 +147,7 @@ export default {
   'component.upstream.fields.checks.passive.unhealthy.timeouts.tooltip':
     'Number of timeouts in proxied traffic to consider a target unhealthy, as observed by passive health checks.',
 
-  'component.upstream.other.none': 'None',
+  'component.upstream.other.none': 'None (Only available when binding the service)',
   'component.upstream.other.pass_host-with-multiple-nodes.title':
     'Please check the target node configuration',
   'component.upstream.other.pass_host-with-multiple-nodes':
diff --git a/web/src/pages/Upstream/locales/en-US.ts b/web/src/pages/Upstream/locales/en-US.ts
index 14e811f..7219b36 100644
--- a/web/src/pages/Upstream/locales/en-US.ts
+++ b/web/src/pages/Upstream/locales/en-US.ts
@@ -17,6 +17,8 @@
 export default {
   'page.upstream.step.select.upstream': 'Select Upstream',
   'page.upstream.step.select.upstream.select.option': 'Custom',
+  'page.upstream.step.select.upstream.select.option.serviceSelected':
+    'Custom (The current configuration will override the bound service)',
   'page.upstream.step.select.upstream.select.none': 'None',
   'page.upstream.step.backend.server.domain.or.ip': 'Backend Server Host/IP',
   'page.upstream.form.item-label.node.domain.or.ip': 'Targets',
diff --git a/web/src/pages/Upstream/locales/zh-CN.ts b/web/src/pages/Upstream/locales/zh-CN.ts
index 3bd84eb..c91cbca 100644
--- a/web/src/pages/Upstream/locales/zh-CN.ts
+++ b/web/src/pages/Upstream/locales/zh-CN.ts
@@ -17,6 +17,8 @@
 export default {
   'page.upstream.step.select.upstream': '选择上游服务',
   'page.upstream.step.select.upstream.select.option': '手动填写',
+  'page.upstream.step.select.upstream.select.option.serviceSelected':
+    '手动填写(当前配置将会覆盖已绑定的服务)',
   'page.upstream.step.select.upstream.select.none': '无',
   'page.upstream.step.backend.server.domain.or.ip': '后端服务域名或 IP',
   'page.upstream.form.item-label.node.domain.or.ip': '目标节点',