<div class="bg_con">
  <div class="img_con">
    <div class="img_inner">
      <img class="img" src="assets/page1-1.png"/>
      <div class="label_btn" [routerLink]="'/rule'">活动规则</div>
    </div>
    <div class="img_inner">
      <img class="img" src="assets/page1-2.png"/>
      <app-notice></app-notice>
    </div>
    <img class="img" src="assets/page1-3.png"/>
    <img class="img" src="assets/page1-4.png" *ngIf="!userInfo"/>
  </div>
  <div class="btn_box" *ngIf="!userInfo">
    <app-button [routerLink]="'/login'" label="立即参与"></app-button>
  </div>
  <div class="share_bg" *ngIf="userInfo">
    <div class="share_box">
      <div class="share_btn" (click)="share('0')">
        <img src="assets/icon2.png" class="icon"/>
        <span class="text">邀请微信好友</span>
      </div>
      <div class="center_line"></div>
      <div class="share_btn1" (click)="share('1')">
        <img src="assets/icon1.png" class="icon"/>
        <span class="text">分享到朋友圈</span>
      </div>
    </div>
    <div class="login_text" *ngIf="userInfo">
      <span class="l1">您好，用户{{userInfo.mobile}}</span>
      <span class="l2" (click)="exit()">注销登录</span>
    </div>
  </div>
  <div style="height: 1rem;"></div>
  <div style="padding: 0 1rem;">
    <app-card label="即刻邀请，立享好礼">
      <div class="inner_card">
        <h2 class="text">您在活动时间内已累计邀请<span style="color:#FF765D;">{{total}}</span>户企业</h2>
        <div class="empty" *ngIf="total == 0">您还没有完成活动，快去邀请吧～</div>
        <div class="product_box" *ngIf="total > 0">
          <div class="product_item" *ngIf="prizeList.length > 0">
            <img [src]="prizeList[prizeList.length - 1].imgUrl"/>
            <div class="product_text">
              <div>
                当前可领取最高奖励为：
              </div>
              <div class="product_text1">
                {{prizeList[prizeList.length - 1].productName}}(限{{prizeList[prizeList.length - 1].totalCnt}}名）
              </div>
            </div>
          </div>
          <app-button label="领取奖品" (click)="showVisible()"></app-button>
          <div class="more_text" (click)="setShowModal()">查看我可以选择的奖品</div>
        </div>
      </div>
    </app-card>
    <div style="height: 1rem;"></div>
    <app-card [label]="'我已累计邀请' + total +'户企业'">
      <div class="inner_card" *ngIf="total == 0">
        <div style="text-align: center;">
          <img src="assets/empty.png" style="width: 7.5rem;"/>
        </div>
        <div class="empty1">邀请企业有好礼，快去邀请吧～</div>
        <div class="btn_box1">
          <app-button label="去邀请"></app-button>
        </div>
      </div>
      <div class="company_box" *ngIf="total > 0">
        <div class="company_item" *ngFor="let item of shareCompany; let i = index">
          <img [src]="'assets/avatar'+ i % 2+'.png'" class="company_img"/>
          <div class="company_text_box">
            <div class="company_text">{{item.entName}}</div>
            <div class="company_text1">已成功办理！</div>
          </div>
        </div>
      </div>
    </app-card>
  </div>
</div>

<div class="modal" *ngIf="showModal">
  <app-card label="我可选择的奖品">
    <div class="modal_inner">
      <div class="product_box">
        <div class="product_item" *ngIf="prizeList.length">
          <img [src]="prizeList[prizeList.length - 1].imgUrl"/>
          <div class="product_text">
            <div>
              当前可领取最高奖励为：
            </div>
            <div class="product_text1">
              {{prizeList[prizeList.length - 1].productName}}(限{{prizeList[prizeList.length - 1].totalCnt}}名）
            </div>
          </div>
        </div>
      </div>
      <div style="height: 1.5rem;width: 100%;background: #F5F5F5;"></div>
      <div class="product_box">
        <div class="product_item" *ngFor="let item of prizeList">
          <img [src]="item.imgUrl"/>
          <div class="product_text">
            <div>
              当前可选择的奖励为：
            </div>
            <div class="product_text1">
              {{item.productName}}（限{{item.totalCnt}}名）
            </div>
          </div>
        </div>
      </div>
    </div>
    <div style="display: flex;justify-content: center;padding-top: 1rem;">
      <app-button label="确认" (click)="setShowModal()"></app-button>
    </div>
  </app-card>
</div>

<app-get-reward [list]="prizeList" [(visible)]="visible"></app-get-reward>
