Add hint text on search box.

shoothzj · Aug 2, 2021 · 43d8dc4 · 43d8dc4
1 parent 22f453e
commit 43d8dc4
Show file tree

Hide file tree

Showing 10 changed files with 175 additions and 42 deletions.
diff --git a/lib/generated/intl/messages_en.dart b/lib/generated/intl/messages_en.dart
@@ -33,8 +33,20 @@ class MessageLookup extends MessageLookupByLibrary {
         "deleteTenant": MessageLookupByLibrary.simpleMessage("Delete Tenant"),
         "deleteTopic": MessageLookupByLibrary.simpleMessage("Delete Topic"),
         "namespaceName": MessageLookupByLibrary.simpleMessage("Namespace Name"),
+        "namespaces": MessageLookupByLibrary.simpleMessage("Namespaces"),
         "refresh": MessageLookupByLibrary.simpleMessage("Refresh"),
+        "searchByNamespace":
+            MessageLookupByLibrary.simpleMessage("Search by Namespace Name"),
+        "searchByTenant":
+            MessageLookupByLibrary.simpleMessage("Search by Tenant Name"),
+        "searchByTopic":
+            MessageLookupByLibrary.simpleMessage("Search by Topic Name"),
+        "subscriptionName":
+            MessageLookupByLibrary.simpleMessage("Subscription Name"),
+        "subscriptions": MessageLookupByLibrary.simpleMessage("Subscriptions"),
         "tenantName": MessageLookupByLibrary.simpleMessage("Tenant Name"),
-        "topicName": MessageLookupByLibrary.simpleMessage("Topic Name")
+        "tenants": MessageLookupByLibrary.simpleMessage("Tenants"),
+        "topicName": MessageLookupByLibrary.simpleMessage("Topic Name"),
+        "topics": MessageLookupByLibrary.simpleMessage("Topics")
       };
 }
diff --git a/lib/generated/intl/messages_zh.dart b/lib/generated/intl/messages_zh.dart
@@ -31,8 +31,16 @@ class MessageLookup extends MessageLookupByLibrary {
         "deleteTenant": MessageLookupByLibrary.simpleMessage("删除租户"),
         "deleteTopic": MessageLookupByLibrary.simpleMessage("删除 Topic"),
         "namespaceName": MessageLookupByLibrary.simpleMessage("命名空间名称"),
+        "namespaces": MessageLookupByLibrary.simpleMessage("命名空间列表"),
         "refresh": MessageLookupByLibrary.simpleMessage("刷新"),
+        "searchByNamespace": MessageLookupByLibrary.simpleMessage("按命名空间名称搜索"),
+        "searchByTenant": MessageLookupByLibrary.simpleMessage("按租户名称搜索"),
+        "searchByTopic": MessageLookupByLibrary.simpleMessage("按 Topic 名称搜索"),
+        "subscriptionName": MessageLookupByLibrary.simpleMessage("订阅名称"),
+        "subscriptions": MessageLookupByLibrary.simpleMessage("订阅列表"),
         "tenantName": MessageLookupByLibrary.simpleMessage("租户名称"),
-        "topicName": MessageLookupByLibrary.simpleMessage("Topic 名称")
+        "tenants": MessageLookupByLibrary.simpleMessage("租户列表"),
+        "topicName": MessageLookupByLibrary.simpleMessage("Topic 名称"),
+        "topics": MessageLookupByLibrary.simpleMessage("Topic 列表")
       };
 }
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
@@ -5,11 +5,19 @@
   "cancel": "Cancel",
   "confirm": "Confirm",
   "confirmDeleteQuestion": "ConfirmDelete?",
+  "tenants": "Tenants",
+  "searchByTenant": "Search by Tenant Name",
   "tenantName": "Tenant Name",
   "deleteTenant": "Delete Tenant",
+  "namespaces": "Namespaces",
+  "searchByNamespace": "Search by Namespace Name",
   "namespaceName": "Namespace Name",
   "deleteNamespace": "Delete Namespace",
+  "topics": "Topics",
+  "searchByTopic": "Search by Topic Name",
   "topicName": "Topic Name",
   "deleteTopic": "Delete Topic",
