feat: new comp-word-entry

novel-app/src/app/comp-word-entry/comp-word-entry.component.html

@@ -0,0 +1,47 @@
+@for(entry of entryList;let idx = $index;track entry){
+  <ion-card>
+    <ion-card-header>
+          <ion-card-title>{{entry?.title || "新词条"}}
+          <ion-button (click)="deleteEntry(idx)" color="danger">删除</ion-button>
+
+          </ion-card-title>
+    </ion-card-header>
+    <ion-card-content>
+      <ion-list>
+        <ion-item>
+          <ion-select  [value]="entry.type" (ionChange)="onIonChange(entry,'type',$event)" placeholder="词条类型">
+            <ion-select-option value="人物">人物</ion-select-option>
+            <ion-select-option value="道具">道具</ion-select-option>
+            <ion-select-option value="场景">场景</ion-select-option>
+          </ion-select>
+          <ion-input [value]="entry.title" (ionChange)="onIonChange(entry,'title',$event)" placeholder="请输入词条名称"></ion-input>
+        </ion-item>
+        <ion-item>
+          <ion-input label="标签" [value]="entry.newTag" (ionChange)="onIonChange(entry,'newTag',$event)"></ion-input>
+          <ion-button (click)="addTag(entry)">添加</ion-button>
+        </ion-item>
+        @if(entry.tags?.length){
+          <ion-item>
+            @for(tag of entry.tags;track tag){
+              <ion-chip>{{tag}}</ion-chip>
+            }
+          </ion-item>
+        }
+        <ion-item>
+          <ion-label slot="start">重要程度</ion-label>
+          <ion-radio-group label="重要程度" [value]="entry.important" (ionChange)="onIonChange(entry,'important',$event)">
+            <ion-radio value="重要">重要</ion-radio><br />
+            <ion-radio value="不重要">不重要</ion-radio>
+          </ion-radio-group>
+        </ion-item>
+        <ion-item>
+          <ion-textarea label="词条简介" [value]="entry.desc" (ionChange)="onIonChange(entry,'desc',$event)"></ion-textarea>
+        </ion-item>
+
+      </ion-list>
+
+
+    </ion-card-content>
+  </ion-card>
+}
+<ion-button expand="block" (click)="addEntry()">添加词条</ion-button>

novel-app/src/app/comp-word-entry/comp-word-entry.component.spec.ts

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

novel-app/src/app/comp-word-entry/comp-word-entry.component.ts

@@ -0,0 +1,71 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonInput, IonItem, IonLabel, IonList, IonRadio, IonRadioGroup, IonSelect, IonSelectOption, IonTextarea } from '@ionic/angular/standalone';
+
+
+interface WordEntry{
+  title :string // 名称
+  type:"人物"|"道具"|"场景" // 类型
+  important:"重要"|"不重要" //  重要程度
+  desc:string // 词条简介
+  tags?:Array<string> // 别名标签
+  newTag?:string
+}
+
+
+/**
+ * 词条编辑组件
+ */
+@Component({
+  selector: 'comp-word-entry',
+  templateUrl: './comp-word-entry.component.html',
+  styleUrls: ['./comp-word-entry.component.scss'],
+  standalone: true,
+  imports:[
+    IonCard,IonCardHeader,IonCardContent,IonCardTitle,IonCardSubtitle,
+    IonList,IonItem,IonLabel,IonIcon,IonSelect,IonSelectOption,
+    IonInput,IonTextarea,
+    IonButton,
+    IonRadio,IonRadioGroup,IonChip
+  ]
+})
+export class CompWordEntryComponent  implements OnInit {
+
+  @Input()
+  entryList:Array<WordEntry> = []
+
+  @Output()
+  entryListChange:EventEmitter<Array<WordEntry>> = new EventEmitter<Array<WordEntry>>()
+
+  onIonChange(entry:any,key:string,ev:any){
+    entry[key] = ev.detail.value;
+  }
+
+  constructor() { }
+
+  ngOnInit() {}
+
+  addEntry(){
+    this.entryList.push({
+      title:"",
+      type:"人物",
+      important:"重要",
+      desc:"简介"
+    })
+    this.entryListChange.emit(this.entryList)
+  }
+  deleteEntry(idx:number){
+    this.entryList.splice(idx,1);
+    this.entryListChange.emit(this.entryList)
+
+  }
+  // 标签条件
+  newTag:string = ""
+  addTag(entry:any){
+    if(!entry.tags) entry.tags = []
+    if(!entry.newTag) return
+    entry.tags.push(entry.newTag)
+    entry.newTag = ""
+  }
+
+
+}

novel-app/src/app/short-generator/short-generator.page.html

@@ -13,6 +13,12 @@
   <ion-input [value]="title" (ionInput)="titleInput($event)"></ion-input>
   <h1>风格</h1>
   <ion-input [value]="style" (ionInput)="styleInput($event)"></ion-input>
+  
+  <!-- 词条列表编辑区域 -->
+   <span (click)="showEntryList()">
+    当前词条 数量{{entryList?.length}}
+   </span>
+  <comp-word-entry [entryList]="entryList" (entryListChange)="onEntryListChange($event)"></comp-word-entry>
   <!-- 文本域：生成提示词 -->
   <h1>人物词条</h1>
   <ion-textarea [value]="userPrompt" (ionInput)="promptInput($event)" placeholder="文本提示词"

novel-app/src/app/short-generator/short-generator.page.ts

@@ -3,6 +3,7 @@ import { IonicModule } from '@ionic/angular';
 import { FormsModule } from '@angular/forms';
 import { Router } from '@angular/router';
 import { FmodeChatCompletion, MarkdownPreviewModule } from 'fmode-ng';
+import { CompWordEntryComponent } from '../comp-word-entry/comp-word-entry.component';
 
 @Component({
   selector: 'app-short-generator',
@@ -12,7 +13,8 @@ import { FmodeChatCompletion, MarkdownPreviewModule } from 'fmode-ng';
   imports: [
     IonicModule,
     FormsModule,
-    MarkdownPreviewModule
+    MarkdownPreviewModule,
+    CompWordEntryComponent,
   ],
 })
 export class ShortGeneratorPage implements OnInit {
@@ -40,7 +42,14 @@ export class ShortGeneratorPage implements OnInit {
   promptInput(ev: any) {
     this.userPrompt = ev.detail.value;
   }
-
+  // 人物词条
+  entryList:Array<any> = []
+  onEntryListChange(ev:any){
+    this.entryList = ev
+  }
+  showEntryList(){
+    console.log(JSON.stringify(this.entryList))
+  }
   // 生成的小说大纲
   generatedOutline: string = "";