// pages/address-book.jsx — 地址簿: saved service addresses (list). Entry from 我的 (profile)
// and from the booking flow's 明細 step. Tapping a row opens 地址詳情 (address-detail.jsx).
const ADDRESSES = [
  { id: 'a1', label: '住家', icon: 'pin', name: '王小美', phone: '0912-345-678', city: '台北市大安區', line: '復興南路一段 1 號 5 樓', note: '門禁密碼 1234#，鑰匙放鞋櫃上方', def: true },
  { id: 'a2', label: '公司', icon: 'grid', name: '王小美', phone: '0912-345-678', city: '台北市信義區', line: '松高路 11 號 8 樓', note: '請至 8 樓櫃台聯絡我代為開門', def: false },
  { id: 'a3', label: '爸媽家', icon: 'map', name: '王媽媽', phone: '0922-111-222', city: '新北市板橋區', line: '文化路二段 50 號', note: '', def: false },
];

// one saved-address row (shared look between list + picker)
function AddressRow({ a, onClick, trailing }) {
  return A('div', { className: onClick ? 'ccaTap' : '', onClick, style: { display: 'flex', gap: 12, alignItems: 'flex-start', padding: '14px 14px' } },
    A('div', { style: { width: 38, height: 38, borderRadius: 11, background: 'var(--brandSoft)', color: 'var(--brandDeep)', display: 'flex', alignItems: 'center', justifyContent: 'center', flexShrink: 0 } }, A(Icon, { name: a.icon, size: 19, sw: 1.9 })),
    A('div', { style: { flex: 1, minWidth: 0 } },
      A('div', { style: { display: 'flex', alignItems: 'center', gap: 7 } },
        A('span', { style: { fontSize: 14.5, fontWeight: 800 } }, a.label),
        a.def && A(Tag, { color: 'ok', icon: 'check' }, '預設')),
      A('div', { style: { fontSize: 12.5, color: 'var(--ink2)', marginTop: 3, lineHeight: 1.5 } }, `${a.city}${a.line}`),
      A('div', { style: { fontSize: 11.5, color: 'var(--ink3)', marginTop: 2 } }, `${a.name} · ${a.phone}`)),
    trailing || null);
}

function AddressBook({ onBack = () => {}, go = () => {} }) {
  return A('div', { style: { flex: 1, display: 'flex', flexDirection: 'column', minHeight: 0, background: 'var(--bg)' } },
    A(AppBar, { title: '地址簿', onLeft: onBack }),
    A(Scroll, { style: { padding: '4px 20px 16px' } },
      A('div', { style: { fontSize: 12, color: 'var(--ink3)', margin: '0 2px 10px' } }, '預約到府服務時可直接選用，省去每次重打'),
      A('div', { style: { background: 'var(--surface)', border: '1px solid var(--line2)', borderRadius: 'var(--rlg)', overflow: 'hidden' } },
        ADDRESSES.map((a, i) => A('div', { key: a.id, style: { borderTop: i ? '1px solid var(--line2)' : 'none' } },
          A(AddressRow, { a, onClick: () => go('addressDetail'), trailing: A(Icon, { name: 'chevR', size: 17, color: 'var(--ink3)' }) })))),
      A('button', { className: 'ccaTap', onClick: () => go('addressDetail'), style: { width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 8, padding: 16, marginTop: 14, borderRadius: 'var(--rlg)', border: '1.5px dashed var(--line)', background: 'transparent', color: 'var(--ink3)', fontFamily: 'inherit', fontSize: 14, fontWeight: 700 } },
        A(Icon, { name: 'plus', size: 19 }), '新增地址')),
    A(HomeBar, {}));
}

Object.assign(window, { ADDRESSES, AddressRow, AddressBook });