Commit 143072d3 authored by rockyl's avatar rockyl

修复内联过程嵌套会报错的问题

美化代码编辑器
parent aa70b179
......@@ -52,9 +52,9 @@ export async function saveOne(project) {
})
}
export async function pack(id) {
export async function pack(id, debug) {
return await fetchApi('/api/project/pack', {
params: {id},
params: {id, debug},
method: 'post',
errMessage: 'Failed to pack project',
})
......
......@@ -5,9 +5,10 @@
export let API_HOST;
if (process.env.NODE_ENV === 'development') {
//API_HOST = 'http://10.10.95.74:7777';
//API_HOST = 'http://10.10.94.134:7777';
//API_HOST = 'http://192.168.1.16:7777';
API_HOST = 'http://10.10.92.33:7777';
//API_HOST = 'http://localhost:3002';
API_HOST = window.__data.apiHost;
//API_HOST = window.__data.apiHost;
//API_HOST = '';
} else {
API_HOST = window.__data.apiHost;
......
......@@ -73,9 +73,7 @@ export const behaviorStore = {
state.originBehaviors[0] = state.currentBehavior;
},
updateProcesses(state, {targetMetaID, replaceMetaID}) {
for (let process of state.data.processes) {
updateProcesses(process, targetMetaID, replaceMetaID);
}
updateProcesses(state.data.processes, targetMetaID, replaceMetaID);
},
deleteProcessMeta(state, {meta, process}) {
let container;
......
......@@ -598,8 +598,8 @@ export const projectStore = {
}*/
return failedList;
},
async packProject({state}) {
const result = await projectApi.pack(state.id);
async packProject({state}, debug) {
const result = await projectApi.pack(state.id, debug);
console.log(result);
return result;
}
......
......@@ -34,10 +34,14 @@ content="width=device-width,initial-scale=1, minimum-scale=1, maximum-scale=1, u
<body>
<div id="$CONTAINER_ID$" style="line-height:0;font-size:0"></div>
<script src="http://10.10.94.134:4002/dist/index.js"></script>
<script src="${process.env.NODE_ENV === 'development' ? 'http://10.10.94.134:4002/dist/index.js' : 'http://yun.duiba.com.cn/editor/zeroing/libs/engine.b0b81ba7872b4ffaa3cdbe5d440cdb4617b86c5c.js'}"></script>
<script src="http://yun.duiba.com.cn/editor/zeroing/libs/tslib.js"></script>
<script src="$PROCESSES_URL$"></script>
<script src="$SCRIPTS_URL$"></script>
<script src="$CUSTOMS_URL$"></script>
<script>
engine.launch('//yun.duiba.com.cn/aurora/$VERSION$-data.json');
</script>
engine.launch('//yun.duiba.com.cn/aurora/$VERSION$-data.json');
</script>
</body>
</html>
`;
......@@ -4,6 +4,10 @@
@import "assets";
@import "behavior";
.CodeMirror {
height: 200px !important;
}
.editor {
display: flex;
flex: 1;
......
......@@ -14,7 +14,7 @@ export function messageError(e) {
})
}
export function playWaiting(promise, text) {
export function playWaiting(promise, text, closeLoading = true) {
const loading = Loading.service({
lock: true,
text: text || i18n.t('In processing'),
......@@ -24,7 +24,9 @@ export function playWaiting(promise, text) {
messageError(e);
throw e;
}).finally(() => {
loading.close();
if(closeLoading){
loading.close();
}
})
}
......@@ -69,11 +71,16 @@ export function getInputDefaultValue(property) {
return property ? property.hasOwnProperty('default') ? property.default + '' : 'unset' : 'unset';
}
export function updateProcesses(process, targetMetaID, replaceMetaID) {
for (let key in process.sub) {
let subProcess = process.sub[key];
if (subProcess.meta === targetMetaID) {
subProcess.meta = replaceMetaID;
export function updateProcesses(processes, targetMetaID, replaceMetaID) {
for (let process of processes) {
for (let key in process.sub) {
let subProcess = process.sub[key];
if (subProcess.meta === targetMetaID) {
subProcess.meta = replaceMetaID;
}
}
if(process.metas){
updateProcesses(process.metas, targetMetaID, replaceMetaID)
}
}
}
......
......@@ -139,8 +139,8 @@
this.panesConfig[id] = configs[0].width / 100;
localStorage.panesConfig = JSON.stringify(this.panesConfig);
},
async saveProject() {
await playWaiting(this.saveToRemote(), this.$t('Saving'));
async saveProject(closeLoading) {
await playWaiting(this.saveToRemote(), this.$t('Saving'), closeLoading);
this.$message({
message: i18n.t('Save project successfully'), //因为message是异步出现,但是当路由回退的时候,this.i18n的实例已经置空,所以要用全局的i18n实例
type: 'success'
......@@ -157,6 +157,9 @@
case 'details':
this.$refs.dialogsDialog.show();
break;
case 'preview':
await this.pack(true);
break;
case 'pack':
await this.pack();
break;
......@@ -188,14 +191,14 @@
break;
}
},
async pack(){
async pack(debug = false){
const loading = this.$loading({
lock: true,
text: this.$t('Packing'),
});
try{
await this.saveProject();
const packResult = await this.packProject();
await this.saveProject(false);
const packResult = await this.packProject(debug);
this.$message({
message: this.$t('Pack project successfully'),
type: 'success',
......
<template>
<div class="board" @dragover="onDragOver" @drop="onDrop" v-resize="onResize">
<div class="board" @dragover="onDragOver" @drop="onDrop" @paste="onPaste" v-resize="onResize">
<div style="height: 1px;"></div>
<!--<el-scrollbar class="full-size">-->
<svg ref="board" class="svg-board full-size" version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" @mousedown="onBoardMouseDown">
xmlns:xlink="http://www.w3.org/1999/xlink" @paste="onPaste" @mousedown="onBoardMouseDown">
<g ref="borderWrapper" :style="boardStyle">
<g id="layer" stroke-width="2" fill="none" fill-rule="evenodd">
<link-line v-for="(line, key, index) in lines" :data="line" :key="index" @dblclick="onDeleteLine"></link-line>
......@@ -16,6 +17,7 @@
@leave-pin="onPinLeave"
@down-pin="onPintDown"
@delete="onProcessNodeDelete"
@copy="onProcessNodeCopy"
@edit-meta="onEditMeta"
@dblclick="editSubProcess(process)"
@meta-modified="onProcessMetaModified"
......@@ -25,7 +27,6 @@
</svg>
<!--</el-scrollbar>-->
<tool-tip ref="toolTip"/>
<inline-choose-dialog ref="inlineChooseDialog"/>
</div>
</template>
......@@ -39,13 +40,13 @@
import {DOCK_POINT_OFFSET} from "../../../config";
import events from "../../../global-events";
import generateUUID from "uuid/v4";
import InlineChooseDialog from "./InlineChooseDialog";
import copy from 'copy-to-clipboard'
const customs = ['custom', 'divider'];
export default {
name: "Board",
components: {InlineChooseDialog, ToolTip, LinkLine, ProcessNode,},
components: {ToolTip, LinkLine, ProcessNode,},
props: [],
data() {
return {
......@@ -115,28 +116,31 @@
const process = new Process(this.process, data, this.resolveProcess);
this.$set(this.subProcessMap, uuid, process);
},
showInlineChoose() {
return this.$confirm(this.$t('As inline'));
},
async addSubProcessData(processId, pos) {
let meta, isInline;
if (customs.includes(processId)) {
try {
const result = await this.$refs.inlineChooseDialog.show();
isInline = result.isInline;
await this.showInlineChoose();
isInline = true;
} catch (e) {
return;
}
meta = await this.addCustomProcessMeta({masterProcess: this.process, isInline, processId});
}else{
} else {
meta = this.process.resolveMeta(processId);
}
if(meta.isPrefab){
if (meta.isPrefab) {
try {
const result = await this.$refs.inlineChooseDialog.show();
isInline = result.isInline;
await this.showInlineChoose();
isInline = true;
} catch (e) {
return;
}
meta = await this.addProcessFromPrefab({masterProcess: this.process, isInline, meta})
}
......@@ -181,6 +185,13 @@
events.$emit('update-dock-pin-pos');
});
},
onPaste(e) {
let dataStr = e.clipboardData.getData("process-data");
if (dataStr) {
let process = JSON.parse(dataStr);
console.log(process);
}
},
onResize() {
const {x, y} = this.$el.getBoundingClientRect();
this.drawState.boardOffset.x = x + this.boardOffset.x;
......@@ -286,6 +297,9 @@
});
}
},
onProcessNodeCopy(data) {
copy(JSON.stringify(data), {format: 'process-data'})
},
onEditMeta(data, meta) {
this.$emit('edit-meta', meta);
},
......
......@@ -5,6 +5,7 @@
<div class="top-bar" v-if="meta.id !== 'entry' && editable">
<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" @mousedown.stop.prevent @click.stop="onClickEdit"/>
<el-link icon="el-icon-document-copy" :underline="false" @mousedown.stop.prevent @click.stop="onClickCopy"/>
</div>
<div class="header">
<i v-if="meta.isInline">i</i>
......@@ -231,6 +232,9 @@
onClickEdit() {
this.$emit('edit-meta', this.data, this.meta);
},
onClickCopy() {
this.$emit('copy', this.data, this.meta);
},
outputPointModify(action) {
let output = this.meta.output;
let count = output.length;
......
<template>
<el-dialog
:title="$t('Alert')"
:visible.sync="dialogVisible"
append-to-body
@close="onClose"
>
<el-checkbox v-model="asInline">{{$t('As inline')}}</el-checkbox>
<span slot="footer" class="dialog-footer">
<el-button size="mini" @click="dialogVisible = false">{{$t('Cancel')}}</el-button>
<el-button size="mini" type="primary" @click="onConfirm">{{$t('Confirm')}}</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
name: "InlineChooseDialog",
data() {
return {
dialogVisible: false,
asInline: false,
}
},
methods: {
show() {
this.dialogVisible = true;
return new Promise((resolve, reject) => {
this.p = {resolve, reject};
});
},
onClose() {
if (this.p) {
this.p.reject();
this.p = null;
}
this.dialogVisible = false;
},
onConfirm() {
if (this.p) {
this.p.resolve({
isInline: this.asInline,
});
this.p = null;
}
this.dialogVisible = false;
},
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
......@@ -37,10 +37,14 @@
</template>
</el-form>
<div style="margin-top: 5px;">
<el-tag v-for="item in exposeVariables" size="mini">{{item}}</el-tag>
<el-tag v-for="(item, key) in exposeVariables" :key="key" size="mini">{{item}}</el-tag>
</div>
<el-input v-if="meta" class="script-editor" :readonly=" !editable" type="textarea" :placeholder="$t('Code')"
v-model="meta.script"></el-input>
<!--<el-input v-if="meta" class="script-editor" :readonly=" !editable" type="textarea" :placeholder="$t('Code')"
v-model="meta.script"></el-input>-->
<codemirror ref="myCm" v-if="meta"
v-model="meta.script"
:options="cmOptions">
</codemirror>
</div>
<div slot="footer" class="dialog-footer">
<div class="button-bar">
......@@ -62,14 +66,18 @@
<script>
import ElFormItem from "./inputs/form-item";
import PropsEditorDialog from "./PropsEditorDialog";
import {codemirror} from "vue-codemirror";
import copy from 'copy-to-clipboard'
import {clonePureObj} from "../../../utils";
import 'codemirror/mode/javascript/javascript.js'
import 'codemirror/lib/codemirror.css'
import 'codemirror/theme/monokai.css'
const exposeVariables = ['args', 'props', 'target', 'global', 'vm', 'engine'];
export default {
name: "MetaEditorDialog",
components: {PropsEditorDialog, ElFormItem},
components: {PropsEditorDialog, ElFormItem, codemirror},
data() {
return {
visible: false,
......@@ -85,7 +93,20 @@
{ required: true, trigger: 'blur' }
],
},
cmOptions: {
// codemirror options
tabSize: 2,
mode: 'text/javascript',
styleActiveLine: true,
theme: 'default',
lineNumbers: true,
line: true,
// more codemirror options, 更多 codemirror 的高级配置...
}
}
},
mounted(){
},
computed: {
editable() {
......@@ -143,6 +164,9 @@
focusPasteBoard(){
this.$refs.pasteBoard.focus();
},
onCmCodeChange(code){
console.log(code);
}
}
}
</script>
......
......@@ -19,7 +19,7 @@
<dynamic-selector style="flex: 1;" v-model="item.value"
:editable="editable"/>
<el-button class="delete-button" icon="el-icon-minus" size="mini" plain circle type="danger"
@click="addMapItem"/>
@click="deleteMapItem(index)"/>
</div>
</div>
<div class="bottom-bar">
......@@ -85,6 +85,9 @@
addMapItem() {
this.editValue.push({});
},
deleteMapItem(index) {
this.editValue.splice(index, 1);
},
save() {
let v = {type: 'map', value: {}};
for (let item of this.editValue) {
......
......@@ -10,7 +10,7 @@ module.exports = {
enableInSFC: true
}
},
devServer: {
/*devServer: {
host: '0.0.0.0',
port: '8080',
proxy: {
......@@ -21,7 +21,7 @@ module.exports = {
target: serverHost,
},
}
},
},*/
configureWebpack: {
}
......
......@@ -2365,6 +2365,11 @@ code-point-at@^1.0.0:
resolved "https://registry.npm.taobao.org/code-point-at/download/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77"
integrity sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=
codemirror@^5.41.0:
version "5.49.2"
resolved "https://registry.npm.taobao.org/codemirror/download/codemirror-5.49.2.tgz#c84fdaf11b19803f828b0c67060c7bc6d154ccad"
integrity sha1-yE/a8RsZgD+CiwxnBgx7xtFUzK0=
collection-visit@^1.0.0:
version "1.0.0"
resolved "https://registry.npm.taobao.org/collection-visit/download/collection-visit-1.0.0.tgz#4bc0373c164bc3291b4d368c829cf1a80a59dca0"
......@@ -3117,6 +3122,11 @@ detect-node@^2.0.4:
resolved "https://registry.npm.taobao.org/detect-node/download/detect-node-2.0.4.tgz#014ee8f8f669c5c58023da64b8179c083a28c46c"
integrity sha1-AU7o+PZpxcWAI9pkuBecCDooxGw=
diff-match-patch@^1.0.0:
version "1.0.4"
resolved "https://registry.npm.taobao.org/diff-match-patch/download/diff-match-patch-1.0.4.tgz#6ac4b55237463761c4daf0dc603eb869124744b1"
integrity sha1-asS1UjdGN2HE2vDcYD64aRJHRLE=
diff@^4.0.1:
version "4.0.1"
resolved "https://registry.npm.taobao.org/diff/download/diff-4.0.1.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fdiff%2Fdownload%2Fdiff-4.0.1.tgz#0c667cb467ebbb5cea7f14f135cc2dba7780a8ff"
......@@ -9430,6 +9440,14 @@ vue-cli-plugin-i18n@^0.6.0:
vue-i18n "^8.0.0"
vue-i18n-extract "^0.4.13"
vue-codemirror@^4.0.6:
version "4.0.6"
resolved "https://registry.npm.taobao.org/vue-codemirror/download/vue-codemirror-4.0.6.tgz#b786bb80d8d762a93aab8e46f79a81006f0437c4"
integrity sha1-t4a7gNjXYqk6q45G95qBAG8EN8Q=
dependencies:
codemirror "^5.41.0"
diff-match-patch "^1.0.0"
vue-draggable-resizable@^2.0.1:
version "2.0.1"
resolved "https://registry.npm.taobao.org/vue-draggable-resizable/download/vue-draggable-resizable-2.0.1.tgz#fb98d0997b1cfa8e3ba90f723cf8b605012cd96d"
......
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