new26

travel-app/src/app/feedback/feedback.component.html

@@ -0,0 +1,42 @@
+<ion-header>
+  <ion-toolbar color="primary">
+    <ion-button slot="start">
+      <ion-back-button defaultHref="/home"></ion-back-button>
+    </ion-button>
+    <ion-title>意见反馈</ion-title>
+    <ion-button slot="end">
+      <ion-menu-toggle auto-hide="false"></ion-menu-toggle>
+    </ion-button>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content class="feedback-page">
+  <form #feedbackForm="ngForm" novalidate>
+    <ion-list lines="none">
+      <ion-item>
+        <ion-label stacked>所属分类(必填)</ion-label>
+        <ion-select [(ngModel)]="selectedCategory" name="selectedCategory" interface="popover" required>
+          <ion-select-option *ngFor="let category of categories" [value]="category">{{ category }}</ion-select-option>
+        </ion-select>
+      </ion-item>
+
+      <ion-item>
+        <ion-textarea placeholder="请详细描述您的问题" [(ngModel)]="feedbackText" name="FeedbackText" maxlength="400" required></ion-textarea>
+      </ion-item>
+
+      <div padding-horizontal>
+        <span>{{ feedbackText.length }}/400</span>
+      </div>
+
+      <ion-item>
+        <ion-icon ios="ios-images-outline" md="md-images-outline" item-start></ion-icon>
+        <input type="file" (change)="onFileChange($event)" multiple accept="image/*">
+      </ion-item>
+    </ion-list>
+
+    <div padding>
+      <ion-button expand="block" color="secondary" type="submit" [disabled]="!feedbackForm.valid">提交反馈</ion-button>
+    </div>
+  </form>
+</ion-content>
+

travel-app/src/app/feedback/feedback.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+
+import { FeedbackComponent } from './feedback.component';
+
+describe('FeedbackComponent', () => {
+  let component: FeedbackComponent;
+  let fixture: ComponentFixture<FeedbackComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [FeedbackComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(FeedbackComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

travel-app/src/app/feedback/feedback.component.ts

@@ -0,0 +1,35 @@
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { Component, OnInit } from '@angular/core';
+import { IonHeader, IonToolbar, IonTitle, IonContent, IonList, IonItem, IonButton, IonBackButton, IonMenuToggle, IonSelect, IonSelectOption, IonLabel, IonTextarea, IonIcon, } from '@ionic/angular/standalone';
+import { ExploreContainerComponent } from '../explore-container/explore-container.component';
+import { FormBuilder } from '@angular/forms';
+import { CommonModule } from '@angular/common';
+@Component({
+  selector: 'app-feedback',
+  templateUrl: './feedback.component.html',
+  styleUrls: ['./feedback.component.scss'],
+  standalone: true,
+  imports: [
+    IonHeader, IonContent, IonToolbar, IonTitle, ExploreContainerComponent,
+    IonButton, IonBackButton, IonMenuToggle, IonSelect, IonSelectOption, IonLabel,
+    IonTextarea, IonIcon,
+    IonList, IonItem,
+    FormsModule,
+    ReactiveFormsModule,CommonModule
+  ]
+})
+export class FeedbackComponent implements OnInit {
+  selectedCategory = '';
+  feedbackText = '';
+  categories = ['功能问题', '性能问题', '用户体验', '其他'];
+
+  constructor(private fb: FormBuilder) { }
+  onFileChange(event: any) {
+  }
+
+  submitFeedback() {
+    console.log('Submitting feedback:', this.selectedCategory, this.feedbackText);
+  }
+
+  ngOnInit() {}
+}

travel-app/src/app/tab4/tab4.page.html

@@ -129,10 +129,10 @@
 
       <ion-col size="3" size-md="4" size-lg="2">
           <ion-icon name="notifications" size="large"start></ion-icon>
-          <p>我的创作</p>
+          <p>我的消息</p>
       </ion-col>
 
-      <ion-col size="3" size-md="4" size-lg="2">
+      <ion-col  (click)="gotoFeedback()" size="3" size-md="4" size-lg="2">
           <ion-icon name="document" size="large"></ion-icon>
           <p>问题建议</p>
       </ion-col>

travel-app/src/app/tab4/tab4.page.ts

@@ -5,7 +5,7 @@ import { addIcons } from 'ionicons';
 import { documentText,calendar,chatboxEllipses,informationCircle,settings,create,
   gift,walk,notifications,document,call,shareSocial
 } from 'ionicons/icons';
-
+import { Router } from '@angular/router';
 @Component({
   selector: 'app-tab4',
   templateUrl: 'tab4.page.html',
@@ -14,19 +14,22 @@ import { documentText,calendar,chatboxEllipses,informationCircle,settings,create
   imports: [IonHeader,IonContent,IonToolbar, IonTitle, ExploreContainerComponent,IonCard,
     IonCardContent,IonCardHeader,IonCardSubtitle,IonCardTitle,
     IonIcon,IonNote,IonThumbnail,IonGrid,IonRow,IonCol,IonButton,
-    IonList, IonItem, IonLabel, IonAvatar],
+    IonList, IonItem, IonLabel, IonAvatar]
 })
 
 
 
 export class Tab4Page {
+  Router: any;
 
-  constructor() {
+  constructor(private router: Router) {
     addIcons({ documentText,calendar,chatboxEllipses,informationCircle,settings,create,
       gift,walk,notifications,document,call,shareSocial
     });
   }
 
-
+  gotoFeedback(){
+    this.router.navigate(['/tabs/Feedback'])
+  }
 
 }

travel-app/src/app/tabs/tabs.page.html

@@ -6,13 +6,13 @@
     </ion-tab-button>
 
     <ion-tab-button tab="tab2" href="/tabs/tab2">
-      <ion-icon aria-hidden="true" name="reader"></ion-icon>
-      <ion-label>行程</ion-label>
+      <ion-icon aria-hidden="true" name="chatbubbles"></ion-icon>
+      <ion-label>小助手</ion-label>
     </ion-tab-button>
 
     <ion-tab-button tab="tab3" href="/tabs/tab3">
-      <ion-icon aria-hidden="true" name="chatbubbles"></ion-icon>
-      <ion-label>小助手</ion-label>
+      <ion-icon aria-hidden="true" name="aperture"></ion-icon>
+      <ion-label>社区</ion-label>
     </ion-tab-button>
 
     <ion-tab-button tab="tab4" href="/tabs/tab4">

travel-app/src/app/tabs/tabs.page.ts

@@ -1,7 +1,7 @@
 import { Component, EnvironmentInjector, inject } from '@angular/core';
 import { IonTabs, IonTabBar, IonTabButton, IonIcon, IonLabel } from '@ionic/angular/standalone';
 import { addIcons } from 'ionicons';
-import { home, reader, chatbubbles,person} from 'ionicons/icons';
+import { home, chatbubbles,aperture,person} from 'ionicons/icons';
 
 @Component({
   selector: 'app-tabs',
@@ -14,6 +14,6 @@ export class TabsPage {
   public environmentInjector = inject(EnvironmentInjector);
 
   constructor() {
-    addIcons({ home, reader, chatbubbles,person});
+    addIcons({ home, chatbubbles,aperture,person});
   }
 }

travel-app/src/app/tabs/tabs.routes.ts

@@ -31,6 +31,11 @@ export const routes: Routes = [
         loadComponent: () =>
           import('../explore-container/explore-container.component').then((m) => m.ExploreContainerComponent),
       },
+      {
+        path: 'Feedback',
+        loadComponent: () =>
+          import('../feedback/feedback.component').then((m) => m.FeedbackComponent),
+      },
       {
         path: 'recommend',
         loadComponent: () =>