<template>
    <div v-if="row.status === 1" class="file-progress">
      <a-progress 
        :percent="row.progress" 
        :status="row.progress < 100 ? 'active' : 'success'"
        :stroke-color="{
          '0%': '#108ee9',
          '100%': '#87d068',
        }"
        size="small"
      />
      <div v-if="row.progress < 100" class="progress-details">
        <span class="speed">{{ row.uploadSpeed }}</span>
        <span class="remaining">剩余: {{ row.remainingTime }}</span>
      </div>
    </div>
  </template>
  
  <script lang="ts" setup>
  defineProps<{
    row: any;
  }>();
  </script>
  
  <style lang="less" scoped>
  .file-progress {
    margin-top: 8px;
    
    .progress-details {
      display: flex;
      justify-content: space-between;
      font-size: 12px;
      color: #666;
      margin-top: 4px;
      
      .speed {
        color: #1890ff;
      }
      
      .remaining {
        color: #fa8c16;
      }
    }
  }
  </style>