Replace Chuck Norris API with lists endpoint
The commit replaces the Chuck Norris joke functionality with a new lists feature that fetches data from a local API endpoint using auth tokens.
This commit is contained in:
@@ -2,23 +2,9 @@
|
||||
<v-container
|
||||
class="fill-height d-flex flex-column align-center justify-center text-center"
|
||||
>
|
||||
<img
|
||||
:src="norrisStore.response.icon_url"
|
||||
alt="chuck norris"
|
||||
size="64"
|
||||
/>
|
||||
<div class="mt-3">My Application's Home Page</div>
|
||||
<div>
|
||||
{{ norrisStore.response }}
|
||||
{{ data }}
|
||||
{{ status }}
|
||||
{{ refreshToken }}
|
||||
</div>
|
||||
<div>
|
||||
<v-btn color="primary" @click="refresh">Refresca token</v-btn>
|
||||
</div>
|
||||
<div>
|
||||
<v-btn color="warning" @click="logout">Logout</v-btn>
|
||||
{{ listasStore.listas }}
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
@@ -28,18 +14,12 @@ definePageMeta({
|
||||
auth: true,
|
||||
});
|
||||
import { ref, onMounted } from "vue";
|
||||
import { useChuckStore } from "~/stores/chuck";
|
||||
import { useSystemStore } from "~/stores/system";
|
||||
import { useListasStore } from "~/stores/listas";
|
||||
const listasStore = useListasStore();
|
||||
const systemStore = useSystemStore();
|
||||
const norrisStore = useChuckStore();
|
||||
const { data, status, refresh, refreshToken, signOut } = useAuth();
|
||||
|
||||
const logout = async () => {
|
||||
await systemStore.deleteCookies();
|
||||
await signOut({ callbackUrl: "/login" });
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
await norrisStore.getData();
|
||||
await listasStore.getData();
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,14 +0,0 @@
|
||||
import { defineStore } from "pinia";
|
||||
|
||||
export const useChuckStore = defineStore("chuckNorris", {
|
||||
state: () => ({
|
||||
response: "",
|
||||
}),
|
||||
actions: {
|
||||
async getData() {
|
||||
const response = await fetch("https://api.chucknorris.io/jokes/random");
|
||||
const data = await response.json();
|
||||
this.response = data;
|
||||
},
|
||||
},
|
||||
});
|
||||
20
app/stores/listas.js
Normal file
20
app/stores/listas.js
Normal file
@@ -0,0 +1,20 @@
|
||||
import { defineStore } from "pinia";
|
||||
const { token } = useAuth();
|
||||
|
||||
export const useListasStore = defineStore("listas", {
|
||||
state: () => ({
|
||||
listas: [],
|
||||
}),
|
||||
actions: {
|
||||
async getData() {
|
||||
const response = await fetch("http://127.0.0.1:8000/lista/", {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Authorization: `${token.value}`,
|
||||
},
|
||||
});
|
||||
const data = await response.json();
|
||||
this.listas = data;
|
||||
},
|
||||
},
|
||||
});
|
||||
Reference in New Issue
Block a user