-  "clearBacklog": "Clear Backlog"
+  "clearBacklog": "Clear Backlog",
+  "subscriptions": "Subscriptions",
+  "subscriptionName": "Subscription Name"
 }
diff --git a/lib/l10n/intl_zh.arb b/lib/l10n/intl_zh.arb
@@ -5,11 +5,19 @@
   "cancel": "取消",
   "confirm": "确认",
   "confirmDeleteQuestion": "确认删除吗？",
+  "tenants": "租户列表",
+  "searchByTenant": "按租户名称搜索",
   "tenantName": "租户名称",
   "deleteTenant": "删除租户",
+  "namespaces": "命名空间列表",
+  "searchByNamespace": "按命名空间名称搜索",
   "namespaceName": "命名空间名称",
   "deleteNamespace": "删除命名空间",
+  "topics": "Topic 列表",
+  "searchByTopic": "按 Topic 名称搜索",
   "topicName": "Topic 名称",
   "deleteTopic": "删除 Topic",
-  "clearBacklog": "清理积压"
+  "clearBacklog": "清理积压",
+  "subscriptions": "订阅列表",
+  "subscriptionName": "订阅名称"
 }
diff --git a/lib/ui/component/searchable_title.dart b/lib/ui/component/searchable_title.dart
@@ -0,0 +1,39 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+class SearchableTitle extends StatelessWidget {
+  final String title;
+
+  final String searchHint;
+
+  final TextEditingController searchController;
+
+  SearchableTitle(this.title, this.searchHint, this.searchController);
+
+  @override
+  Widget build(BuildContext context) {
+    var searchBox = Container(
+      width: 300,
+      child: TextFormField(
+        controller: searchController,
+        decoration: InputDecoration(hintText: searchHint),
+      ),
+    );
+    return Container(
+      height: 40,
+      child: ListView(
+        scrollDirection: Axis.horizontal,
+        shrinkWrap: true,
+        children: [
+          Container(
+            child: Text(
+              title,
+              style: TextStyle(fontSize: 30),
+            ),
+          ),
+          searchBox
+        ],
+      ),
+    );
+  }
+}
diff --git a/lib/ui/pulsar/screen/pulsar_namespace.dart b/lib/ui/pulsar/screen/pulsar_namespace.dart
@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:paas_dashboard_flutter/generated/l10n.dart';
 import 'package:paas_dashboard_flutter/route/page_route_const.dart';
+import 'package:paas_dashboard_flutter/ui/component/searchable_title.dart';
 import 'package:paas_dashboard_flutter/ui/util/data_cell_util.dart';
 import 'package:paas_dashboard_flutter/ui/util/exception_util.dart';
 import 'package:paas_dashboard_flutter/ui/util/form_util.dart';
@@ -74,26 +75,18 @@ class PulsarNamespaceScreenState extends State<PulsarNamespaceScreen> {
           vm.fetchTopics();
         },
         child: Text(S.of(context).refresh));
-    var searchBox = Container(
-      width: 300,
-      child: TextField(
-        controller: searchTextController,
-      ),
-    );
     var body = ListView(
       children: <Widget>[
         Container(
           height: 50,
           child: ListView(
             scrollDirection: Axis.horizontal,
             shrinkWrap: true,
-            children: [formButton, refreshButton, searchBox],
+            children: [formButton, refreshButton],
           ),
         ),
-        Text(
-          'Partitioned Topics',
-          style: TextStyle(fontSize: 22),
-        ),
+        SearchableTitle(S.of(context).topics, S.of(context).searchByTopic,
+            searchTextController),
         topicsTable
       ],
     );

diff --git a/lib/ui/pulsar/screen/pulsar_partitioned_topic.dart b/lib/ui/pulsar/screen/pulsar_partitioned_topic.dart
@@ -1,6 +1,5 @@
 import 'package:flutter/material.dart';
 import 'package:paas_dashboard_flutter/generated/l10n.dart';
-import 'package:paas_dashboard_flutter/ui/util/alert_util.dart';
 import 'package:paas_dashboard_flutter/ui/util/exception_util.dart';
 import 'package:paas_dashboard_flutter/ui/util/spinner_util.dart';
 import 'package:paas_dashboard_flutter/vm/pulsar/pulsar_partitioned_topic_view_model.dart';
