Complete core mini program flows

pets-fe/pages/tasks/tasks.js

@@ -1,11 +1,13 @@
 const { secure, toast } = require("../../utils/api");
-const today = () => new Date().toLocaleDateString("sv-SE");
+const { localDate, shiftDate } = require("../../utils/date");
 Page({
   data: {
     pets: [],
     tasks: [],
-    date: today(),
+    date: localDate(),
     showForm: false,
+    editingId: "",
+    saving: false,
     title: "",
     petIndex: 0,
     category: "food",
@@ -17,11 +19,13 @@ Page({
     this.load();
   },
   async load() {
+    const date = this.data.date;
     try {
       const [pets, result] = await Promise.all([
         secure("/pets"),
-        secure("/tasks?date=" + this.data.date),
+        secure("/tasks?date=" + date),
       ]);
+      if (date !== this.data.date) return;
       const tasks = result.items.map((t) => ({
         ...t,
         petName: (pets.find((p) => p.id === t.pet_id) || {}).name || "宠物",
@@ -42,17 +46,50 @@ Page({
         date: this.data.date,
         completed: !t.completed,
       });
-      this.load();
+      await this.load();
     } catch (err) {
       toast(err);
     }
   },
   open() {
-    this.setData({ showForm: true });
+    if (!this.data.pets.length) {
+      wx.showToast({ title: "请先添加宠物", icon: "none" });
+      return;
+    }
+    this.setData({
+      showForm: true,
+      editingId: "",
+      title: "",
+      petIndex: 0,
+      category: "food",
+      time_of_day: "08:30",
+      repeat_rule: "daily",
+    });
   },
   close() {
     this.setData({ showForm: false });
   },
+  edit(e) {
+    const task = this.data.tasks[e.currentTarget.dataset.index];
+    const petIndex = this.data.pets.findIndex((pet) => pet.id === task.pet_id);
+    this.setData({
+      showForm: true,
+      editingId: task.id,
+      title: task.title,
+      petIndex: Math.max(petIndex, 0),
+      category: task.category,
+      time_of_day: task.time_of_day,
+      repeat_rule: task.repeat_rule,
+    });
+  },
+  changeDay(e) {
+    this.setData({ date: shiftDate(this.data.date, Number(e.currentTarget.dataset.days)) });
+    this.load();
+  },
+  showToday() {
+    this.setData({ date: localDate() });
+    this.load();
+  },
   field(e) {
     this.setData({ [e.currentTarget.dataset.key]: e.detail.value });
   },
@@ -69,22 +106,26 @@ Page({
     this.setData({ repeat_rule: e.detail.value });
   },
   async save() {
+    if (this.data.saving) return;
     if (!this.data.pets.length || !this.data.title.trim()) {
       wx.showToast({ title: "请选择宠物并填写任务名", icon: "none" });
       return;
     }
+    this.setData({ saving: true });
     try {
-      await secure("/tasks", "POST", {
+      await secure(this.data.editingId ? "/tasks/" + this.data.editingId : "/tasks", this.data.editingId ? "PUT" : "POST", {
         pet_id: this.data.pets[this.data.petIndex].id,
-        title: this.data.title,
+        title: this.data.title.trim(),
         category: this.data.category,
         time_of_day: this.data.time_of_day,
         repeat_rule: this.data.repeat_rule,
       });
-      this.setData({ showForm: false, title: "" });
-      this.load();
+      this.setData({ showForm: false, editingId: "" });
+      await this.load();
     } catch (e) {
       toast(e);
+    } finally {
+      this.setData({ saving: false });
     }
   },
   async remove(e) {

pets-fe/pages/tasks/tasks.wxml

@@ -2,7 +2,7 @@
   <view class="eyebrow">LITTLE THINGS, BIG LOVE</view>
   <view class="title">今日小任务 ☑</view>
   <view class="summary">
-    <view>今天也要照顾好它们</view>
+    <view>这一天也要照顾好它们</view>
     <strong>
       {{done}}
       <text>/ {{tasks.length}}</text>
@@ -15,6 +15,11 @@
     <text class="section-title">{{date}} 的日常</text>
     <text class="add" bindtap="open">＋ 添加任务</text>
   </view>
+  <view class="date-nav">
+    <text data-days="-1" bindtap="changeDay">‹ 前一天</text>
+    <text bindtap="showToday">回到今天</text>
+    <text data-days="1" bindtap="changeDay">后一天 ›</text>
+  </view>
   <view class="card list">
     <view wx:for="{{tasks}}" wx:key="id" class="task">
       <view
@@ -27,12 +32,13 @@
       <view class="icon">
         {{item.category==='water'?'💧':item.category==='food'?'🥣':'🐾'}}
       </view>
-      <view class="info" data-index="{{index}}" bindtap="toggle">
+      <view class="info" data-index="{{index}}" bindtap="edit">
         <strong>{{item.title}}</strong>
         <text>
           {{item.petName}} · {{item.time_of_day}} ·
           {{item.repeat_rule==='daily'?'每天':item.repeat_rule==='weekdays'?'工作日':'周末'}}
         </text>
+        <text>点此编辑</text>
       </view>
       <text class="remove" data-index="{{index}}" bindtap="remove">×</text>
     </view>
@@ -45,7 +51,7 @@
 <view wx:if="{{showForm}}" class="overlay">
   <view class="sheet">
     <view class="row">
-      <strong>新建小任务</strong>
+      <strong>{{editingId?'编辑小任务':'新建小任务'}}</strong>
       <text bindtap="close">×</text>
     </view>
     <view class="field">
@@ -128,7 +134,7 @@
         </label>
       </radio-group>
     </view>
-    <button class="primary" bindtap="save">保存任务</button>
+    <button class="primary" bindtap="save" disabled="{{saving}}">保存任务</button>
   </view>
 </view>
 <tab-bar current="/pages/tasks/tasks" />

pets-fe/pages/tasks/tasks.wxss

@@ -33,6 +33,13 @@
   font-size: 24rpx;
   font-weight: 700;
 }
+.date-nav {
+  display: flex;
+  justify-content: space-between;
+  color: #327c5e;
+  font-size: 23rpx;
+  margin: 0 0 22rpx;
+}
 .list {
   padding: 8rpx 26rpx;
 }