feat(tab1): 添加生成器列表并优化页面布局

book-app/src/app/page-inquiry/page-inquiry.component.html

@@ -1,10 +1,10 @@
 <ion-content>
 
-  <h1>科室</h1>
+  <h1>类型</h1>
   <ion-input  [value]="keshi" (ionInput)="keshiInput($event)"></ion-input>
 
   <!-- 文本域：生成提示词 -->
-  <h1>症状的描述</h1>
+  <h1>描述</h1>
   <ion-textarea [value]="userPrompt" (ionInput)="promptInput($event)" placeholder="文本提示词" autoGrow="true"></ion-textarea>
   
   <!-- 按钮：执行消息生成函数 -->

book-app/src/app/page-inquiry/page-inquiry.component.ts

@@ -17,12 +17,12 @@ export class PageInquiryComponent  implements OnInit {
   constructor() {}
   ngOnInit(){}
   // 用户输入提示词
-  keshi:string = "武器类型"
+  keshi:string = "如：武器，功法，名称"
   keshiInput(ev:any){
     this.keshi = ev.detail.value;
   }
   // 用户输入提示词
-  userPrompt:string = "给你的武器一点描述"
+  userPrompt:string = "进行描述"
   promptInput(ev:any){
     this.userPrompt = ev.detail.value;
   }
@@ -34,7 +34,7 @@ export class PageInquiryComponent  implements OnInit {
     console.log("create")
 
     let PromptTemplate = `
-    您作为一名专业的小说作者，请您根据用户描述的要求，给这个${this.keshi}起一个双音节词的炫酷的名称
+    您作为一名专业的小说作者，请您根据用户描述的要求，给这个${this.keshi}取一个名字，并进行介绍
     以下是用户的口述：${this.userPrompt}
     `
 

book-app/src/app/tab1/tab1.page.html

@@ -7,7 +7,35 @@
 </ion-header>
 
 <ion-content [fullscreen]="true">
-    <ion-button expand="full" (click)="getPlantingPlan()">获取种植方案</ion-button>
+  <h1>
+    生成器列表
+  </h1>
+  <ion-button expand="full" class="custom-button">
+    点击我
+    <img src="1.png" alt="底部图片" class="button-image" />
+  </ion-button>
+  <div class="inquery" style="margin-top: 10px">
+    <div class="inquery-ai">
+    <ion-button expand="full" (click)="getPlantingPlan()">
+    <img src="1.png" alt="" slot="start">
+    取名生成器</ion-button>
+</div>
 
-  <app-explore-container name="Tab 1 page"></app-explore-container>
+<div class="inquery-human">
+  <ion-button expand="full" (click)="getPlantingPlan()">
+    属性生成器
+  </ion-button>
+</div>
+
+
+  <div class="inquery-ai">
+  <ion-button expand="full" (click)="getPlantingPlan()">内容生成器</ion-button>
+</div>
+
+<div class="inquery-human">
+    <ion-button expand="full" (click)="getPlantingPlan()">图片生成器</ion-button>
+  </div>
+</div>
+
+  
 </ion-content>

book-app/src/app/tab1/tab1.page.scss

@@ -0,0 +1,41 @@
+
+.inquery{
+  width:100%;
+  height:100px;
+  // background-color: #fd0000;
+  padding: 5px 0px;
+  box-sizing: border-box;
+  margin: 0px 0px;
+  ion-button{
+      width: 100%;
+      height: 100%;
+      background-color: crimson;
+      display: inline-block;
+  }
+  .inquery-ai{
+      height: 100%;
+      width: 48%;
+      display: inline-block;
+      margin: 0;
+      padding: 0;
+  }
+  .inquery-human{
+      height: 100%;
+      width: 48%;
+      display: inline-block;
+      margin-left: 2%;
+      padding: 0;
+  }
+}
+.custom-button {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+  
+  .button-image {
+    margin-top: 8px; /* 调整图片与按钮文本之间的间距 */
+    width: 24px; /* 设置图片宽度 */
+    height: auto; /* 保持图片比例 */
+  }

book-app/src/app/tab1/tab1.page.ts

@@ -20,6 +20,9 @@ export class Tab1Page {
       // 这里可以调用API或服务来获取种植方案
     
     }
+  goToPage2(){
+    this.router.navigate(['/tabs/page-test'])
+  }
   
  
 }