NFCReader/renderer.js

import { connectReader, readId, closeReader } from './lib/cardReader.es.js';
const { ipcRenderer } = require('electron');

const connectBtn = document.getElementById('connectBtn');
const disconnectBtn = document.getElementById('disconnectBtn');
const readBtn = document.getElementById('readBtn');
const statusDot = document.getElementById('statusDot');
const statusText = document.getElementById('statusText');
const resultBox = document.getElementById('resultBox');

const minimizeBtn = document.getElementById('minimizeBtn');
const maximizeBtn = document.getElementById('maximizeBtn');
const closeBtn = document.getElementById('closeBtn');

let isConnected = false;

function updateStatus(status) {
  statusDot.className = 'status-dot ' + status;
  
  switch(status) {
    case 'connected':
      statusText.textContent = '已连接';
      isConnected = true;
      connectBtn.disabled = true;
      disconnectBtn.disabled = false;
      readBtn.disabled = false;
      break;
    case 'disconnected':
      statusText.textContent = '未连接';
      isConnected = false;
      connectBtn.disabled = false;
      disconnectBtn.disabled = true;
      readBtn.disabled = true;
      break;
    case 'connecting':
      statusText.textContent = '连接中...';
      connectBtn.disabled = true;
      disconnectBtn.disabled = true;
      readBtn.disabled = true;
      break;
  }
}

function showResult(content, isError = false) {
  if (isError) {
    resultBox.innerHTML = '<p class="error-message">' + content + '</p>';
  } else {
    resultBox.innerHTML = '<p class="result-content">卡片 ID: ' + content + '</p>';
  }
}

connectBtn.addEventListener('click', async () => {
  updateStatus('connecting');
  resultBox.innerHTML = '<p class="placeholder-text">正在连接读卡器...</p>';
  
  try {
    await connectReader();
    updateStatus('connected');
    showResult('读卡器连接成功！请将卡片放在读卡器上，然后点击"读取卡片"按钮');
  } catch (error) {
    updateStatus('disconnected');
    showResult('连接失败: ' + error.message, true);
  }
});

disconnectBtn.addEventListener('click', async () => {
  try {
    await closeReader();
    updateStatus('disconnected');
    showResult('读卡器已断开连接');
  } catch (error) {
    showResult('断开连接失败: ' + error.message, true);
  }
});

readBtn.addEventListener('click', async () => {
  if (!isConnected) {
    showResult('请先连接读卡器', true);
    return;
  }
  
  resultBox.innerHTML = '<p class="placeholder-text">正在读取卡片...</p>';
  
  try {
    const cardId = await readId();
    if (cardId) {
      showResult(cardId);
    } else {
      showResult('未检测到卡片，请确保卡片已放置在读卡器上', true);
    }
  } catch (error) {
    showResult('读取失败: ' + error.message, true);
  }
});

minimizeBtn.addEventListener('click', () => {
  ipcRenderer.send('window-minimize');
});

maximizeBtn.addEventListener('click', () => {
  ipcRenderer.send('window-maximize');
});

closeBtn.addEventListener('click', () => {
  ipcRenderer.send('window-close');
});