@@ -38,10 +37,10 @@ class PulsarPartitionedTopicScreenState
       child: DataTable(
           showCheckboxColumn: false,
           columns: [
-            DataColumn(label: Text('Subscription Name')),
+            DataColumn(label: Text(S.of(context).subscriptionName)),
             DataColumn(label: Text('MsgBacklog')),
             DataColumn(label: Text('MsgRateOut')),
-            DataColumn(label: Text('Clear Backlog')),
+            DataColumn(label: Text(S.of(context).clearBacklog)),
           ],
           rows: vm.displayList
               .map((data) => DataRow(cells: [
@@ -55,7 +54,7 @@ class PulsarPartitionedTopicScreenState
                       Text(data.rateOut.toString()),
                     ),
                     DataCell(TextButton(
-                      child: Text('clear-backlog'),
+                      child: Text(S.of(context).clearBacklog),
                       onPressed: () {
                         vm.clearBacklog(data.subscriptionName);
                       },
@@ -79,7 +78,7 @@ class PulsarPartitionedTopicScreenState
           ),
         ),
         Text(
-          'Subscriptions',
+          S.of(context).subscriptions,
           style: TextStyle(fontSize: 22),
         ),
         topicsFuture

diff --git a/lib/ui/pulsar/screen/pulsar_tenant.dart b/lib/ui/pulsar/screen/pulsar_tenant.dart
@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:paas_dashboard_flutter/generated/l10n.dart';
 import 'package:paas_dashboard_flutter/route/page_route_const.dart';
+import 'package:paas_dashboard_flutter/ui/component/searchable_title.dart';
 import 'package:paas_dashboard_flutter/ui/util/data_cell_util.dart';
 import 'package:paas_dashboard_flutter/ui/util/exception_util.dart';
 import 'package:paas_dashboard_flutter/ui/util/form_util.dart';
@@ -65,26 +66,18 @@ class PulsarTenantScreenState extends State<PulsarTenantScreen> {
           vm.fetchNamespaces();
         },
         child: Text(S.of(context).refresh));
-    var searchBox = Container(
-      width: 300,
-      child: TextField(
-        controller: searchTextController,
-      ),
-    );
     var listView = ListView(
       children: <Widget>[
         Container(
           height: 50,
           child: ListView(
             scrollDirection: Axis.horizontal,
             shrinkWrap: true,
-            children: [formButton, refreshButton, searchBox],
+            children: [formButton, refreshButton],
           ),
         ),
-        Text(
-          'Namespaces',
-          style: TextStyle(fontSize: 22),
-        ),
+        SearchableTitle(S.of(context).namespaces,
+            S.of(context).searchByNamespace, searchTextController),
         SingleChildScrollView(
           child: PaginatedDataTable(
               showCheckboxColumn: false,

diff --git a/lib/ui/pulsar/tab/pulsar_details.dart b/lib/ui/pulsar/tab/pulsar_details.dart
@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:paas_dashboard_flutter/generated/l10n.dart';
 import 'package:paas_dashboard_flutter/route/page_route_const.dart';
+import 'package:paas_dashboard_flutter/ui/component/searchable_title.dart';
 import 'package:paas_dashboard_flutter/ui/util/data_cell_util.dart';
 import 'package:paas_dashboard_flutter/ui/util/exception_util.dart';
 import 'package:paas_dashboard_flutter/ui/util/form_util.dart';
@@ -65,26 +66,18 @@ class PulsarTenantsState extends State<PulsarTenantsWidget> {
           vm.fetchTenants();
         },
         child: Text(S.of(context).refresh));
-    var searchBox = Container(
-      width: 300,
-      child: TextField(
-        controller: searchTextController,
-      ),
-    );
     var body = ListView(
       children: <Widget>[
         Container(
           height: 50,
           child: ListView(
             scrollDirection: Axis.horizontal,
             shrinkWrap: true,
-            children: [formButton, refreshButton, searchBox],
+            children: [formButton, refreshButton],
           ),
         ),
-        Text(
-          'Tenants',
-          style: TextStyle(fontSize: 22),
-        ),
+        SearchableTitle(S.of(context).tenants, S.of(context).searchByTenant,
+            searchTextController),
         SingleChildScrollView(
           child: PaginatedDataTable(
               showCheckboxColumn: false,