swcs/mixtape
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

start module output

Browse Source
This commit is contained in:
Tobias Klika
2020-08-20 01:35:08 +02:00
parent f6882ea1f1
commit d65df84cc3
22 changed files with 289 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files
zero.Web.UI/App/components/forms/property.vue
+3 -2
View File
@@ -50,8 +50,9 @@
.ui-split + .ui-property,
.ui-property + .ui-property
{
padding-top: 30px;
margin-top: 30px;
margin-top: 50px;
//padding-top: 30px;
//margin-top: 30px;
//border-top: 1px solid var(--color-line);
}
zero.Web.UI/App/components/loading.vue
+18 -6
View File
@@ -1,11 +1,18 @@
<template>
<i class="ui-loading"></i>
<i class="ui-loading" :class="{'is-big': isBig }"></i>
</template>
<script>
export default {
name: 'uiLoading'
name: 'uiLoading',
props: {
isBig: {
type: Boolean,
default: false
}
}
}
</script>
@@ -16,12 +23,17 @@
width: 28px;
height: 28px;
border-radius: 40px;
border: 2px solid var(--color-bg-mid);
border: 2px solid var(--color-bg-bright-two);
border-left-color: var(--color-fg);
opacity: 1;
will-change: transform;
animation: loadingRotation .8s linear infinite;
transition: opacity .25s ease;
animation: loadingRotation 0.8s linear infinite;
&.is-big
{
width: 36px;
height: 36px;
border-width: 2px;
}
}
@keyframes loadingRotation
zero.Web.UI/App/components/modules/edit-module.vue
+48 -19
View File
@@ -1,46 +1,66 @@
<template>
<ui-overlay-editor class="ui-module-overlay">
<template v-slot:header>
<ui-header-bar title="Richtext" :back-button="false" :close-button="true" />
</template>
<template v-slot:footer>
<ui-button type="white" label="@ui.close" @click="config.hide"></ui-button>
<ui-button label="Confirm" @click="onSave" :state="state"></ui-button>
</template>
<ui-form ref="form" v-slot="form" @submit="onSubmit" @load="onLoad">
<ui-overlay-editor class="ui-module-overlay">
<div class="ui-module-overlay-editor">
<ui-editor :config="config.renderer" v-model="model" :meta="meta" :is-page="false" infos="none" />
</div>
</ui-overlay-editor>
<template v-slot:header>
<ui-header-bar :title="config.module.name" :back-button="false" :close-button="true" />
</template>
<template v-slot:footer>
<ui-button type="white" label="@ui.close" @click="config.hide"></ui-button>
<ui-button :submit="true" label="Confirm" :state="form.state" :disabled="loading || disabled"></ui-button>
</template>
<ui-loading v-if="loading" :is-big="true" />
<div v-if="!loading" class="ui-module-overlay-editor">
<ui-editor :config="config.renderer" v-model="model" :meta="meta" :is-page="false" infos="none" />
</div>
</ui-overlay-editor>
</ui-form>
</template>
<script>
import ModulesApi from 'zero/resources/modules.js';
import UiEditor from 'zero/editor/editor';
export default {
props: {
model: Object,
config: Object
},
components: { UiEditor },
data: () => ({
disabled: false,
id: null,
loading: true,
state: 'default',
meta: {
}
meta: {},
model: {}
}),
methods: {
onSave()
onLoad(form)
{
//this.state = 'loading';
//this.config.confirm(res.model);
form.load(!this.id ? ModulesApi.getEmpty(this.config.module.alias) : null).then(response =>
{
this.disabled = !response.meta.canEdit;
this.meta = response.meta;
this.model = response.entity;
this.loading = false;
});
},
onSubmit(form)
{
this.config.confirm(this.model);
}
}
}
@@ -51,6 +71,7 @@
{
> content
{
position: relative;
padding-top: 0 !important;
}
@@ -75,5 +96,13 @@
{
display: block;
}
.ui-loading
{
position: absolute;
left: 50%;
top: 50%;
margin: -14px 0 0 -14px;
}
}
</style>
zero.Web.UI/App/components/modules/modules-select.vue
+27 -22
View File
@@ -32,17 +32,18 @@
<script>
import ModulesApi from 'zero/resources/modules.js';
import EditModuleOverlay from './edit-module';
import Overlay from 'zero/services/overlay.js';
import { groupBy as _groupBy, keys as _keys, each as _each } from 'underscore';
export default {
name: 'uiModulesSelect',
props: {
value: [String, Object, Array],
config: Object
value: Array,
config: Object,
types: {
type: Array,
default: () => []
}
},
@@ -54,11 +55,25 @@
}),
watch: {
types(val)
{
this.rebuildGroups(val);
}
},
created()
{
ModulesApi.getModuleTypes().then(res =>
this.rebuildGroups(this.types);
},
methods: {
rebuildGroups(value)
{
let groups = _groupBy(res, val => val.group);
let groups = _groupBy(value, val => val.group);
let index = 0;
_each(groups, (items, key) =>
@@ -73,11 +88,7 @@
});
this.activeGroup = this.moduleTypes[0];
});
},
methods: {
},
selectGroup(group)
{
@@ -87,17 +98,11 @@
editModule(module, isAdd)
{
return Overlay.open({
component: EditModuleOverlay,
display: 'editor',
module: module,
renderer: 'module.' + module.alias,
model: {},
width: 1100
}).then(value =>
this.$emit('selected', module, isAdd);
if (isAdd)
{
});
this.isSelecting = false;
}
}
}
zero.Web.UI/App/components/modules/modules.vue
+74 -7
View File
@@ -1,36 +1,92 @@
<template>
<div class="ui-modules-inner">
<ui-modules-select v-if="canAdd" />
<div class="ui-module-item" v-for="item in items">
<header class="ui-module-item-header"><i :class="getModule(item.moduleTypeAlias).icon"></i> {{getModule(item.moduleTypeAlias).name}}</header>
</div>
<ui-modules-select :types="moduleTypes" :value="value" v-if="canAdd" @selected="onSelected" />
</div>
</template>
<script>
import ModulesApi from 'zero/resources/modules.js';
import EditModuleOverlay from './edit-module';
import Overlay from 'zero/services/overlay.js';
import { find as _find } from 'underscore';
export default {
name: 'uiModules',
props: {
value: [String, Object, Array],
value: {
type: Array,
default: () => []
},
config: Object
},
data: () => ({
items: [],
canAdd: true,
isSelecting: false,
moduleTypes: []
}),
watch: {
value(val)
{
this.setup(val);
}
},
created()
{
this.setup(this.value);
ModulesApi.getModuleTypes().then(res =>
{
this.moduleTypes = res;
});
},
methods: {
start()
setup(value)
{
this.isSelecting = true;
}
this.items = JSON.parse(JSON.stringify(value || []));
},
getModule(alias)
{
return _find(this.moduleTypes, x => x.alias == alias);
},
onSelected(module, isAdd)
{
return Overlay.open({
component: EditModuleOverlay,
display: 'editor',
module: module,
renderer: 'module.' + module.alias,
model: {},
width: 1100
}).then(value =>
{
this.items.push(value);
this.onChange();
});
},
onChange()
{
this.$emit('input', this.items);
}
}
}
</script>
@@ -45,7 +101,7 @@
margin-top: var(--padding);
}
.ui-modules-start
.ui-modules-start, .ui-module-item
{
margin: 0;
padding: var(--padding);
@@ -56,6 +112,17 @@
justify-content: center;
}
.ui-module-item
{
display: block;
}
.ui-module-item + .ui-module-item,
.ui-module-item + .ui-modules-start
{
margin-top: 3px;
}
.ui-modules-start-button
{
color: var(--color-fg);
zero.Web.UI/App/navigation.vue
+1 -1
View File
@@ -38,7 +38,7 @@
<button type="button" class="app-nav-account-button">
<img class="-image" v-if="userAvatar" :src="userAvatar" :alt="user.name" />
<span class="-image" v-if="!userAvatar"><i class="fth-user"></i></span>
<p class="-text"><strong>{{user.name}}</strong><br>{{user.email}}</p>
<p class="-text"><strong>{{user.name}}</strong></p>
<i class="-arrow fth-chevron-down"></i>
</button>
</template>
zero.Web.UI/App/resources/modules.js
+6 -1
View File
@@ -12,5 +12,10 @@ export default {
getModuleType(alias)
{
return Axios.get(base + 'getModuleType', { params: { alias } }).then(res => Promise.resolve(res.data));
}
},
getEmpty(alias)
{
return Axios.get(base + 'getEmpty', { params: { alias } }).then(res => Promise.resolve(res.data));
},
};
zero.Web.UI/App/resources/pages.js
+2 -2
View File
@@ -24,9 +24,9 @@ export default {
return Axios.get(base + 'getEmpty', { params: { type, parent } }).then(res => Promise.resolve(res.data));
},
getRevisions(id)
getRevisions(id, page)
{
return Axios.get(base + 'getRevisions', { params: { id } }).then(res => Promise.resolve(res.data));
return Axios.get(base + 'getRevisions', { params: { id, page } }).then(res => Promise.resolve(res.data));
},
getAll(query)
zero.Web.UI/Sass/Canvas/_navigation.scss
+4 -4
View File
@@ -164,14 +164,14 @@ a.app-nav-child
.-image
{
height: 36px;
width: 36px;
height: 32px;
width: 32px;
border-radius: 18px;
position: relative;
top: -1px;
background: var(--color-bg-bright-two);
text-align: center;
line-height: 37px;
line-height: 33px;
font-size: 16px;
}
@@ -182,7 +182,7 @@ a.app-nav-child
strong
{
font-weight: 700;
font-weight: 400;
color: var(--color-fg);
}
}
zero.Web.UI/Sass/Modules/Buttons/_button.scss
+2
View File
@@ -41,6 +41,8 @@ button::-moz-focus-inner
padding: 0 20px;
height: 42px;
border-radius: var(--radius);
//border-bottom-left-radius: 15px;
//border-top-right-radius: 15px;
font-size: var(--font-size);
font-weight: 700;
margin: 0;