创建 服务列表界面

taskservice/lib/main.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import 'package:taskservice/src/acclist/page_acclist.dart';
 import 'package:taskservice/src/crtacc/page_crtacc.dart';
 import 'package:taskservice/src/home/home.dart';
+import 'package:taskservice/src/service/page_servicelist.dart';
 
 void main() {
   runApp(MyApp());
@@ -19,6 +20,8 @@ class MyApp extends StatelessWidget {
           return CupertinoPageRoute(builder: (context)=> CreateAccPage());
         }else if(name == '$AccountListPage') {
           return CupertinoPageRoute(builder: (context)=> AccountListPage());
+        }else if(name == '$CreateServiceList') {
+          return CupertinoPageRoute(builder: (context)=> CreateServiceList());
         }
         return null;
       },

taskservice/lib/src/crtacc/page_crtacc.dart

@@ -6,6 +6,7 @@ import 'package:taskservice/Model/JXMemberModel.dart';
 import 'package:taskservice/Model/JXServiceModel.dart';
 import 'package:taskservice/database/DataBase.dart';
 import 'package:taskservice/src/custom_widgets.dart';
+import 'package:taskservice/src/service/page_servicelist.dart';
 
 class CreateAccPage extends StatefulWidget {
   @override
@@ -90,7 +91,10 @@ class _CreateAccPageState extends State<CreateAccPage> {
                       )),
                   margin: EdgeInsets.symmetric(vertical: 12, horizontal: 80),
                   child: InkWell(
-                    onTap: () => null,
+                    onTap: () {
+                      /*跳转到服务*/
+                      Navigator.of(context).pushNamed('$CreateServiceList');
+                    },
                     child: Container(
                       padding: EdgeInsets.all(8),
                       child: Text(
@@ -112,39 +116,46 @@ class _CreateAccPageState extends State<CreateAccPage> {
 
   SliverList buildItemsPart() {
     return SliverList(
-        delegate: SliverChildBuilderDelegate((BuildContext context, int index) {
-      if (index <= services.length - 1) {
-        var service = services[index];
-        return Container(
-          padding: EdgeInsets.symmetric(horizontal: 16),
-          child: Column(
-            children: <Widget>[
-              SizedBox(height: 8,),
-              Row(
-                mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                children: <Widget>[
-                  Text('类型: ${service.kind}'),
-                  Text('周期: ${service.cycle}${service.cycleUnit}'),
-                ],
-              ),
-              SizedBox(height: 20,),
-              Row(
-                children: <Widget>[
-                  Text('备注 ${service.remark}'),
-                ],
-              ),
-              SizedBox(height: 8,),
-              Divider(
-                height: 2,
-                thickness: 2,
-              ),
-            ],
-          ),
-        );
-      } else {
-        return null;
-      }
-    }));
+      delegate: SliverChildBuilderDelegate((BuildContext context, int index) {
+        if (index <= services.length - 1) {
+          var service = services[index];
+          return Container(
+            padding: EdgeInsets.symmetric(horizontal: 16),
+            child: Column(
+              children: <Widget>[
+                SizedBox(
+                  height: 8,
+                ),
+                Row(
+                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                  children: <Widget>[
+                    Text('类型: ${service.kind}'),
+                    Text('周期: ${service.cycle}${service.cycleUnit}'),
+                  ],
+                ),
+                SizedBox(
+                  height: 20,
+                ),
+                Row(
+                  children: <Widget>[
+                    Text('备注 ${service.remark}'),
+                  ],
+                ),
+                SizedBox(
+                  height: 8,
+                ),
+                Divider(
+                  height: 2,
+                  thickness: 2,
+                ),
+              ],
+            ),
+          );
+        } else {
+          return null;
+        }
+      }),
+    );
   }
 
   SliverList buildEditPart() {

taskservice/lib/src/custom_widgets.dart

@@ -6,7 +6,8 @@ import 'package:taskservice/Common/JXColors.dart';
 class MyScaffold extends StatelessWidget {
   final Widget body;
   final String title;
-  MyScaffold({@required this.title, @required this.body});
+  final List <Widget> actions;
+  MyScaffold({@required this.title, this.actions, @required this.body});
   @override
   Widget build(BuildContext context) {
     return Scaffold(
@@ -14,6 +15,7 @@ class MyScaffold extends StatelessWidget {
         centerTitle: true,
         title: Text(title),
         backgroundColor: JXColors.k101E40,
+        actions: actions,
       ),
       body: SafeArea(
         child: body,

taskservice/lib/src/home/home.dart

@@ -93,17 +93,18 @@ class _MyHomePageState extends State<MyHomePage> {
               searchController: _searchController,
             ),
             Expanded(
-                child: Container(
-              color: JXColors.kF0F0F0,
-              child: ListView.builder(
-                padding: EdgeInsets.only(left: 12.0, right: 12.0),
-                itemCount: _cells.length,
-                itemExtent: 138.0,
-                itemBuilder: (BuildContext context, int row) {
-                  return _cells[row];
-                },
+              child: Container(
+                color: JXColors.kF0F0F0,
+                child: ListView.builder(
+                  padding: EdgeInsets.only(left: 12.0, right: 12.0),
+                  itemCount: _cells.length,
+                  itemExtent: 138.0,
+                  itemBuilder: (BuildContext context, int row) {
+                    return _cells[row];
+                  },
+                ),
               ),
-            )),
+            ),
             Row(
               mainAxisAlignment: MainAxisAlignment.start,
               children: <Widget>[
@@ -133,11 +134,13 @@ class _MyHomePageState extends State<MyHomePage> {
                     padding: EdgeInsets.all(0),
                     color: JXColors.k101E40,
                     borderRadius: BorderRadius.all(Radius.circular(0)),
-                    child: Text('会员列表',
-                        style: TextStyle(
-                          fontSize: 14,
-                          color: JXColors.kFFFFFF,
-                        )),
+                    child: Text(
+                      '会员列表',
+                      style: TextStyle(
+                        fontSize: 14,
+                        color: JXColors.kFFFFFF,
+                      ),
+                    ),
                   ),
                 ),
               ],

taskservice/lib/src/service/page_servicelist.dart

@@ -0,0 +1,194 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:taskservice/Common/JXColors.dart';
+import 'package:taskservice/Model/JXServiceModel.dart';
+import '../custom_widgets.dart';
+
+class CreateServiceList extends StatefulWidget {
+  @override
+  _CreateServiceList createState() => _CreateServiceList();
+}
+
+class _CreateServiceList extends State<CreateServiceList> {
+  /*搜索栏*/
+  TextEditingController _searchBar = TextEditingController();
+
+  /*服务数组*/
+  List <JXServiceModel> _baseServices = [];
+  /*cells*/
+  List <JXServiceModel> _displayItems = [];
+
+  @override
+  void initState() {
+    // TODO: implement initState
+    super.initState();
+    _baseServices = [
+      JXServiceModel()
+      ..kind = '清洗'
+      ..cycle = 2
+      ..cycleUnit = '月'
+      ..remark = '带清洁工具',
+      JXServiceModel()
+        ..kind = '除胶'
+        ..cycle = 1
+        ..cycleUnit = '月'
+        ..remark = '带清洁工具',
+      JXServiceModel()
+        ..kind = '换水'
+        ..cycle = 1
+        ..cycleUnit = '月'
+        ..remark = '带清洁工具',
+      JXServiceModel()
+        ..kind = '换滤芯'
+        ..cycle = 4
+        ..cycleUnit = '月'
+        ..remark = '带清洁工具',
+      JXServiceModel()
+        ..kind = '换电机'
+        ..cycle = 5
+        ..cycleUnit = '月'
+        ..remark = '带清洁工具',
+    ];
+    filterSevice();
+  }
+  @override
+  Widget build(BuildContext context) {
+    // TODO: implement build
+    return MyScaffold(
+      title: '服务列表',
+      actions: <Widget>[
+        IconButton(
+          icon: Icon(Icons.add),
+          iconSize: 34.0,
+          tooltip: 'Add',
+          onPressed: addBtnClickAction,
+        ),
+      ],
+      body: Column(
+        children: <Widget>[
+          SearchBar(
+            onTextChanged: (value){
+              filterSevice();
+            },
+            hint: '输入服务类型',
+            onBtnClear: (){
+              setState(() {
+                _searchBar.clear();
+                filterSevice();
+              });
+            },
+            searchController: _searchBar,
+          ),
+          Expanded(
+            child: CustomScrollView(
+              physics: BouncingScrollPhysics(),
+              slivers: <Widget>[
+                SliverList(
+                  delegate: SliverChildBuilderDelegate((BuildContext context, int index) {
+                    if (index < _displayItems.length) {
+                      var service = _displayItems[index];
+                      return theCellBuilder(service);
+                    } else {
+                      return null;
+                    }
+                  }),
+                ),
+              ],
+            ),
+          ),
+          Container(
+            padding: EdgeInsets.all(0),
+            width: MediaQuery.of(context).size.width,
+            height: 44.0,
+            child: CupertinoButton(
+              onPressed: saveBtnClickAction,
+              color: JXColors.k101E40,
+              borderRadius: BorderRadius.all(Radius.circular(0)),
+              child: Text(
+                '保存',
+                style: TextStyle(
+                  fontSize: 14,
+                  color: JXColors.kFFFFFF,
+                ),
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  /*cell*/
+  Widget theCellBuilder(JXServiceModel service) {
+    return GestureDetector(
+      onTap: (){
+        print('click cell, name:${service.kind}');
+      },
+      child: Container(
+        padding: EdgeInsets.symmetric(horizontal: 16),
+        color: JXColors.kFFFFFF,
+        alignment: Alignment.topCenter,
+        child: Column(
+          children: <Widget>[
+            SizedBox(height: 8,),
+            Row(
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              children: <Widget>[
+                Text('类型: ${service.kind}'),
+                Text('周期: ${service.cycle}${service.cycleUnit}'),
+              ],
+            ),
+            SizedBox(height: 20,),
+            Row(
+              children: <Widget>[
+                Text('备注 ${service.remark}'),
+              ],
+            ),
+            SizedBox(height: 8,),
+            Divider(
+              height: 2,
+              thickness: 2,
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  /*筛选服务*/
+  void filterSevice() {
+    String text = _searchBar.text;
+    print('筛选：$text');
+
+    _displayItems.clear();
+    if (text.isEmpty) {
+      _displayItems.addAll(_baseServices);
+    } else {
+      for (JXServiceModel service in _baseServices) {
+        bool has = false;
+        /*filter kind*/
+        if (service.kind.toLowerCase().contains(text.toLowerCase())) {
+          _displayItems.add(service);
+          has = true;
+        }
+      }
+    }
+    setState(() {});
+  }
+
+  /*保存*/
+  void saveBtnClickAction() {
+    print('保存');
+  }
+
+  /*添加信息的服务*/
+  void addBtnClickAction() {
+    print('添加服务');
+    _baseServices.add(JXServiceModel()
+      ..kind = ''
+      ..cycle = 2
+      ..cycleUnit = '日'
+      ..remark = '测试');
+    filterSevice();
+  }
+}