From e93a2bc605bbad15d572d0bcfee2519795d50478 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=83=96=E8=99=8E?=
 <9575462+tang-and-han-dynasties@user.noreply.gitee.com>
Date: Wed, 17 Jul 2024 17:47:18 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=AE=9E=E7=8E=B0=E6=92=A4=E9=94=80?=
 =?UTF-8?q?=E9=87=8D=E5=81=9A=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/form-design/index.vue              | 173 ++++++++++++++------
 packages/form-design/panel-header/index.vue | 159 ++++++++++--------
 packages/locale/lang/zh_CN.js               |   2 +
 3 files changed, 214 insertions(+), 120 deletions(-)

diff --git a/packages/form-design/index.vue b/packages/form-design/index.vue
index 7a597b3..9237ceb 100644
--- a/packages/form-design/index.vue
+++ b/packages/form-design/index.vue
@@ -1,14 +1,8 @@
 <template>
   <el-container class="form-design">
     <el-header class="header" height="40px">
-      <HeaderPanel
-          :clear="clear"
-          :preview="preview"
-          :imp="imp"
-          :exp="exp"
-          :formTemplate="formTemplate"
-          @importData="importData"
-      >
+      <HeaderPanel :clear="clear" :preview="preview" :imp="imp" :exp="exp" :formTemplate="formTemplate"
+        @importData="importData" @undo="handleUndo" @redo="handleRedo">
         <template slot="controlButton">
           <slot name="controlButton"></slot>
         </template>
@@ -24,24 +18,18 @@
       <el-container class="ng-main-container">
         <el-aside width="260px" class="item-panel">
           <slot name="drag"></slot>
-          <DragPanel
-              :basic-item="basicItem"
-              :decorate-item="decorateItem"
-              :layout-item="layoutItem"
-              :application-item="applicationItem"
-          />
+          <DragPanel :basic-item="basicItem" :decorate-item="decorateItem" :layout-item="layoutItem"
+            :application-item="applicationItem" />
         </el-aside>
         <el-main class="center-panel form-main">
-          <ContainerPanel
-              :formTemplate="formTemplate"
-              @handleSelectItem="handleSelectItem"
-              :selectItem="selectItem"
-              :arrow="arrow"
-          >
+          <ContainerPanel :formTemplate="formTemplate" @handleSelectItem="handleSelectItem" :selectItem="selectItem"
+            :arrow="arrow">
           </ContainerPanel>
         </el-main>
-        <el-aside :width="arrow ? '0px' : '370px'"  class="properties-panel">
-          <a  :class="[arrow ? 'togglelefts ' : 'togglelefts arrowR']" @click="arrow=!arrow" :style="{right: (arrow ?  '0px': '370px')}" :title="arrow ? t('ngform.open_properties_panel') : t('ngform.close_properties_panel')"></a>
+        <el-aside :width="arrow ? '0px' : '370px'" class="properties-panel">
+          <a :class="[arrow ? 'togglelefts ' : 'togglelefts arrowR']" @click="arrow = !arrow"
+            :style="{ right: (arrow ? '0px' : '370px') }"
+            :title="arrow ? t('ngform.open_properties_panel') : t('ngform.close_properties_panel')"></a>
           <PropertiesPanel :selectItem="selectItem">
             <template slot="custom-properties">
               <slot name="custom-properties" :selectItem="selectItem"></slot>
@@ -68,6 +56,69 @@ import { use } from '../locale/index'
 import { getUUID } from '../utils/index'
 import cloneDeep from 'lodash/cloneDeep'
 import LocalMixin from '../locale/mixin.js'
