Use nested tabbar in pulsar namespace page (#39)

shoothzj · Jan 14, 2022 · 374e428 · 374e428
1 parent b349397
commit 374e428
Show file tree

Hide file tree

Showing 9 changed files with 112 additions and 35 deletions.
diff --git a/lib/generated/intl/messages_en.dart b/lib/generated/intl/messages_en.dart
@@ -23,6 +23,7 @@ class MessageLookup extends MessageLookupByLibrary {
   final messages = _notInlinedMessages(_notInlinedMessages);
   static Map<String, Function> _notInlinedMessages(_) => <String, Function>{
         "aboutAuthor": MessageLookupByLibrary.simpleMessage("About author"),
+        "anErrorOccurred": MessageLookupByLibrary.simpleMessage("An Error Occurred"),
         "appName": MessageLookupByLibrary.simpleMessage("Paas Dashboard"),
         "basic": MessageLookupByLibrary.simpleMessage("Basic"),
         "brokersName": MessageLookupByLibrary.simpleMessage("Broker Instance"),

diff --git a/lib/generated/intl/messages_zh.dart b/lib/generated/intl/messages_zh.dart
@@ -23,6 +23,7 @@ class MessageLookup extends MessageLookupByLibrary {
   final messages = _notInlinedMessages(_notInlinedMessages);
   static Map<String, Function> _notInlinedMessages(_) => <String, Function>{
         "aboutAuthor": MessageLookupByLibrary.simpleMessage("关于作者"),
+        "anErrorOccurred": MessageLookupByLibrary.simpleMessage("一个异常发生了"),
         "appName": MessageLookupByLibrary.simpleMessage("Paas 仪表盘"),
         "basic": MessageLookupByLibrary.simpleMessage("基础信息"),
         "brokersName": MessageLookupByLibrary.simpleMessage("Pulsar 实例"),

diff --git a/lib/generated/l10n.dart b/lib/generated/l10n.dart
diff --git a/lib/l10n/intl_en.arb b/lib/l10n/intl_en.arb
@@ -1,6 +1,7 @@
 {
   "@@locale": "en",
   "aboutAuthor": "About author",
+  "anErrorOccurred": "An Error Occurred",
   "appName": "Paas Dashboard",
   "basic": "Basic",
   "brokersName": "Broker Instance",

diff --git a/lib/l10n/intl_zh.arb b/lib/l10n/intl_zh.arb
@@ -1,6 +1,7 @@
 {
   "@@locale": "zh",
   "aboutAuthor": "关于作者",
+  "anErrorOccurred": "一个异常发生了",
   "appName": "Paas 仪表盘",
   "basic": "基础信息",
   "brokersName": "Pulsar 实例",

diff --git a/lib/ui/pulsar/screen/pulsar_namespace.dart b/lib/ui/pulsar/screen/pulsar_namespace.dart
@@ -6,6 +6,7 @@ import 'package:paas_dashboard_flutter/ui/pulsar/widget/pulsar_partitioned_topic
 import 'package:paas_dashboard_flutter/ui/pulsar/widget/pulsar_sink_list.dart';
 import 'package:paas_dashboard_flutter/ui/pulsar/widget/pulsar_source_list.dart';
 import 'package:paas_dashboard_flutter/ui/pulsar/widget/pulsar_topic_list.dart';
+import 'package:paas_dashboard_flutter/ui/util/colored_tab_bar.dart';
 import 'package:paas_dashboard_flutter/vm/pulsar/pulsar_namespace_backlog_quota_view_model.dart';
 import 'package:paas_dashboard_flutter/vm/pulsar/pulsar_namespace_policies_view_model.dart';
 import 'package:paas_dashboard_flutter/vm/pulsar/pulsar_namespace_view_model.dart';
@@ -39,50 +40,93 @@ class PulsarNamespaceScreenState extends State<PulsarNamespaceScreen> {
   Widget build(BuildContext context) {
     final vm = Provider.of<PulsarNamespaceViewModel>(context);
     return DefaultTabController(
-      length: 6,
+      length: 3,
       child: Scaffold(
         appBar: AppBar(
           title: Text('Pulsar ${S.of(context).tenant} ${vm.tenant} -> ${S.of(context).namespace} ${vm.namespace}'),
           bottom: TabBar(
             tabs: [
-              Tab(text: "BacklogQuota"),
-              Tab(text: "PartitionedTopics"),
-              Tab(text: "Topics"),
-              Tab(text: "Source"),
-              Tab(text: "Sink"),
-              Tab(text: "Policies"),
+              Tab(text: "Policy"),
+              Tab(text: "Topic"),
+              Tab(text: "Function"),
             ],
           ),
         ),
         body: TabBarView(
           children: [
-            ChangeNotifierProvider(
-              create: (context) =>
-                  PulsarNamespaceBacklogQuotaViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
-              child: PulsarNamespaceBacklogQuotaWidget(),
-            ).build(context),
-            ChangeNotifierProvider(
-              create: (context) =>
-                  PulsarPartitionedTopicListViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
-              child: PulsarPartitionedTopicListWidget(),
-            ).build(context),
-            ChangeNotifierProvider(
-              create: (context) => PulsarTopicListViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
-              child: PulsarTopicListWidget(),
-            ).build(context),
-            ChangeNotifierProvider(
-              create: (context) => PulsarSourceListViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
-              child: PulsarSourceListWidget(),
-            ).build(context),
-            ChangeNotifierProvider(
-              create: (context) => PulsarSinkListViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
-              child: PulsarSinkListWidget(),
-            ).build(context),
-            ChangeNotifierProvider(
-              create: (context) =>
-                  PulsarNamespacePoliciesViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
-              child: PulsarNamespacePoliciesWidget(),
-            ).build(context),
+            DefaultTabController(
+              length: 2,
+              child: Scaffold(
+                appBar: ColoredTabBar(
+                    Colors.black,
+                    TabBar(
+                      tabs: [
+                        Tab(text: "BacklogQuota"),
+                        Tab(text: "Policies"),
+                      ],
+                    )),
+                body: TabBarView(children: [
+                  ChangeNotifierProvider(
+                    create: (context) =>
+                        PulsarNamespaceBacklogQuotaViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
+                    child: PulsarNamespaceBacklogQuotaWidget(),
+                  ).build(context),
+                  ChangeNotifierProvider(
+                    create: (context) =>
+                        PulsarNamespacePoliciesViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
+                    child: PulsarNamespacePoliciesWidget(),
+                  ).build(context),
+                ]),
+              ),
+            ),
+            DefaultTabController(
+              length: 2,
+              child: Scaffold(
+                appBar: ColoredTabBar(
+                    Colors.black,
+                    TabBar(
+                      tabs: [
+                        Tab(text: "PartitionedTopic"),
+                        Tab(text: "Topic"),
+                      ],
+                    )),
+                body: TabBarView(children: [
+                  ChangeNotifierProvider(
+                    create: (context) =>
+                        PulsarPartitionedTopicListViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
+                    child: PulsarPartitionedTopicListWidget(),
+                  ).build(context),
+                  ChangeNotifierProvider(
+                    create: (context) => PulsarTopicListViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
+                    child: PulsarTopicListWidget(),
+                  ).build(context),
+                ]),
+              ),
+            ),
+            DefaultTabController(
+              length: 2,
+              child: Scaffold(
+                appBar: ColoredTabBar(
+                    Colors.black,
+                    TabBar(
+                      tabs: [
+                        Tab(text: "Source"),
+                        Tab(text: "Sink"),
+                      ],
+                    )),
+                body: TabBarView(children: [
+                  ChangeNotifierProvider(
+                    create: (context) =>
+                        PulsarSourceListViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
+                    child: PulsarSourceListWidget(),
+                  ).build(context),
+                  ChangeNotifierProvider(
+                    create: (context) => PulsarSinkListViewModel(vm.pulsarInstancePo, vm.tenantResp, vm.namespaceResp),
+                    child: PulsarSinkListWidget(),
+                  ).build(context),
+                ]),
+              ),
+            )
           ],
         ),
       ),

diff --git a/lib/ui/pulsar/widget/pulsar_source_list.dart b/lib/ui/pulsar/widget/pulsar_source_list.dart
@@ -25,6 +25,7 @@ class PulsarSourceListWidgetState extends State<PulsarSourceListWidget> {
   void initState() {
     super.initState();
     final vm = Provider.of<PulsarSourceListViewModel>(context, listen: false);
+    vm.fetchSources();
     searchTextController.addListener(() {
       vm.filter(searchTextController.text);
     });

diff --git a/lib/ui/util/alert_util.dart b/lib/ui/util/alert_util.dart
@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:paas_dashboard_flutter/generated/l10n.dart';
 
 class AlertUtil {
   static void exceptionDialog(Exception exception, BuildContext context) {
@@ -12,7 +13,7 @@ class AlertUtil {
   static AlertDialog create(Object? error, BuildContext context) {
     return AlertDialog(
       title: Text(
-        'An Error Occured!',
+        S.of(context).anErrorOccurred,
         textAlign: TextAlign.center,
         style: TextStyle(
           color: Colors.redAccent,

diff --git a/lib/ui/util/colored_tab_bar.dart b/lib/ui/util/colored_tab_bar.dart
@@ -0,0 +1,17 @@
+import 'package:flutter/material.dart';
+
+class ColoredTabBar extends Container implements PreferredSizeWidget {
+  ColoredTabBar(this.color, this.tabBar);
+
+  final Color color;
+  final TabBar tabBar;
+
+  @override
+  Size get preferredSize => tabBar.preferredSize;
+
+  @override
+  Widget build(BuildContext context) => Container(
+        color: color,
+        child: tabBar,
+      );
+}