翻译中文

实现预设

.env

-VUE_APP_I18N_LOCALE=en
+VUE_APP_I18N_LOCALE=zh-CN
 VUE_APP_I18N_FALLBACK_LOCALE=en

public/index.html

@@ -14,7 +14,8 @@
 </noscript>
 <script>
 	window.__data = {
-		token : "<%= process.env.NODE_ENV === 'development' ? 'eyJhbGciOiJIUzI1NiJ9.5Yqz55Cq5bOw.wixVqBeqGS2FBY_VWF1cC_Vg5Zr0vYgRTfuncjGthYY' : '$TOKEN$' %>"
+		token : "<%= process.env.NODE_ENV === 'development' ? 'eyJhbGciOiJIUzI1NiJ9.5Yqz55Cq5bOw.wixVqBeqGS2FBY_VWF1cC_Vg5Zr0vYgRTfuncjGthYY' : '$TOKEN$' %>",
+		apiHost : "<%= process.env.NODE_ENV === 'development' ? 'http://beacon.duibadev.com.cn' : '$API_HOST$' %>"
 	}
 </script>
 <div id="app"></div>

src/config.js

@@ -3,12 +3,12 @@
  */
 
 export let API_HOST;
-if(process.env.NODE_ENV === 'development'){
+if (process.env.NODE_ENV === 'development') {
 	//API_HOST = 'http://10.10.95.74:7777';
 	//API_HOST = 'http://localhost:3002';
-	API_HOST = 'http://beacon.duibadev.com.cn'
-}else{
-	API_HOST = 'http://beacon.duibadev.com.cn'
+	API_HOST = window.__data.apiHost;
+} else {
+	API_HOST = window.__data.apiHost;
 }
 
 export const UPLOAD_FILE_URL = API_HOST + '/api/uploadFile';

src/locales/en.json

@@ -7,6 +7,8 @@
 	"Save": "Save",
 	"Copy": "Copy",
 	"Exit": "Exit",
+	"Props": "Props",
+	"Behavior": "Behavior",
 	"Add": "Add",
 	"Delete": "Delete",
 	"Import": "Import",
@@ -20,6 +22,8 @@
 	"Code": "Code",
 	"Desc": "Desc",
 	"Empty": "Empty",
+	"Key": "Key",
+	"Default": "Default",
 	"Event": "Event",
 	"No desc": "No desc",
 	"Description": "Description",
@@ -61,7 +65,6 @@
 	"Scale Mode": "Scale Mode",
 	"Renderer Type": "Renderer Type",
 	"Props Editor": "Props Editor",
-	"Edit Behavior": "Edit Behavior",
 	"Trigger once": "Trigger once",
 	"Meta Editor": "Meta Editor",
 	"As inline": "As inline",
@@ -131,5 +134,25 @@
 		"static": "Static",
 		"arguments": "Arguments",
 		"data-center": "DataCenter"
+	},
+	"prosTypes": {
+		"boolean": "Boolean",
+		"string": "String",
+		"number": "Number",
+		"enum": "Enum",
+		"color": "Color",
+		"asset": "Asset",
+		"node": "Node",
+		"data": "Data"
+	},
+	"events": {
+		"init": "Init",
+		"awake": "Awake",
+		"sleep": "Sleep",
+		"data-center": "DataCenter",
+		"click": "Click",
+		"touchstart": "Touchstart",
+		"touchend": "Touchend",
+		"touchmove": "Touchmove"
 	}
 }
\ No newline at end of file

src/locales/zh-CN.json

 {
 	"Alert": "提示",
-  "Confirm": "确定",
+	"Confirm": "确认",
 	"Cancel": "取消",
-  "In processing": "处理中…",
-  "Projects": "项目列表",
-  "copy": "副本",
-  "No projects": "没有项目",
+	"Close": "关闭",
+	"Still Close": "仍然关闭",
+	"Save": "保存",
+	"Copy": "复制",
+	"Exit": "退出",
+	"Props": "属性",
+	"Behavior": "行为",
+	"Add": "添加",
+	"Delete": "删除",
+	"Import": "导入",
+	"Export": "导出",
+	"Upload": "上传",
+	"Edit": "编辑",
+	"ID": "ID",
+	"Name": "名字",
+	"Alias": "别名",
+	"Output": "输出",
+	"Code": "代码",
+	"Desc": "描述",
+	"Empty": "空",
+	"Key": "属性名",
+	"Default": "默认值",
+	"Event": "事件",
+	"No desc": "无描述",
+	"Description": "描述",
+	"Failed to fetch": "网络错误!",
+	"In processing": "处理中……",
+	"Projects": "项目",
+	"copy": "复制",
+	"No projects": "无项目",
 	"Create": "创建",
-  "Project name": "项目名称",
+	"Project details": "项目详情",
+	"Project does not exist": "项目不存在",
+	"Project name": "项目名",
+	"Data mapping": "数据映射",
+	"Behavior Editor": "行为编辑器",
 	"Template": "模板",
 	"Preparing": "准备中…",
+	"Deleting": "删除中…",
+	"Saving": "保存中…",
+	"Divider": "分流节点",
+	"Custom": "自定义节点",
+	"Entry": "入口",
+	"Packing": "打包",
+	"Type": "类型",
+	"Group": "分组",
+	"Access denied": "无权限",
+	"Invalid router": "无效的页面",
+	"Jump after": "{cd}秒后跳转",
+	"Open in new tab": "新标签打开",
+	"Pack project successfully": "项目打包成功",
+	"Pack project failed": "项目打包失败",
 	"Create project": "创建项目",
+	"Rename project": "重命名项目",
+	"Entry scene view": "入口场景视图",
+	"Page title": "页面标题",
+	"Container ID": "容器ID",
+	"Design width": "设计宽度",
+	"Design height": "设计高度",
+	"Frame Rate": "帧率",
+	"Scale Mode": "缩放模式",
+	"Renderer Type": "渲染模式",
+	"Props Editor": "属性编辑器",
+	"Trigger once": "触发一次",
+	"Meta Editor": "过程元配置",
+	"As inline": "作为内联",
+	"Link to parent": "连接到父节点",
+	"Input project name": "输入项目名",
+	"Invalid project name": "无效的项目名",
 	"Creating project": "项目创建中…",
-  "Create project success": "创建项目成功",
+	"Create project success": "项目创建成功",
 	"Duplicate project": "复制项目",
 	"Duplicating project": "项目复制中…",
-  "Duplicate project success": "复制项目成功",
+	"Duplicate project success": "项目复制成功",
 	"Project name cannot be empty": "项目名不能为空",
-  "This action will permanently delete project": "即将永久删除项目[{projectName}], 是否继续?",
-  "Failed to fetch env": "环境获取失败",
-  "Failed to fetch projects": "项目列表获取失败",
+	"This action will permanently delete project": "您将删除项目[{projectName}], 是否继续?",
+	"Fetching projects": "获取项目列表…",
+	"Failed to fetch env": "获取环境失败",
+	"Failed to fetch projects": "获取项目列表失败",
+	"Failed to fetch project": "获取项目失败",
 	"Failed to create project": "创建项目失败",
 	"Failed to duplicate project": "复制项目失败",
 	"Failed to delete project": "删除项目失败",
 	"Failed to get project": "获取项目失败",
 	"Failed to save project": "保存项目失败",
+	"Save project successfully": "保存项目成功",
+	"Input view name": "输入视图名",
+	"Invalid view name": "无效的视图名",
+	"Unsaved version found locally": "本地发现了未保存保本，请选择版本打开",
+	"Local Version": "本地版本",
+	"Remote Version": "远程版本",
+	"Confirm to exit the editor": "确定退出编辑器吗?",
+	"Confirm to publish": "确定发布吗?",
+	"Are you sure to delete this asset": "确定删除素材吗",
+	"Are you sure to delete this link": "确定删除映射吗",
+	"Rename asset": "重命名素材",
+	"Input asset name": "输入素材名",
+	"Invalid asset name": "无效的素材名",
+	"Copied field to clipboard": "已复制 {field} 到剪切板",
+	"Unsaved Alert": "项目还未保存，是否保存?",
+	"Meta is in use, can not delete": "过程元正在使用中，不能删除!",
+	"Are you sure to delete this meta": "确定删除这个过程元吗?",
+	"This Meta ID is in use, can not save": "这个ID正在被使用，不能保存!",
+	"Custom node desc": "自定义节点",
+	"Divider node desc": "分流节点，出口会按顺序一次执行",
+	"Save this behavior before": "是否先保存这个行为?",
 	"menu": {
 		"save": "保存",
 		"details": "详情",
 		"preview": "预览",
-    "publish": "发布",
+		"pack": "发布",
 		"data-mapping": "数据映射",
-    "exit": "退出"
+		"exit": "退出",
+		"undo": "撤销",
+		"redo": "重做"
+	},
+	"view_node_menu": {
+		"node": "节点",
+		"image": "图片",
+		"label": "标签",
+		"rect": "矩形"
 	},
 	"panes": {
 		"Assets": "素材",
 		"Inspector": "属性",
-    "Playground": "编辑",
+		"Playground": "画布",
 		"Views": "视图"
+	},
+	"dataTypes": {
+		"static": "静态",
+		"arguments": "入参",
+		"data-center": "数据中心"
+	},
+	"prosTypes": {
+		"boolean": "布尔",
+		"string": "字符串",
+		"number": "数字",
+		"enum": "枚举",
+		"color": "颜色",
+		"asset": "素材",
+		"node": "节点",
+		"data": "数据"
+	},
+	"events": {
+		"init": "初始化",
+		"awake": "激活",
+		"sleep": "入眠",
+		"data-center": "数据中心",
+		"click": "触摸点击",
+		"touchstart": "触摸按下",
+		"touchend": "触摸弹起",
+		"touchmove": "触摸移动"
 	}
 }
\ No newline at end of file

src/store/modules/behavior.js

@@ -7,7 +7,7 @@
 import Vue from "vue";
 import i18n from "../../i18n";
 import generateUUID from "uuid/v4";
-import {metaInUse, updateProcesses} from "../../utils";
+import {clonePureObj, metaInUse, updateProcesses} from "../../utils";
 
 export const behaviorStore = {
 	state: {
@@ -32,8 +32,8 @@ export const behaviorStore = {
 		behavior_startEdit(state, {originData, behaviors, event}) {
 			state.originData = originData;
 			state.originBehaviors = behaviors;
-			state.behaviors = JSON.parse(JSON.stringify(behaviors));
-			state.data = JSON.parse(JSON.stringify(originData));
+			state.behaviors = clonePureObj(behaviors);
+			state.data = clonePureObj(originData);
 
 			if (state.behaviors.length > 0) {
 				state.currentBehavior = state.behaviors[0];
@@ -153,7 +153,7 @@ export const behaviorStore = {
 		}
 	},
 	actions: {
-		addCustomProcessMeta({commit, state}, {process, isInline, processId}) {
+		addCustomProcessMeta({commit, state}, {masterProcess, isInline, processId}) {
 			let meta = {
 				id: generateUUID(),
 				script: '',
@@ -171,19 +171,33 @@ export const behaviorStore = {
 					meta.isDivider = true;
 					break;
 			}
-			if (isInline) {
-				if (!process.meta.metas) {
-					Vue.set(process.meta, 'metas', []);
-				}
-				process.meta.metas.push(meta);
-			} else {
-				commit('addProcessMeta', meta);
-			}
+
+			addProcessMeta(commit, isInline, masterProcess, meta);
 			return meta;
 		},
+		addProcessFromPrefab({commit, state}, {masterProcess, isInline, meta: pMeta}){
+			let meta = clonePureObj(pMeta);
+			meta.id = generateUUID();
+			meta.isInline = isInline;
+			delete meta.type;
+
+			addProcessMeta(commit, isInline, masterProcess, meta);
+			return meta;
+		}
 	}
 };
 
 function updatePropsEditable(state) {
 	state.editable = state.processStack.filter(item => item.meta.type === 'builtin') <= 0;
 }
+
+function addProcessMeta(commit, isInline, masterProcess, meta){
+	if (isInline) {
+		if (!masterProcess.meta.metas) {
+			Vue.set(masterProcess.meta, 'metas', []);
+		}
+		masterProcess.meta.metas.push(meta);
+	} else {
+		commit('addProcessMeta', meta);
+	}
+}

src/store/modules/project.js

@@ -7,7 +7,7 @@ import { projectApi } from "../../api";
 import path from "path";
 import generateUUID from "uuid/v4";
 import { getCmpProps, flattenViews, getCmpByUUID } from '../../utils/common';
-import { saveAs } from "../../utils";
+import {clonePureObj, saveAs} from "../../utils";
 import { template } from "../../template";
 
 const defaultOptions = {
@@ -25,7 +25,7 @@ const defaultOptions = {
 const OPERATE_MAX_LENGTH = 200; // 撤销重做栈最大值
 
 function getDefaultOptions() {
-	return JSON.parse(JSON.stringify(defaultOptions));
+	return clonePureObj(defaultOptions);
 }
 
 export const projectStore = {

src/themes/light/index.scss

@@ -47,3 +47,12 @@
 	padding: 5px 0 5px 5px;
 }
 
+.el-input-number.is-controls-right .el-input__inner {
+	padding-left: 5px;
+	padding-right: 40px;
+}
+
+.el-input-number--mini .el-input-number__increase, .el-input-number--mini .el-input-number__decrease {
+	width: 16px;
+}
+

src/utils/events.js

-export default ['init', 'awake', 'sleep', 'datacenter', 'click', 'touchstart', 'touchend', 'touchmove']
\ No newline at end of file

src/utils/index.js

@@ -103,3 +103,7 @@ export function metaInUse(process, targetMetaID) {
 	}
 	return result;
 }
+
+export function clonePureObj(obj){
+	return JSON.parse(JSON.stringify(obj));
+}

src/views/Editor.vue

@@ -170,15 +170,15 @@
 								duration: 1000,
 							});
 							this.$confirm(this.$t('Pack project successfully'), this.$t('Alert'), {
-								confirmButtonText: this.$t('Close'),
-								cancelButtonText: this.$t('Open in new tab'),
+								confirmButtonText: this.$t('Open in new tab'),
+								cancelButtonText: this.$t('Close'),
 								type: 'warning'
 							}).then(() => {
-
-							}).catch(() => {
 								setTimeout(()=>{
 									window.open(tplUrl, 'blank');
 								}, 500);
+							}).catch(() => {
+
 							});
 						}catch (e) {
 							this.$message({

src/views/Editor/Inspector.vue

 <template>
 	<pane icon="el-icon-s-operation" :title="$t('panes.Inspector')">
 		<el-tabs v-model="tab" type="border-card" class="inspector-tabs">
-			<el-tab-pane label="Props" name="properties">
+			<el-tab-pane :label="$t('Props')" name="properties">
 				<props-tab/>
 			</el-tab-pane>
-			<el-tab-pane label="Behavior" name="behavior">
+			<el-tab-pane :label="$t('Behavior')" name="behavior">
 				<behavior-tab/>
 			</el-tab-pane>
 		</el-tabs>

src/views/Editor/Inspector/BehaviorTab.vue

@@ -4,13 +4,12 @@
 		<el-form ref="form" size="mini" label-width="60px">
 			<div v-for="(evn, key) in eventsObj" :key="key">
 				<el-form-item :label="$t('Event') + ':'">
-					<div>{{key}}</div>
+					<div>{{events[key]}}</div>
 					<div >
-						<el-tooltip :content="$t('Trigger once')" placement="top">
+						<!--<el-tooltip :content="$t('Trigger once')" placement="top">
 							<el-switch v-model="evn.once" @change="v => handleOnceChange(key, v)"></el-switch>
-						</el-tooltip>
-						<el-button size="mini"  @click="showBehaviorEditor(evn, key)" style="margin-left: 20px;">
-							{{$t('Edit Behavior')}}
+						</el-tooltip>-->
+						<el-button size="mini"  @click="showBehaviorEditor(evn, key)" style="margin-left: 20px;" icon="el-icon-edit">
 							<i v-if="evn.behaviors && evn.behaviors.length" class="el-icon-check el-icon--right"></i>
 						</el-button>
             <el-button icon="el-icon-delete" size="mini" v-if="evn.behaviors && evn.behaviors.length" @click="deleteBehavior(key)">
@@ -27,20 +26,21 @@
 <script>
 import { mapGetters } from 'vuex';
 import _ from 'lodash';
-import events from '../../../utils/events';
 import BehaviorEditorDialog from '../dialogs/BehaviorEditorDialog';
 
 export default {
   name: 'BehaviorTab',
   data() {
     let eventsObj = {};
-    events.forEach(event => {
+    const events = this.$t('events');
+	  Object.keys(events).forEach(event => {
       eventsObj[event] = {
         once: false,
         behaviors: []
       };
     });
     return {
+    	events,
       eventsObj,
       behaviors: [],
       currentEvent: ''

src/views/Editor/behavior-editor/BehaviorEditor.vue

@@ -12,11 +12,11 @@
 			<div class="center full-size background" splitpanes-min="20" :splitpanes-size="70">
 				<edit-path :processStack="processStack" @pop="onPop"/>
 				<div class="operate-bar">
-					<el-button-group>
+					<!--<el-button-group>
 						<el-button size="mini" icon="el-icon-zoom-out" @click="setScale(-0.1)"/>
 						<el-button size="mini" @click="setScale(0)">1:1</el-button>
 						<el-button size="mini" icon="el-icon-zoom-in" @click="setScale(0.1)"/>
-					</el-button-group>
+					</el-button-group>-->
 				</div>
 				<board ref="board" @select-process-node="onSelectProcessNode" @edit-process="editProcess" @edit-meta="onEditMeta"/>
 			</div>

src/views/Editor/behavior-editor/Board.vue

@@ -82,14 +82,16 @@
 		methods: {
 			...mapActions([
 				'addCustomProcessMeta',
-				'addDividerProcessMeta',
+				'addProcessFromPrefab',
 			]),
 			...mapMutations([
 				'deleteProcessMeta',
+				'setScale',
 			]),
 			async edit(process, resolveProcess) {
 				this.boardOffset.x = 0;
 				this.boardOffset.y = 0;
+				this.setScale(0);
 				this.selectedProcessNode = null;
 				this.process = process;
 				this.resolveProcess = resolveProcess;
@@ -114,7 +116,7 @@
 				this.$set(this.subProcessMap, uuid, process);
 			},
 			async addSubProcessData(processId, pos) {
-				let process, processMeta, isInline;
+				let meta, isInline;
 
 				if (customs.includes(processId)) {
 					try {
@@ -124,15 +126,24 @@
 						return;
 					}
 
-					processMeta = await this.addCustomProcessMeta({process: this.process, isInline, processId});
-					processId = processMeta.id;
+					meta = await this.addCustomProcessMeta({masterProcess: this.process, isInline, processId});
+				}else{
+					meta = this.process.resolveMeta(processId);
 				}
 
-				process = this.process.resolveMeta(processId);
+				if(meta.isPrefab){
+					try {
+						const result = await this.$refs.inlineChooseDialog.show();
+						isInline = result.isInline;
+					} catch (e) {
+						return;
+					}
+					meta = await this.addProcessFromPrefab({masterProcess: this.process, isInline, meta})
+				}
 
 				let data = {
 					uuid: generateUUID(),
-					meta: process.id,
+					meta: meta.id,
 					design: {
 						x: pos.x,
 						y: pos.y,
@@ -232,8 +243,8 @@
 			},
 			onMouseMove(e) {
 				const scale = this.scale;
-				let x = e.x - this.drawState.boardOffset.x;
-				let y = e.y - this.drawState.boardOffset.y;
+				let x = e.x - this.drawState.boardOffset.x - this.boardOffset.x;
+				let y = e.y - this.drawState.boardOffset.y - this.boardOffset.y;
 				this.lineDrawing.path = this.drawingLineStart + `${x / scale},${y / scale} ${x / scale},${y / scale}`;
 			},
 			onMouseUp(e) {
@@ -279,7 +290,7 @@
 				this.$emit('edit-meta', meta);
 			},
 			editSubProcess(process) {
-				if (!process.meta.isDivider && (this.editable || process.meta.type !== 'builtin' || process.meta.sub && Object.keys(process.meta.sub).length > 0)) {
+				if (!process.meta.isDivider && this.editable && (process.meta.type !== 'builtin' || process.meta.sub && Object.keys(process.meta.sub).length > 0)) {
 					this.$emit('edit-process', process);
 				}
 			},
@@ -363,6 +374,8 @@
 					return;
 				}
 
+				this.onResize();
+
 				this.boardDragDownPos = null;
 			},
 		}

src/views/Editor/behavior-editor/Board/ProcessNode.vue

@@ -4,7 +4,7 @@
 		     @mouseleave="onMouseLeave" @click="onClick" @dblclick="onDblclick">
 			<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'" @mousedown.stop.prevent @click.stop="onClickEdit"/>
+				<el-link icon="el-icon-edit" :underline="false" v-if="meta.type !== 'builtin' && !meta.isDivider" @mousedown.stop.prevent @click.stop="onClickEdit"/>
 			</div>
 			<div class="header">
 				<i v-if="meta.isInline">i</i>

src/views/Editor/behavior-editor/MetaEditorDialog.vue

@@ -5,13 +5,13 @@
 		<div class="meta-editor-wrapper">
 			<el-form ref="form" v-if="meta" :model="meta" :rules="rules" :show-message="false" class="info-editor" size="mini" label-position="right" label-width="70px" @submit.native.prevent>
 				<template>
-					<el-form-item prop="id" label="ID">
+					<el-form-item prop="id" :label="$t('ID')">
 						<el-input v-model="meta.id" :placeholder="$t('ID')" :readonly="!editable"/>
 					</el-form-item>
-					<el-form-item prop="name" label="Name">
+					<el-form-item prop="name" :label="$t('Name')">
 						<el-input v-model="meta.name" :placeholder="$t('Name')" :readonly="!editable"/>
 					</el-form-item>
-					<el-form-item prop="desc" label="Desc">
+					<el-form-item prop="desc" :label="$t('Desc')">
 						<el-input v-model="meta.desc" :placeholder="$t('Description')" :readonly="!editable"/>
 					</el-form-item>
 					<!--<el-form-item prop="type" label="Type">
@@ -20,7 +20,7 @@
 					<el-form-item prop="group" label="Group">
 						<el-input v-model="meta.group" :placeholder="$t('Group')" :readonly="!editable"/>
 					</el-form-item>-->
-					<el-form-item label="Props">
+					<el-form-item :label="$t('Props')">
 						<el-link :underline="false" @click="onClickEditProps" :disabled="!editable">
 							<template v-if="Object.keys(meta.props).length">
 								<el-tag type="success" size="mini" v-for="(option, key) in meta.props" :key="key">{{key}}</el-tag>
@@ -28,7 +28,7 @@
 							<template v-else>{{$t('Empty')}}</template>
 						</el-link>
 					</el-form-item>
-					<el-form-item label="Output">
+					<el-form-item :label="$t('Output')">
 						<div style="display: flex;flex: 1;">
 							<el-select style="flex: 1;" v-model="meta.output" :disabled="!editable" allow-create filterable multiple
 							           :placeholder="$t('Output')"/>
@@ -48,8 +48,8 @@
 						<el-button size="mini" slot="reference" plain @click="pasteMeta">PasteMeta</el-button>
 					</el-popover>
 				</el-button-group>
-				<el-button size="mini" plain @click="cancel">Cancel</el-button>
-				<el-button size="mini" plain @click="save">Save</el-button>
+				<el-button size="mini" plain @click="cancel">{{$t('Cancel')}}</el-button>
+				<el-button size="mini" plain @click="save">{{$t('Save')}}</el-button>
 			</div>
 		</div>
 		<props-editor-dialog ref="propsEditorDialog"/>
@@ -60,6 +60,7 @@
 	import ElFormItem from "./inputs/form-item";
 	import PropsEditorDialog from "./PropsEditorDialog";
 	import copy from 'copy-to-clipboard'
+	import {clonePureObj} from "../../../utils";
 
 	export default {
 		name: "MetaEditorDialog",
@@ -91,7 +92,7 @@
 		methods: {
 			edit(meta) {
 				this.visible = true;
-				this.meta = JSON.parse(JSON.stringify(meta));
+				this.meta = clonePureObj(meta);
 				this.oldMetaID = this.meta.id;
 			},
 			onClickEditProps() {

src/views/Editor/behavior-editor/PropsEditorDialog.vue

@@ -11,13 +11,13 @@
 						:data="props"
 						style="width: 100%">
 						<el-table-column
-							label="Type"
+							:label="$t('Type')"
 							width="100">
 							<template slot-scope="scope">
 								<el-select v-model="scope.row.option.type" size="mini">
-									<el-option v-for="type in types"
+									<el-option v-for="(str, type) in types"
 									           :key="type"
-									           :label="type"
+									           :label="str"
 									           :value="type"
 									>
 									</el-option>
@@ -25,21 +25,21 @@
 							</template>
 						</el-table-column>
 						<el-table-column
-							label="Key"
-							width="120">
+							:label="$t('Key')"
+							width="200">
 							<template slot-scope="scope">
 								<el-input v-model="scope.row.key" size="mini"/>
 							</template>
 						</el-table-column>
 						<el-table-column
-							label="Alias"
-							width="100">
+							:label="$t('Alias')"
+							width="200">
 							<template slot-scope="scope">
 								<el-input v-model="scope.row.option.alias" size="mini"/>
 							</template>
 						</el-table-column>
 						<el-table-column
-							label="Default">
+							:label="$t('Default')">
 							<template slot-scope="scope">
 								<el-input v-if="scope.row.option.type === 'string' || scope.row.option.type === 'enum'" class="default-value" v-model="scope.row.option.default" size="mini" placeholder="Default"/>
 								<el-input-number v-if="scope.row.option.type === 'number'" controls-position="right" class="default-value" v-model="scope.row.option.default" size="mini" placeholder="Default"/>
@@ -72,14 +72,16 @@
 		</div>
 		<div slot="footer" class="dialog-footer">
 			<div class="button-bar">
-				<el-button size="mini" plain @click="cancel">Cancel</el-button>
-				<el-button size="mini" plain @click="save">Save</el-button>
+				<el-button size="mini" plain @click="cancel">{{$t('Cancel')}}</el-button>
+				<el-button size="mini" plain @click="save">{{$t('Save')}}</el-button>
 			</div>
 		</div>
 	</el-dialog>
 </template>
 
 <script>
+	import {clonePureObj} from "../../../utils";
+
 	export default {
 		name: "PropsEditorDialog",
 		data() {
@@ -88,23 +90,14 @@
 				originProps: null,
 				copiedProps: null,
 				props: [],
-				types: [
-					'boolean',
-					'string',
-					'number',
-					'enum',
-					'color',
-					'asset',
-					'node',
-					'data',
-				],
+				types: this.$t('prosTypes'),
 			}
 		},
 		methods: {
 			edit(props) {
 				this.visible = true;
 				this.originProps = props;
-				this.copiedProps = JSON.parse(JSON.stringify(props));
+				this.copiedProps = clonePureObj(props);
 				this.props.splice(0);
 				for (let key in this.copiedProps) {
 					let option = this.copiedProps[key];

src/views/Editor/behavior-editor/inputs/DataInput.vue

@@ -11,7 +11,7 @@
 				:disabled="!editable"
 			>
 				<el-radio-group v-model="editValue.type" size="mini" @change="onChange" :disabled="!editable">
-					<el-radio-button v-for="(item, key) in dataTypes" :label="key">{{item}}</el-radio-button>
+					<el-radio-button v-for="(item, key) in dataTypes" :label="key" :key="key">{{item}}</el-radio-button>
 				</el-radio-group>
 				<el-input clearable slot="reference" :value="editValue.value" @input="onInput" @change="onChange"
 				          :readonly="!editable"