table now has edit button, WIP

This commit is contained in:
Gourav Kumar 2024-06-13 23:24:48 +05:30
parent e359526b17
commit 956faf2e3c
3 changed files with 25 additions and 8 deletions

View File

@ -1,6 +1,6 @@
<script setup> <script setup>
import CreateSecret from "./components/CreateSecret.vue"; import CreateSecret from "./components/CreateSecret.vue";
import HelloWorld from "./components/HelloWorld.vue"; import HomePage from "./components/HomePage.vue";
import ListSecrets from "./components/ListSecrets.vue"; import ListSecrets from "./components/ListSecrets.vue";
</script> </script>
@ -28,7 +28,7 @@ import ListSecrets from "./components/ListSecrets.vue";
</el-dialog> </el-dialog>
<div class="container"> <div class="container">
<HelloWorld msg="You did it!" @loggedin="loggedin = true" v-if="!loggedin" /> <HomePage msg="You did it!" @loggedin="loggedin = true" v-if="!loggedin" />
<el-button @click="showSecrets = true" v-if="loggedin"> Show secrets </el-button> <el-button @click="showSecrets = true" v-if="loggedin"> Show secrets </el-button>
<el-button @click="showSecrets = false" v-if="showSecrets && loggedin"> <el-button @click="showSecrets = false" v-if="showSecrets && loggedin">
Hide secrets Hide secrets

View File

@ -1,8 +1,5 @@
<template> <template>
<div> <div>
<h3>
{{ title }}
</h3>
<div id="container"> <div id="container">
<el-form :model="form" label-width="auto"> <el-form :model="form" label-width="auto">
<el-form-item label="Issuer"> <el-form-item label="Issuer">

View File

@ -1,6 +1,14 @@
<template> <template>
<div> <div>
<el-table :data="secretsList" style="width: 100vw"> <el-table :data="secretsList" style="width: 100vw">
<el-table-column type="expand">
<template #default="props">
<div style="margin-left: 3rem">
{{ props.row.notes }}
</div>
</template>
</el-table-column>
<el-table-column prop="id" label="Id" />
<el-table-column prop="issuer" label="Issuer" /> <el-table-column prop="issuer" label="Issuer" />
<el-table-column prop="username" label="Username" /> <el-table-column prop="username" label="Username" />
<el-table-column label="Secret"> <el-table-column label="Secret">
@ -10,7 +18,14 @@
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="notes" label="Notes" /> <!-- <el-table-column prop="notes" label="Notes" /> -->
<el-table-column fixed="right" label="Operations" width="120">
<template #default="scope">
<el-button link type="primary" size="small" @click="handleClick(scope)">
Edit
</el-button>
</template>
</el-table-column>
</el-table> </el-table>
</div> </div>
</template> </template>
@ -42,14 +57,15 @@ export default {
const response = await fetch(url, requestOptions) const response = await fetch(url, requestOptions)
.then((response) => response.json()) .then((response) => response.json())
.then((data) => { .then((data) => {
// console.log(data); console.log(data);
return data; return data;
}) })
.catch((err) => console.log(err)); .catch((err) => console.log(err));
response.forEach((element) => { response.forEach((element) => {
console.log(element); // console.log(element);
const row = this.parseSecret(element.data); const row = this.parseSecret(element.data);
row["id"] = element["id"];
this.secretsList.push(row); this.secretsList.push(row);
}); });
}, },
@ -65,6 +81,10 @@ export default {
console.log(expires); console.log(expires);
return otp; return otp;
}, },
handleClick(scope) {
console.log(scope);
},
}, },
mounted() { mounted() {