.standard-page
.row
.col-8
.header
h1 {{user.profile.name}}
h4
strong User Id:
| {{user._id}}
.col-4
button.btn.btn-secondary(@click='editing = !editing') Edit
.row(v-if='!editing')
.col-8
.about
h2 About
p {{user.profile.blurb}}
.photo
h2 Photo
img.img-rendering-auto(v-if='user.profile.imageUrl', :src='user.profile.imageUrl')
.col-4
.info
h2 info
div
strong Joined:
| {{user.auth.timestamps.created}}
div
strong Total Log Ins:
span {{ $t('totalCheckins', {count: user.loginIncentives}) }}
div
| {{getProgressDisplay()}}
.progress
.progress-bar(role='progressbar', :aria-valuenow='incentivesProgress', aria-valuemin='0', aria-valuemax='100', :style='{width: incentivesProgress + "%"}')
span.sr-only {{ incentivesProgress }}% Complete
// @TODO: Implement in V2 .social
.row(v-if='editing')
h1 Edit Profile
.col-12
.alert.alert-info.alert-sm(v-html='$t("communityGuidelinesWarning", managerEmail)')
// TODO use photo-upload instead: https://groups.google.com/forum/?fromgroups=#!topic/derbyjs/xMmADvxBOak
.form-group
label {{ $t('displayName') }}
input.form-control(type='text', :placeholder="$t('fullName')", v-model='editingProfile.name')
.form-group
label {{ $t('photoUrl') }}
input.form-control(type='url', v-model='editingProfile.imageUrl', :placeholder="$t('imageUrl')")
.form-group
label {{ $t('about') }}
textarea.form-control(rows=5, :placeholder="$t('displayBlurbPlaceholder')", v-model='editingProfile.blurb')
// include ../../shared/formatting-help
.form-group
label Facebook
input.form-control(type='text', placeholder="Paste your link here", v-model='editingProfile.facebook')
.form-group
label Instagram
input.form-control(type='text', placeholder="Paste your link here", v-model='editingProfile.instagram')
.form-group
label Twitter
input.form-control(type='text', placeholder="Paste your link here", v-model='editingProfile.twitter')
.col-3.offset-6.text.center
button.btn.btn-primary(@click='save()') {{ $t("save") }}
button.btn.btn-warning(@click='editing = false') {{ $t("cancel") }}