refactor(crd): 优化 CRD 页面布局和功能

- 在 floating-toolbar 中添加回退按钮，提高页面导航便利性 -调整 namespaced_cr 页面布局，移除冗余的 flex容器 - 优化命名空间选择器布局，提升用户体验
weibaohui · Dec 25, 2024 · 371548c · 371548c
1 parent 6d8244f
commit 371548c
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 68 deletions.
diff --git a/assets/pages/crd/cluster_cr.json b/assets/pages/crd/cluster_cr.json
@@ -5,6 +5,21 @@
       "type": "container",
       "className": "floating-toolbar",
       "body": [
+        {
+          "type": "button",
+          "label": "回退",
+          "level": "link",
+          "className": "mr-2",
+          "onEvent": {
+            "click": {
+              "actions": [
+                {
+                  "actionType": "goBack"
+                }
+              ]
+            }
+          }
+        },
         {
           "type": "tpl",
           "tpl": "${kind}",
@@ -48,27 +63,6 @@
         }
       ]
     },
-    {
-      "type": "flex",
-      "justify": "flex-start",
-      "items": [
-        {
-          "type": "button",
-          "label": "回退",
-          "level": "link",
-          "className": "ml-2",
-          "onEvent": {
-            "click": {
-              "actions": [
-                {
-                  "actionType": "goBack"
-                }
-              ]
-            }
-          }
-        }
-      ]
-    },
     {
       "type": "crud",
       "id": "detailCRUD",

diff --git a/assets/pages/crd/namespaced_cr.json b/assets/pages/crd/namespaced_cr.json
@@ -5,6 +5,21 @@
       "type": "container",
       "className": "floating-toolbar",
       "body": [
+        {
+          "type": "button",
+          "label": "回退",
+          "level": "link",
+          "className": "mr-2",
+          "onEvent": {
+            "click": {
+              "actions": [
+                {
+                  "actionType": "goBack"
+                }
+              ]
+            }
+          }
+        },
         {
           "type": "tpl",
           "tpl": "${kind}",
@@ -54,55 +69,30 @@
       "wrapWithPanel": false,
       "body": [
         {
-          "type": "flex",
-          "justify": "flex-start",
-          "items": [
-            {
-              "type": "button",
-              "label": "回退",
-              "level": "link",
-              "className": "ml-2",
-              "onEvent": {
-                "click": {
-                  "actions": [
-                    {
-                      "actionType": "goBack"
-                    }
-                  ]
-                }
-              }
-            },
-            {
-              "style": {
-                "width": 500,
-                "margin": 5
-              },
-              "label": "Namespace",
-              "type": "select",
-              "name": "ns",
-              "id": "ns",
-              "searchable": true,
-              "source": "/k8s/ns/option_list",
-              "value": "${ls:selectedNs||'default'}",
-              "onEvent": {
-                "change": {
-                  "actions": [
-                    {
-                      "actionType": "reload",
-                      "componentId": "detailCRUD",
-                      "data": {
-                        "ns": "${ns}"
-                      }
-                    },
-                    {
-                      "actionType": "custom",
-                      "script": "localStorage.setItem('selectedNs', event.data.ns)"
-                    }
-                  ]
+          "label": "命名空间",
+          "type": "select",
+          "name": "ns",
+          "id": "ns",
+          "searchable": true,
+          "source": "/k8s/ns/option_list",
+          "value": "${ls:selectedNs||'default'}",
+          "onEvent": {
+            "change": {
+              "actions": [
+                {
+                  "actionType": "reload",
+                  "componentId": "detailCRUD",
+                  "data": {
+                    "ns": "${ns}"
+                  }
+                },
+                {
+                  "actionType": "custom",
+                  "script": "localStorage.setItem('selectedNs', event.data.ns)"
                 }
-              }
+              ]
             }
-          ]
+          }
         }
       ]
     },