3 Junio-2023

src/Componentes/AmazonInvoice.tsx

@@ -16,7 +16,6 @@ const AmazonInvoice: React.FC = () => {
   const handleConsultClick = () => {
     axios
       .get<Invoice[]>(`https://localhost:5051/api/AmazonInvoice/AmazonInvoiceGET?id=${id}`)
-      //.get<Invoice[]>(`https://localhost:5051/api/AmazonInvoice/AmazonInvoiceGETselect?id=${id}`)
       .then((response) => {
         const invoiceData: Invoice[] = response.data;
         if (invoiceData.length > 0) {
@@ -33,15 +32,16 @@ const AmazonInvoice: React.FC = () => {
   };
 
   return (
-    <div>
+    <div className="container">
       <h1>Amazon Invoice</h1>
-      <label>
-        ID:
-        <input type="text" value={id} onChange={handleIdChange} />
-      </label>
-      <button onClick={handleConsultClick}>Consultar</button>
+      <div className="form-group">
+        <label htmlFor="id">ID:</label>
+        <input id="id" type="text" value={id} onChange={handleIdChange} className="form-control" />
+      </div>
+      <button onClick={handleConsultClick} className="btn btn-primary">Consultar</button>
       {invoice && (
-        <div>
+        <div className="master-grid">
+          <div className="master-grid-item">
             <h2>Master:</h2>
             <table className="table table-striped table-dark">
               <thead>
@@ -53,7 +53,6 @@ const AmazonInvoice: React.FC = () => {
                   <th>Clasificador</th>
                   <th>Estatus</th>
                   <th>Trailer Id</th>
-                
                 </tr>
               </thead>
               <tbody>
@@ -96,11 +95,10 @@ const AmazonInvoice: React.FC = () => {
               </tbody>
             </table>
           </div>
+        </div>
       )}
     </div>
   );
 };
 
 export default AmazonInvoice;
-
-