kauft.es
/
linkylinky-dashboard
4
0
Fork 0
Code Issues 1 Pull Requests 10 Projects Releases Wiki Activity

Implemented basic api getting and deletion

This commit is contained in:
Nicolai Ort 2021-08-16 16:47:15 +02:00
parent 91572bd24e
commit ca09aa0fd5
Signed by: niggl
GPG Key ID: 13AFA55AF62F269F
3 changed files with 72 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
package.json
View File

@ -25,6 +25,7 @@
},
"type": "module",
"dependencies": {
"@sveltejs/adapter-static": "^1.0.0-next.16"
"@sveltejs/adapter-static": "^1.0.0-next.16",
"axios": "^0.21.1"
}
}

18
src/lib/Apiclient.js Normal file
View File

@ -0,0 +1,18 @@
import axios from 'axios';
const config = {
username: "niggl",
password: "9VEBc596T7tiPB7mNJukfeH9LfGzrrJN"
}
export default class Apiclient {
static async getUrls() {
return (await axios.get("https://kauft.es/api?showVisits=true", {
auth: config
})).data
}
static async deleteUrl(shortcode) {
return (await axios.delete(`https://kauft.es/api/${shortcode}`, {
auth: config
})).status
}
}

92
src/routes/links.svelte
View File

@ -1,46 +1,58 @@
<script>
import Apiclient from '$lib/Apiclient';
$: urls = [];
let urlQuery = Apiclient.getUrls().then((res) => {
console.log('here');
urls = res;
});
function deleteUrl(shortcode) {
Apiclient.deleteUrl(shortcode).then((res) => {
urls = urls.filter((url) => url.shortcode != shortcode);
});
}
</script>
<h2 class="text-3xl font-bold text-gray-800 dark:text-gray-100 pb-6">Manage all links</h2>
<div class="rounded-xl">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50 dark:bg-gray-900 text-gray-800 dark:text-gray-100">
<tr>
<th
scope="col"
class="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider"
>
Shortcode
</th>
<th
scope="col"
class="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider"
>
Target
</th>
<th
scope="col"
class="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider"
>
Visits
</th>
<th scope="col" class="relative px-6 py-3">
<span class="sr-only">Edit</span>
</th>
</tr>
</thead>
<tbody class="bg-white dark:bg-gray-700 divide-y divide-gray-200 dark:text-gray-100" x-max="1">
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900 dark:text-gray-200"> TODO </td>
<td class="px-6 py-4 whitespace-nowrap text-sm">
<a href="https://sthsth">https://sthsth</a>
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm"> 69 </td>
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
<a href="#" class="text-indigo-600 dark:text-red-600 hover:text-indigo-900 dark:hover:text-red-900">Delete</a>
</td>
</tr>
</tbody>
</table>
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50 dark:bg-gray-900 text-gray-800 dark:text-gray-100">
<tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider">
Shortcode
</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider">
Target
</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider">
Visits
</th>
<th scope="col" class="relative px-6 py-3">
<span class="sr-only">Edit</span>
</th>
</tr>
</thead>
<tbody class="bg-white dark:bg-gray-700 divide-y divide-gray-200 dark:text-gray-100" x-max="1">
{#each urls as url}
<tr>
<td
class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900 dark:text-gray-200"
>
{url.shortcode}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm">
<a href={url.target}>{url.target}</a>
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm"> {url.visits} </td>
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
<button
on:click={deleteUrl(url.shortcode)}
class="text-indigo-600 dark:text-red-600 hover:text-indigo-900 dark:hover:text-red-900"
>Delete</button
>
</td>
</tr>
{/each}
</tbody>
</table>
</div>