51 lines
2.8 KiB
JavaScript
51 lines
2.8 KiB
JavaScript
Vue.component('ProfilCard', {
|
|
template: `<div>
|
|
<img class="profil-img rounded-circle" src="img/profil_icon.png" width=120px height=120px>
|
|
<div class="profil-card card">
|
|
<div class="edit-item"><i class="material-icons" data-toggle="modal" data-target="#myModal">edit</i></div>
|
|
<div class="profil-text">
|
|
<h5><b>{{ profil.user }}</b></h5><br>
|
|
<h6>{{ profil.major }}<br><br>
|
|
{{ profil.semester }}</h6>
|
|
</div>
|
|
<hr>
|
|
<div class="om-tab">
|
|
<button class="tablinks om-tablinks"><b>Abonniert<br>{{ profil.abos }}</b></button>
|
|
<button class="tablinks om-tablinks"><b>Gespeichert<br>{{ profil.saved }}</b></button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade" id="myModal" role="dialog">
|
|
<div class="modal-dialog modal-dialog-centered">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Profil Bearbeiten</h5>
|
|
<button type="button" class="close" data-dismiss="modal">×</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form class="new-msg-form">
|
|
<div class="form-group">
|
|
<label class="bmd-label-floating">Benutzername*</label>
|
|
<input type="text" class="form-control" id="user">
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="bmd-label-floating">Studiengang*</label>
|
|
<input type="text" class="form-control" id="major">
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="bmd-label-floating">Semester*</label>
|
|
<input type="text" class="form-control" id="semester">
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class ="btn btn-default" data-dismiss="modal" id="close">Close</button>
|
|
<button type="submit" class="btn btn-raised om-btn" data-dismiss="modal" id="save">Save</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>`,
|
|
props: ['profil']
|
|
});
|