<div class="resume-upload-container">
  <div class="upload-header">
    <h2>简历投稿</h2>
    <p>将您的简历投递给心仪的公司，开启职业新篇章</p>
  </div>
  
  <div class="upload-main">
    <button class="upload-button" (click)="toggleUploadPanel()">
      <div class="button-glow"></div>
      <i class="icon-upload"></i>
      <span>上传简历</span>
    </button>
    
    <div class="target-companies">
      <h3>目标公司</h3>
      <div class="company-tags">
        <div 
          *ngFor="let company of targetCompanies" 
          class="company-tag"
          [class.selected]="company.selected"
          (click)="toggleCompanySelection(company)">
          {{ company.name }}
        </div>
      </div>
    </div>
  </div>
  
  <div class="upload-panel" [class.open]="isUploadPanelOpen">
    <div class="panel-header">
      <h3>上传简历</h3>
      <button class="close-button" (click)="toggleUploadPanel()">
        <i class="icon-close"></i>
      </button>
    </div>
    
    <div class="panel-content">
      <div 
        class="drop-zone"
        [class.dragging]="isDragging"
        (dragover)="onDragOver($event)"
        (dragleave)="onDragLeave($event)"
        (drop)="onDrop($event)">
        <div class="drop-content" *ngIf="uploadStatus === 'idle'">
          <i class="icon-cloud-upload"></i>
          <p>拖拽简历文件到此处或</p>
          <label class="file-input-label">
            <input type="file" class="file-input" (change)="onFileSelected($event)" accept=".pdf,.doc,.docx">
            选择文件
          </label>
          <p class="hint">支持 PDF, DOC, DOCX 格式，大小不超过 5MB</p>
        </div>
        
        <div class="upload-progress" *ngIf="uploadStatus === 'uploading'">
          <div class="progress-circle">
            <svg viewBox="0 0 100 100">
              <circle cx="50" cy="50" r="45" class="progress-background"></circle>
              <circle cx="50" cy="50" r="45" class="progress-bar" [style.stroke-dashoffset]="283 - (283 * uploadProgress / 100)"></circle>
            </svg>
            <div class="progress-text">{{ uploadProgress }}%</div>
          </div>
          <p>正在上传: {{ fileName }}</p>
        </div>
        
        <div class="upload-success" *ngIf="uploadStatus === 'success'">
          <i class="icon-check-circle"></i>
          <h4>上传成功!</h4>
          <p>{{ fileName }} ({{ fileSize }})</p>
          <button class="action-button" (click)="submitResume()">提交给选定的公司</button>
        </div>
        
        <div class="upload-error" *ngIf="uploadStatus === 'error'">
          <i class="icon-error"></i>
          <h4>上传失败</h4>
          <p>请上传 PDF 或 Word 文档</p>
          <button class="action-button" (click)="resetUpload()">重试</button>
        </div>
      </div>
    </div>
  </div>
</div>
