mirror of
https://github.com/documize/community.git
synced 2025-07-23 15:19:42 +02:00
Update Space view to use new layout
This commit is contained in:
McMatts
parent
0cc83c13c8
commit
d5b5e015d1
18 changed files with 474 additions and 330 deletions
|
|
@ -36,7 +36,7 @@ import (
|
|||
"github.com/documize/community/model/doc"
|
||||
"github.com/documize/community/model/page"
|
||||
pm "github.com/documize/community/model/permission"
|
||||
"github.com/documize/community/model/template"
|
||||
// "github.com/documize/community/model/template"
|
||||
"github.com/documize/community/model/workflow"
|
||||
uuid "github.com/nu7hatch/gouuid"
|
||||
)
|
||||
|
|
@ -66,23 +66,23 @@ func (h *Handler) SavedList(w http.ResponseWriter, r *http.Request) {
|
|||
return
|
||||
}
|
||||
|
||||
templates := []template.Template{}
|
||||
// templates := []template.Template{}
|
||||
|
||||
for _, d := range documents {
|
||||
var t = template.Template{}
|
||||
t.ID = d.RefID
|
||||
t.Title = d.Name
|
||||
t.Description = d.Excerpt
|
||||
t.Author = ""
|
||||
t.Dated = d.Created
|
||||
t.Type = template.TypePrivate
|
||||
// for _, d := range documents {
|
||||
// var t = template.Template{}
|
||||
// t.ID = d.RefID
|
||||
// t.Title = d.Name
|
||||
// t.Description = d.Excerpt
|
||||
// t.Author = ""
|
||||
// t.Dated = d.Created
|
||||
// t.Type = template.TypePrivate
|
||||
|
||||
if d.SpaceID == spaceID {
|
||||
templates = append(templates, t)
|
||||
}
|
||||
}
|
||||
// if d.SpaceID == spaceID {
|
||||
// templates = append(templates, t)
|
||||
// }
|
||||
// }
|
||||
|
||||
response.WriteJSON(w, templates)
|
||||
response.WriteJSON(w, documents)
|
||||
}
|
||||
|
||||
// SaveAs saves existing document as a template.
|
||||
|
|
|
|||
|
|
@ -12,6 +12,8 @@
|
|||
import Component from '@ember/component';
|
||||
|
||||
export default Component.extend({
|
||||
classNames: ['hashtags'],
|
||||
|
||||
init() {
|
||||
this._super(...arguments);
|
||||
let tagz = [];
|
||||
|
|
@ -20,7 +22,7 @@ export default Component.extend({
|
|||
let tags = this.get('documentTags').split('#');
|
||||
_.each(tags, function(tag) {
|
||||
if (tag.length > 0) {
|
||||
tagz.pushObject("#" + tag);
|
||||
tagz.pushObject(tag);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -17,6 +17,7 @@ import AuthMixin from '../../mixins/auth';
|
|||
import Component from '@ember/component';
|
||||
|
||||
export default Component.extend(AuthMixin, {
|
||||
classNames: ["section"],
|
||||
router: service(),
|
||||
documentService: service('document'),
|
||||
folderService: service('folder'),
|
||||
|
|
@ -26,6 +27,7 @@ export default Component.extend(AuthMixin, {
|
|||
spaceSettings: computed('permissions', function() {
|
||||
return this.get('permissions.spaceOwner') || this.get('permissions.spaceManage');
|
||||
}),
|
||||
selectedFilter: '',
|
||||
|
||||
init() {
|
||||
this._super(...arguments);
|
||||
|
|
@ -81,8 +83,6 @@ export default Component.extend(AuthMixin, {
|
|||
});
|
||||
|
||||
this.set('categoryFilter', id);
|
||||
this.set('spaceSelected', false);
|
||||
this.set('uncategorizedSelected', false);
|
||||
break;
|
||||
|
||||
case 'uncategorized':
|
||||
|
|
@ -94,19 +94,29 @@ export default Component.extend(AuthMixin, {
|
|||
});
|
||||
|
||||
this.set('categoryFilter', '');
|
||||
this.set('spaceSelected', false);
|
||||
this.set('uncategorizedSelected', true);
|
||||
break;
|
||||
|
||||
case 'space':
|
||||
allowed = _.pluck(categoryMembers, 'documentId');
|
||||
docs.forEach((d) => {
|
||||
filtered.pushObject(d);
|
||||
});
|
||||
|
||||
this.set('categoryFilter', '');
|
||||
this.set('spaceSelected', true);
|
||||
this.set('uncategorizedSelected', false);
|
||||
break;
|
||||
|
||||
case 'template':
|
||||
filtered.pushObjects(this.get('templates'));
|
||||
this.set('categoryFilter', '');
|
||||
break;
|
||||
|
||||
case 'draft':
|
||||
filtered = this.get('documentsDraft');
|
||||
this.set('categoryFilter', '');
|
||||
break;
|
||||
|
||||
case 'live':
|
||||
filtered = this.get('documentsLive');
|
||||
this.set('categoryFilter', '');
|
||||
break;
|
||||
}
|
||||
|
||||
|
|
@ -114,6 +124,7 @@ export default Component.extend(AuthMixin, {
|
|||
cat.set('selected', cat.get('id') === id);
|
||||
});
|
||||
|
||||
this.set('selectedFilter', filter);
|
||||
this.set('categories', categories);
|
||||
this.get('onFiltered')(filtered);
|
||||
}
|
||||
|
|
@ -19,6 +19,7 @@ import Notifier from '../../mixins/notifier';
|
|||
import Component from '@ember/component';
|
||||
|
||||
export default Component.extend(ModalMixin, AuthMixin, Notifier, {
|
||||
classNames: ["display-inline-block"],
|
||||
spaceService: service('folder'),
|
||||
localStorage: service(),
|
||||
templateService: service('template'),
|
||||
|
|
|
|||
|
|
@ -209,7 +209,10 @@ let constants = EmberObject.extend({
|
|||
Attachment: 'dicon-attachment',
|
||||
BarChart: 'dicon-chart-bar-2',
|
||||
Bookmark: 'dicon-bookmark',
|
||||
ButtonAction: 'button-2',
|
||||
BookmarkAdd: 'dicon-bookmark-add',
|
||||
BookmarkDelete: 'dicon-bookmark-delete',
|
||||
ButtonAction: 'dicon-button-2',
|
||||
Category: 'dicon-flag',
|
||||
Checkbox: 'dicon-shape-rectangle',
|
||||
CheckboxChecked: 'dicon-i-check',
|
||||
Database: 'dicon-database',
|
||||
|
|
|
|||
|
|
@ -10,21 +10,73 @@
|
|||
// https://documize.com
|
||||
|
||||
import { computed } from '@ember/object';
|
||||
import Model from 'ember-data/model';
|
||||
import attr from 'ember-data/attr';
|
||||
import stringUtil from '../utils/string';
|
||||
// import { belongsTo, hasMany } from 'ember-data/relationships';
|
||||
import Model from 'ember-data/model';
|
||||
|
||||
|
||||
export default Model.extend({
|
||||
author: attr('string'),
|
||||
dated: attr(),
|
||||
description: attr('string'),
|
||||
title: attr('string'),
|
||||
type: attr('number', { defaultValue: 0 }),
|
||||
name: attr('string'),
|
||||
excerpt: attr('string'),
|
||||
job: attr('string'),
|
||||
location: attr('string'),
|
||||
orgId: attr('string'),
|
||||
spaceId: attr('string'),
|
||||
userId: attr('string'),
|
||||
tags: attr('string'),
|
||||
template: attr('boolean'),
|
||||
protection: attr('number', { defaultValue: 0 }),
|
||||
approval: attr('number', { defaultValue: 0 }),
|
||||
lifecycle: attr('number', { defaultValue: 1 }),
|
||||
versioned: attr('boolean'),
|
||||
versionId: attr('string'),
|
||||
versionOrder: attr('number', { defaultValue: 0 }),
|
||||
groupId: attr('string'),
|
||||
|
||||
slug: computed('title', function () {
|
||||
return stringUtil.makeSlug(this.get('title'));
|
||||
// client-side property
|
||||
selected: attr('boolean', { defaultValue: false }),
|
||||
slug: computed('name', function () {
|
||||
return stringUtil.makeSlug(this.get('name'));
|
||||
}),
|
||||
created: attr(),
|
||||
revised: attr()
|
||||
revised: attr(),
|
||||
|
||||
isDraft: computed('lifecycle', function () {
|
||||
let constants = this.get('constants');
|
||||
return this.get('lifecycle') == constants.Lifecycle.Draft;
|
||||
}),
|
||||
|
||||
isLive: computed('lifecycle', function () {
|
||||
let constants = this.get('constants');
|
||||
return this.get('lifecycle') == constants.Lifecycle.Live;
|
||||
}),
|
||||
|
||||
lifecycleLabel: computed('lifecycle', function () {
|
||||
let constants = this.get('constants');
|
||||
switch (this.get('lifecycle')) {
|
||||
case constants.Lifecycle.Draft:
|
||||
return constants.Lifecycle.DraftLabel;
|
||||
case constants.Lifecycle.Live:
|
||||
return constants.Lifecycle.LiveLabel;
|
||||
case constants.Lifecycle.Archived:
|
||||
return constants.Lifecycle.ArchivedLabel;
|
||||
}
|
||||
|
||||
return '';
|
||||
}),
|
||||
});
|
||||
|
||||
|
||||
// export default Model.extend({
|
||||
// author: attr('string'),
|
||||
// dated: attr(),
|
||||
// description: attr('string'),
|
||||
// title: attr('string'),
|
||||
// type: attr('number', { defaultValue: 0 }),
|
||||
|
||||
// slug: computed('title', function () {
|
||||
// return stringUtil.makeSlug(this.get('title'));
|
||||
// }),
|
||||
// created: attr(),
|
||||
// revised: attr()
|
||||
// });
|
||||
|
|
|
|||
|
|
@ -32,6 +32,8 @@ export default Route.extend(AuthenticatedRouteMixin, {
|
|||
model() {
|
||||
this.get('browser').setTitle(this.modelFor('folder').folder.get('name'));
|
||||
|
||||
let constants = this.get('constants');
|
||||
|
||||
let folders = this.modelFor('folder').folders;
|
||||
folders.forEach(f => {
|
||||
f.set('selected', false);
|
||||
|
|
@ -47,6 +49,8 @@ export default Route.extend(AuthenticatedRouteMixin, {
|
|||
permissions: this.modelFor('folder').permissions,
|
||||
folders: folders,
|
||||
documents: documents,
|
||||
documentsDraft: _.filter(documents, function(d) { return d.get('lifecycle') === constants.Lifecycle.Draft; }),
|
||||
documentsLive: _.filter(documents, function(d) { return d.get('lifecycle') === constants.Lifecycle.Live; }),
|
||||
templates: this.modelFor('folder').templates,
|
||||
showStartDocument: false,
|
||||
rootDocCount: 0,
|
||||
|
|
|
|||
|
|
@ -1,54 +1,49 @@
|
|||
{{#layout/top-bar}}
|
||||
<li class="item">
|
||||
{{#link-to "folder.index" model.folder.id model.folder.slug class="link selected"}}
|
||||
{{model.folder.name}}
|
||||
{{/link-to}}
|
||||
</li>
|
||||
{{/layout/top-bar}}
|
||||
{{#layout/master-sidebar selectedItem="spaces"}}
|
||||
{{folder/space-sidebar
|
||||
spaces=model.folders
|
||||
space=model.folder
|
||||
templates=model.templates
|
||||
permissions=model.permissions
|
||||
documents=model.documents
|
||||
documentsDraft=model.documentsDraft
|
||||
documentsLive=model.documentsLive
|
||||
categories=model.categories
|
||||
categorySummary=model.categorySummary
|
||||
categoryMembers=model.categoryMembers
|
||||
rootDocCount=model.rootDocCount
|
||||
categoryFilter=category
|
||||
onFiltered=(action "onFiltered")
|
||||
onRefresh=(action "onRefresh")}}
|
||||
{{/layout/master-sidebar}}
|
||||
|
||||
{{#layout/middle-zone}}
|
||||
{{#layout/middle-zone-content}}
|
||||
{{toolbar/for-space
|
||||
spaces=model.folders
|
||||
space=model.folder
|
||||
permissions=model.permissions
|
||||
templates=model.templates
|
||||
category=category
|
||||
categories=model.categories
|
||||
documents=filteredDocs
|
||||
onRefresh=(action "onRefresh")}}
|
||||
|
||||
{{folder/documents-list
|
||||
documents=filteredDocs
|
||||
spaces=model.folders
|
||||
space=model.folder
|
||||
templates=model.templates
|
||||
permissions=model.permissions
|
||||
onExportDocument=(action "onExportDocument")
|
||||
onDeleteDocument=(action "onDeleteDocument")
|
||||
onMoveDocument=(action "onMoveDocument")}}
|
||||
{{/layout/middle-zone-content}}
|
||||
|
||||
{{#layout/middle-zone-sidebar scrollable=true}}
|
||||
<div id="sidebar" class="sidebar">
|
||||
{{folder/space-view
|
||||
{{#layout/master-content}}
|
||||
<div class="grid-container-6-4">
|
||||
<div class="grid-cell-1">
|
||||
{{layout/page-heading title=model.folder.name}}
|
||||
{{layout/page-desc desc="some space desc"}}
|
||||
</div>
|
||||
<div class="grid-cell-2 grid-cell-right">
|
||||
{{toolbar/for-space
|
||||
spaces=model.folders
|
||||
space=model.folder
|
||||
templates=model.templates
|
||||
permissions=model.permissions
|
||||
documents=model.documents
|
||||
templates=model.templates
|
||||
category=category
|
||||
categories=model.categories
|
||||
categorySummary=model.categorySummary
|
||||
categoryMembers=model.categoryMembers
|
||||
rootDocCount=model.rootDocCount
|
||||
categoryFilter=category
|
||||
onFiltered=(action "onFiltered")
|
||||
documents=filteredDocs
|
||||
onRefresh=(action "onRefresh")}}
|
||||
</div>
|
||||
{{/layout/middle-zone-sidebar}}
|
||||
{{/layout/middle-zone}}
|
||||
|
||||
{{#layout/bottom-bar}}
|
||||
{{/layout/bottom-bar}}
|
||||
</div>
|
||||
|
||||
{{ui/ui-spacer size=400}}
|
||||
|
||||
{{folder/documents-list
|
||||
documents=filteredDocs
|
||||
spaces=model.folders
|
||||
space=model.folder
|
||||
templates=model.templates
|
||||
permissions=model.permissions
|
||||
onExportDocument=(action "onExportDocument")
|
||||
onDeleteDocument=(action "onDeleteDocument")
|
||||
onMoveDocument=(action "onMoveDocument")}}
|
||||
{{/layout/master-content}}
|
||||
|
|
|
|||
|
|
@ -41,7 +41,7 @@ export default Service.extend({
|
|||
});
|
||||
|
||||
templates = response.map((template) => {
|
||||
let data = this.get('store').normalize('template', template);
|
||||
let data = this.get('store').normalize('document', template);
|
||||
return this.get('store').push(data);
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -90,3 +90,25 @@ $display-break-5: 1800px;
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.grid-container-5-5 {
|
||||
@extend %grid-base;
|
||||
|
||||
@media (min-width: $display-break-2) {
|
||||
grid-template-columns: 5fr 5fr;
|
||||
grid-template-rows: 1fr;
|
||||
|
||||
.grid-cell-1 {
|
||||
grid-column-start: 1;
|
||||
grid-row-start: 1;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.grid-cell-2 {
|
||||
grid-column-start: 2;
|
||||
grid-row-start: 1;
|
||||
padding: 0;
|
||||
justify-self: self-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,21 +5,19 @@
|
|||
display: block;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
// z-index: 777;
|
||||
|
||||
.master-content {
|
||||
display: block;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
// z-index: 666;
|
||||
}
|
||||
}
|
||||
.master-sidebar-container {
|
||||
display: block;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
z-index: 1041;
|
||||
// z-index: 1041; // reequired if we want to show modals from inside sidebar
|
||||
|
||||
.master-navbar {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -13,6 +13,24 @@
|
|||
color: map-get($gray-shades, 700);
|
||||
}
|
||||
|
||||
> .text {
|
||||
margin: 10px 0;
|
||||
font-size: 1rem;
|
||||
font-weight: 500;
|
||||
color: $color-black-light-3;
|
||||
}
|
||||
|
||||
> .label {
|
||||
display: inline-block;
|
||||
margin: 10px 0 13px 0;
|
||||
padding: 0.3rem 0.7rem;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 500;
|
||||
background-color: map-get($gray-shades, 600);
|
||||
color: map-get($gray-shades, 100);
|
||||
@include border-radius(3px);
|
||||
}
|
||||
|
||||
> .list {
|
||||
margin: 10px 0;
|
||||
|
||||
|
|
|
|||
|
|
@ -1,24 +1,15 @@
|
|||
.view-space {
|
||||
> .filter-caption {
|
||||
margin: 10px 0;
|
||||
color: map-get($gray-shades, 600);
|
||||
font-size: 1.1rem;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
> .documents {
|
||||
margin: 60px 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
> .document {
|
||||
@include card();
|
||||
@include ease-in();
|
||||
list-style-type: none;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
margin: 0 0 30px 0;
|
||||
margin: 0 0 2rem 0;
|
||||
padding: 15px 20px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
&:hover {
|
||||
> .checkbox {
|
||||
|
|
@ -26,55 +17,110 @@
|
|||
}
|
||||
}
|
||||
|
||||
> a {
|
||||
@include ease-in();
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 15px 20px;
|
||||
|
||||
> .title {
|
||||
color: $color-black;
|
||||
font-size: 1.3rem;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
> .snippet {
|
||||
color: map-get($gray-shades, 600);
|
||||
font-size: 1rem;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: map-get($gray-shades, 600);
|
||||
}
|
||||
}
|
||||
|
||||
> .checkbox {
|
||||
position: absolute;
|
||||
display: none;
|
||||
top: 10px;
|
||||
right: 20px;
|
||||
right: 10px;
|
||||
cursor: pointer;
|
||||
|
||||
> .material-icons {
|
||||
width: 10px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: map-get($gray-shades, 900);
|
||||
> .dicon {
|
||||
color: map-get($yellow-shades, 700);
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
> .actions {
|
||||
position: absolute;
|
||||
display: none;
|
||||
bottom: 2px;
|
||||
right: 12px;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
> .info {
|
||||
padding: 0;
|
||||
align-self: self-start;
|
||||
justify-self: self-start;
|
||||
|
||||
> .name {
|
||||
font-size: 1.3rem;
|
||||
font-weight: 700;
|
||||
color: map-get($gray-shades, 800);
|
||||
}
|
||||
|
||||
> .desc {
|
||||
font-size: 1.1rem;
|
||||
font-weight: 400;
|
||||
margin-top: 0.4rem;
|
||||
color: $color-black-light-3;
|
||||
}
|
||||
}
|
||||
|
||||
> .meta {
|
||||
padding: 25px 0 0 0;
|
||||
|
||||
> .lifecycle {
|
||||
display: inline-block;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
@include border-radius(5px);
|
||||
background-color: map-get($gray-shades, 300);
|
||||
padding: 0.25rem 1rem;
|
||||
|
||||
> .draft {
|
||||
color: map-get($yellow-shades, 600);
|
||||
}
|
||||
|
||||
> .live {
|
||||
color: map-get($green-shades, 600);
|
||||
}
|
||||
|
||||
> .archived {
|
||||
color: map-get($red-shades, 600);
|
||||
}
|
||||
}
|
||||
|
||||
> .dicon {
|
||||
color: map-get($gray-shades, 600);
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.hashtags {
|
||||
display: inline-block;
|
||||
padding: 0 10px 0 10px;
|
||||
|
||||
> .hashtag {
|
||||
padding: 0 10px 0 10px;
|
||||
|
||||
> .dicon {
|
||||
color: map-get($gray-shades, 500);
|
||||
font-size: 20px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
> .name {
|
||||
display: inline-block;
|
||||
color: map-get($gray-shades, 800);
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
> .dicon, > .name {
|
||||
color: map-get($gray-shades, 600);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .selected {
|
||||
background-color: $theme-100 !important;
|
||||
background-color: map-get($yellow-shades, 200);
|
||||
|
||||
> .checkbox {
|
||||
display: block;
|
||||
|
|
@ -83,19 +129,9 @@
|
|||
> .actions {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hashtags {
|
||||
> .hashtag {
|
||||
display: inline-block;
|
||||
margin: 5px 10px 0 5px;
|
||||
color: map-get($gray-shades, 600);
|
||||
font-size: 0.875rem;
|
||||
font-style: italic;
|
||||
|
||||
&:hover {
|
||||
color: $color-link;
|
||||
background-color: map-get($yellow-shades, 200);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<div class="hashtags">
|
||||
{{#each tagz as |tg|}}
|
||||
{{#link-to "search" (query-params filter=tg) class="hashtag"}}{{tg}}{{/link-to}}
|
||||
{{/each}}
|
||||
</div>
|
||||
{{#each tagz as |tg|}}
|
||||
{{#link-to "search" (query-params filter=tg) class="hashtag"}}
|
||||
<i class="dicon {{constants.Icon.Tag}}" />
|
||||
<div class="name">{{tg}}</div>
|
||||
{{/link-to}}
|
||||
{{/each}}
|
||||
|
|
|
|||
|
|
@ -2,44 +2,41 @@
|
|||
<ul class="documents">
|
||||
{{#each documents key="id" as |document|}}
|
||||
<li class="document {{if document.selected "selected"}}" id="document-{{document.id}}">
|
||||
|
||||
{{#link-to "document.index" space.id space.slug document.id document.slug}}
|
||||
<div class="title">{{ document.name }}</div>
|
||||
<div class="snippet">{{ document.excerpt }}</div>
|
||||
{{folder/document-tags documentTags=document.tags}}
|
||||
{{#if (not-eq document.lifecycle constants.Lifecycle.Live)}}
|
||||
<button type="button" class="mt-3 btn btn-warning text-uppercase bold-700">{{document.lifecycleLabel}}</button>
|
||||
{{/if}}
|
||||
{{#link-to "document.index" space.id space.slug document.id document.slug class="info"}}
|
||||
<div class="name">{{ document.name }}</div>
|
||||
<div class="desc">{{ document.excerpt }}</div>
|
||||
{{/link-to}}
|
||||
<div class="meta">
|
||||
<div class="lifecycle">
|
||||
<div class="{{if (eq document.lifecycle constants.Lifecycle.Draft) 'draft'}}
|
||||
{{if (eq document.lifecycle constants.Lifecycle.Live) 'live'}}
|
||||
{{if (eq document.lifecycle constants.Lifecycle.Archived) 'archived'}}">
|
||||
{{document.lifecycleLabel}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{folder/document-tags documentTags=document.tags}}
|
||||
</div>
|
||||
|
||||
{{#if hasDocumentActions}}
|
||||
<div class="checkbox" {{action "selectDocument" document.id}}>
|
||||
{{#if document.selected}}
|
||||
<i class="material-icons">check_box</i>
|
||||
<i class="dicon {{constants.Icon.CheckboxChecked}}"/>
|
||||
{{else}}
|
||||
<i class="material-icons">check_box_outline_blank</i>
|
||||
<i class="dicon {{constants.Icon.Checkbox}}"/>
|
||||
{{/if}}
|
||||
</div>
|
||||
{{#if document.selected}}
|
||||
<div class="actions">
|
||||
<div class="move-documents-button button-icon-green button-icon-small align-middle" {{action "onExport"}}>
|
||||
<i class="material-icons">import_export</i>
|
||||
{{#attach-tooltip showDelay=1000}}Export as HTML{{/attach-tooltip}}
|
||||
</div>
|
||||
<div class="button-icon-gap" />
|
||||
{{#if permissions.documentMove}}
|
||||
<div class="move-documents-button button-icon-green button-icon-small align-middle" {{action "onShowMoveDocuments"}}>
|
||||
<i class="material-icons">compare_arrows</i>
|
||||
{{#attach-tooltip showDelay=1000}}Move{{/attach-tooltip}}
|
||||
</div>
|
||||
<div class="button-icon-gap" />
|
||||
{{/if}}
|
||||
{{#if permissions.documentDelete}}
|
||||
<div class="delete-documents-button button-icon-red button-icon-small align-middle" {{action "onShowDeleteDocuments"}}>
|
||||
{{#attach-tooltip showDelay=1000}}Delete{{/attach-tooltip}}
|
||||
<i class="material-icons">delete</i>
|
||||
</div>
|
||||
{{/if}}
|
||||
{{#ui/ui-toolbar dark=false light=true raised=true large=false bordered=true}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.Export color=constants.Color.Gray tooltip="Export content" onClick=(action "onExport")}}
|
||||
{{#if permissions.documentMove}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.Export2 color=constants.Color.Gray tooltip="Move to another space" onClick=(action "onShowMoveDocuments")}}
|
||||
{{/if}}
|
||||
{{#if permissions.documentDelete}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.Delete color=constants.Color.Red tooltip="Delete" onClick=(action "onShowDeleteDocuments")}}
|
||||
{{/if}}
|
||||
{{/ui/ui-toolbar}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
|
|
|||
53
gui/app/templates/components/folder/space-sidebar.hbs
Normal file
53
gui/app/templates/components/folder/space-sidebar.hbs
Normal file
|
|
@ -0,0 +1,53 @@
|
|||
{{ui/ui-spacer size=300}}
|
||||
|
||||
<div class="title">label</div>
|
||||
<div class="label">Unclassified</div>
|
||||
|
||||
{{ui/ui-spacer size=200}}
|
||||
|
||||
<div class="title">filter</div>
|
||||
<div class="list">
|
||||
<div class="item {{if (eq selectedFilter "space") "selected"}}" {{action "onDocumentFilter" "space" space.id}}>
|
||||
<i class={{concat "dicon " constants.Icon.Filter}} />
|
||||
<div class="name">All ({{documents.length}})</div>
|
||||
</div>
|
||||
{{#if hasCategories}}
|
||||
{{#if (gt rootDocCount 0)}}
|
||||
<div class="item {{if (eq selectedFilter "uncategorized") "selected"}}" {{action "onDocumentFilter" "uncategorized" space.id}}>
|
||||
<i class={{concat "dicon " constants.Icon.Filter}} />
|
||||
<div class="name">Uncategorized ({{rootDocCount}})</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{#if permissions.documentTemplate}}
|
||||
<div class="item {{if (eq selectedFilter "template") "selected"}}" {{action "onDocumentFilter" "template" space.id}}>
|
||||
<i class={{concat "dicon " constants.Icon.Filter}} />
|
||||
<div class="name">Templates ({{templates.length}})</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
{{#if permissions.documentLifecycle}}
|
||||
<div class="item {{if (eq selectedFilter "draft") "selected"}}" {{action "onDocumentFilter" "draft" space.id}}>
|
||||
<i class={{concat "dicon " constants.Icon.Filter}} />
|
||||
<div class="name">Drafts ({{documentsDraft.length}})</div>
|
||||
</div>
|
||||
<div class="item {{if (eq selectedFilter "live") "selected"}}" {{action "onDocumentFilter" "live" space.id}}>
|
||||
<i class={{concat "dicon " constants.Icon.Filter}} />
|
||||
<div class="name">Live ({{documentsLive.length}})</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
{{ui/ui-spacer size=200}}
|
||||
|
||||
<div class="title">category</div>
|
||||
<div class="list">
|
||||
{{#if categories}}
|
||||
{{#each categories as |cat|}}
|
||||
<div class="item {{if cat.selected "selected"}}" {{action "onDocumentFilter" "category" cat.id}}>
|
||||
<i class={{concat "dicon " constants.Icon.Category}} />
|
||||
<div class="name">{{cat.category}} ({{cat.docCount}})</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
{{else}}
|
||||
{{/if}}
|
||||
</div>
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
<div class="view-space">
|
||||
<div class="filter-caption mt-4">{{documents.length}} documents</div>
|
||||
<ul class="tabnav-control tabnav-control-centered w-75">
|
||||
<li class="tab tab-vertical {{if spaceSelected "selected"}}" {{action "onDocumentFilter" "space" space.id}}>All ({{documents.length}})</li>
|
||||
{{#if hasCategories}}
|
||||
{{#if (gt rootDocCount 0)}}
|
||||
<li class="tab tab-vertical text-truncate {{if uncategorizedSelected "selected"}}" {{action "onDocumentFilter" "uncategorized" space.id}}>Uncategorized ({{rootDocCount}})</li>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="view-space">
|
||||
<div class="filter-caption mt-5">
|
||||
{{categories.length}}
|
||||
{{#if (gt categories.length 1) }}
|
||||
categories
|
||||
{{else if (eq categories.length 0) }}
|
||||
categories
|
||||
{{else}}
|
||||
category
|
||||
{{/if}}
|
||||
</div>
|
||||
<ul class="tabnav-control tabnav-control-centered w-75">
|
||||
{{#each categories as |cat|}}
|
||||
<li class="tab tab-vertical text-truncate {{if cat.selected "selected"}}" {{action "onDocumentFilter" "category" cat.id}}>{{cat.category}} ({{cat.docCount}})</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
||||
{{#if spaceSettings}}
|
||||
<div class="text-center {{if (gt categories.length 0) "mt-4"}}">
|
||||
{{#link-to "folder.settings" space.id space.slug (query-params tab="categories") class="btn btn-secondary bold-700"}}{{categoryLinkName}}{{/link-to}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
|
@ -1,134 +1,120 @@
|
|||
<div class="row justify-content-between no-gutters">
|
||||
{{#ui/ui-toolbar dark=false light=false raised=false large=true bordered=false}}
|
||||
{{#if hasDocuments}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.Export color=constants.Color.Gray
|
||||
tooltip="Export as HTML" onClick=(action "onShowExport")}}
|
||||
{{/if}}
|
||||
{{#if pinState.isPinned}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.BookmarkDelete color=constants.Color.Gray
|
||||
tooltip="Remove view from bookmarks" onClick=(action "onUnpin")}}
|
||||
{{else if session.authenticated}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.BookmarkAdd color=constants.Color.Gray
|
||||
tooltip="Bookmark this view" onClick=(action "onPin")}}
|
||||
{{/if}}
|
||||
|
||||
<div class="col-6">
|
||||
{{#if permissions.documentAdd}}
|
||||
<div class="btn-group" role="group">
|
||||
<button id="btnGroupDocument" type="button" class="btn btn-success bold-700 dropdown-toggle">
|
||||
+ CONTENT
|
||||
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
|
||||
<div class="menu">
|
||||
<a class="item" href="#" {{action "onShowEmptyDocModal"}}>Blank canvas</a>
|
||||
{{#if hasTemplates}}
|
||||
<a class="item" href="#" {{action "onShowTemplateDocModal"}}>From template</a>
|
||||
{{/if}}
|
||||
<a class="item" href="#" {{action "onShowImportDocModal"}}>Import files</a>
|
||||
</div>
|
||||
{{/attach-popover}}
|
||||
</button>
|
||||
{{#if (or permissions.spaceOwner permissions.spaceManage)}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.Settings color=constants.Color.Gray
|
||||
tooltip="Space settings" link="folder.settings" }}
|
||||
{{!-- {{#link-to "folder.settings" space.id space.slug class="button-icon-gray align-middle"}}
|
||||
<i class="material-icons">settings</i>
|
||||
{{#attach-tooltip showDelay=1000}}Settings, permissions, templates{{/attach-tooltip}}
|
||||
{{/link-to}} --}}
|
||||
{{/if}}
|
||||
{{/ui/ui-toolbar}}
|
||||
|
||||
{{#if permissions.documentAdd}}
|
||||
{{#ui/ui-toolbar dark=false light=true raised=true large=true bordered=true}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.Plus color=constants.Color.Green}}
|
||||
{{ui/ui-toolbar-label label="CONTENT" color=constants.Color.Green}}
|
||||
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
|
||||
<div class="menu">
|
||||
<a class="item" href="#" {{action "onShowEmptyDocModal"}}>Blank canvas</a>
|
||||
{{#if hasTemplates}}
|
||||
<a class="item" href="#" {{action "onShowTemplateDocModal"}}>From template</a>
|
||||
{{/if}}
|
||||
<a class="item" href="#" {{action "onShowImportDocModal"}}>Import files</a>
|
||||
</div>
|
||||
<div id="empty-doc-modal" class="modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">Blank Canvas</div>
|
||||
<div class="modal-body">
|
||||
<form onsubmit={{action "onAddEmptyDoc"}}>
|
||||
<div class="form-group">
|
||||
<label for="empty-doc-name">Document Name</label>
|
||||
{{input id="empty-doc-name" type="text" value=emptyDocName placeholder="Enter name" class=(if emptyDocNameError "form-control mousetrap is-invalid" "form-control mousetrap") autocomplete="off"}}
|
||||
</div>
|
||||
</form>
|
||||
{{/attach-popover}}
|
||||
{{/ui/ui-toolbar}}
|
||||
|
||||
<div id="empty-doc-modal" class="modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">Blank Canvas</div>
|
||||
<div class="modal-body">
|
||||
<form onsubmit={{action "onAddEmptyDoc"}}>
|
||||
<div class="form-group">
|
||||
<label for="empty-doc-name">Document Name</label>
|
||||
{{input id="empty-doc-name" type="text" value=emptyDocName placeholder="Enter name" class=(if emptyDocNameError "form-control mousetrap is-invalid" "form-control mousetrap") autocomplete="off"}}
|
||||
</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 "onAddEmptyDoc"}}>Add</button>
|
||||
</div>
|
||||
</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 "onAddEmptyDoc"}}>Add</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="template-doc-modal" class="modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">From Template</div>
|
||||
<div class="modal-body">
|
||||
<form onsubmit={{action "onAddTemplateDoc"}}>
|
||||
<div class="form-group">
|
||||
<label for="template-doc-name">Document Name</label>
|
||||
{{input id="template-doc-name" type="text" value=templateDocName placeholder="Enter name" class=(if templateDocNameError "form-control mousetrap is-invalid" "form-control mousetrap") autocomplete="off"}}
|
||||
</div>
|
||||
<div class="widget-list-picker">
|
||||
<ul class="options">
|
||||
{{#each templates as |item|}}
|
||||
<li class="option {{if item.selected "selected"}}" {{action "onSelectTemplate" item}}>
|
||||
<div class="text text-truncate">
|
||||
{{item.title}}<br>{{item.description}}
|
||||
</div>
|
||||
{{#if item.selected}}
|
||||
<i class="material-icons">check</i>
|
||||
{{/if}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</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 "onAddTemplateDoc"}}>Add</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="import-doc-modal" class="modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">Import Files</div>
|
||||
<div class="modal-body">
|
||||
<div class="import-zone">
|
||||
<button id="import-document-button" type="button" class="btn btn-outline-secondary btn-lg btn-block">
|
||||
<br>
|
||||
Click to select files or drag-drop files
|
||||
<br><br>
|
||||
.doc, .docx, .md, .markdown
|
||||
<br><br>
|
||||
</button>
|
||||
<div class="import-status">
|
||||
{{#each importStatus as |status|}}
|
||||
<p>{{status}}</p>
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-6 text-right">
|
||||
{{#if hasDocuments}}
|
||||
<div id="space-export-button" class="button-icon-danger align-middle" {{action "onShowExport"}}>
|
||||
<i class="material-icons">import_export</i>
|
||||
{{#attach-tooltip showDelay=1000}}Export as HTML{{/attach-tooltip}}
|
||||
<div id="template-doc-modal" class="modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">From Template</div>
|
||||
<div class="modal-body">
|
||||
<form onsubmit={{action "onAddTemplateDoc"}}>
|
||||
<div class="form-group">
|
||||
<label for="template-doc-name">Document Name</label>
|
||||
{{input id="template-doc-name" type="text" value=templateDocName placeholder="Enter name" class=(if templateDocNameError "form-control mousetrap is-invalid" "form-control mousetrap") autocomplete="off"}}
|
||||
</div>
|
||||
<div class="widget-list-picker">
|
||||
<ul class="options">
|
||||
{{#each templates as |item|}}
|
||||
<li class="option {{if item.selected "selected"}}" {{action "onSelectTemplate" item}}>
|
||||
<div class="text text-truncate">
|
||||
{{item.title}}<br>{{item.description}}
|
||||
</div>
|
||||
{{#if item.selected}}
|
||||
<i class="material-icons">check</i>
|
||||
{{/if}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</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 "onAddTemplateDoc"}}>Add</button>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{#if pinState.isPinned}}
|
||||
<div class="button-icon-gap" />
|
||||
<div id="space-pin-button" class="button-icon-gold align-middle" {{action "onUnpin"}}>
|
||||
<i class="material-icons">star</i>
|
||||
{{#attach-tooltip showDelay=1000}}Remove bookmark{{/attach-tooltip}}
|
||||
</div>
|
||||
{{else if session.authenticated}}
|
||||
<div class="button-icon-gap" />
|
||||
<div id="space-pin-button" class="button-icon-gray align-middle" {{action "onPin"}}>
|
||||
<i class="material-icons">star</i>
|
||||
{{#attach-tooltip showDelay=1000}}Bookmark{{/attach-tooltip}}
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{#if (or permissions.spaceOwner permissions.spaceManage)}}
|
||||
<div class="button-icon-gap" />
|
||||
{{#link-to "folder.settings" space.id space.slug class="button-icon-gray align-middle"}}
|
||||
<i class="material-icons">settings</i>
|
||||
{{#attach-tooltip showDelay=1000}}Settings, permissions, templates{{/attach-tooltip}}
|
||||
{{/link-to}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div id="import-doc-modal" class="modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">Import Files</div>
|
||||
<div class="modal-body">
|
||||
<div class="import-zone">
|
||||
<button id="import-document-button" type="button" class="btn btn-outline-secondary btn-lg btn-block">
|
||||
<br>
|
||||
Click to select files or drag-drop files
|
||||
<br><br>
|
||||
.doc, .docx, .md, .markdown
|
||||
<br><br>
|
||||
</button>
|
||||
<div class="import-status">
|
||||
{{#each importStatus as |status|}}
|
||||
<p>{{status}}</p>
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
<div id="space-export-modal" class="modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue