<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title>
      意境呈现{{imagineWork?.progress || 0}}
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content [fullscreen]="true">
  <div style="background-color: #fcfafafa;margin: 15px;border-radius: 10px;padding-top: 10px;">
    <!-- 生成提示词 -->
    <span style="font-weight: bold;font-size: 20px;margin-left: 10px;">logo设想</span>
    <ion-textarea [value]="userPrompt" (ionInput)="promptInput($event)" placeholder="logo创作" autoGrow="true"
      style="margin-left: 10px;text-decoration: underline;opacity: 0.5;"></ion-textarea>
  </div>
  <div style="display: flex;align-items: center;justify-content: center;margin-bottom: 10px;">
    <ion-button (click)="createImage()" expand="block" style="width: 90%;">logo创作</ion-button>
  </div>
  <!-- 意境画面提示词 -->
  <div>
    {{PictureDescResult}}
  </div>
  <!-- 生成结果 -->
  @if(images.length) {
  @for(imageUrl of images;track imageUrl){
  <img [src]="imageUrl" alt="" srcset="">
  }
  }
  <!-- 生成状态 -->
  @if(!images.length){
  @if(imagineWork){
  <h1>生成中</h1>
  }
  @if(!imagineWork){
  <h1>未开始</h1>
  }
  }

</ion-content>