Ghost/ghost/admin/app/templates/staff/user.hbs
2019-02-22 18:16:25 +07:00

344 lines
18 KiB
Handlebars

<section class="gh-canvas">
<header class="gh-canvas-header">
<h2 class="gh-canvas-title" data-test-screen-title>
{{link-to "Staff" "staff" data-test-staff-link=true}}
<span>{{svg-jar "arrow-right"}}</span>
{{user.name}}
{{#if user.isSuspended}}
<span class="gh-badge suspended" data-test-suspended-badge>Suspended</span>
{{/if}}
</h2>
{{#if showLeaveSettingsModal}}
{{gh-fullscreen-modal "leave-settings"
confirm=(action "leaveSettings")
close=(action "toggleLeaveSettingsModal")
modifier="action wide"}}
{{/if}}
<section class="view-actions">
{{#if userActionsAreVisible}}
<span class="dropdown">
{{#gh-dropdown-button dropdownName="user-actions-menu" classNames="gh-btn gh-btn-default gh-btn-icon only-has-icon user-actions-cog" title="User Actions" data-test-user-actions=true}}
<span>
{{svg-jar "settings"}}
<span class="hidden">User Settings</span>
</span>
{{/gh-dropdown-button}}
{{#gh-dropdown name="user-actions-menu" tagName="ul" classNames="user-actions-menu dropdown-menu dropdown-triangle-top-right"}}
{{#if canMakeOwner}}
<li>
<button {{action "toggleTransferOwnerModal"}}>
Make Owner
</button>
{{#if showTransferOwnerModal}}
{{gh-fullscreen-modal "transfer-owner"
confirm=(action "transferOwnership")
close=(action "toggleTransferOwnerModal")
modifier="action wide"}}
{{/if}}
</li>
{{/if}}
{{#if deleteUserActionIsVisible}}
<li>
<button {{action "toggleDeleteUserModal"}} class="delete" data-test-delete-button>
Delete User
</button>
</li>
{{#if user.isActive}}
<li>
<button {{action "toggleSuspendUserModal"}} class="suspend" data-test-suspend-button>
Suspend User
</button>
</li>
{{/if}}
{{#if user.isSuspended}}
<li>
<button {{action "toggleUnsuspendUserModal"}} class="unsuspend" data-test-unsuspend-button>
Un-suspend User
</button>
</li>
{{/if}}
{{/if}}
{{/gh-dropdown}}
</span>
{{/if}}
{{gh-task-button class="gh-btn gh-btn-blue gh-btn-icon" task=save data-test-save-button=true}}
{{#if showDeleteUserModal}}
{{gh-fullscreen-modal "delete-user"
model=user
confirm=(action "deleteUser")
close=(action "toggleDeleteUserModal")
modifier="action wide"}}
{{/if}}
{{#if showSuspendUserModal}}
{{gh-fullscreen-modal "suspend-user"
model=user
confirm=(action "suspendUser")
close=(action "toggleSuspendUserModal")
modifier="action wide"}}
{{/if}}
{{#if showUnsuspendUserModal}}
{{gh-fullscreen-modal "unsuspend-user"
model=user
confirm=(action "unsuspendUser")
close=(action "toggleUnsuspendUserModal")
modifier="action wide"}}
{{/if}}
</section>
</header>
<div class="gm-main view-container settings-user">
<form class="user-profile" novalidate="novalidate" autocomplete="off" {{action (perform save) on="submit"}}>
<figure class="user-cover" style={{background-image-style user.coverImageUrl}}>
<button type="button" class="gh-btn gh-btn-default user-cover-edit" {{action "toggleUploadCoverModal"}}><span>Change Cover</span></button>
{{#if showUploadCoverModal}}
{{gh-fullscreen-modal "upload-image"
model=(hash model=user imageProperty="coverImage")
close=(action "toggleUploadCoverModal")
modifier="action wide"}}
{{/if}}
</figure>
<figure class="user-image bg-whitegrey">
<div id="user-image" class="img" style={{background-image-style user.profileImageUrl}}><span class="hidden">{{user.name}}"s Picture</span></div>
<button type="button" {{action "toggleUploadImageModal"}} class="edit-user-image">Edit Picture</button>
{{#if showUploadImageModal}}
{{gh-fullscreen-modal "upload-image"
model=(hash model=user imageProperty="profileImage" uploadUrl="/images/profile-image")
close=(action "toggleUploadImageModal")
modifier="action wide"}}
{{/if}}
</figure>
<fieldset class="user-details-bottom">
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="name" class="first-form-group"}}
<label for="user-name">Full Name</label>
{{gh-text-input
id="user-name"
class="user-name"
placeholder="Full Name"
autocorrect="off"
value=(readonly user.name)
input=(action (mut user.name) value="target.value")
focus-out=(action "validate" "name" target=user)
data-test-name-input=true
}}
{{#if user.errors.name}}
{{gh-error-message errors=user.errors property="name" data-test-error="user-name"}}
{{else}}
<p>Use your real name so people can recognise you</p>
{{/if}}
{{/gh-form-group}}
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="slug"}}
<label for="user-slug">Slug</label>
{{gh-text-input
class="user-name"
id="user-slug"
name="user"
placeholder="Slug"
selectOnClick="true"
autocorrect="off"
value=(readonly slugValue)
input=(action (mut slugValue) value="target.value")
focus-out=(action (perform updateSlug slugValue))
data-test-slug-input=true
}}
<p>{{gh-blog-url}}/author/{{slugValue}}</p>
{{gh-error-message errors=user.errors property="slug" data-test-error="user-slug"}}
{{/gh-form-group}}
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="email"}}
<label for="user-email">Email</label>
{{!-- Administrators only see text of Owner's email address but not input --}}
{{#if canChangeEmail}}
{{gh-text-input
type="email"
id="user-email"
name="email"
placeholder="Email Address"
autocapitalize="off"
autocorrect="off"
autocomplete="off"
value=(readonly user.email)
input=(action (mut user.email) value="target.value")
focus-out=(action "validate" "email" target=user)
data-test-email-input=true}}
{{gh-error-message errors=user.errors property="email" data-test-error="user-email"}}
{{else}}
<span>{{user.email}}</span>
{{/if}}
<p>Used for notifications</p>
{{/gh-form-group}}
{{#if rolesDropdownIsVisible}}
<div class="form-group">
<label for="user-role">Role</label>
<span class="gh-select" tabindex="0">
{{one-way-select
id="new-user-role"
options=roles
optionValuePath="id"
optionLabelPath="name"
value=user.role
update=(action "changeRole")
}}
</span>
<p>What permissions should this user have?</p>
</div>
{{/if}}
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="location"}}
<label for="user-location">Location</label>
{{gh-text-input
id="user-location"
value=(readonly user.location)
input=(action (mut user.location) value="target.value")
focus-out=(action "validate" "location" target=user)
data-test-location-input=true}}
{{gh-error-message errors=user.errors property="location" data-test-error="user-location"}}
<p>Where in the world do you live?</p>
{{/gh-form-group}}
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="website"}}
<label for="user-website">Website</label>
{{gh-text-input
type="url"
id="user-website"
autocapitalize="off"
autocorrect="off"
autocomplete="off"
value=(readonly user.website)
input=(action (mut user.website) value="target.value")
focus-out=(action "validate" "website" target=user)
data-test-website-input=true}}
{{gh-error-message errors=user.errors property="website" data-test-error="user-website"}}
<p>Have a website or blog other than this one? Link it!</p>
{{/gh-form-group}}
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="facebook"}}
<label for="user-facebook">Facebook Profile</label>
{{gh-text-input
type="url"
placeholder="https://www.facebook.com/username"
autocorrect="off"
id="user-facebook"
name="user[facebook]"
value=(readonly user.facebook)
input=(action (mut _scratchFacebook) value="target.value")
focus-out=(action "validateFacebookUrl")
data-test-facebook-input=true
}}
{{gh-error-message errors=user.errors property="facebook" data-test-error="user-facebook"}}
<p>URL of your personal Facebook Profile</p>
{{/gh-form-group}}
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="twitter"}}
<label for="user-twitter">Twitter Profile</label>
{{gh-text-input
type="url"
placeholder="https://twitter.com/username"
autocorrect="off"
id="user-twitter"
name="user[twitter]"
value=(readonly user.twitter)
input=(action (mut _scratchTwitter) value="target.value")
focus-out=(action "validateTwitterUrl")
data-test-twitter-input=true
}}
{{gh-error-message errors=user.errors property="twitter" data-test-error="user-twitter"}}
<p>URL of your personal Twitter profile</p>
{{/gh-form-group}}
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="bio" class="bio-container"}}
<label for="user-bio">Bio</label>
{{gh-textarea
id="user-bio"
value=(readonly user.bio)
input=(action (mut user.bio) value="target.value")
focus-out=(action "validate" "bio" target=user)
data-test-bio-input=true
}}
{{gh-error-message errors=user.errors property="bio" data-test-error="user-bio"}}
<p>
Write about you, in 200 characters or less.
{{gh-count-characters user.bio}}
</p>
{{/gh-form-group}}
<hr />
</fieldset>
</form> {{! user details form }}
{{!-- If an administrator is viewing Owner's profile then hide inputs for change password --}}
{{#if canChangePassword}}
<form id="password-reset" class="user-profile" novalidate="novalidate" autocomplete="off" {{action (perform user.saveNewPassword) on="submit"}}>
<fieldset>
{{#if isOwnProfile}}
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="password"}}
<label for="user-password-old">Old Password</label>
{{gh-text-input
type="password"
id="user-password-old"
autocomplete="current-password"
value=(readonly user.password)
input=(action "updatePassword" value="target.value")
keyEvents=(hash
Enter=(action (perform user.saveNewPassword))
)
data-test-old-pass-input=true
}}
{{gh-error-message errors=user.errors property="password" data-test-error="user-old-pass"}}
{{/gh-form-group}}
{{/if}}
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="newPassword"}}
<label for="user-password-new">New Password</label>
{{gh-text-input
value=(readonly user.newPassword)
type="password"
autocomplete="new-password"
id="user-password-new"
input=(action "updateNewPassword" value="target.value")
keyEvents=(hash
Enter=(action (perform user.saveNewPassword))
)
data-test-new-pass-input=true
}}
{{gh-error-message errors=user.errors property="newPassword" data-test-error="user-new-pass"}}
{{/gh-form-group}}
{{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="ne2Password"}}
<label for="user-new-password-verification">Verify Password</label>
{{gh-text-input
value=(readonly user.ne2Password)
type="password"
id="user-new-password-verification"
input=(action "updateNe2Password" value="target.value")
keyEvents=(hash
Enter=(action (perform user.saveNewPassword))
)
data-test-ne2-pass-input=true
}}
{{gh-error-message errors=user.errors property="ne2Password" data-test-error="user-ne2-pass"}}
{{/gh-form-group}}
<div class="form-group">
{{gh-task-button "Change Password" class="gh-btn gh-btn-red gh-btn-icon button-change-password" task=user.saveNewPassword data-test-save-pw-button=true}}
</div>
</fieldset>
</form> {{! change password form }}
{{/if}}
</div>
</section>