feat

app-angular/src/app/app.component.html

@@ -10,6 +10,10 @@
             <ion-icon name="footsteps"></ion-icon>
             AI
         </ion-tab-button>
+        <ion-tab-button routerLink="/lesson/page-test">
+            <ion-icon name="logo-octocat"></ion-icon>
+            测试
+          </ion-tab-button>
       <ion-tab-button routerLink="/lesson/lesson">
             <ion-icon name="chatbubbles"></ion-icon>
             禁忌

app-angular/src/modules/lesson/lesson-routing.module.ts

@@ -16,6 +16,7 @@ import { PageChatComponent } from './page-chat/page-chat.component';
 import { authGuard } from '../user/guard-auth/auth.guard';
 import { PageLessonComponent } from './page-lesson/page-lesson.component';
 import { PageLessonDetailComponent } from './page-lesson-detail/page-lesson-detail.component';
+import { PageTestComponent } from './page-test/page-test.component';
 
 
 const routes: Routes = [
@@ -26,6 +27,7 @@ const routes: Routes = [
   { path: 'lesson', component: PageLessonComponent },
   { path: 'lesson/detail', component: PageLessonDetailComponent },
   { path: 'page-chat', component: PageChatComponent },
+  { path: 'page-test', component: PageTestComponent }, 
   { path: 'they/detail', component: TheyDetailComponent },
   { path: 'community/scienceDetail', component: ScienceDetailComponent },
   { path: 'community/share', component: ShareComponent },

app-angular/src/modules/lesson/lesson.module.ts

@@ -19,6 +19,7 @@ import { UserCollectionComponent } from './user-collection/user-collection.compo
 import { PageChatComponent } from './page-chat/page-chat.component';
 import { PageLessonDetailComponent } from './page-lesson-detail/page-lesson-detail.component';
 import { PageLessonComponent } from './page-lesson/page-lesson.component';
+import { PageTestComponent } from './page-test/page-test.component';
 
 @NgModule({
   declarations: [
@@ -37,6 +38,7 @@ import { PageLessonComponent } from './page-lesson/page-lesson.component';
     PageChatComponent,
     PageLessonDetailComponent,
     PageLessonComponent,
+    PageTestComponent,
 
 
 

app-angular/src/modules/lesson/page-chat/page-chat.component.html

@@ -90,7 +90,7 @@
                     <ion-input label="年龄" type="number" placeholder=""></ion-input>
                 </ion-item>
                 <ion-item>
-                    <ion-input label="身高（cm）" type="number" placeholder=""></ion-input>
+                    <ion-input label="身长（cm）" type="number" placeholder=""></ion-input>
                 </ion-item>
                 <ion-item>
                     <ion-input label="体重（kg）" type="number" placeholder=""></ion-input>
@@ -107,7 +107,7 @@
                     </ion-select>
                 </ion-item>
                 <ion-item>
-                    <ion-textarea label="你是否有其他信息或补充" labelPlacement="floating" placeholder="Enter text"></ion-textarea>
+                    <ion-textarea label="你是否有其他信息或补充" labelPlacement="floating" placeholder=" "></ion-textarea>
                 </ion-item>
             </ion-list>
             <!-- <div style="display: flex; justify-content: center;"> -->

app-angular/src/modules/lesson/page-lesson/page-lesson.component.ts

@@ -43,7 +43,7 @@ export class PageLessonComponent {
     this.courseList = await this.getMenuData();
   }
   // 触底加载函数逻辑
-  pageSize = 5
+  pageSize = 10
   skip: number = 0 // 跳过多少条进行加载
   async onBottomLoad(event: any, infiScroll: any) {
     console.log("onBottomLoad", this.courseList.length)

app-angular/src/modules/lesson/page-test/page-test.component.html

@@ -0,0 +1,65 @@
+<div class="ion-page">
+    <ion-header>
+        <ion-segment value="all">
+            <ion-segment-button value="all" (click)="changeTab('all')">
+                <ion-label>不同MBTI宠物</ion-label>
+            </ion-segment-button>
+            <ion-segment-button value="favorites" (click)="changeTab('favorites')">
+                <ion-label>宠物测试</ion-label>
+            </ion-segment-button>
+        </ion-segment>
+    </ion-header>
+
+    <ion-content>
+        <ng-container *ngIf="currentTab === 'all'">
+            <h4 style="text-align: center;padding: 15px;">宠物mbti</h4>
+
+            <ion-content>
+                <ion-grid>
+                    <ion-row>
+                        <ng-container *ngFor="let course of courseList; let i = index">
+                            <ng-container *ngIf="i % 2 === 0">
+                                <ion-col size="5.5">
+                                        <img alt="Silhouette of mountains" [src]="course?.get('petImg')" />
+                                        <ion-card-header>
+                                            <ion-card-title>{{course?.get("petName")}}</ion-card-title>
+                                        </ion-card-header>
+                                </ion-col>
+                                <ion-col size="5.5" *ngIf="i + 1 < courseList.length">
+                                        <img alt="Silhouette of mountains" [src]="courseList[i + 1].get('petImg')" />
+                                        <ion-card-header>
+                                            <ion-card-title>{{courseList[i +1].get("petName")}}</ion-card-title>
+                                        </ion-card-header>
+                                </ion-col>
+                            </ng-container>
+                        </ng-container>
+                    </ion-row>
+                </ion-grid>
+            </ion-content>
+        </ng-container>
+
+
+
+
+        <!-- 宠物测试 -->
+        <ng-container *ngIf="currentTab === 'favorites'">
+            <h4 style="text-align: center;padding: 15px;">请填写以下信息，以便为你宠物测试</h4>
+            <ion-list>
+                <ion-item>
+                    <ion-select [value]="planOptions.targets" (ionChange)="setOption('targets',$event)"
+                        aria-label="object" placeholder="选择你的偏好" [multiple]="true">
+                        <ion-select-option value="慵懒休闲">慵懒休闲</ion-select-option>
+                        <ion-select-option value="活泼好动">活泼好动</ion-select-option>
+                        <ion-select-option value="独立自主">独立自主</ion-select-option>
+                    </ion-select>
+                </ion-item>               
+                <ion-item>
+                    <ion-textarea label="你是否有其他信息或补充" labelPlacement="floating" placeholder=" "></ion-textarea>
+                </ion-item>
+            </ion-list>
+            <ion-button  expand="block">生成</ion-button>
+
+        </ng-container>
+        <div class="navfooter"> </div>
+    </ion-content>
+</div>

app-angular/src/modules/lesson/page-test/page-test.component.scss

@@ -0,0 +1,96 @@
+// AI禁忌事项
+.page {
+    background-color: #f2f2f2;
+    height: calc(100% - 114px);
+    width: 100vw;
+    overflow-y: scroll;
+}
+
+.footer {
+    position: fixed;
+    bottom: 60px;
+    width: 100vw;
+}
+
+.chat-container {
+    padding: 10px;
+
+}
+
+.message-container {
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: 10px;
+}
+
+.message-container-mine {
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: 10px;
+    flex-direction: row-reverse;
+}
+
+.avatar-left {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    margin-right: 10px;
+
+}
+
+.avatar-right {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    margin-left: 10px;
+}
+
+.message-box-left {
+    background-color: #fff;
+    border-radius: 10px;
+    padding: 10px;
+    max-width: 70%;
+}
+
+.message-box-right {
+    background-color: #95ec69;
+    border-radius: 10px;
+    padding: 10px;
+    max-width: 70%;
+}
+
+.message-content {
+    word-wrap: break-word;
+}
+
+.send-container {
+    display: flex;
+    align-items: center;
+    padding: 10px;
+    background-color: #f2f2f2;
+
+}
+
+.message-input {
+    flex: 1;
+    padding: 8px;
+    border: none;
+    border-radius: 20px;
+    background-color: #fff;
+}
+
+.send-button {
+    padding: 8px 15px;
+    border: none;
+    border-radius: 20px;
+    background-color: #38c1f5;
+    color: white;
+    font-weight: bold;
+    cursor: pointer;
+    margin-left: 10px;
+}
+
+.navfooter {
+    width: 100%;
+    height: 120px;
+}

app-angular/src/modules/lesson/page-test/page-test.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageTestComponent } from './page-test.component';
+
+describe('PageTestComponent', () => {
+  let component: PageTestComponent;
+  let fixture: ComponentFixture<PageTestComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [PageTestComponent]
+    });
+    fixture = TestBed.createComponent(PageTestComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

app-angular/src/modules/lesson/page-test/page-test.component.ts

@@ -0,0 +1,60 @@
+import { Component } from '@angular/core';
+import { Router } from '@angular/router';
+  // 引入Parse第三方库
+  import * as Parse from "parse"
+  (Parse as any).serverURL = "http://metapunk.cn:9999/parse"
+  Parse.initialize("dev")
+
+@Component({
+  selector: 'app-page-test', // 组件的选择器，用于在模板中引用组件
+  templateUrl: './page-test.component.html', // 组件的模板文件路径
+  styleUrls: ['./page-test.component.scss'] // 组件的样式文件路径
+})
+  export class PageTestComponent {
+    currentUser = Parse.User.current() // 当前用户对象
+  currentTab: string = 'all'; // 当前选项卡的标识符
+  changeTab(tab: string) {
+    this.currentTab = tab;}
+
+    constructor(private router: Router) { this.initPage(); }
+    courseList: Array<Parse.Object> = []
+    // 首次进入页面，默认加载首批数据
+    async initPage() {
+      this.courseList = await this.getMenuData()
+    }
+    // 数据加载相关函数
+    async getMenuData() {
+      let query = new Parse.Query("PetTest");
+      query.limit(this.pageSize);
+      query.include('courseAuthor')
+
+      if (this.skip) {
+        query.skip(this.skip)
+      }
+      query.addAscending("no")
+      let list = await query.find();
+      console.log(list);
+      return list
+    }
+    
+    planOptions: any = {
+      gender: "未知",
+      targets: []
+    } // 计划选项对象，包含性别和目标属性
+    setOption(key: string, event: any) {
+      this.planOptions[key] = event.detail.value; // 更新计划选项对象的属性值
+    }
+    // 触底加载函数逻辑
+    pageSize = 30
+    skip: number = 0 // 跳过多少条进行加载
+    async onBottomLoad(event: any, infiScroll: any) {
+      console.log("onBottomLoad", this.courseList.length)
+      this.skip = this.courseList.length;
+      let list = await this.getMenuData();
+      this.courseList = this.courseList.concat(list)
+      infiScroll?.complete();
+    }
+    // goLessonDetail(lesson: any) {
+    //   this.router.navigate(["/lesson/test/detail"], { queryParams: lesson })
+    // }
+  }