Skip to content

Z
zeroing-editor
Commit fdaf0b39 authored by rockyl's avatar rockyl
Browse files
Options

项目列表分页问题 

修复版本列表排序错乱的问题
版本列表排序问题
打包素材分组时，没有把link://的素材加载
完成行为独立编辑器
parent ed7bfeea
Hide whitespace changes
Inline Side-by-side
Showing with 515 additions and 305 deletions
src/locales/zh-CN.json
View file @ fdaf0b39
...@@ -251,6 +251,9 @@ ...@@ -251,6 +251,9 @@
"Next Conflict": "下一个冲突", "Next Conflict": "下一个冲突",
"To Verify": "去验证", "To Verify": "去验证",
"Transform options": "转换参数", "Transform options": "转换参数",
"Save behavior successfully": "保存行为成功",
"The main editor is closed and cannot be saved": "主编辑器已关闭，无法保存",
"A behavior is being edited. Please save it first": "有行为正在编辑，请先保存",
"eventGroup": { "eventGroup": {
"in": "接收", "in": "接收",
"out": "派发" "out": "派发"
...@@ -359,6 +362,10 @@ ...@@ -359,6 +362,10 @@
"webgl": "WEBGL", "webgl": "WEBGL",
"canvas": "CANVAS" "canvas": "CANVAS"
}, },
"behaviorEditors": {
"builtin": "内建",
"standalone": "独立"
},
"pxEnvs": { "pxEnvs": {
"dev": "开发环境", "dev": "开发环境",
"test": "测试环境", "test": "测试环境",
......
src/router.js
View file @ fdaf0b39
...@@ -24,9 +24,9 @@ export default new Router({ ...@@ -24,9 +24,9 @@ export default new Router({
component: () => import('./views/Preview.vue') component: () => import('./views/Preview.vue')
}, },
{ {
path: '/diff', path: '/process-editor',
name: 'diff', name: 'process-editor',
component: () => import('./views/ProjectDiff.vue') component: () => import('./views/ProcessEditor.vue')
}, },
] ]
}) })
src/store/modules/behavior.js
View file @ fdaf0b39
...@@ -7,8 +7,7 @@ ...@@ -7,8 +7,7 @@
import Vue from "vue"; import Vue from "vue";
import i18n from "../../i18n"; import i18n from "../../i18n";
import generateUUID from "uuid/v4"; import generateUUID from "uuid/v4";
import {clonePureObj, getViewNodePath, findMetaDepById, searchViewNode, updateProcesses} from "../../utils"; import {clonePureObj, findMetaDepById, searchViewNode, updateProcesses} from "../../utils";
import {arrayFind} from "element-ui/src/utils/util";
export const behaviorStore = { export const behaviorStore = {
state: { state: {
...@@ -35,13 +34,16 @@ export const behaviorStore = { ...@@ -35,13 +34,16 @@ export const behaviorStore = {
makeBehaviorDirty(state) { makeBehaviorDirty(state) {
state.dirty = true; state.dirty = true;
}, },
behavior_startEdit(state, {originData, behavior}) { clearBehavior(state) {
state.dirty = false; state.dirty = false;
},
behavior_startEdit(state, {originData, behavior}) {
state.projectData = originData; state.projectData = originData;
state.originProcesses = originData.processes; state.originProcesses = originData.processes;
state.processes = clonePureObj(originData.processes); state.processes = clonePureObj(originData.processes);
state.currentBehavior = clonePureObj(behavior); state.currentBehavior = clonePureObj(behavior);
this.commit('clearBehavior');
this.commit('updateCustomProcesses', state.processes); this.commit('updateCustomProcesses', state.processes);
}, },
behavior_save(state) { behavior_save(state) {
...@@ -162,13 +164,12 @@ export const behaviorStore = { ...@@ -162,13 +164,12 @@ export const behaviorStore = {
if (uuid) { if (uuid) {
return searchViewNode(state.projectData.views, uuid); return searchViewNode(state.projectData.views, uuid);
} }
} },
processesInEditor(state) {
return state.processes;
},
}, },
actions: { actions: {
behavior_save({commit, state}) {
commit('behavior_save');
return state.currentBehavior;
},
addCustomProcessMeta({commit, state}, {masterProcess, isInline, processId, name}) { addCustomProcessMeta({commit, state}, {masterProcess, isInline, processId, name}) {
let meta = { let meta = {
id: generateUUID(), id: generateUUID(),
......
src/store/modules/editor.js
View file @ fdaf0b39
...@@ -17,7 +17,7 @@ export const editorStore = { ...@@ -17,7 +17,7 @@ export const editorStore = {
state: { state: {
initialized: false, initialized: false,
name: 'Zeroing Editor', name: 'Zeroing Editor',
version: '0.2.0', version: '0.2.1',
templates: { templates: {
builtin: ['blank'], builtin: ['blank'],
custom: [], custom: [],
......
src/store/modules/package.js
View file @ fdaf0b39
...@@ -4,10 +4,11 @@ ...@@ -4,10 +4,11 @@
import db from "../../utils/db-storage"; import db from "../../utils/db-storage";
import {packageApi} from "../../api"; import {packageApi} from "../../api";
import maxSatisfying from "semver/ranges/max-satisfying"; import semverMaxSatisfying from "semver/ranges/max-satisfying";
import semverRSort from "semver/functions/rsort";
import i18n from "../../i18n"; import i18n from "../../i18n";
import events from "@/global-events.js" import events from "@/global-events.js"
import {timeFormat, typeMapping} from "../../utils"; import {clonePureObj, timeFormat, typeMapping} from "../../utils";
const storeName = 'packages'; const storeName = 'packages';
...@@ -30,15 +31,38 @@ export const packageStore = { ...@@ -30,15 +31,38 @@ export const packageStore = {
customProcesses: [], customProcesses: [],
}, },
mutations: { mutations: {
resetPackageStore(state, sourceState) {
for (let key in sourceState) {
state[key] = sourceState[key];
}
},
updatePackageInfos(state, packageInfos) { updatePackageInfos(state, packageInfos) {
for (let i = 0, li = typeMapping.length; i < li; i++) { for (let i = 0, li = typeMapping.length; i < li; i++) {
state.packageInfos[typeMapping[i]].splice(0); state.packageInfos[typeMapping[i]].splice(0);
} }
for (let packageInfo of packageInfos) { for (let packageInfo of packageInfos) {
packageInfo.versions = packageInfo.versions.split(',').reverse(); let {versions, remarks, update_times, update_time} = packageInfo;
packageInfo.remarks = packageInfo.remarks.split(',').reverse();
packageInfo.update_times = packageInfo.update_times.split(',').map(time => timeFormat(time)).reverse(); versions = versions.split(',');
packageInfo.update_time = timeFormat(packageInfo.update_time); remarks = remarks.split(',');
update_times = update_times.split(',').map(time => timeFormat(time));
let sortedVersions = semverRSort(versions.concat());
let sortedRemarks = [];
let sortedUpdate_times = [];
for (let i = 0, li = sortedVersions.length; i < li; i++) {
const version = sortedVersions[i];
let index = versions.indexOf(version);
sortedRemarks[i] = remarks[index];
sortedUpdate_times[i] = update_times[index];
}
packageInfo.versions = sortedVersions;
packageInfo.remarks = sortedRemarks;
packageInfo.update_times = sortedUpdate_times;
packageInfo.update_time = timeFormat(update_time);
state.packageInfos[typeMapping[packageInfo.type]].push(packageInfo); state.packageInfos[typeMapping[packageInfo.type]].push(packageInfo);
} }
}, },
......
src/store/modules/project.js
View file @ fdaf0b39
...@@ -31,6 +31,7 @@ const storeName = 'project'; ...@@ -31,6 +31,7 @@ const storeName = 'project';
const psStoreName = 'pack-history'; const psStoreName = 'pack-history';
const defaultOptions = { const defaultOptions = {
behaviorEditor: 'builtin',
pageTitle: 'no title', pageTitle: 'no title',
entrySceneView: '', entrySceneView: '',
loadingView: '', loadingView: '',
...@@ -92,11 +93,14 @@ export const projectStore = { ...@@ -92,11 +93,14 @@ export const projectStore = {
}, },
makeProjectDirty() { makeProjectDirty() {
},
resetProjectData(state, data) {
state.data = data;
}, },
updateProjectUpdateTime(state, {time, dirty = true}) { updateProjectUpdateTime(state, {time, dirty = true}) {
state.update_time = time; state.update_time = time;
if(dirty){ if (dirty) {
this.commit('makeProjectDirty'); this.commit('makeProjectDirty');
} }
}, },
...@@ -136,6 +140,10 @@ export const projectStore = { ...@@ -136,6 +140,10 @@ export const projectStore = {
localData.options.pxEnv = getDefaultOptions().pxEnv; localData.options.pxEnv = getDefaultOptions().pxEnv;
} }
if (!localData.options.behaviorEditor) {
localData.options.behaviorEditor = 'builtin';
}
this.dispatch('fillLastVersion'); this.dispatch('fillLastVersion');
this.commit('updateAssetDep'); this.commit('updateAssetDep');
...@@ -543,7 +551,13 @@ export const projectStore = { ...@@ -543,7 +551,13 @@ export const projectStore = {
view.depCustoms = depCustoms; view.depCustoms = depCustoms;
this.commit('makeProjectDirty'); this.commit('makeProjectDirty');
} },
overwriteProcesses(state, {processes}) {
state.data.processes.splice(0);
state.data.processes.push(...processes);
this.commit('makeProjectDirty');
},
}, },
getters: { getters: {
project(state) { project(state) {
...@@ -557,6 +571,9 @@ export const projectStore = { ...@@ -557,6 +571,9 @@ export const projectStore = {
data: JSON.stringify(newData), data: JSON.stringify(newData),
}; };
}, },
behaviorEditor(state) {
return state.data.options.behaviorEditor;
},
menuBadge: (state) => (key) => { menuBadge: (state) => (key) => {
let result = false; let result = false;
switch (key) { switch (key) {
......
src/themes/light/behavior.scss
View file @ fdaf0b39
...@@ -4,322 +4,349 @@ $dock-pin-width: 9px; ...@@ -4,322 +4,349 @@ $dock-pin-width: 9px;
.behavior-editor-dialog { .behavior-editor-dialog {
.process-pane { }
.process-editor-dialog {
flex: 1;
display: flex;
flex-direction: column;
.editor-wrapper{
flex: 1;
display: flex;
}
.behavior-editor {
flex: 1;
} }
.process-tree { .bottom-bar {
display: flex; display: flex;
flex-direction: column; justify-content: space-between;
padding: 10px;
&>div{
*:not(:first-child){
margin-left: 5px;
}
}
}
}
.process-pane {
.scrollbar { }
.process-tree {
display: flex;
flex-direction: column;
.scrollbar {
flex: 1;
.process-tree-node {
flex: 1; flex: 1;
flex-direction: row;
display: flex;
padding-right: 10px;
.process-tree-node { .node-name {
flex: 1; flex: 1;
flex-direction: row; width: 0;
display: flex; text-overflow: ellipsis;
padding-right: 10px; overflow: hidden;
font-size: 14px;
.node-name {
flex: 1;
width: 0;
text-overflow: ellipsis;
overflow: hidden;
font-size: 14px;
.current-node {
background-color: $--color-text-secondary;
color: $--color-white;
border-radius: 5px;
padding: 0 2px;
}
}
.edit-button { .current-node {
visibility: hidden; background-color: $--color-text-secondary;
color: $--color-white;
border-radius: 5px;
padding: 0 2px;
} }
} }
.edit-button {
visibility: hidden;
}
} }
} }
}
.behavior { .behavior {
border: 1px solid $--border-color-base; //border: 1px solid $--border-color-base;
.background { .background {
background-color: $--background-color-base; background-color: $--background-color-base;
}
.center {
display: flex;
flex-direction: column;
.el-button {
padding: 3px;
margin-top: 2px;
margin-right: 2px;
} }
.center { .top-bar {
display: flex; display: flex;
flex-direction: column; justify-content: space-between;
align-items: flex-start;
.el-button { .edit-path {
padding: 3px; flex: 1;
margin-top: 2px; padding: 5px;
margin-right: 2px; height: 14px;
border-bottom: 1px solid $--border-color-light;
} }
}
.top-bar {
display: flex;
justify-content: space-between;
align-items: flex-start;
.edit-path { .operate-bar {
flex: 1; padding: 3px;
padding: 5px;
height: 14px; border-bottom: 1px solid $--border-color-light;
}
}
.board {
flex: 1;
.svg-board {
.line {
stroke: #979797;
&.hover, &:hover {
stroke: $--color-primary;
stroke-dasharray: 5, 1;
}
border-bottom: 1px solid $--border-color-light; &.contact {
stroke: $--color-primary;
} }
} }
.node {
display: flex;
flex-direction: column;
min-width: 100px;
background-color: $--background-color-base;
border: 1px solid $block-border-blur-background-color;
position: relative;
border-radius: 5px;
outline: none;
user-select: none;
margin: 0 $dock-pin-width;
&:hover {
& > .top-bar {
visibility: visible;
}
}
.operate-bar { /*&:hover {
padding: 3px; border-color: $block-border-hover-background-color;
border-bottom: 1px solid $--border-color-light; & > .header {
} background-color: $block-border-hover-background-color;
} }
}*/
.board { /*&:focus {
flex: 1; border-color: $block-border-focus-background-color;
.svg-board { & > .header {
.line { background-color: $block-border-focus-background-color;
stroke: #979797; }
}*/
.top-bar {
height: 19px;
padding: 0 3px;
margin: -20px 5px 0;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
background-color: rgba(0, 0, 0, 0.1);
align-self: flex-end;
visibility: hidden;
&.hover, &:hover { .el-link {
stroke: $--color-primary; padding: 3px 2px 2px 2px;
stroke-dasharray: 5, 1;
} }
&.contact { .el-link + .el-link {
stroke: $--color-primary; margin-left: 5px;
} }
} }
.node { .header {
min-height: 12px;
background-color: $block-border-blur-background-color;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
padding: 3px;
font-size: 12px;
color: white;
display: flex; display: flex;
flex-direction: column;
min-width: 100px;
background-color: $--background-color-base;
border: 1px solid $block-border-blur-background-color;
position: relative;
border-radius: 5px;
outline: none;
user-select: none;
margin: 0 $dock-pin-width;
&:hover { i {
& > .top-bar { display: block;
visibility: visible; //color: $--color-warning;
} margin-right: 3px;
} }
/*&:hover { .title {
border-color: $block-border-hover-background-color; flex: 1;
}
}
& > .header { .body {
background-color: $block-border-hover-background-color; display: flex;
} flex-direction: column;
}*/ padding: 3px;
font-size: 12px;
color: $--color-text-regular;
/*&:focus { .field-item {
border-color: $block-border-focus-background-color; display: flex;
align-items: center;
& > .header { & > * {
background-color: $block-border-focus-background-color; flex: 1;
}
}*/
.top-bar {
height: 19px;
padding: 0 3px;
margin: -20px 5px 0;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
background-color: rgba(0, 0, 0, 0.1);
align-self: flex-end;
visibility: hidden;
.el-link {
padding: 3px 2px 2px 2px;
}
.el-link + .el-link { white-space: nowrap;
margin-left: 5px; overflow: hidden;
} }
}
.header { .key {
min-height: 12px;
background-color: $block-border-blur-background-color;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
padding: 3px;
font-size: 12px;
color: white;
display: flex;
i {
display: block;
//color: $--color-warning;
margin-right: 3px;
} }
.title { .linked-value {
flex: 1;
}
}
.body {
display: flex;
flex-direction: column;
padding: 3px;
font-size: 12px;
color: $--color-text-regular;
.field-item {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-end;
}
& > * { .string-value {
flex: 1; text-align: right;
white-space: nowrap; .tag {
overflow: hidden; color: $--color-success;
} }
}
.key { .color-value {
width: 15px;
} height: 15px;
border-radius: 3px;
float: right;
border: 1px solid $--border-color-base;
}
}
.linked-value { }
display: flex;
align-items: center;
justify-content: flex-end;
}
.string-value { .dock {
text-align: right; position: absolute;
top: 50%;
transform: translateY(-50%);
display: flex;
flex-direction: column;
.tag { .pin {
color: $--color-success; border: 1px solid $block-border-blur-background-color;
} padding: 1px;
} margin-bottom: 5px;
background-color: white;
.color-value { div {
width: 15px; width: 3px;
height: 15px; height: 3px;
border-radius: 3px; border: 1px solid $block-border-blur-background-color;
float: right; border-radius: 3px;
border: 1px solid $--border-color-base;
}
} }
} &:hover {
border-color: $--color-primary;
.dock {
position: absolute;
top: 50%;
transform: translateY(-50%);
display: flex;
flex-direction: column;
.pin {
border: 1px solid $block-border-blur-background-color;
padding: 1px;
margin-bottom: 5px;
background-color: white;
div {
width: 3px;
height: 3px;
border: 1px solid $block-border-blur-background-color;
border-radius: 3px;
}
&:hover { & > div {
border-color: $--color-primary; border-color: $--color-primary;
& > div {
border-color: $--color-primary;
}
}
&:last-child {
margin-bottom: 0;
} }
} }
}
.input { &:last-child {
@extend .dock; margin-bottom: 0;
left: -$dock-pin-width; }
} }
}
.output { .input {
@extend .dock; @extend .dock;
right: -$dock-pin-width; left: -$dock-pin-width;
}
} }
.active { .output {
border-color: $block-border-focus-background-color; @extend .dock;
right: -$dock-pin-width;
}
}
& > .header { .active {
background-color: $block-border-focus-background-color; border-color: $block-border-focus-background-color;
}
/*& > .top-bar { & > .header {
visibility: visible; background-color: $block-border-focus-background-color;
}*/
} }
/*& > .top-bar {
visibility: visible;
}*/
} }
} }
}
.properties { .properties {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.wrapper { .wrapper {
padding: 5px; padding: 5px;
flex: 1; flex: 1;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.name-input { .name-input {
} }
.scrollbar { .scrollbar {
margin-right: -5px; margin-right: -5px;
padding-top: 5px; padding-top: 5px;
flex: 1; flex: 1;
.scrollbar-view { .scrollbar-view {
padding-right: 10px; padding-right: 10px;
}
} }
}
.inside-code { .inside-code {
flex: 1; flex: 1;
height: 0; height: 0;
border-top: 1px solid $--border-color-base; border-top: 1px solid $--border-color-base;
.scrollbar { .scrollbar {
height: 100%; height: 100%;
.code-body { .code-body {
tab-size: 1.5em; tab-size: 1.5em;
width: 100%; width: 100%;
margin: 0; margin: 0;
font-size: 12px; font-size: 12px;
white-space: pre-wrap; white-space: pre-wrap;
}
} }
} }
} }
......
src/views/Editor.vue
View file @ fdaf0b39
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
</template> </template>
<script> <script>
import {mapState, mapActions, mapMutations} from 'vuex' import {mapState, mapActions, mapMutations, mapGetters} from 'vuex'
import SplitPanes from 'splitpanes' import SplitPanes from 'splitpanes'
import ToolBar from "./Editor/ToolBar"; import ToolBar from "./Editor/ToolBar";
import Inspector from "./Editor/Inspector"; import Inspector from "./Editor/Inspector";
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
import Playground from "./Editor/Playground"; import Playground from "./Editor/Playground";
import Assets from "./Editor/Assets"; import Assets from "./Editor/Assets";
import DetailsDialog from "./Editor/dialogs/DetailsDialog"; import DetailsDialog from "./Editor/dialogs/DetailsDialog";
import {openPreview, playWaiting} from "../utils"; import {clonePureObj, openPreview, playWaiting} from "../utils";
import i18n from "../i18n"; import i18n from "../i18n";
import events from "@/global-events.js" import events from "@/global-events.js"
import db from "../utils/db-storage"; import db from "../utils/db-storage";
...@@ -92,8 +92,18 @@ ...@@ -92,8 +92,18 @@
operators: (state) => state.project.operators, operators: (state) => state.project.operators,
currentOperator: (state) => state.editor.operator, currentOperator: (state) => state.editor.operator,
}), }),
...mapGetters(['behaviorEditor'])
}, },
async mounted() { async mounted() {
if (!window.saveProcesses) {
window.saveProcesses = (processes)=> {
this.overwriteProcesses({processes});
this.$message({
message: this.$t('Save behavior successfully'),
type: 'success'
});
}
}
document.addEventListener('keydown', this.onKeyPress); document.addEventListener('keydown', this.onKeyPress);
events.$on('save-and-preview', () => { events.$on('save-and-preview', () => {
this.clickMenu("preview"); this.clickMenu("preview");
...@@ -238,7 +248,7 @@ ...@@ -238,7 +248,7 @@
async onConflictResolved(data) { async onConflictResolved(data) {
const {projectID, project} = this.$route.params; const {projectID, project} = this.$route.params;
let cancel = await this.saveProject(true, data); let cancel = await this.saveProject(true, data);
if(!cancel){ if (!cancel) {
this.loadRemoteVersion(projectID, project, undefined, data); this.loadRemoteVersion(projectID, project, undefined, data);
} }
}, },
...@@ -385,12 +395,46 @@ ...@@ -385,12 +395,46 @@
this.$refs.missingPackagesDialog.show(missingPackages); this.$refs.missingPackagesDialog.show(missingPackages);
}, },
editBehavior(path, index) { editBehavior(path, index) {
this.$refs.behaviorEditorDialog.show(path, index); switch (this.behaviorEditor) {
case 'builtin':
this.$refs.behaviorEditorDialog.show(path, index);
break;
case 'standalone':
this.onOpenStandalone(path, index);
break;
}
},
onOpenStandalone(path, index) {
let processEditorUrl = location.href.substr(0, location.href.indexOf('#')) + '#/process-editor';
let processEditorWin = this.processEditorWin = open(processEditorUrl, 'Process Editor', 'width=800, height=600');
if (processEditorWin.reset) {
if(processEditorWin.editable()){
this.showStandaloneEditor(path, index);
}else{
this.$message({
message: this.$t('A behavior is being edited. Please save it first'),
type: 'warning'
});
}
} else {
processEditorWin.onload = () => {
this.showStandaloneEditor(path, index);
}
}
},
showStandaloneEditor(path, index) {
let processEditorWin = this.processEditorWin;
let projectData = clonePureObj(this.$store.state.project.data);
let packageState = clonePureObj(this.$store.state.project.package);
processEditorWin.reset({projectData, packageState});
processEditorWin.edit(path, index);
}, },
handleBehaviorsChange() { handleBehaviorsChange() {
this.makeProjectDirty(); this.makeProjectDirty();
}, },
...mapMutations(['makeProjectDirty']), ...mapMutations(['makeProjectDirty', 'overwriteProcesses']),
...mapActions([ ...mapActions([
'loadPackages', 'loadPackages',
'localVersionExist', 'localVersionExist',
......
src/views/Editor/behavior-editor/Board/ProcessNode.vue
View file @ fdaf0b39
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
@mouseenter="onMouseEnter" @mouseenter="onMouseEnter"
@mouseleave="onMouseLeave" @click="onClick" @dblclick="onDblclick"> @mouseleave="onMouseLeave" @click="onClick" @dblclick="onDblclick">
<div class="top-bar" v-if="meta.id !== 'entry' && editable"> <div class="top-bar" v-if="meta.id !== 'entry' && editable">
<el-link icon="el-icon-magic-stick" :underline="false" v-if="meta.type !== 'builtin'" @mousedown.stop.prevent @click.stop="onClickTransform"/> <el-link icon="el-icon-magic-stick" :underline="false" v-if="false && meta.type !== 'builtin'" @mousedown.stop.prevent @click.stop="onClickTransform"/>
<el-link icon="el-icon-delete" :underline="false" @mousedown.stop.prevent @click.stop="onClickDelete"/> <el-link icon="el-icon-delete" :underline="false" @mousedown.stop.prevent @click.stop="onClickDelete"/>
<el-link icon="el-icon-edit" :underline="false" v-if="meta.type !== 'builtin' && !meta.isDivider" <el-link icon="el-icon-edit" :underline="false" v-if="meta.type !== 'builtin' && !meta.isDivider"
@mousedown.stop.prevent @click.stop="onClickEdit"/> @mousedown.stop.prevent @click.stop="onClickEdit"/>
......
src/views/Editor/dialogs/BehaviorEditorDialog.vue
View file @ fdaf0b39
...@@ -4,7 +4,9 @@ ...@@ -4,7 +4,9 @@
:append-to-body="true" custom-class="flex-dialog behavior-editor-dialog"> :append-to-body="true" custom-class="flex-dialog behavior-editor-dialog">
<behavior-editor v-if="editorReady" ref="behaviorEditor" class="full-size"></behavior-editor> <behavior-editor v-if="editorReady" ref="behaviorEditor" class="full-size"></behavior-editor>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<div></div> <div>
</div>
<div> <div>
<!--<el-button size="mini" @click="onSave(true)">{{$t('Save And Preview')}}</el-button> <!--<el-button size="mini" @click="onSave(true)">{{$t('Save And Preview')}}</el-button>
<el-button size="mini" type="primary" @click="onSave(false)">{{$t('Save And Close')}}</el-button>--> <el-button size="mini" type="primary" @click="onSave(false)">{{$t('Save And Close')}}</el-button>-->
...@@ -20,6 +22,7 @@ ...@@ -20,6 +22,7 @@
import {mapState, mapMutations, mapActions} from 'vuex' import {mapState, mapMutations, mapActions} from 'vuex'
import BehaviorEditor from "../behavior-editor/BehaviorEditor"; import BehaviorEditor from "../behavior-editor/BehaviorEditor";
import events from "@/global-events.js" import events from "@/global-events.js"
import {clonePureObj} from "../../../utils";
export default { export default {
name: "BehaviorEditorDialog", name: "BehaviorEditorDialog",
...@@ -49,7 +52,7 @@ ...@@ -49,7 +52,7 @@
this.visible = true; this.visible = true;
}, },
async onSave() { async onSave() {
const behavior = await this.behavior_save(); this.behavior_save();
/*for (let i = 0, li = this.behaviors.length; i < li; i++) { /*for (let i = 0, li = this.behaviors.length; i < li; i++) {
const b = this.behaviors[i]; const b = this.behaviors[i];
if (b.uuid === behavior.uuid) { if (b.uuid === behavior.uuid) {
...@@ -95,8 +98,6 @@ ...@@ -95,8 +98,6 @@
}, },
...mapMutations([ ...mapMutations([
'behavior_cancel', 'behavior_cancel',
]),
...mapActions([
'behavior_save', 'behavior_save',
]) ])
} }
......
src/views/Editor/dialogs/editors/ProjectEditor.vue
View file @ fdaf0b39
...@@ -2,6 +2,15 @@ ...@@ -2,6 +2,15 @@
<el-scrollbar v-if="editData" class="project-scrollbar" wrap-class="wrap-x-hidden" view-class="project-editor"> <el-scrollbar v-if="editData" class="project-scrollbar" wrap-class="wrap-x-hidden" view-class="project-editor">
<el-form @submit.native.prevent ref="form" :model="editData" size="mini" label-position="right" <el-form @submit.native.prevent ref="form" :model="editData" size="mini" label-position="right"
label-width="150px"> label-width="150px">
<el-form-item prop="behaviorEditor" :label="$t('Behavior Editor')">
<el-select v-model="editData.behaviorEditor">
<el-option v-for="(label, key) in behaviorEditors"
:key="key"
:value="key"
:label="label"
></el-option>
</el-select>
</el-form-item>
<el-form-item prop="pageTitle" :label="$t('Page title')"> <el-form-item prop="pageTitle" :label="$t('Page title')">
<el-input v-model="editData.pageTitle"/> <el-input v-model="editData.pageTitle"/>
</el-form-item> </el-form-item>
...@@ -83,12 +92,14 @@ ...@@ -83,12 +92,14 @@
data() { data() {
const scaleMode = this.$t('scaleMode'); const scaleMode = this.$t('scaleMode');
const rendererType = this.$t('rendererType'); const rendererType = this.$t('rendererType');
const behaviorEditors = this.$t('behaviorEditors');
return { return {
visible: false, visible: false,
editData: null, editData: null,
scaleMode, scaleMode,
rendererType, rendererType,
monacoEditorOptions, monacoEditorOptions,
behaviorEditors,
} }
}, },
computed: { computed: {
......
src/views/ProcessEditor.vue 0 → 100644
View file @ fdaf0b39
<template>
<div class="process-editor-dialog">
<div class="editor-wrapper">
<behavior-editor v-if="editorReady" ref="behaviorEditor" class="behavior-editor"></behavior-editor>
</div>
<div class="bottom-bar">
<div>
</div>
<div>
<el-button size="mini" type="danger" @click="onClose()">{{$t('Close')}}</el-button>
<el-badge :hidden="!showBadge" is-dot>
<el-button size="mini" type="primary" @click="onSave()">{{$t('Save')}}</el-button>
</el-badge>
</div>
</div>
</div>
</template>
<script>
import {mapMutations, mapState, mapGetters} from 'vuex'
import BehaviorEditor from "./Editor/behavior-editor/BehaviorEditor";
import {clonePureObj} from "../utils";
export default {
name: "ProcessEditor",
components: {BehaviorEditor},
data() {
return {
editorReady: false,
}
},
mounted() {
window.reset = ({projectData, packageState}) => {
console.log('reset');
this.resetProjectData(projectData);
this.resetPackageStore(packageState);
};
window.editable = () => {
return !this.showBadge;
};
window.edit = (path, index) => {
this.edit(path, index);
};
window.onbeforeunload = (e) => {
return this.showBadge ? true : null;
};
},
computed: {
...mapState({
showBadge: state => state.behavior.dirty,
}),
...mapGetters(['processesInEditor'])
},
methods: {
edit(path, index) {
this.path = path;
this.index = index;
this.editorReady = true;
this.$nextTick(this.startEdit);
},
startEdit() {
this.$refs.behaviorEditor.edit(this.path, this.index);
},
async onSave() {
if (!this.showBadge) {
return;
}
let opener;
try {
if (window.opener && window.opener.saveProcesses) {
opener = window.opener;
}
} catch (e) {
}
if (opener) {
let processes = clonePureObj(this.processesInEditor);
window.opener.saveProcesses(processes);
this.clearBehavior();
/*this.$message({
message: this.$t('Save behavior successfully'),
type: 'success'
});*/
} else {
this.$alert(this.$t('The main editor is closed and cannot be saved'));
}
},
onClose() {
if (this.showBadge) {
this.$confirm(this.$t('Save this behavior before'), this.$t('Alert'), {
closeOnClickModal: false,
closeOnPressEscape: false,
confirmButtonText: this.$t('Save And Close'),
cancelButtonText: this.$t('Still Close'),
distinguishCancelAndClose: true,
type: 'warning'
}).then(() => {
this.onSave();
this.close();
}).catch((action) => {
switch (action) {
case 'close':
break;
case 'cancel':
this.close();
break;
}
});
} else {
this.close();
}
},
close() {
window.close();
},
...mapMutations(['clearBehavior', 'resetProjectData', 'resetPackageStore', 'behavior_save'])
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
src/views/ProjectDiff.vue deleted 100644 → 0
View file @ ed7bfeea
<template>
<monaco-editor
class="script-editor"
ref="editor"
v-model="code"
language="json"
:options="monacoEditorOptions"
diff-editor
:original="originalCode"
/>
</template>
<script>
import MonacoEditor from "vue-monaco";
import {monacoEditorOptions} from "../utils";
//import old from './old.json'
//let originalCode = JSON.stringify(old, null, '\t');
let originalCode = `hello`;
console.log(originalCode);
export default {
name: "ProjectDiff",
components: {MonacoEditor},
data() {
return {
monacoEditorOptions,
code: '',
originalCode,
}
},
mounted() {
let editor = this.$refs.editor.getEditor();
editor.onDidUpdateDiff(()=>{
let m = editor.getLineChanges();
console.log(m);
})
}
}
</script>
<style scoped>
.script-editor{
width: 100%;
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment