Monedero: equivalente en MXN y USD en cuentas y reporte de puntos

frontend/src/pages/Monedero.tsx

@@ -109,6 +109,17 @@ const Monedero: FC = () => {
     loadReporte();
   }, [loadReporte]);
 
+  // Tipo de cambio para mostrar el equivalente en USD
+  const [rate, setRate] = useState<number | null>(null);
+  useEffect(() => {
+    odooApi.getExchangeRate()
+      .then((res) => { if (res.current?.rate) setRate(res.current.rate); })
+      .catch(() => {});
+  }, []);
+
+  const fmtUsd = (mxn: number) =>
+    rate ? `≈ ${(mxn / rate).toLocaleString('en-US', { style: 'currency', currency: 'USD' })}` : '';
+
   const openModal = (w: WalletType, type: TxType) => {
     setSelected(w);
     setTxType(type);
@@ -192,6 +203,7 @@ const Monedero: FC = () => {
                 <Card className="p-4 bg-theme-bg border-0">
                   <p className="text-xs text-theme-muted">Equivalente</p>
                   <p className="text-xl font-heading font-semibold text-theme-heading">{fmtMoney(reporte.equivalente_mxn)}</p>
+                  {rate && <p className="text-xs text-theme-muted mt-0.5">{fmtUsd(reporte.equivalente_mxn)} USD</p>}
                 </Card>
                 <Card className="p-4 bg-theme-bg border-0">
                   <p className="text-xs text-theme-muted">Cuentas con monedero</p>
@@ -252,7 +264,7 @@ const Monedero: FC = () => {
                       <th className="text-left p-3 text-xs font-medium text-theme-muted uppercase">Paciente</th>
                       <th className="text-left p-3 text-xs font-medium text-theme-muted uppercase">Teléfono</th>
                       <th className="text-left p-3 text-xs font-medium text-theme-muted uppercase">Puntos</th>
-                      <th className="text-left p-3 text-xs font-medium text-theme-muted uppercase">Equivalente MXN</th>
+                      <th className="text-left p-3 text-xs font-medium text-theme-muted uppercase">Equivalente</th>
                       <th className="text-left p-3 text-xs font-medium text-theme-muted uppercase">Acciones</th>
                     </tr>
                   </thead>
@@ -262,7 +274,10 @@ const Monedero: FC = () => {
                         <td className="p-3 text-sm font-medium text-theme-heading">{w.patient}</td>
                         <td className="p-3 text-sm text-theme-muted">{w.phone}</td>
                         <td className="p-3 text-sm font-medium text-theme-heading">{w.points} pts</td>
-                        <td className="p-3 text-sm text-theme-muted">${w.equivalent_mxn}</td>
+                        <td className="p-3 text-sm text-theme-muted">
+                          ${w.equivalent_mxn}
+                          {rate && <span className="block text-xs">{fmtUsd(w.equivalent_mxn)} USD</span>}
+                        </td>
                         <td className="p-3">
                           <div className="flex items-center gap-1">
                             <Button
@@ -298,7 +313,7 @@ const Monedero: FC = () => {
                     subtitle={w.phone}
                     rows={[
                       { label: 'Puntos', value: `${w.points} pts` },
-                      { label: 'Equivalente', value: `$${w.equivalent_mxn}` },
+                      { label: 'Equivalente', value: `$${w.equivalent_mxn}${rate ? ` (${fmtUsd(w.equivalent_mxn)} USD)` : ''}` },
                     ]}
                     actions={
                       <>
@@ -362,6 +377,9 @@ const Monedero: FC = () => {
             </p>
             <p className="text-sm text-theme-muted">
               Puntos disponibles: <span className="font-medium text-theme-heading">{selected.points} pts</span>
+              <span className="block text-xs mt-0.5">
+                ${selected.equivalent_mxn} MXN{rate ? ` · ${fmtUsd(selected.equivalent_mxn)} USD` : ''}
+              </span>
             </p>
             <Input
               label="Puntos *"