mirror of
https://github.com/documize/community.git
synced 2025-08-02 20:15:26 +02:00
Streamline document meta view and editing experience
Meta data: 1. Condensed layout. 2. Unified editing. Co-Authored-By: Saul S <sauls8t@users.noreply.github.com>
This commit is contained in:
McMatts
parent
f70d4b33a3
commit
27fde0dac8
26 changed files with 2389 additions and 1956 deletions
|
|
@ -1,26 +0,0 @@
|
|||
{{#unless editMode}}
|
||||
<div class="view-document">
|
||||
<div class="document-heading {{if canEdit 'cursor-pointer'}}" onclick={{if canEdit (action 'toggleEdit')}}>
|
||||
<h1 class="doc-title">
|
||||
{{#if document.template}}
|
||||
<span class="bg-warning p-1 pr-2 pl-2">Template</span>
|
||||
{{/if}}
|
||||
{{document.name}}
|
||||
</h1>
|
||||
<div class="doc-excerpt">{{document.excerpt}}</div>
|
||||
</div>
|
||||
</div>
|
||||
{{else}}
|
||||
<form class="view-document" {{action "onSave" on="submit"}}>
|
||||
<div class="document-heading-edit">
|
||||
<div class="form-group">
|
||||
{{focus-input id="document-name" type="text" value=docName class=(if hasNameError 'form-control mousetrap is-invalid' 'form-control mousetrap') placeholder="Title" autocomplete="off"}}
|
||||
</div>
|
||||
<div class="form-group">
|
||||
{{textarea id="document-excerpt" rows="2" value=docExcerpt class='form-control mousetrap' placeholder="Excerpt" autocomplete="off"}}
|
||||
</div>
|
||||
<button type="button" class="btn btn-outline-secondary" {{action "onCancel"}}>Cancel</button>
|
||||
<button type="submit" class="btn btn-success" {{action "onSave"}}>Save</button>
|
||||
</div>
|
||||
</form>
|
||||
{{/unless}}
|
||||
|
|
@ -1,119 +1,42 @@
|
|||
<div class="view-document">
|
||||
<div class="document-customfields">
|
||||
{{#if (eq document.lifecycle constants.Lifecycle.Live)}}
|
||||
<div id="document-lifecycle-popover" class="document-lifecycle-live text-uppercase">{{document.lifecycleLabel}}</div>
|
||||
{{/if}}
|
||||
{{#if (eq document.lifecycle constants.Lifecycle.Draft)}}
|
||||
<div id="document-lifecycle-popover" class="document-lifecycle-draft text-uppercase">{{document.lifecycleLabel}}</div>
|
||||
{{/if}}
|
||||
|
||||
<div class="row {{if (eq selectedCategories.length 0) 'd-print-none'}}">
|
||||
<div class="col-12 col-sm-3 heading">Categories</div>
|
||||
<div class="col-12 col-sm-9 value">
|
||||
{{#each selectedCategories as |cat|}}
|
||||
{{#link-to 'folder' folder.id folder.slug (query-params category=cat.id)}}
|
||||
{{cat.category}}
|
||||
{{/link-to}}
|
||||
|
||||
{{else}}
|
||||
{{#if canAddCategory}}
|
||||
{{#if canSelectCategory}}
|
||||
<a href="#" class="d-print-none" {{action 'onShowCategoryModal'}}><select></a>
|
||||
{{else}}
|
||||
{{#link-to 'folder.category' folder.id folder.slug class='d-print-none'}}<manage>{{/link-to}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/each}}
|
||||
{{#if canSelectCategory}}
|
||||
<div class="action-button button-icon-gray button-icon-small align-middle d-print-none" {{action 'onShowCategoryModal'}}>
|
||||
<i class="material-icons align-middle">edit</i>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-block d-sm-none margin-top-20" />
|
||||
<div class="d-sm-inline-block margin-left-20" />
|
||||
|
||||
<div class="row {{if (eq tagz.length 0) 'd-print-none'}}">
|
||||
<div class="col-12 col-sm-3 heading">Tags</div>
|
||||
<div class="col-12 col-sm-9 value">
|
||||
{{#each tagz as |t index|}}
|
||||
{{#link-to 'search' (query-params filter=t matchTag=true matchDoc=false matchContent=false matchFile=false)}}
|
||||
{{concat '#' t}}
|
||||
{{/link-to}}
|
||||
{{/each}}
|
||||
{{#if permissions.documentEdit}}
|
||||
<div class="action-button button-icon-gray button-icon-small align-middle d-print-none" data-toggle="modal" data-target="#document-tags-modal" data-backdrop="static">
|
||||
<i class="material-icons align-middle">edit</i>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
{{#if (eq document.protection constants.ProtectionType.None)}}
|
||||
<div id="document-protection-popover" class="document-protection-unlocked text-uppercase">OPEN</div>
|
||||
{{/if}}
|
||||
{{#if (eq document.protection constants.ProtectionType.Review)}}
|
||||
<div id="document-protection-popover" class="document-protection-review text-uppercase">PROTECTED</div>
|
||||
{{/if}}
|
||||
{{#if (eq document.protection constants.ProtectionType.Lock)}}
|
||||
<div id="document-protection-popover" class="document-protection-locked text-uppercase">LOCKED</div>
|
||||
{{/if}}
|
||||
|
||||
<div class="row d-print-none">
|
||||
<div class="col-12 col-sm-3 heading">Change Control</div>
|
||||
<div class="col-12 col-sm-9 value-static">
|
||||
<span>{{changeControlMsg}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{#if (eq document.protection constants.ProtectionType.Review)}}
|
||||
<div class="row d-print-none">
|
||||
<div class="col-12 col-sm-3 heading">Approval Process</div>
|
||||
<div class="col-12 col-sm-9 value-static">
|
||||
<span>{{approvalMsg}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{#if userChanges}}
|
||||
<div class="row d-print-none">
|
||||
<div class="col-12 col-sm-3 heading">Your Contributions</div>
|
||||
<div class="col-12 col-sm-9 value-static">
|
||||
<span>{{contributorMsg}}</span>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{#if isApprover}}
|
||||
<div class="row d-print-none">
|
||||
<div class="col-12 col-sm-3 heading">Approver Status</div>
|
||||
<div class="col-12 col-sm-9 value-static">
|
||||
<span>{{approverMsg}}</span>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
{{document/view-attachment document=document permissions=permissions}}
|
||||
<div class="d-block d-sm-none margin-top-20" />
|
||||
<div class="d-sm-inline-block margin-left-20" />
|
||||
|
||||
{{#each selectedCategories as |cat|}}
|
||||
<div class="document-category" data-toggle="tooltip" data-placement="top" title="Category">
|
||||
{{cat.category}}
|
||||
</div>
|
||||
{{/each}}
|
||||
|
||||
<div class="d-block d-sm-none margin-top-20" />
|
||||
|
||||
{{#each tagz as |t index|}}
|
||||
<div class="document-tag" data-toggle="tooltip" data-placement="top" title="Tag">
|
||||
{{concat '#' t}}
|
||||
</div>
|
||||
{{/each}}
|
||||
|
||||
<div class="document-meta">
|
||||
{{document/view-attachment document=document permissions=permissions}}
|
||||
</div>
|
||||
|
||||
{{#if permissions.documentEdit}}
|
||||
{{#ui/ui-dialog title="Document Categories" confirmCaption="Select" buttonType="btn-success" show=showCategoryModal onAction=(action 'onSaveCategory')}}
|
||||
<p>Select who can view documents within category</p>
|
||||
{{ui/ui-list-picker items=categories nameField='category' singleSelect=false}}
|
||||
{{/ui/ui-dialog}}
|
||||
|
||||
<div id="document-tags-modal" class="modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">Document Tags</div>
|
||||
<div class="modal-body">
|
||||
<form onsubmit={{action 'onAddTag'}}>
|
||||
<div class="form-group">
|
||||
<label for="add-tag-field">Specify up to three tags per document</label>
|
||||
{{#each tagzEdit as |t|}}
|
||||
<div class="m-3 text-secondary">
|
||||
<div class="button-icon-danger button-icon-small align-middle" {{action 'onRemoveTag' t}}>
|
||||
<i class="material-icons">clear</i>
|
||||
</div>
|
||||
{{concat '#' t}}
|
||||
</div>
|
||||
{{/each}}
|
||||
{{focus-input type='text' id="add-tag-field" class="form-control mousetrap" placeholder="Tag name" value=newTag}}
|
||||
<small class="form-text text-success">Press ENTER to add tag</small>
|
||||
<small class="form-text text-muted">Lowercase, characters, numbers, hyphens only</small>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
|
||||
<button type="button" class="btn btn-success" onclick={{action 'onSaveTags'}}>Save</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
<div class="margin-top-70" />
|
||||
|
|
|
|||
21
gui/app/templates/components/document/settings-general.hbs
Normal file
21
gui/app/templates/components/document/settings-general.hbs
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
<div class="content-zone">
|
||||
<div class="explainer-header">General Options</div>
|
||||
<p class="explainer-text explainer-gap">Set name, excerpt and lifecycle stage</p>
|
||||
|
||||
<form class="view-document">
|
||||
<div class="form-group">
|
||||
<label for="document-name">Name</label>
|
||||
{{focus-input id="document-name" type="text" value=docName
|
||||
class=(if hasNameError 'form-control mousetrap is-invalid' 'form-control mousetrap') placeholder="Title" autocomplete="off" disabled=noEdits}}
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="document-excerpt">Excerpt</label>
|
||||
{{textarea id="document-excerpt" rows="4" value=docExcerpt class='form-control mousetrap' placeholder="Excerpt" autocomplete="off" disabled=noEdits}}
|
||||
<small class="form-text text-muted">Optional description explaining content</small>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-success text-uppercase font-weight-bold mt-5" {{action "onSave"}}>Save</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
45
gui/app/templates/components/document/settings-meta.hbs
Normal file
45
gui/app/templates/components/document/settings-meta.hbs
Normal file
|
|
@ -0,0 +1,45 @@
|
|||
<div class="content-zone">
|
||||
<div class="explainer-header">Categories & Tags</div>
|
||||
<p class="explainer-text explainer-gap">Categorize your content, assign tags to suppliment</p>
|
||||
|
||||
<h1>Specify up to three tags</h1>
|
||||
<p class="form-text text-muted">Lowercase, characters, numbers, hyphens only</p>
|
||||
<form>
|
||||
<div class="input-group mb-3">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text">#</span>
|
||||
</div>
|
||||
{{input type='text' id='add-tag-field1' class="form-control mousetrap tag-input" placeholder="Tag name" value=tag1}}
|
||||
</div>
|
||||
<div class="input-group mb-3">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text">#</span>
|
||||
</div>
|
||||
{{input type='text' id='add-tag-field2' class="form-control mousetrap tag-input" placeholder="Tag name" value=tag2}}
|
||||
</div>
|
||||
<div class="input-group mb-3">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text">#</span>
|
||||
</div>
|
||||
{{input type='text' id='add-tag-field3' class="form-control mousetrap tag-input" placeholder="Tag name" value=tag3}}
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="mt-5" />
|
||||
|
||||
<h1>Assign categories</h1>
|
||||
<p class="form-text text-muted">Categories allow you divide a space into logical chunks</p>
|
||||
|
||||
{{ui/ui-list-picker items=categories nameField='category' singleSelect=false}}
|
||||
{{#unless selectedCategories}}
|
||||
<p class="text-danger">This space has no categories defined yet.</p>
|
||||
{{#if canAddCategory}}
|
||||
<p>
|
||||
{{#link-to 'folder.category' space.id space.slug class="btn btn-secondary font-weight-bold"}}Manage categories{{/link-to}}
|
||||
</p>
|
||||
{{/if}}
|
||||
{{/unless}}
|
||||
|
||||
<button type="submit" class="btn btn-success text-uppercase font-weight-bold mt-5" {{action "onSave"}}>Save</button>
|
||||
</div>
|
||||
|
||||
|
|
@ -1,5 +1,9 @@
|
|||
<div class="col-12 col-sm-3 heading">Attachments</div>
|
||||
<div class="col-12 col-sm-9 view-attachment">
|
||||
<div class="view-attachment d-print-none">
|
||||
{{#if canEdit}}
|
||||
<div class="upload-document-files">
|
||||
<div id="upload-document-files" class="btn btn-secondary text-uppercase font-weight-bold">+ Attachments</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
{{#if hasAttachments}}
|
||||
<ul class="list">
|
||||
{{#each files key="id" as |a index|}}
|
||||
|
|
@ -18,11 +22,6 @@
|
|||
{{/each}}
|
||||
</ul>
|
||||
{{/if}}
|
||||
{{#if canEdit}}
|
||||
<div class="upload-document-files">
|
||||
<div id="upload-document-files" class="btn btn-outline-secondary">Upload</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
{{#ui/ui-dialog title="Delete Attachment" confirmCaption="Delete" buttonType="btn-danger" show=showDialog onAction=(action 'onDelete')}}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue