约定 顶部 烂

lib/home/home_view.dart

@@ -40,7 +40,7 @@ class HomeView extends BaseUI {
   Widget _buildLeftBar(BuildContext context) {
     HomeViewModel provider =
         getProvider(context, listen: false) as HomeViewModel;
-    const double leftBarWidth = 120;
+    const double leftBarWidth = 100;
     double itemHeight = (MediaQuery.of(context).size.height -
             leftBarWidth -
             MediaQuery.of(context).padding.top) /
@@ -60,7 +60,6 @@ class HomeView extends BaseUI {
   }
 
   Widget _buildRightContainer(BuildContext context) {
-
     HomeViewModel provider =
         getProvider(context, listen: false) as HomeViewModel;
     return Expanded(
@@ -76,6 +75,7 @@ class HomeView extends BaseUI {
           ),
         ],
         child: PageView(
+          physics: const NeverScrollableScrollPhysics(),
           controller: provider.pageController,
           children: _buildPageViews(context, provider),
         ),
@@ -137,15 +137,15 @@ class HomeView extends BaseUI {
                 provider.currentIndex == index
                     ? "images/tabbar/${provider.tabIcons[index]}_select.png"
                     : "images/tabbar/${provider.tabIcons[index]}_normal.png",
-                width: 23,
+                width: 20,
-                height: 27,
+                height: 23,
               ),
-              const SizedBox(height: 5),
+              const SizedBox(height: 3),
               Text(
                 provider.tabTitles[index],
                 style: provider.currentIndex == index
-                    ? const TextStyle(color: Colors.white, fontSize: 14)
+                    ? const TextStyle(color: Colors.white, fontSize: 12)
-                    : const TextStyle(color: Colors.grey, fontSize: 14),
+                    : const TextStyle(color: Colors.grey, fontSize: 12),
               )
             ],
           ),

lib/home/reserve_view.dart

@@ -7,8 +7,13 @@ import '../common/base/provider.dart';
 class ReserveView extends BaseUI {
   @override
   Widget buildBody(BuildContext context) {
-    return Center(
+    ReserveViewModel provider =
-      child: Text("Reserve"),
+        getProvider(context, listen: false) as ReserveViewModel;
+    return Column(
+      children: [
+        _buildTopDateBar(context, provider),
+        Expanded(child: _buildContentView(context, provider)),
+      ],
     );
   }
 
@@ -26,4 +31,202 @@ class ReserveView extends BaseUI {
   AppBar? getAppBar(BuildContext context) {
     return null;
   }
+
+  Widget _buildTopDateBar(BuildContext context, ReserveViewModel provider) {
+    return Padding(
+      padding: const EdgeInsets.fromLTRB(15, 5, 15, 5),
+      child: Row(
+        children: [
+          _buildDateItem(context, provider),
+          _buildDateSelectContent(context, provider),
+          const SizedBox(
+            width: 15,
+          ),
+          InkWell(
+              onTap: () {},
+            child: SizedBox(
+              width: 40,
+              height: 40,
+              child: Center(
+                child: Image.asset(
+                  "images/reserve/lock.png",
+                  width: 24,
+                  height: 24,
+                ),
+              ),
+            ),
+          ),
+          const SizedBox(
+            width: 5,
+          ),
+          InkWell(
+            onTap: () {},
+            child: SizedBox(
+              width: 40,
+              height: 40,
+              child: Center(
+                child: Image.asset(
+                  "images/reserve/phone.png",
+                  width: 24,
+                  height: 24,
+                ),
+              ),
+            ),
+          ),
+          const SizedBox(
+            width: 5,
+          ),
+          InkWell(
+            onTap: () {},
+            child: const SizedBox(
+              width: 40,
+              height: 40,
+              child: Center(
+                child: Text("刷新", style: TextStyle(fontSize: 15, color: Colors.blue),),
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildContentView(BuildContext context, ReserveViewModel provider) {
+    return Row(
+      children: [],
+    );
+  }
+
+  Widget _buildDateItem(BuildContext context, ReserveViewModel provider) {
+    return Container(
+      decoration: BoxDecoration(
+        borderRadius: BorderRadius.circular(5),
+        border: Border.all(color: const Color(0xffafafaf), width: 1),
+      ),
+      height: 40,
+      padding: const EdgeInsets.fromLTRB(10, 0, 10, 0),
+      child: Row(
+        children: [
+          Image.asset(
+            "images/reserve/date.png",
+            width: 24,
+            height: 24,
+          ),
+          const SizedBox(width: 7),
+          Text(
+            provider.getCurrentDate(),
+            style: const TextStyle(color: Color(0xff333333), fontSize: 14),
+          )
+        ],
+      ),
+    );
+  }
+
+  // Widget _buildCallRecordListWidget(BuildContext context, ReserveViewModel provider) {
+  //   return ListView.builder(
+  //     itemCount: provider.callRecordList.length,
+  //     itemBuilder: (context, index) {
+  //       return _buildCallRecordItem(context, provider.callRecordList[index]);
+  //     },
+  //   );
+  // }
+
+  Widget _buildDateSelectContent(
+      BuildContext context, ReserveViewModel provider) {
+    return Row(
+      children: [
+        _buildDateSelectItem(context,
+            day: provider.getOffsetDay(0),
+            week: provider.getOffsetWeekday(0),
+            isToday: true),
+        _buildDateSelectItem(context,
+            day: provider.getOffsetDay(1), week: provider.getOffsetWeekday(1)),
+        _buildDateSelectItem(context,
+            day: provider.getOffsetDay(2), week: provider.getOffsetWeekday(2)),
+      ],
+    );
+  }
+
+  Widget _buildDateSelectItem(
+    BuildContext context, {
+    String day = "",
+    String week = "",
+    isToday = false,
+  }) {
+    const double itemHeight = 45;
+    const double btnWidth = 60;
+    return Container(
+        height: itemHeight,
+        margin: const EdgeInsets.only(left: 15),
+        padding: const EdgeInsets.fromLTRB(10, 0, 6, 0),
+        decoration: BoxDecoration(
+          borderRadius: BorderRadius.circular(5),
+          border: Border.all(
+              color:
+                  isToday ? const Color(0xff318AFE) : const Color(0xffafafaf),
+              width: 1),
+        ),
+        child: Row(
+          children: [
+            Column(
+              mainAxisAlignment: MainAxisAlignment.center,
+              children: [
+                Text(
+                  day,
+                  style: TextStyle(
+                    color: isToday
+                        ? const Color(0xff6A8DC6)
+                        : const Color(0xff333333),
+                    fontSize: 13,
+                  ),
+                ),
+                Text(
+                  week,
+                  style: TextStyle(
+                    color: isToday
+                        ? const Color(0xff6A8DC6)
+                        : const Color(0xff333333),
+                    fontSize: 13,
+                  ),
+                ),
+              ],
+            ),
+            const SizedBox(width: 10),
+            Container(
+              width: 1,
+              height: itemHeight,
+              color: const Color(0xffafafaf),
+            ),
+            InkWell(
+              onTap: () {},
+              child: const SizedBox(
+                width: btnWidth,
+                child: Center(
+                  child: Text(
+                    "午餐",
+                    style: TextStyle(fontSize: 16, color: Color(0xff333333)),
+                  ),
+                ),
+              ),
+            ),
+            Container(
+              width: 1,
+              height: itemHeight,
+              color: const Color(0xffafafaf),
+            ),
+            InkWell(
+              onTap: () {},
+              child: const SizedBox(
+                width: btnWidth,
+                child: Center(
+                  child: Text(
+                    "晚餐",
+                    style: TextStyle(fontSize: 16, color: Color(0xff333333)),
+                  ),
+                ),
+              ),
+            ),
+          ],
+        ));
+  }
 }

lib/home/reserve_view_model.dart

@@ -1,3 +1,36 @@
 import 'package:cashier_reserve/common/base/ui_model.dart';
 
-class ReserveViewModel extends BaseUIModel {}
+class ReserveViewModel extends BaseUIModel {
+  Map<int, String> weekdayMap = {
+    1: "星期一",
+    2: "星期二",
+    3: "星期三",
+    4: "星期四",
+    5: "星期五",
+    6: "星期六",
+    7: "星期日",
+  };
+
+  Map<int, String> dayInfoMap = {
+    0: "今",
+    1: "明",
+    2: "后",
+  };
+
+  String getCurrentDate() {
+    DateTime now = DateTime.now();
+    return "${now.year}/${now.month}/${now.day}";
+  }
+
+  String getOffsetDay(int offset) {
+    DateTime now = DateTime.now();
+    DateTime offsetDay = now.add(Duration(days: offset));
+    return "${dayInfoMap[offset]}/${offsetDay.day}";
+  }
+
+  String getOffsetWeekday(int offset) {
+    DateTime now = DateTime.now();
+    DateTime offsetDay = now.add(Duration(days: offset));
+    return weekdayMap[offsetDay.weekday] ?? "";
+  }
+}

pubspec.yaml

@@ -73,6 +73,8 @@ flutter:
 
     - images/tabbar/
 
+    - images/reserve/
+
   # An image asset can refer to one or more resolution-specific "variants", see
   # https://flutter.dev/to/resolution-aware-images