+
+function debounce(func, wait) {
+  let timeout;
+  return function () {
+    const context = this;
+    const args = arguments;
+    clearTimeout(timeout);
+    timeout = setTimeout(() => {
+      func.apply(context, args);
+    }, wait);
+  };
+}
+class Command {
+  constructor(execute, undo) {
+    this.execute = execute;
+    this.undo = undo;
+  }
+}
+class UndoCommand extends Command {
+  constructor(context) {
+    super(
+      () => {
+        if (context.undoStack.length > 1) {
+          let laststate = context.undoStack[context.undoStack.length - 2];
+          context.formTemplate = deepClone(laststate);
+          let redostate = context.undoStack.pop();
+          context.redoStack.push(redostate);
+        } else {
+          alert("撤回栈已空，无法撤回");
+        }
+        setTimeout(() => {
+          context.ischange = false;
+        }, 400);
+      },
+      () => {
+        if (context.redoStack.length > 0) {
+          context.formTemplate = context.redoStack.pop();
+        } else {
+          alert("无法重做");
+        }
+      }
+    );
+  }
+}
+
+
+class RedoCommand extends Command {
+  constructor(context) {
+    super(
+      () => {
+        if (context.redoStack.length > 0) {
+          context.formTemplate = context.redoStack.pop();
+        } else {
+          alert("无法重做");
+        }
+      },
+      () => {
+        // 这里可以实现撤销 redo 的逻辑，但我们暂时不需要
+      }
+    );
+  }
+}
+const deepClone = (obj) => JSON.parse(JSON.stringify(obj));
 export default {
   mixins: [LocalMixin],
   name: 'ng-form-design',
@@ -83,19 +134,24 @@ export default {
       arrow: false,
       i18nkey: getUUID(),
       formTemplate: this.template || {
-              list: [
-              ],
-              config: {
-                labelPosition: 'left',
-                labelWidth: 100,
-                size: 'mini',
-                outputHidden: true, //  是否输出隐藏字段的值 默认打开,所有字段都输出
-                hideRequiredMark: false,
-                syncLabelRequired: false,
-                labelSuffix: '' , // 标签后缀
-                customStyle: ''
-              }
-            },
+        list: [
+        ],
+        config: {
+          labelPosition: 'left',
+          labelWidth: 100,
+          size: 'mini',
+          outputHidden: true, //  是否输出隐藏字段的值 默认打开,所有字段都输出
+          hideRequiredMark: false,
+          syncLabelRequired: false,
+          labelSuffix: '', // 标签后缀
+          customStyle: ''
+        }
+      },
+      undoStack: [],
+      redoStack: [],
+      ischange: false,
+      maxUndoStackSize: 15,
+      maxRedoStackSize: 5,
     }
   },
   props: {
@@ -111,7 +167,7 @@ export default {
             outputHidden: true, //  是否输出隐藏字段的值 默认打开,所有字段都输出
             hideRequiredMark: false,
             syncLabelRequired: false,
-            labelSuffix: '' , // 标签后缀
+            labelSuffix: '', // 标签后缀
             customStyle: ''
           }
         }
