feat: new tab3

myapp/src/app/tab3/tab3.page.html

@@ -65,6 +65,10 @@
 
         <div class="form-buttons">
           <ion-button type="button" fill="outline" (click)="cancelEdit()">取消</ion-button>
+          <ion-button *ngIf="editingField" type="button" color="danger" (click)="confirmDelete()">
+            <ion-icon name="trash" slot="start"></ion-icon>
+            删除
+          </ion-button>
           <ion-button type="submit" [disabled]="!fieldForm.valid">保存</ion-button>
         </div>
       </form>

myapp/src/app/tab3/tab3.page.scss

@@ -15,7 +15,10 @@
     margin-top: 20px;
 
     ion-button {
-      width: 48%;
+      width: 30%;
+      &:nth-child(3) {
+        width: 35%;
+      }
     }
   }
 }
@@ -121,7 +124,7 @@ ion-list {
     ion-avatar {
       width: 50px;
       height: 50px;
-      background: var(--ion-color-light-shade);
+      background: var(--ion-color-light-shage);
     }
 
     h2 {

myapp/src/app/tab3/tab3.page.ts

@@ -24,7 +24,6 @@ interface CropDistribution {
   selector: 'app-tab3',
   templateUrl: './tab3.page.html',
   styleUrls: ['./tab3.page.scss'],
-  standalone: false,
 })
 export class Tab3Page implements OnInit {
   fields: FarmField[] = [];
@@ -99,10 +98,12 @@ export class Tab3Page implements OnInit {
     this.cancelEdit();
   }
 
-  async deleteField(fieldId: string) {
+  async confirmDelete() {
+    if (!this.editingField || !this.editingField.id) return;
+
     const alert = await this.alertCtrl.create({
       header: '确认删除',
-      message: '确定要删除这个农田地块吗？',
+      message: `确定要删除农田 "${this.editingField.name}" 吗？`,
       buttons: [
         {
           text: '取消',
@@ -111,11 +112,7 @@ export class Tab3Page implements OnInit {
         {
           text: '删除',
           handler: async () => {
-            const fieldObject = new CloudObject('FarmField');
-            fieldObject.id = fieldId;
-            await fieldObject.destroy();
-
-            this.fields = this.fields.filter(f => f.id !== fieldId);
+            await this.deleteField(this.editingField!.id);
           }
         }
       ]
@@ -124,6 +121,19 @@ export class Tab3Page implements OnInit {
     await alert.present();
   }
 
+  async deleteField(fieldId: string) {
+    try {
+      const fieldObject = new CloudObject('FarmField');
+      fieldObject.id = fieldId;
+      await fieldObject.destroy();
+
+      this.fields = this.fields.filter(f => f.id !== fieldId);
+      this.cancelEdit();
+    } catch (error) {
+      console.error('删除农田失败:', error);
+    }
+  }
+
   async initializeSampleData() {
     const query = new CloudQuery('FarmField');
     const existingFields = await query.find();