<!--头部-->
<app-custom-header [param]="['生成结果','    ']"></app-custom-header>
<ion-content>
    <img id="background" [src]="history?.get('image')" />
    <img id="shade" />
    <img (click)="goSendPost(history?.get('image'),jsonData['方案名'])" id="share" src="https://s1.imagehub.cc/images/2025/01/11/e19a2422768dc1412e6dbf26a8aaf060.png">
    <ion-card>
        <img class="scan" [src]="history?.get('image')">
        <div>
            <h1>{{ jsonData['方案名'] }}</h1>
            <h2>{{jsonData['区域风格']}} {{jsonData['功能']}} {{jsonData['设计理念']}} {{jsonData['艺术风格']}}</h2>
            <ion-button>保存到我的风格</ion-button>
        </div>
    </ion-card>

    <ion-card id="score">
        <div id="up">
            <div id="left">
                <div id="score-title">
                    <ion-avatar>
                        <img src="/assets/icon/favicon.png" />
                    </ion-avatar>
                    <p>衣靠评分</p>
                </div>
                <div id="score-content">
                    <p>{{animatedScore}}</p>
                    <img [src]="getIcon(ECScore[0])" />
                </div>
            </div>
            <div id="right">
                <div id="shape-title">
                    <p>维度评分</p>
                </div>
                <div id="shape-content">
                    <div class="shape-list">
                        <p class="label">功能</p>
                        <ion-progress-bar [value]="ECScore[1]"></ion-progress-bar>
                        <p class="value">{{ECScore[1] * 10 | number: '1.1-1'}}</p>
                    </div>
                    <div class="shape-list">
                        <p class="label">区域</p>
                        <ion-progress-bar [value]="ECScore[2]"></ion-progress-bar>
                        <p class="value">{{ECScore[2] * 10 | number: '1.1-1'}}</p>
                    </div>
                    <div class="shape-list">
                        <p class="label">设计</p>
                        <ion-progress-bar [value]="ECScore[3]"></ion-progress-bar>
                        <p class="value">{{ECScore[3] * 10 | number: '1.1-1'}}</p>
                    </div>
                </div>
            </div>
        </div>
        <div id="down">
            <p>100人生成过</p>
            <p>50人分享</p>
        </div>
    </ion-card>


    <ion-card id="show">
        <div *ngFor="let key of keys" (click)="toggleDetails(key)" [class.expanded]="isDetailShown(key)">
            <h1>{{ jsonData['schemeList'][key]['name'] }}</h1>
            <p *ngIf="isDetailShown(key)">{{ jsonData['schemeList'][key]['desc'] }}</p>
        </div>
    </ion-card>
</ion-content>