@@ -164,7 +220,7 @@ export default {
     }
   },
   computed: {
-    
+
     templateConfig() {
       if (this.formTemplate) return this.formTemplate.config
       return {}
@@ -200,17 +256,25 @@ export default {
       immediate: false
     },
     formTemplate: {
-      handler(newVal) {
+      handler: debounce(function (oldVal, newVal) {
         this.$emit('update:template', newVal)
-      },
+
+        if (!this.ischange) {
+          this.undoStack.push(deepClone(oldVal));
+          if (this.undoStack.length > this.maxUndoStackSize) {
+            this.undoStack.shift();
+          }
+          if (!this.first) this.first = true;
+        }
+      }, 300),
       deep: true,
-      immediate: false
+      immediate: true,
     }
   },
   provide() {
     return {
       customC: this.components,
-      configC: ()=>this.templateConfig,
+      configC: () => this.templateConfig,
       //dictsC: this.dicts,
       httpConfigC: this.httpConfig,
       ngConfig: this.config
@@ -237,6 +301,16 @@ export default {
     }
   },
   methods: {
+    //撤销重做
+    handleUndo() {
+      this.ischange = true;
+      const undoCommand = new UndoCommand(this);
+      undoCommand.execute();
+    },
+    handleRedo() {
+      const redoCommand = new RedoCommand(this);
+      redoCommand.execute();
+    },
     handleSelectItem(record) {
       //console.log(record)
       this.selectItem = record
@@ -274,7 +348,7 @@ export default {
 <style>
 .form-design {
   height: 100%;
-  background: white; 
+  background: white;
   text-align: left;
 }
 
@@ -314,11 +388,8 @@ export default {
   box-shadow: -3px 0 6px rgb(48 65 86 / 35%);
   background: white;
 }
-
 </style>
 <style>
-
-
 .togglelefts {
   width: 14px;
   height: 54px;
@@ -330,9 +401,10 @@ export default {
   top: 45%;
   margin-top: -27px;
   z-index: 1000;
-  border-right:solid 1px #fff;
+  border-right: solid 1px #fff;
   cursor: pointer;
 }
+
 .togglelefts:before {
   content: "";
   position: absolute;
@@ -344,6 +416,7 @@ export default {
   border-bottom: 5px solid transparent;
   border-top: 5px solid transparent;
 }
+
 .togglelefts:after {
   content: "";
   position: absolute;
@@ -359,11 +432,13 @@ export default {
 .togglelefts:hover {
   background: #d9f1ff;
 }
+
 .togglelefts:hover:before {
   border-right: 5px solid #fff;
   border-bottom: 5px solid transparent;
   border-top: 5px solid transparent;
 }
+
 .togglelefts:hover:after {
   border-bottom: 4px solid transparent;
   border-right: 4px solid #d9f1ff;
@@ -383,6 +458,7 @@ export default {
   border-right: none;
   cursor: pointer;
 }
+
 .arrowR:after {
   content: "";
   position: absolute;
@@ -396,6 +472,7 @@ export default {
   border-right: none;
   cursor: pointer;
 }
+
 .arrowR:hover:before {
   border-left: 5px solid #fff;
   border-bottom: 5px solid transparent;
@@ -403,14 +480,14 @@ export default {
   border-top: 5px solid transparent;
   cursor: pointer;
 }
+
 .arrowR:hover:after {
   border-right: none;
   border-bottom: 4px solid transparent;
   border-left: 4px solid #005eaa;
   border-top: 4px solid transparent;
   cursor: pointer;
-}  
-
+}
 </style>
 <!--
 <style lang="scss">
diff --git a/packages/form-design/panel-header/index.vue b/packages/form-design/panel-header/index.vue
index 30f3efa..93691f7 100644
--- a/packages/form-design/panel-header/index.vue
+++ b/packages/form-design/panel-header/index.vue
@@ -1,38 +1,47 @@
 <template>
-<div class="panel-header-index">  
-	<el-row>	
-		<el-col :span="6">
-			<slot name="logo">
-			 	<a href="https://gitee.com/jjxliu306/ng-form-element" target="_black">
-					<img class="logo" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAABTpJREFUWEftVmtsFFUU/u7M7KNTS9tAtSAtiAotQUA0BIjKI1s07i5CutWCAaIJqMFAQvwhGORhICYSMSQCIaYhaDTQBZGyxZQWCD8EDRCw2Ae05VmklLZLS3dndmbuNXe22+6yC2TbHxjjSSaZuXPuOd/57jnnHoLHLOQx+8f/AP4bDDidCzI1aKMqfKVnks2pATPgeNOzDgRrTccM6yvLveuSATEgAAVOTxED9jLgB8Zo1dHy/buScc51BwTA4SrcDUbcFkpGHz5c2pqs84EDcHqOcSOVPu/M/jj/dwNwu92yYljHAkI+JWwCAV4iQD1jrJ4IqAfIOMaw3IyCYCvALjCKMYSQMQzgzxmBkfMArbWLoZqysrJAIpYS5oDDWfSRJLI1uoGhfJNNIjRviCDYJXT9fsNI42uSAGNomkAJAVruMag6s/D1/CwhYBWJfNVPQ36FWfmaRcAtjZINlb7S7feDiAPgcHoOAXAuck0zXC6nKKemwlb1mbnvrsLwxXEVU3JEOJ6VkGHv2777XAjfn9Pw9kiCJTNkU787xNDcxVDVqOv7azQJgK/S53VFg4gB4HB6WKosY/uGZRiaNxnQVaChAriwzzSWan140TRcViHfVpH5XApSBpuE9MrpmwZWVSjmd6XP22uo96XA6dmYnf3U6pJNyyE9ORqoOQA0HgXUTvz0p4aSsyEcWCA/EoS/KQi108CQsTJEqxB37AW7unntbzri85q0mgAKnEVzGNgvm1cWY8KsQuDsLqDpeO/mCy0Gqlso5o+PjSpRUlGNoa0uAHumhLThtjiVbX+E8HONBgLy1hFf6UEye/bCVNGu1Oamk6d3zM8RQETgXkt/yxoN7RTDrID8RHz0EaMrfEHjUju7aSj2fOJwvzMF1Di5ZfGLGGe5Bujhc4qWeyGGT35VoFNgzQwbRmQkNs6Z+rRCQW6GgK9etz/wuMov6tjymwoI4lTicBUuGZQ2aOe+H0vC586f++S7MyHsqdbM1ecHC9jmTknI0MeHgqi/Q81/ReMsWPqyWYVx0thO8eHBIEDYUuJwerZaRLKsfOUkAR1XEjKwpkrBqetGr6H1s+yYlivGGD7WpGPTCbV3bfJwERsd9oQAeJJ6DqpU0dm3HMCxnHRhRsm8xFFxC96/NJTV6WgPUpP+FVNtJhPRwpvR50cVNLWHdebmS3CNiU9a9a5uJunmOxZUt9LjJgM56cL7JfNSUvudeUls7L4Vwt2rCj64JPUw4CpcAkZ2eotlpEd1tiRsJqXqv6ygod3AqmreBHgO9FTB2pk2vDKCd8tYaQswFO9NeI880nFpsRzTrqnB0FYTwIluATvqaLgKIn3g1Vxx2KrpttjM6nHB+3xEeL/nsnBi+HxJz0wT0Yms83+LJsZWAe+SgVYNX9620AY/azb7AFeMdMIF4y14b1Li0uF6vos6vuH1CyA6umiWeJ94bWQ8k13NKrpuqNjTKaG8mfV1wkhk/C5gwOrV022Y+Uy8gUfy/QAFQ2PoaAgg1Bku48W1YvxdENnLb0P+7s6z4N3xFgyWkxsZT13RIBnAC1kC9KABPUihdunQAxTnbTZ8fU43XSW8DaNAmPMAHzbm5EkCr/cJ2X2p4VcYrvopRmUKSLOFAda0UpTVaahs1DEvi2LuEDMOXCcirhkCznYSevpvgzeOh88DfSBiJyKrSGh+liA0dVCjS2UmmshEFNCY0BYIr03MFm/aCMsI6JAvdjCq6szsVklNRBEQiWZCHiwIqWUU9QLoG4yQkQzgNXpSIOxKf2bCfwBgrE2DNwT/bgAAAABJRU5ErkJggg==" >
-					<span class="title">ng-form-element</span>
-				</a>
-			</slot>
-		</el-col>
-		<el-col :span="8" style="min-height: 30px;">
-			<slot name="formName"></slot>
-		</el-col>
-		<el-col :span="10"> 
-			<span class="buttons">
-				<slot name="controlButton"></slot>
-				<el-button v-if="clear" type="text" size="medium" icon="el-icon-delete" @click="handleClear">{{t('ngform.header.clear')}}</el-button>
-			    <el-button v-if="preview" type="text" size="medium" icon="el-icon-view" @click="handlePreview">{{t('ngform.header.preview')}}</el-button>
-			  	<!--   <el-button v-if="reder"  type="text" size="medium" icon="el-icon-view" @click="handleRender">渲染</el-button> -->
-			    <el-button v-if="imp" type="text" size="medium" icon="el-icon-download" @click="handleImport">{{t('ngform.header.imp')}}</el-button>
-			    <el-button v-if="exp" type="text" size="medium" icon="el-icon-upload2" @click="handleExport">{{t('ngform.header.exp')}}</el-button>
-			</span> 
-		</el-col> 
-	</el-row>	 
+	<div class="panel-header-index">
+		<el-row>
+			<el-col :span="6">
+				<slot name="logo">
+					<a href="https://gitee.com/jjxliu306/ng-form-element" target="_black">
+						<img class="logo"
+							src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAABTpJREFUWEftVmtsFFUU/u7M7KNTS9tAtSAtiAotQUA0BIjKI1s07i5CutWCAaIJqMFAQvwhGORhICYSMSQCIaYhaDTQBZGyxZQWCD8EDRCw2Ae05VmklLZLS3dndmbuNXe22+6yC2TbHxjjSSaZuXPuOd/57jnnHoLHLOQx+8f/AP4bDDidCzI1aKMqfKVnks2pATPgeNOzDgRrTccM6yvLveuSATEgAAVOTxED9jLgB8Zo1dHy/buScc51BwTA4SrcDUbcFkpGHz5c2pqs84EDcHqOcSOVPu/M/jj/dwNwu92yYljHAkI+JWwCAV4iQD1jrJ4IqAfIOMaw3IyCYCvALjCKMYSQMQzgzxmBkfMArbWLoZqysrJAIpYS5oDDWfSRJLI1uoGhfJNNIjRviCDYJXT9fsNI42uSAGNomkAJAVruMag6s/D1/CwhYBWJfNVPQ36FWfmaRcAtjZINlb7S7feDiAPgcHoOAXAuck0zXC6nKKemwlb1mbnvrsLwxXEVU3JEOJ6VkGHv2777XAjfn9Pw9kiCJTNkU787xNDcxVDVqOv7azQJgK/S53VFg4gB4HB6WKosY/uGZRiaNxnQVaChAriwzzSWan140TRcViHfVpH5XApSBpuE9MrpmwZWVSjmd6XP22uo96XA6dmYnf3U6pJNyyE9ORqoOQA0HgXUTvz0p4aSsyEcWCA/EoS/KQi108CQsTJEqxB37AW7unntbzri85q0mgAKnEVzGNgvm1cWY8KsQuDsLqDpeO/mCy0Gqlso5o+PjSpRUlGNoa0uAHumhLThtjiVbX+E8HONBgLy1hFf6UEye/bCVNGu1Oamk6d3zM8RQETgXkt/yxoN7RTDrID8RHz0EaMrfEHjUju7aSj2fOJwvzMF1Di5ZfGLGGe5Bujhc4qWeyGGT35VoFNgzQwbRmQkNs6Z+rRCQW6GgK9etz/wuMov6tjymwoI4lTicBUuGZQ2aOe+H0vC586f++S7MyHsqdbM1ecHC9jmTknI0MeHgqi/Q81/ReMsWPqyWYVx0thO8eHBIEDYUuJwerZaRLKsfOUkAR1XEjKwpkrBqetGr6H1s+yYlivGGD7WpGPTCbV3bfJwERsd9oQAeJJ6DqpU0dm3HMCxnHRhRsm8xFFxC96/NJTV6WgPUpP+FVNtJhPRwpvR50cVNLWHdebmS3CNiU9a9a5uJunmOxZUt9LjJgM56cL7JfNSUvudeUls7L4Vwt2rCj64JPUw4CpcAkZ2eotlpEd1tiRsJqXqv6ygod3AqmreBHgO9FTB2pk2vDKCd8tYaQswFO9NeI880nFpsRzTrqnB0FYTwIluATvqaLgKIn3g1Vxx2KrpttjM6nHB+3xEeL/nsnBi+HxJz0wT0Yms83+LJsZWAe+SgVYNX9620AY/azb7AFeMdMIF4y14b1Li0uF6vos6vuH1CyA6umiWeJ94bWQ8k13NKrpuqNjTKaG8mfV1wkhk/C5gwOrV022Y+Uy8gUfy/QAFQ2PoaAgg1Bku48W1YvxdENnLb0P+7s6z4N3xFgyWkxsZT13RIBnAC1kC9KABPUihdunQAxTnbTZ8fU43XSW8DaNAmPMAHzbm5EkCr/cJ2X2p4VcYrvopRmUKSLOFAda0UpTVaahs1DEvi2LuEDMOXCcirhkCznYSevpvgzeOh88DfSBiJyKrSGh+liA0dVCjS2UmmshEFNCY0BYIr03MFm/aCMsI6JAvdjCq6szsVklNRBEQiWZCHiwIqWUU9QLoG4yQkQzgNXpSIOxKf2bCfwBgrE2DNwT/bgAAAABJRU5ErkJggg==">
+						<span class="title">ng-form-element</span>
+					</a>
+				</slot>
+			</el-col>
+			<el-col :span="8" style="min-height: 30px;">
+				<el-button v-if="clear" type="text" size="medium" icon="el-icon-back" @click="handleUndo">{{
+				t('ngform.header.undo') }}</el-button>
+				<el-button v-if="clear" type="text" size="medium" icon="el-icon-right" @click="handleRedo">{{
+				t('ngform.header.redo') }}</el-button>
+				<slot name="formName"></slot>
+			</el-col>
+			<el-col :span="10">
+				<span class="buttons">
+					<slot name="controlButton"></slot>
+					<el-button v-if="clear" type="text" size="medium" icon="el-icon-delete"
+						@click="handleClear">{{ t('ngform.header.clear') }}</el-button>
+					<el-button v-if="preview" type="text" size="medium" icon="el-icon-view"
+						@click="handlePreview">{{ t('ngform.header.preview') }}</el-button>
+					<!--   <el-button v-if="reder"  type="text" size="medium" icon="el-icon-view" @click="handleRender">渲染</el-button> -->
+					<el-button v-if="imp" type="text" size="medium" icon="el-icon-download"
+						@click="handleImport">{{ t('ngform.header.imp') }}</el-button>
+					<el-button v-if="exp" type="text" size="medium" icon="el-icon-upload2"
+						@click="handleExport">{{ t('ngform.header.exp') }}</el-button>
+				</span>
+			</el-col>
+		</el-row>
 
-  <Preview v-if="previewVisible" ref="preview" />
-  <Code v-if="codeVisible" ref="code" @imp="importData" />
-</div>
+		<Preview v-if="previewVisible" ref="preview" />
+		<Code v-if="codeVisible" ref="code" @imp="importData" />
+	</div>
 </template>
 <script>
 import Preview from './preview.vue'
 import Code from './code.vue'
 import LocalMixin from '../../locale/mixin.js'
-export default{
+export default {
 	mixins: [LocalMixin],
 	components: {
 		Preview,
@@ -49,57 +58,63 @@ export default{
 			type: Object
 		},
 		// 按钮显示隐藏 
-	  clear: {
-	    type: Boolean ,
-	    default: true
-	  },
-	  preview: {
-	    type: Boolean ,
-	    default: true
-	  },
-	  reder: {
-	    type: Boolean ,
-	    default: true
-	  },
-	  imp: {
-	    type: Boolean ,
-	    default: true
-	  },
-	  exp: {
-	    type: Boolean ,
-	    default: true
-	  }
+		clear: {
+			type: Boolean,
+			default: true
+		},
+		preview: {
+			type: Boolean,
+			default: true
+		},
+		reder: {
+			type: Boolean,
+			default: true
+		},
+		imp: {
+			type: Boolean,
+			default: true
+		},
+		exp: {
+			type: Boolean,
+			default: true
+		}
 	},
 	methods: {
 		handleClear() {
-			this.$confirm( this.t('ngform.header.clear_prompt'),   this.t('ngform.header.prompt'), {
-          		confirmButtonText:  this.t('ngform.confirm') ,
-          		cancelButtonText:  this.t('ngform.cancel') ,
-          		type: 'warning'
-      		}).then(() => {
-        		this.$set(this.formTemplate , 'list' , [])
-      		})
-			
+			this.$confirm(this.t('ngform.header.clear_prompt'), this.t('ngform.header.prompt'), {
+				confirmButtonText: this.t('ngform.confirm'),
+				cancelButtonText: this.t('ngform.cancel'),
+				type: 'warning'
+			}).then(() => {
+				this.$set(this.formTemplate, 'list', [])
+			})
+
+		},
+		handleUndo() {
+			this.$emit('undo');
+		},
+		handleRedo() {
+			this.$emit('redo');
 		},
 		handlePreview() {
-			this.previewVisible = true 
-			this.$nextTick(()=> {
+			this.previewVisible = true
+			this.$nextTick(() => {
 				this.$refs.preview.init(this.formTemplate)
 			})
 		},
 		handleImport() {
-			this.codeVisible = true 
-			this.$nextTick(()=> {
-				this.$refs.code.init(this.formTemplate , true)
+			this.codeVisible = true
+			this.$nextTick(() => {
+				this.$refs.code.init(this.formTemplate, true)
 			})
 		},
 		// 外部导入
 		importData(codes) {
-			this.$emit('importData' , codes)
+			this.$emit('importData', codes)
 		},
 		handleExport() {
-			this.codeVisible = true 
-			this.$nextTick(()=> {
+			this.codeVisible = true
+			this.$nextTick(() => {
 				this.$refs.code.init(this.formTemplate)
 			})
 		}
@@ -108,23 +123,23 @@ export default{
 </script>
 <style>
 .panel-header-index {
-  height: 100%;
+	height: 100%;
 }
 
-.panel-header-index .logo, .panel-header-index .title {
-  float: left;
+.panel-header-index .logo,
+.panel-header-index .title {
+	float: left;
 }
 
 .panel-header-index .title {
-  line-height: 40px;
-  height: 40px;
-  padding-left: 20px;
+	line-height: 40px;
+	height: 40px;
+	padding-left: 20px;
 }
 
 .panel-header-index .buttons {
-  float: right;
+	float: right;
 }
-
 </style>
 <!-- 
 <style lang="scss">
diff --git a/packages/locale/lang/zh_CN.js b/packages/locale/lang/zh_CN.js
index 318b8f3..7318a8e 100644
--- a/packages/locale/lang/zh_CN.js
+++ b/packages/locale/lang/zh_CN.js
@@ -14,6 +14,8 @@ export default {
       clear_prompt: '是否要清空当前面板?',
       content_not_empty: '内容不能为空',
       content_parse_error: '内容解析异常，请检查文本内容',
+      undo: '撤销',
+      redo: '重做',
     },
     close: '关闭',
     confirm: '确定',
-- 
Gitee