Card Operations Overview

// 1. Verify user eligibility
const profile = await fetch('/v1/user/profile', {
  headers: {
    'X-Client-ID': clientId,
    'Authorization': `Bearer ${accessToken}`
  }
});

if (profile.status !== 'VERIFIED') {
  throw new Error('User must complete KYC first');
}

// 2. Check if user already has a card
const statusResponse = await fetch('/v1/card/status', {
  headers: {
    'X-Client-ID': clientId,
    'Authorization': `Bearer ${accessToken}`
  }
});

if (statusResponse.ok) {
  console.log('User already has a card');
  return;
}

// 3. Order virtual card
const order = await fetch('/v1/card/order', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    'X-Client-ID': clientId,
    'Authorization': `Bearer ${accessToken}`
  },
  body: JSON.stringify({ type: 'VIRTUAL' })
});

// 4. Wait for activation (usually instant for virtual)
const card = await fetch('/v1/card/status', {
  headers: {
    'X-Client-ID': clientId,
    'Authorization': `Bearer ${accessToken}`
  }
});

console.log(`Card ${card.id} is ${card.status}`);

// User reports wallet lost - freeze card immediately
const freezeResponse = await fetch('/v1/card/freeze', {
  method: 'POST',
  headers: {
    'X-Client-ID': clientId,
    'Authorization': `Bearer ${accessToken}`
  }
});

if (freezeResponse.ok) {
  console.log('Card frozen - all transactions will be declined');
}

// Later: User finds wallet - unfreeze card
const unfreezeResponse = await fetch('/v1/card/unfreeze', {
  method: 'POST',
  headers: {
    'X-Client-ID': clientId,
    'Authorization': `Bearer ${accessToken}`
  }
});

if (unfreezeResponse.ok) {
  console.log('Card reactivated');
}

// 1. Generate token for viewing card details
const tokenResponse = await fetch('https://dev.api.baanx.com/v1/card/details/token', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    'X-Client-ID': clientId,
    'Authorization': `Bearer ${accessToken}`
  },
  body: JSON.stringify({
    customCss: {
      cardBackgroundColor: '#000000',
      cardTextColor: '#FFFFFF',
      panBackgroundColor: '#EFEFEF',
      panTextColor: '#000000'
    }
  })
});

const { token, imageUrl } = await tokenResponse.json();

// 2. Display as secure image
const img = document.createElement('img');
img.src = imageUrl;
img.alt = 'Card Details';
img.style.cssText = 'max-width: 100%; border-radius: 12px;';
document.getElementById('card-details-container').appendChild(img);

// 3. Clean up when user closes
function closeCardDetails() {
  img.remove();
  // imageUrl is automatically garbage collected
}