From 173ddfd05fad2c0b8749e79f35b4aa7a83e47781 Mon Sep 17 00:00:00 2001
From: Mono Mono <monomono@disroot.org>
Date: Sat, 14 Feb 2026 17:49:49 -0500
Subject: [PATCH 01/12] feat(Login): add example jwt token

---
 src/components/Login.vue   | 42 +++++++++++++++++++++
 src/pages/autenticarse.vue |  7 ++++
 src/pages/login.vue        |  7 ++++
 src/services/auth.js       | 49 ++++++++++++++++++++++++
 src/services/django-api.js | 77 ++++++++++++++++++++++----------------
 vite.config.mjs            | 12 +++++-
 6 files changed, 160 insertions(+), 34 deletions(-)
 create mode 100644 src/components/Login.vue
 create mode 100644 src/pages/autenticarse.vue
 create mode 100644 src/pages/login.vue
 create mode 100644 src/services/auth.js

diff --git a/src/components/Login.vue b/src/components/Login.vue
new file mode 100644
index 0000000..b499f04
--- /dev/null
+++ b/src/components/Login.vue
@@ -0,0 +1,42 @@
+<script setup>
+  import { ref } from 'vue';
+  import AuthService from '@/services/auth';
+  import { inject } from 'vue';
+
+  const username = ref('');
+  const password = ref('');
+  const error = ref('');
+
+  async function login() {
+    try {
+      await AuthService.login({ username: username.value, password: password.value });
+      // opcional: redirigir al dashboard
+    } catch (e) {
+      error.value = e.message;
+    }
+  }
+
+  // ejemplo de llamada a clientes (requiere token)
+  const api = inject('api');
+
+  async function loadCustomers() {
+    try {
+      const data = await api.getCustomers();
+      console.log(data);
+    } catch (e) {
+      console.error(e);
+    }
+  }
+</script>
+
+<template>
+  <h1>Login</h1>
+  <v-form @submit.prevent="login">
+    <v-text-field v-model="username" label="Usuario" required />
+    <v-text-field v-model="password" label="Contraseña" type="password" required />
+    <v-btn type="submit">Entrar</v-btn>
+    <v-alert v-if="error" type="error">{{ error }}</v-alert>
+  </v-form>
+
+  <v-btn @click="loadCustomers">Cargar clientes</v-btn>
+</template>
diff --git a/src/pages/autenticarse.vue b/src/pages/autenticarse.vue
new file mode 100644
index 0000000..d6a52a2
--- /dev/null
+++ b/src/pages/autenticarse.vue
@@ -0,0 +1,7 @@
+<template>
+  <Login />
+</template>
+
+<script setup>
+//
+</script>
diff --git a/src/pages/login.vue b/src/pages/login.vue
new file mode 100644
index 0000000..d6a52a2
--- /dev/null
+++ b/src/pages/login.vue
@@ -0,0 +1,7 @@
+<template>
+  <Login />
+</template>
+
+<script setup>
+//
+</script>
diff --git a/src/services/auth.js b/src/services/auth.js
new file mode 100644
index 0000000..8700ff3
--- /dev/null
+++ b/src/services/auth.js
@@ -0,0 +1,49 @@
+class AuthService {
+  static TOKEN_KEY = 'access_token';
+  static REFRESH_KEY = 'refresh_token';
+
+  static login(credentials) {
+    const url = `${import.meta.env.VITE_DJANGO_BASE_URL}/api/token/`;
+    return fetch(url, {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(credentials),
+    })
+      .then(r => r.json())
+      .then(data => {
+        localStorage.setItem(this.TOKEN_KEY, data.access);
+        localStorage.setItem(this.REFRESH_KEY, data.refresh);
+        return data;
+      });
+  }
+
+  static getAccessToken() {
+    return localStorage.getItem(this.TOKEN_KEY);
+  }
+
+  static getRefreshToken() {
+    return localStorage.getItem(this.REFRESH_KEY);
+  }
+
+  static async refresh() {
+    const refresh = this.getRefreshToken();
+    if (!refresh) throw new Error('No refresh token');
+
+    const url = `${import.meta.env.VITE_DJANGO_BASE_URL}/api/token/refresh/`;
+    const resp = await fetch(url, {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ refresh }),
+    });
+    const data = await resp.json();
+    localStorage.setItem(this.TOKEN_KEY, data.access);
+    return data.access;
+  }
+
+  static logout() {
+    localStorage.removeItem(this.TOKEN_KEY);
+    localStorage.removeItem(this.REFRESH_KEY);
+  }
+}
+
+export default AuthService;
diff --git a/src/services/django-api.js b/src/services/django-api.js
index 653ad3f..a52cd3b 100644
--- a/src/services/django-api.js
+++ b/src/services/django-api.js
@@ -1,8 +1,38 @@
+import AuthService from '@/services/auth';
+
 class DjangoApi {
   constructor() {
     this.base = import.meta.env.VITE_DJANGO_BASE_URL;
   }
 
+  _authHeaders() {
+    const token = AuthService.getAccessToken();
+    return token ? { Authorization: `Bearer ${token}` } : {};
+  }
+
+  _handleResponse(response) {
+    if (!response.ok) {
+      // Si el token ha expirado (401) intentamos refrescar y re‑intentar
+      if (response.status === 401) {
+        return AuthService.refresh().then(newToken => {
+          // volver a ejecutar la petición original con el nuevo token
+          const retryHeaders = {
+            ...response.headers,
+            Authorization: `Bearer ${newToken}`,
+          };
+          // aquí usamos fetch de nuevo con los mismos parámetros
+          // (para simplificar, delegamos a getRequest/postRequest)
+          // En la práctica, extrae la lógica a una función reutilizable.
+          throw new Error('Retry logic should be implemented here');
+        });
+      }
+      return response.json().then(err => {
+        throw new Error(`Error ${response.status}: ${err.detail || response.statusText}`);
+      });
+    }
+    return response.json();
+  }
+
   getCustomers() {
     const url = this.base + '/don_confiao/api/customers/';
     return this.getRequest(url);
@@ -79,42 +109,23 @@ class DjangoApi {
   }
 
   getRequest(url) {
-    return new Promise ((resolve, reject) => {
-      fetch(url)
-        .then(response => response.json())
-        .then(data => {
-          resolve(data);
-        })
-        .catch(error => {
-          reject(error);
-        });
-    });
+    return fetch(url, {
+      headers: {
+        'Content-Type': 'application/json',
+        ...this._authHeaders(),
+      },
+    }).then(this._handleResponse);
   }
 
   postRequest(url, content) {
-    return new Promise((resolve, reject) => {
-      fetch(url, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(content)
-      })
-        .then(response => {
-          if (!response.ok) {
-            reject(new Error(`Error ${response.status}: ${response.statusText}`));
-          } else {
-            response.json().then(data => {
-              if (!data) {
-                reject(new Error('La respuesta no es un JSON válido'));
-              } else {
-                resolve(data);
-              }
-            });
-          }
-        })
-        .catch(error => reject(error));
-    });
+    return fetch(url, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        ...this._authHeaders(),
+      },
+      body: JSON.stringify(content),
+    }).then(this._handleResponse);
   }
 }
 
diff --git a/vite.config.mjs b/vite.config.mjs
index a1a9dec..3d70eca 100644
--- a/vite.config.mjs
+++ b/vite.config.mjs
@@ -11,6 +11,16 @@ import Vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
 import { defineConfig } from 'vite'
 import { fileURLToPath, URL } from 'node:url'
 
+const aliasMap = {
+   '@': fileURLToPath(new URL('./src', import.meta.url)),
+};
+
+console.log('🔧 Alias configurado:');
+console.log(aliasMap);          // <-- se muestra en la terminal al iniciar Vite
+console.log('Resolución real de "@":', aliasMap['@']);
+
+
+
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [
@@ -50,7 +60,7 @@ export default defineConfig({
   } },
   resolve: {
     alias: {
-      '@': fileURLToPath(new URL('./src', import.meta.url))
+      '@': fileURLToPath(new URL('./src', import.meta.url)),
     },
     extensions: [
       '.js',
-- 
2.49.1


From 173cf3771bdad37c671de97f64c11d54e3dcd6aa Mon Sep 17 00:00:00 2001
From: Mono Mono <monomono@disroot.org>
Date: Sat, 14 Feb 2026 17:56:37 -0500
Subject: [PATCH 02/12]  #28 dependency: add axios

---
 package-lock.json | 220 ++++++++++++++++++++++++++++++++++++++--------
 package.json      |   1 +
 2 files changed, 183 insertions(+), 38 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 98e7269..f18e1cf 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.0.0",
       "dependencies": {
         "@mdi/font": "7.4.47",
+        "axios": "^1.13.5",
         "core-js": "^3.37.1",
         "roboto-fontface": "*",
         "vee-validate": "^4.14.6",
@@ -1503,6 +1504,12 @@
         "node": ">=16.14.0"
       }
     },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
+      "license": "MIT"
+    },
     "node_modules/available-typed-arrays": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
@@ -1519,6 +1526,17 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/axios": {
+      "version": "1.13.5",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.13.5.tgz",
+      "integrity": "sha512-cz4ur7Vb0xS4/KUN0tPWe44eqxrIu31me+fbang3ijiNscE129POzipJJA6zniq2C/Z6sJCjMimjS8Lc/GAs8Q==",
+      "license": "MIT",
+      "dependencies": {
+        "follow-redirects": "^1.15.11",
+        "form-data": "^4.0.5",
+        "proxy-from-env": "^1.1.0"
+      }
+    },
     "node_modules/babel-eslint": {
       "version": "10.1.0",
       "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz",
@@ -1667,6 +1685,19 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/callsites": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
@@ -1752,6 +1783,18 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "license": "MIT",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -1941,6 +1984,15 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
     "node_modules/doctrine": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-3.0.0.tgz",
@@ -1954,6 +2006,20 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/dunder-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/entities": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
@@ -2028,14 +2094,10 @@
       }
     },
     "node_modules/es-define-property": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz",
-      "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==",
-      "dev": true,
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
       "license": "MIT",
-      "dependencies": {
-        "get-intrinsic": "^1.2.4"
-      },
       "engines": {
         "node": ">= 0.4"
       }
@@ -2044,17 +2106,15 @@
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
       "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/es-object-atoms": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.0.0.tgz",
-      "integrity": "sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==",
-      "dev": true,
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
+      "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
       "license": "MIT",
       "dependencies": {
         "es-errors": "^1.3.0"
@@ -2064,15 +2124,15 @@
       }
     },
     "node_modules/es-set-tostringtag": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.3.tgz",
-      "integrity": "sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==",
-      "dev": true,
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
+      "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
       "license": "MIT",
       "dependencies": {
-        "get-intrinsic": "^1.2.4",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
         "has-tostringtag": "^1.0.2",
-        "hasown": "^2.0.1"
+        "hasown": "^2.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -2851,6 +2911,26 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/follow-redirects": {
+      "version": "1.15.11",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.11.tgz",
+      "integrity": "sha512-deG2P0JfjrTxl50XGCDyfI97ZGVCxIpfKYmfyrQ54n5FO/0gfIES8C/Psl6kWVDolizcaaxZJnTS0QSMxvnsBQ==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/for-each": {
       "version": "0.3.3",
       "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
@@ -2861,6 +2941,22 @@
         "is-callable": "^1.1.3"
       }
     },
+    "node_modules/form-data": {
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.5.tgz",
+      "integrity": "sha512-8RipRLol37bNs2bhoV67fiTEvdTrbMUYcFTiy3+wuuOnUog2QBHCZWXDRijWQfAkhBj2Uf5UnVaiWwA5vdd82w==",
+      "license": "MIT",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "es-set-tostringtag": "^2.1.0",
+        "hasown": "^2.0.2",
+        "mime-types": "^2.1.12"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/fs.realpath": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
@@ -2886,7 +2982,6 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
       "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
-      "dev": true,
       "license": "MIT",
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -2922,17 +3017,21 @@
       }
     },
     "node_modules/get-intrinsic": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz",
-      "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==",
-      "dev": true,
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
       "license": "MIT",
       "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
         "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
         "function-bind": "^1.1.2",
-        "has-proto": "^1.0.1",
-        "has-symbols": "^1.0.3",
-        "hasown": "^2.0.0"
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "math-intrinsics": "^1.1.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -2941,6 +3040,19 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/get-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/get-symbol-description": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.2.tgz",
@@ -3041,13 +3153,12 @@
       }
     },
     "node_modules/gopd": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz",
-      "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==",
-      "dev": true,
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
       "license": "MIT",
-      "dependencies": {
-        "get-intrinsic": "^1.1.3"
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -3107,10 +3218,9 @@
       }
     },
     "node_modules/has-symbols": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz",
-      "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==",
-      "dev": true,
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
       "license": "MIT",
       "engines": {
         "node": ">= 0.4"
@@ -3123,7 +3233,6 @@
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
       "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "has-symbols": "^1.0.3"
@@ -3139,7 +3248,6 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
       "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "function-bind": "^1.1.2"
@@ -3721,6 +3829,15 @@
         "node": ">=16.14.0"
       }
     },
+    "node_modules/math-intrinsics": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/merge2": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
@@ -3745,6 +3862,27 @@
         "node": ">=8.6"
       }
     },
+    "node_modules/mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/minimatch": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
@@ -4206,6 +4344,12 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/proxy-from-env": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
+      "license": "MIT"
+    },
     "node_modules/punycode": {
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
diff --git a/package.json b/package.json
index bb0a559..c72811c 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,7 @@
   },
   "dependencies": {
     "@mdi/font": "7.4.47",
+    "axios": "^1.13.5",
     "core-js": "^3.37.1",
     "roboto-fontface": "*",
     "vee-validate": "^4.14.6",
-- 
2.49.1


From 4a67f85dcbf948f5a2c93299a75a92db6d8e02ef Mon Sep 17 00:00:00 2001
From: Mono Mono <monomono@disroot.org>
Date: Sat, 14 Feb 2026 18:20:07 -0500
Subject: [PATCH 03/12]  #28 refactor(api): using axios instead fetch.

---
 src/services/django-api.js | 51 +++++---------------------------------
 src/services/http.js       | 48 +++++++++++++++++++++++++++++++++++
 vite.config.mjs            | 10 --------
 3 files changed, 54 insertions(+), 55 deletions(-)
 create mode 100644 src/services/http.js

diff --git a/src/services/django-api.js b/src/services/django-api.js
index a52cd3b..b302065 100644
--- a/src/services/django-api.js
+++ b/src/services/django-api.js
@@ -1,36 +1,17 @@
 import AuthService from '@/services/auth';
+import http from '@/services/http';
 
 class DjangoApi {
   constructor() {
     this.base = import.meta.env.VITE_DJANGO_BASE_URL;
   }
 
-  _authHeaders() {
-    const token = AuthService.getAccessToken();
-    return token ? { Authorization: `Bearer ${token}` } : {};
+  getRequest(url) {
+    return http.get(url).then(r => r.data);
   }
 
-  _handleResponse(response) {
-    if (!response.ok) {
-      // Si el token ha expirado (401) intentamos refrescar y re‑intentar
-      if (response.status === 401) {
-        return AuthService.refresh().then(newToken => {
-          // volver a ejecutar la petición original con el nuevo token
-          const retryHeaders = {
-            ...response.headers,
-            Authorization: `Bearer ${newToken}`,
-          };
-          // aquí usamos fetch de nuevo con los mismos parámetros
-          // (para simplificar, delegamos a getRequest/postRequest)
-          // En la práctica, extrae la lógica a una función reutilizable.
-          throw new Error('Retry logic should be implemented here');
-        });
-      }
-      return response.json().then(err => {
-        throw new Error(`Error ${response.status}: ${err.detail || response.statusText}`);
-      });
-    }
-    return response.json();
+  postRequest(url, payload) {
+    return http.post(url, payload).then(r => r.data);
   }
 
   getCustomers() {
@@ -107,26 +88,6 @@ class DjangoApi {
     const url = this.base + '/don_confiao/api/enviar_ventas_a_tryton';
     return this.postRequest(url, {});
   }
-
-  getRequest(url) {
-    return fetch(url, {
-      headers: {
-        'Content-Type': 'application/json',
-        ...this._authHeaders(),
-      },
-    }).then(this._handleResponse);
-  }
-
-  postRequest(url, content) {
-    return fetch(url, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-        ...this._authHeaders(),
-      },
-      body: JSON.stringify(content),
-    }).then(this._handleResponse);
-  }
 }
 
-  export default DjangoApi;
+export default DjangoApi;
diff --git a/src/services/http.js b/src/services/http.js
new file mode 100644
index 0000000..27884c7
--- /dev/null
+++ b/src/services/http.js
@@ -0,0 +1,48 @@
+import axios from 'axios';
+import AuthService from '@/services/auth';
+
+const http = axios.create({
+  baseURL: import.meta.env.VITE_DJANGO_BASE_URL, // ← raíz del API
+  headers: {
+    'Content-Type': 'application/json',
+  },
+});
+
+http.interceptors.request.use(
+  config => {
+    const token = AuthService.getAccessToken();
+    if (token) {
+      config.headers.Authorization = `Bearer ${token}`;
+    }
+    return config;
+  },
+  error => Promise.reject(error)
+);
+
+http.interceptors.response.use(
+  response => response, // paso directo si todo está OK
+  async error => {
+    const originalRequest = error.config;
+
+    // Sólo intentamos refrescar una vez
+    if (error.response?.status === 401 && !originalRequest._retry) {
+      originalRequest._retry = true;
+      try {
+        const newAccess = await AuthService.refresh(); // guarda el nuevo token
+        // vuelve a colocar el header actualizado
+        originalRequest.headers.Authorization = `Bearer ${newAccess}`;
+        return http.request(originalRequest); // re‑intenta la petición
+      } catch (refreshError) {
+        // Si el refresh falla, forzamos logout
+        AuthService.logout();
+        // opcional: redirigir al login
+        window.location.href = '/login';
+        return Promise.reject(refreshError);
+      }
+    }
+
+    return Promise.reject(error);
+  }
+);
+
+export default http;
diff --git a/vite.config.mjs b/vite.config.mjs
index 3d70eca..bfb192d 100644
--- a/vite.config.mjs
+++ b/vite.config.mjs
@@ -11,16 +11,6 @@ import Vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
 import { defineConfig } from 'vite'
 import { fileURLToPath, URL } from 'node:url'
 
-const aliasMap = {
-   '@': fileURLToPath(new URL('./src', import.meta.url)),
-};
-
-console.log('🔧 Alias configurado:');
-console.log(aliasMap);          // <-- se muestra en la terminal al iniciar Vite
-console.log('Resolución real de "@":', aliasMap['@']);
-
-
-
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [
-- 
2.49.1


From 4e79ecd56bfa29e747e52c13dca2633ceb96a988 Mon Sep 17 00:00:00 2001
From: Mono Mono <monomono@disroot.org>
Date: Sat, 14 Feb 2026 18:55:26 -0500
Subject: [PATCH 04/12]  #28 feat(api): add logout.

---
 src/components/Login.vue           | 34 ++++++++----------------------
 src/components/Logout.vue          | 29 +++++++++++++++++++++++++
 src/components/NavBar.vue          |  1 +
 src/pages/{login.vue => salir.vue} |  2 +-
 src/services/http.js               | 14 +++++-------
 5 files changed, 45 insertions(+), 35 deletions(-)
 create mode 100644 src/components/Logout.vue
 rename src/pages/{login.vue => salir.vue} (80%)

diff --git a/src/components/Login.vue b/src/components/Login.vue
index b499f04..b5899cb 100644
--- a/src/components/Login.vue
+++ b/src/components/Login.vue
@@ -1,3 +1,12 @@
+<template>
+  <h1>Login</h1>
+  <v-form @submit.prevent="login">
+    <v-text-field v-model="username" label="Usuario" required />
+    <v-text-field v-model="password" label="Contraseña" type="password" required />
+    <v-btn type="submit">Entrar</v-btn>
+    <v-alert v-if="error" type="error">{{ error }}</v-alert>
+  </v-form>
+</template>
 <script setup>
   import { ref } from 'vue';
   import AuthService from '@/services/auth';
@@ -10,33 +19,8 @@
   async function login() {
     try {
       await AuthService.login({ username: username.value, password: password.value });
-      // opcional: redirigir al dashboard
     } catch (e) {
       error.value = e.message;
     }
   }
-
-  // ejemplo de llamada a clientes (requiere token)
-  const api = inject('api');
-
-  async function loadCustomers() {
-    try {
-      const data = await api.getCustomers();
-      console.log(data);
-    } catch (e) {
-      console.error(e);
-    }
-  }
 </script>
-
-<template>
-  <h1>Login</h1>
-  <v-form @submit.prevent="login">
-    <v-text-field v-model="username" label="Usuario" required />
-    <v-text-field v-model="password" label="Contraseña" type="password" required />
-    <v-btn type="submit">Entrar</v-btn>
-    <v-alert v-if="error" type="error">{{ error }}</v-alert>
-  </v-form>
-
-  <v-btn @click="loadCustomers">Cargar clientes</v-btn>
-</template>
diff --git a/src/components/Logout.vue b/src/components/Logout.vue
new file mode 100644
index 0000000..50598ca
--- /dev/null
+++ b/src/components/Logout.vue
@@ -0,0 +1,29 @@
+<style scoped>
+p {
+  font-size: 1.1rem;
+  color: #555;
+}
+</style>
+<template>
+  <v-container class="d-flex flex-column align-center justify-center" style="height: 100vh;">
+    <v-progress-circular indeterminate color="primary" />
+    <p class="mt-4">Cerrando sesión…</p>
+  </v-container>
+</template>
+<script>
+  import AuthService from '@/services/auth';
+  export default {
+    name: 'DonConfiao',
+    mounted() {
+      this.logout();
+    },
+    methods: {
+      logout() {
+        AuthService.logout();
+        this.$router.push({
+          path: "/autenticarse"
+        });
+      },
+    },
+  };
+</script>
diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
index 4a4be41..cf364d6 100644
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@@ -50,6 +50,7 @@
          menuItems: [
              { title: 'Inicio', route: '/', icon: 'mdi-home'},
              { title: 'Comprar', route:'/comprar', icon: 'mdi-cart'},
+             { title: 'Salir', route:'/salir', icon: 'mdi-cart'},
          ],
          menuAdminItems: [
              { title: 'Cuadrar tarro', route: '/cuadrar_tarro', icon: 'mdi-calculator'},
diff --git a/src/pages/login.vue b/src/pages/salir.vue
similarity index 80%
rename from src/pages/login.vue
rename to src/pages/salir.vue
index d6a52a2..72751f5 100644
--- a/src/pages/login.vue
+++ b/src/pages/salir.vue
@@ -1,5 +1,5 @@
 <template>
-  <Login />
+  <Logout />
 </template>
 
 <script setup>
diff --git a/src/services/http.js b/src/services/http.js
index 27884c7..c00f04b 100644
--- a/src/services/http.js
+++ b/src/services/http.js
@@ -2,7 +2,7 @@ import axios from 'axios';
 import AuthService from '@/services/auth';
 
 const http = axios.create({
-  baseURL: import.meta.env.VITE_DJANGO_BASE_URL, // ← raíz del API
+  baseURL: import.meta.env.VITE_DJANGO_BASE_URL,
   headers: {
     'Content-Type': 'application/json',
   },
@@ -20,23 +20,19 @@ http.interceptors.request.use(
 );
 
 http.interceptors.response.use(
-  response => response, // paso directo si todo está OK
+  response => response,
   async error => {
     const originalRequest = error.config;
 
-    // Sólo intentamos refrescar una vez
     if (error.response?.status === 401 && !originalRequest._retry) {
       originalRequest._retry = true;
       try {
-        const newAccess = await AuthService.refresh(); // guarda el nuevo token
-        // vuelve a colocar el header actualizado
+        const newAccess = await AuthService.refresh();
         originalRequest.headers.Authorization = `Bearer ${newAccess}`;
-        return http.request(originalRequest); // re‑intenta la petición
+        return http.request(originalRequest);
       } catch (refreshError) {
-        // Si el refresh falla, forzamos logout
         AuthService.logout();
-        // opcional: redirigir al login
-        window.location.href = '/login';
+        window.location.href = '/autenticarse';
         return Promise.reject(refreshError);
       }
     }
-- 
2.49.1


From 0ba348cc64f7e1d3439a128bfbeb05e21c914747 Mon Sep 17 00:00:00 2001
From: Mono Mono <monomono@disroot.org>
Date: Sat, 21 Feb 2026 13:38:00 -0500
Subject: [PATCH 05/12]  #28 fix(login): handle bad credentials.

---
 src/components/Login.vue | 81 +++++++++++++++++++++++++++++++---------
 src/services/auth.js     | 39 ++++++++++++++-----
 2 files changed, 93 insertions(+), 27 deletions(-)

diff --git a/src/components/Login.vue b/src/components/Login.vue
index b5899cb..1ea77d6 100644
--- a/src/components/Login.vue
+++ b/src/components/Login.vue
@@ -1,26 +1,71 @@
 <template>
   <h1>Login</h1>
-  <v-form @submit.prevent="login">
-    <v-text-field v-model="username" label="Usuario" required />
-    <v-text-field v-model="password" label="Contraseña" type="password" required />
-    <v-btn type="submit">Entrar</v-btn>
-    <v-alert v-if="error" type="error">{{ error }}</v-alert>
+
+  <v-form ref="loginForm" @submit.prevent="onSubmit">
+    <v-text-field
+      v-model="username"
+      label="Usuario"
+      :rules="[requiredRule]"
+      required
+    />
+    <v-text-field
+      v-model="password"
+      label="Contraseña"
+      type="password"
+      :rules="[requiredRule]"
+      required
+    />
+
+    <v-btn type="submit" color="primary">Entrar</v-btn>
+
+    <v-alert v-if="error" type="error" class="mt-2">{{ error }}</v-alert>
   </v-form>
 </template>
-<script setup>
-  import { ref } from 'vue';
+
+<script>
   import AuthService from '@/services/auth';
-  import { inject } from 'vue';
 
-  const username = ref('');
-  const password = ref('');
-  const error = ref('');
+  export default {
+    name: 'DonConfiao',
 
-  async function login() {
-    try {
-      await AuthService.login({ username: username.value, password: password.value });
-    } catch (e) {
-      error.value = e.message;
-    }
-  }
+    data() {
+      return {
+        username: '',
+        password: '',
+        error: '',
+      };
+    },
+
+    methods: {
+      requiredRule(value) {
+        return !!value || 'Este campo es obligatorio';
+      },
+
+      async onSubmit() {
+        this.error = '';
+
+        const form = this.$refs.loginForm;
+        const isValid = await form.validate();
+
+        if (!isValid) return;
+
+        if (!this.username || !this.password) {
+          this.error = 'Usuario y contraseña son obligatorios';
+          return;
+        }
+
+        try {
+          await AuthService.login({
+            username: this.username,
+            password: this.password,
+          });
+          this.$router.push({ path: '/' });
+        } catch (e) {
+          // Si el servicio devuelve un error (ej. 401) lo convertimos en excepción
+          const msg = e?.response?.data?.message ?? e.message;
+          this.error = msg ?? 'Error al iniciar sesión';
+        }
+      },
+    },
+  };
 </script>
diff --git a/src/services/auth.js b/src/services/auth.js
index 8700ff3..600e643 100644
--- a/src/services/auth.js
+++ b/src/services/auth.js
@@ -2,19 +2,34 @@ class AuthService {
   static TOKEN_KEY = 'access_token';
   static REFRESH_KEY = 'refresh_token';
 
-  static login(credentials) {
+  static async login(credentials) {
     const url = `${import.meta.env.VITE_DJANGO_BASE_URL}/api/token/`;
-    return fetch(url, {
+
+    const resp = await fetch(url, {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify(credentials),
-    })
-      .then(r => r.json())
-      .then(data => {
-        localStorage.setItem(this.TOKEN_KEY, data.access);
-        localStorage.setItem(this.REFRESH_KEY, data.refresh);
-        return data;
-      });
+    });
+
+    if (!resp.ok) {
+      let errMsg = resp.statusText;
+      try {
+        const errData = await resp.json();
+        errMsg = errData?.detail ?? errData?.message ?? errMsg;
+      } catch (_) {
+
+      }
+      throw new Error(errMsg);
+    }
+
+    const data = await resp.json();
+
+    if (data.access && data.refresh) {
+      localStorage.setItem(this.TOKEN_KEY, data.access);
+      localStorage.setItem(this.REFRESH_KEY, data.refresh);
+    }
+
+    return data;
   }
 
   static getAccessToken() {
@@ -35,6 +50,12 @@ class AuthService {
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({ refresh }),
     });
+
+    if (!resp.ok) {
+      const errData = await resp.json().catch(() => ({}));
+      throw new Error(errData?.detail ?? resp.statusText);
+    }
+
     const data = await resp.json();
     localStorage.setItem(this.TOKEN_KEY, data.access);
     return data.access;
-- 
2.49.1


From 72d81bdf47f80f2da4816c0518d24e4cab6203ef Mon Sep 17 00:00:00 2001
From: mono <mono@desarrollo-mono.localhost>
Date: Sat, 7 Mar 2026 16:03:17 -0500
Subject: [PATCH 06/12] #28 fix: add component imports in pages and
 isAuthenticated method

---
 src/components/LoginDialog.vue | 69 ++++++++++++++++++++++++++++++++++
 src/services/auth.js           |  4 ++
 2 files changed, 73 insertions(+)
 create mode 100644 src/components/LoginDialog.vue

diff --git a/src/components/LoginDialog.vue b/src/components/LoginDialog.vue
new file mode 100644
index 0000000..24bedb4
--- /dev/null
+++ b/src/components/LoginDialog.vue
@@ -0,0 +1,69 @@
+<template>
+  <v-dialog v-model="show" max-width="400">
+    <v-card>
+      <v-card-title class="headline">Iniciar sesión</v-card-title>
+      <v-card-text>
+        <v-form ref="form" @submit.prevent="onSubmit">
+          <v-text-field
+            v-model="username"
+            label="Usuario"
+            :rules="[required]"
+            required
+          />
+          <v-text-field
+            v-model="password"
+            label="Contraseña"
+            type="password"
+            :rules="[required]"
+            required
+          />
+          <v-alert v-if="error" type="error" class="mt-2">{{ error }}</v-alert>
+        </v-form>
+      </v-card-text>
+
+      <v-card-actions>
+        <v-spacer />
+        <v-btn text @click="show = false">Cancelar</v-btn>
+        <v-btn color="primary" @click="onSubmit">Entrar</v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-dialog>
+</template>
+
+<script>
+import AuthService from '@/services/auth';
+
+export default {
+  name: 'LoginDialog',
+  data: () => ({
+    show: false,
+    username: '',
+    password: '',
+    error: '',
+  }),
+  methods: {
+    required(v) {
+      return !!v || 'Campo obligatorio';
+    },
+    async onSubmit() {
+      this.error = '';
+      const form = this.$refs.form;
+      if (!(await form.validate())) return;
+
+      try {
+        await AuthService.login({
+          username: this.username,
+          password: this.password,
+        });
+        this.show = false;
+        this.$emit('login-success');   // notifica al NavBar
+      } catch (e) {
+        this.error = e.message ?? 'Error al iniciar sesión';
+      }
+    },
+    open() {
+      this.show = true;
+    },
+  },
+};
+</script>
diff --git a/src/services/auth.js b/src/services/auth.js
index 600e643..3766e8e 100644
--- a/src/services/auth.js
+++ b/src/services/auth.js
@@ -61,6 +61,10 @@ class AuthService {
     return data.access;
   }
 
+  static isAuthenticated() {
+    return !!this.getAccessToken();
+  }
+
   static logout() {
     localStorage.removeItem(this.TOKEN_KEY);
     localStorage.removeItem(this.REFRESH_KEY);
-- 
2.49.1


From 1c8638b8d450214f17af0cdc5f73ba01507ca587 Mon Sep 17 00:00:00 2001
From: mono <mono@desarrollo-mono.localhost>
Date: Sat, 7 Mar 2026 16:03:21 -0500
Subject: [PATCH 07/12] docs: add AGENTS.md with project conventions for AI
 agents

---
 AGENTS.md | 72 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 72 insertions(+)
 create mode 100644 AGENTS.md

diff --git a/AGENTS.md b/AGENTS.md
new file mode 100644
index 0000000..0d20087
--- /dev/null
+++ b/AGENTS.md
@@ -0,0 +1,72 @@
+# Don Confiao - Frontend
+
+## Tech Stack
+- **Framework:** Vue 3 (Composition API)
+- **UI Library:** Vuetify 3
+- **Routing:** Vue Router 4 (auto-routes con `unplugin-vue-router`)
+- **State:** Pinia
+- **HTTP:** Axios
+- **Build:** Vite
+- **Linting:** ESLint
+
+## Project Structure
+```
+src/
+├── assets/          # Imágenes, iconos estáticos
+├── components/      # Componentes Vue reutilizables
+├── layouts/         # Layouts de página
+├── pages/           # Vistas (auto-routed desde文件名)
+├── plugins/         # Configuración de Vuetify, etc.
+├── router/          # Configuración de rutas
+├── services/        # API services (auth.js, etc.)
+├── stores/          # Pinia stores
+└── styles/          # SCSS settings
+```
+
+## Important Conventions
+
+### Auto-imports
+- Componentes en `src/components/` se auto-importan por nombre
+- Los archivos en `src/pages/*.vue` se routing automáticamente via `unplugin-vue-router`
+- Alias `@` = `src/`
+
+### Pages (CRITICAL)
+**Siempre importar componentes en los archivos de página:**
+```vue
+<template>
+  <MiComponente />
+</template>
+
+<script setup>
+import MiComponente from '@/components/MiComponente.vue';
+</script>
+```
+
+### Componentes
+- Usar Composition API (`<script setup>` o `export default { }`)
+- Naming: PascalCase (ej: `LoginDialog.vue`, `CartGrid.vue`)
+- Componentes de página van en `pages/`, componentes reutilizables en `components/`
+
+### Servicios API
+- Ubicación: `src/services/`
+- Usar Axios para HTTP requests
+- JWT tokens en localStorage (`access_token`, `refresh_token`)
+
+### Routing
+- Rutas automáticas basadas en archivos en `src/pages/`
+- No requiere configuración manual en `router/index.js`
+
+## Environment Variables
+- `VITE_DJANGO_BASE_URL` - URL del backend Django
+
+## Commands
+```bash
+npm run dev      # Desarrollo (puerto 3000)
+npm run build    # Producción
+npm run preview  # Preview build
+npm run lint     # ESLint fix
+```
+
+## Common Issues
+1. **Página en blanco:** Verificar que los componentes en `src/pages/*.vue` tengan import explícito
+2. **Errores de lint:** Ejecutar `npm run lint`
-- 
2.49.1


From d4421aece494c9a8086a61c62e5de3c18c34706f Mon Sep 17 00:00:00 2001
From: mono <mono@desarrollo-mono.localhost>
Date: Sat, 7 Mar 2026 16:05:26 -0500
Subject: [PATCH 08/12] chore: add .env to gitignore and add .env.example

---
 .env.example | 2 ++
 .gitignore   | 1 +
 2 files changed, 3 insertions(+)
 create mode 100644 .env.example

diff --git a/.env.example b/.env.example
new file mode 100644
index 0000000..76df82e
--- /dev/null
+++ b/.env.example
@@ -0,0 +1,2 @@
+VITE_API_IMPLEMENTATION=django
+VITE_DJANGO_BASE_URL=http://localhost:7000
diff --git a/.gitignore b/.gitignore
index da3df75..9ca2b60 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,6 +5,7 @@ node_modules
 # local env files
 .env.local
 .env.*.local
+.env
 
 # Log files
 npm-debug.log*
-- 
2.49.1


From 7731b2fbd67e7b8a8b9e0656bb50268a3b49282d Mon Sep 17 00:00:00 2001
From: mono <mono@desarrollo-mono.localhost>
Date: Sat, 7 Mar 2026 16:12:17 -0500
Subject: [PATCH 09/12] #28 feat(auth): add login/logout buttons in NavBar

---
 src/components/NavBar.vue | 37 ++++++++++++++++++++++++++++++-------
 1 file changed, 30 insertions(+), 7 deletions(-)

diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
index cf364d6..8c422f8 100644
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@@ -3,11 +3,22 @@
     <v-app-bar-nav-icon variant="text" @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
     <v-toolbar-title>Menu</v-toolbar-title>
     <v-spacer></v-spacer>
-    <template v-if="$vuetify.display.mdAndUp">
-      <v-btn icon="mdi-magnify" variant="text"></v-btn>
-      <v-btn icon="mdi-filter" variant="text"></v-btn>
-    </template>
-    <v-btn icon="mdi-dots-vertical" variant="text"></v-btn>
+    <v-btn 
+      v-if="!isAuthenticated" 
+      prepend-icon="mdi-login" 
+      variant="text"
+      @click="navigate('/autenticarse')"
+    >
+      Login
+    </v-btn>
+    <v-btn 
+      v-else 
+      prepend-icon="mdi-logout" 
+      variant="text"
+      @click="logout"
+    >
+      Logout
+    </v-btn>
   </v-app-bar>
   <v-navigation-drawer v-model="drawer"
                        :location="$vuetify.display.mobile ? 'bottom' : undefined"
@@ -41,16 +52,17 @@
 
 <script>
  import trytonIcon from '../assets/icons/tryton-icon.svg';
+ import AuthService from '@/services/auth';
  export default {
      name: 'NavBar',
      data: () => ({
          drawer: false,
          group: null,
          showAdminMenu: false,
+         isAuthenticated: false,
          menuItems: [
              { title: 'Inicio', route: '/', icon: 'mdi-home'},
              { title: 'Comprar', route:'/comprar', icon: 'mdi-cart'},
-             { title: 'Salir', route:'/salir', icon: 'mdi-cart'},
          ],
          menuAdminItems: [
              { title: 'Cuadrar tarro', route: '/cuadrar_tarro', icon: 'mdi-calculator'},
@@ -62,12 +74,18 @@
              { title: 'Actualizar Ventas Tryton', route: '/sincronizar_ventas_tryton', icon: 'trytonIcon'}
          ],
      }),
+     mounted() {
+       this.checkAuth();
+     },
      watch: {
          group () {
              this.drawer = false
          },
      },
      methods: {
+         checkAuth() {
+           this.isAuthenticated = AuthService.isAuthenticated();
+         },
          navigate(route) {
              this.$router.push(route);
          },
@@ -78,6 +96,11 @@
          toggleAdminMenu() {
              this.showAdminMenu = !this.showAdminMenu;
          },
+         logout() {
+           AuthService.logout();
+           this.isAuthenticated = false;
+           this.$router.push('/');
+         },
      }
   }
-</script>
+ </script>
-- 
2.49.1


From 608862341568e21388ed5ee057356b65e2d5505d Mon Sep 17 00:00:00 2001
From: mono <mono@desarrollo-mono.localhost>
Date: Sat, 7 Mar 2026 16:22:04 -0500
Subject: [PATCH 10/12] docs: add git commit conventions to AGENTS.md

---
 AGENTS.md | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/AGENTS.md b/AGENTS.md
index 0d20087..78fb193 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -70,3 +70,12 @@ npm run lint     # ESLint fix
 ## Common Issues
 1. **Página en blanco:** Verificar que los componentes en `src/pages/*.vue` tengan import explícito
 2. **Errores de lint:** Ejecutar `npm run lint`
+
+## Git Commits
+**Antes de hacer commit:**
+1. Pedir permiso al usuario
+2. Mostrar resumen de los cambios que se incluirán
+
+**Formato de mensajes:**
+- Usar prefijo `#<numero>` para referenciar el issue (ej: `#28 feat: add login` donde #28 es el número del issue en GitHub/GitLab)
+- Prefijos válidos: `feat`, `fix`, `chore`, `docs`, `refactor`, `style`
-- 
2.49.1


From 3112c82bb2984082e1cb53ab825a432361ddb725 Mon Sep 17 00:00:00 2001
From: mono <mono@desarrollo-mono.localhost>
Date: Sat, 7 Mar 2026 16:48:24 -0500
Subject: [PATCH 11/12] #28 fix: update auth state on route change

---
 src/components/NavBar.vue | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
index 8c422f8..faf893a 100644
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@@ -77,11 +77,14 @@
      mounted() {
        this.checkAuth();
      },
-     watch: {
-         group () {
-             this.drawer = false
-         },
-     },
+      watch: {
+          group () {
+              this.drawer = false
+          },
+          $route() {
+            this.checkAuth();
+          },
+      },
      methods: {
          checkAuth() {
            this.isAuthenticated = AuthService.isAuthenticated();
-- 
2.49.1


From 7f73251c5e7449d48ebcc1d0741b2d5a48b0c466 Mon Sep 17 00:00:00 2001
From: mono <mono@desarrollo-mono.localhost>
Date: Sat, 7 Mar 2026 17:03:30 -0500
Subject: [PATCH 12/12] #28 style: fix lint issues in auth components

---
 src/components/Login.vue       |  1 -
 src/components/LoginDialog.vue |  2 +-
 src/components/Logout.vue      | 43 ++++++++++++++++++----------------
 src/components/NavBar.vue      | 16 ++++++-------
 src/services/auth.js           |  4 +---
 5 files changed, 33 insertions(+), 33 deletions(-)

diff --git a/src/components/Login.vue b/src/components/Login.vue
index 1ea77d6..7e971c4 100644
--- a/src/components/Login.vue
+++ b/src/components/Login.vue
@@ -61,7 +61,6 @@
           });
           this.$router.push({ path: '/' });
         } catch (e) {
-          // Si el servicio devuelve un error (ej. 401) lo convertimos en excepción
           const msg = e?.response?.data?.message ?? e.message;
           this.error = msg ?? 'Error al iniciar sesión';
         }
diff --git a/src/components/LoginDialog.vue b/src/components/LoginDialog.vue
index 24bedb4..df79108 100644
--- a/src/components/LoginDialog.vue
+++ b/src/components/LoginDialog.vue
@@ -56,7 +56,7 @@ export default {
           password: this.password,
         });
         this.show = false;
-        this.$emit('login-success');   // notifica al NavBar
+        this.$emit('login-success');
       } catch (e) {
         this.error = e.message ?? 'Error al iniciar sesión';
       }
diff --git a/src/components/Logout.vue b/src/components/Logout.vue
index 50598ca..7e1098e 100644
--- a/src/components/Logout.vue
+++ b/src/components/Logout.vue
@@ -1,29 +1,32 @@
-<style scoped>
-p {
-  font-size: 1.1rem;
-  color: #555;
-}
-</style>
 <template>
   <v-container class="d-flex flex-column align-center justify-center" style="height: 100vh;">
     <v-progress-circular indeterminate color="primary" />
     <p class="mt-4">Cerrando sesión…</p>
   </v-container>
 </template>
+
 <script>
-  import AuthService from '@/services/auth';
-  export default {
-    name: 'DonConfiao',
-    mounted() {
-      this.logout();
+import AuthService from '@/services/auth';
+
+export default {
+  name: 'DonConfiao',
+  mounted() {
+    this.logout();
+  },
+  methods: {
+    logout() {
+      AuthService.logout();
+      this.$router.push({
+        path: '/autenticarse'
+      });
     },
-    methods: {
-      logout() {
-        AuthService.logout();
-        this.$router.push({
-          path: "/autenticarse"
-        });
-      },
-    },
-  };
+  },
+};
 </script>
+
+<style scoped>
+p {
+  font-size: 1.1rem;
+  color: #555;
+}
+</style>
diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
index faf893a..0f2f5ef 100644
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@@ -77,14 +77,14 @@
      mounted() {
        this.checkAuth();
      },
-      watch: {
-          group () {
-              this.drawer = false
-          },
-          $route() {
-            this.checkAuth();
-          },
-      },
+     watch: {
+         group () {
+             this.drawer = false
+         },
+         $route() {
+           this.checkAuth();
+         },
+     },
      methods: {
          checkAuth() {
            this.isAuthenticated = AuthService.isAuthenticated();
diff --git a/src/services/auth.js b/src/services/auth.js
index 3766e8e..87743b6 100644
--- a/src/services/auth.js
+++ b/src/services/auth.js
@@ -16,9 +16,7 @@ class AuthService {
       try {
         const errData = await resp.json();
         errMsg = errData?.detail ?? errData?.message ?? errMsg;
-      } catch (_) {
-
-      }
+      } catch (_) { /* ignore */ }
       throw new Error(errMsg);
     }
 
-- 
2.49.1