(shenyu-dashboard) branch master updated: Optimize the layout of GeneralContextRuleHandle (#449)

[dengliming]

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

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


The following commit(s) were added to refs/heads/master by this push:
     new a1b187d9 Optimize the layout of GeneralContextRuleHandle (#449)
a1b187d9 is described below

commit a1b187d9838f5852b587c033348a9b9c064a6189
Author: Kerwin Bryant <kerwin...@qq.com>
AuthorDate: Sun Apr 7 22:18:14 2024 +0800

    Optimize the layout of GeneralContextRuleHandle (#449)
---
 .../PluginRuleHandle/GeneralContextRuleHandle.js   | 23 ++++++++++------------
 1 file changed, 10 insertions(+), 13 deletions(-)

diff --git a/src/routes/Plugin/PluginRuleHandle/GeneralContextRuleHandle.js 
b/src/routes/Plugin/PluginRuleHandle/GeneralContextRuleHandle.js
index 43e71124..f423956d 100644
--- a/src/routes/Plugin/PluginRuleHandle/GeneralContextRuleHandle.js
+++ b/src/routes/Plugin/PluginRuleHandle/GeneralContextRuleHandle.js
@@ -107,23 +107,20 @@ export default class GeneralContextRuleHandle extends 
Component {
       initialValue: this.keys,
     });
     const keys = getFieldValue("keys");
+    const rowStyle = { display: "flex", alignItems: "center" };
 
     return (
-      <div className={styles.handleWrap} style={{ padding: "0px 40px" }}>
-        <div className={styles.header}>
-          <h3 style={{ width: 60, marginTop: 10 }}>
-            {getIntlContent("SHENYU.COMMON.DEAL")}:{" "}
-          </h3>
-        </div>
-        <Tabs
-          style={{ marginLeft: 10, width: "100%" }}
-          defaultActiveKey={currentType}
-          onChange={this.handleTabChange}
-        >
+      <FormItem
+        label={getIntlContent("SHENYU.COMMON.DEAL")}
+        labelCol={{ span: 3 }}
+        wrapperCol={{ span: 21 }}
+        className={styles.rootFormItem}
+      >
+        <Tabs defaultActiveKey={currentType} onChange={this.handleTabChange}>
           {handlers.map((handler) => (
             <TabPane tab={titleCase(handler)} key={handler}>
               {keys[handler].map((key, keyIndex) => (
-                <Row gutter={16} key={key}>
+                <Row gutter={16} key={key} style={rowStyle}>
                   <Col span={7}>
                     <FormItem>
                       {getFieldDecorator(
@@ -205,7 +202,7 @@ export default class GeneralContextRuleHandle extends 
Component {
             </TabPane>
           ))}
         </Tabs>
-      </div>
+      </FormItem>
     );
   }
 }