70 lines
1.7 KiB
Vue
70 lines
1.7 KiB
Vue
|
<template>
|
||
|
|
<div class="wrapper">
|
||
|
|
<div class="has-text-centered">
|
||
|
|
<h3 class="title">Settings</h3>
|
||
|
|
</div>
|
||
|
|
<div class="columns">
|
||
|
|
<div class="column is-one-quarter">
|
||
|
|
<figure class="image is-128x128 m-auto">
|
||
|
|
<img
|
||
|
|
class="is-rounded is-avatar"
|
||
|
|
src="//external-content.duckduckgo.com/iu/?u=http%3A%2F%2F0.gravatar.com%2Favatar%2F3e9dc6179a412b170e6a8d779a84c341.png&f=1"
|
||
|
|
/>
|
||
|
|
</figure>
|
||
|
|
<div class="card m-t-lg">
|
||
|
|
<header class="card-header">
|
||
|
|
<p class="card-header-title">My Children</p>
|
||
|
|
</header>
|
||
|
|
<div class="card-content">bla bla bla</div>
|
||
|
|
<footer class="card-footer">
|
||
|
|
<a href="#" class="card-footer-item">Add a New Child</a>
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column">
|
||
|
|
<form class="form">
|
||
|
|
<div class="field">
|
||
|
|
<label class="label">Name</label>
|
||
|
|
<div class="control">
|
||
|
|
<input class="input" type="text" placeholder="Text input" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="field">
|
||
|
|
<label class="label">Email</label>
|
||
|
|
<div class="control">
|
||
|
|
<input class="input" type="text" placeholder="Text input" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script lang="ts">
|
||
|
|
let user: {
|
||
|
|
avatar?: string;
|
||
|
|
email?: string;
|
||
|
|
name: string;
|
||
|
|
isAdmin: boolean;
|
||
|
|
} = {
|
||
|
|
name: "LOADING...",
|
||
|
|
isAdmin: false
|
||
|
|
};
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: "Settings",
|
||
|
|
beforeCreate() {},
|
||
|
|
async created() {
|
||
|
|
const response = await fetch("/users/profile/");
|
||
|
|
this.user = await response.json();
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
user
|
||
|
|
};
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|