diff --git a/src/api/index.js b/src/api/index.js
index 5280db0..92eed38 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -34,7 +34,7 @@ api.interceptors.request.use(
          */
         if (store.getters['user/isLogin']) {
             request.headers.token = store.state.user.token 
-            // request.headers.token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzUxMiJ9.eyJhcHAiOiJnb3YiLCJjbGllbnQiOiJ3ZWIiLCJleHAiOjE2MzMwNTM0NTYsInVzZXJJZCI6Ijg0ODg3ZDQzMjEzN2EzMGI3YWJhYWM1MDY5ODZkNDYxIiwiaWF0IjoxNjMyNDQ4NjU2fQ.xc2Dz5yPaNLCJsQCZnBYKgTTb88PhBZ1E5g3NaqImhHOwOE4R_OAexct7FdSs6oh3Eqzf4Bw9e7mWHkAoFeroQ'
+            // request.headers.token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzUxMiJ9.eyJhcHAiOiJnb3YiLCJjbGllbnQiOiJ3ZWIiLCJleHAiOjE2NDk0OTQwMzQsInVzZXJJZCI6ImViY2VmN2MxYzYzYTg3YTIyNmU1OWYxZTAxNDlkMzMxIiwiaWF0IjoxNjQ4ODg5MjM0fQ.Zque4dkZDdqhqzUktp3kJ2I3FlH7q2c8ePbMCwqglVuAnfqozxnqRlXIHJF9RDVA1mSayPaZqYEeia5zztciFQ'
             // request.headers.Authorization = store.state.user.token
         }
         signRequest(request)
diff --git a/src/views/form/editor/index.vue b/src/views/form/editor/index.vue
index 2ebdecb..64deea2 100644
--- a/src/views/form/editor/index.vue
+++ b/src/views/form/editor/index.vue
@@ -1,113 +1,128 @@
 <template>
-  <div class="form-edit-container">
-    <div class="left-board">
-      <el-scrollbar class="left-scrollbar">
-        <div class="components-list">
-          <div v-for="(item, listIndex) in leftComponents"
-               :key="listIndex">
-            <div class="components-title">
-              <svg-icon name="component" />
-              {{ item.title }}
-            </div>
-            <draggable :clone="cloneComponent"
-                       :group="{ name: 'componentsGroup', pull: 'clone', put: false }"
-                       :list="item.list"
-                       :sort="false"
-                       class="components-draggable"
-                       draggable=".components-item"
-                       @end="onEnd">
-              <div v-for="(element, index) in item.list"
-                   :key="index"
-                   class="components-item"
-                   @click="addComponent(element)">
-                <div class="components-body">
-                  <svg-icon :name="element.__config__.tagIcon" />
-                  {{ element.__config__.label }}
+    <div class="form-edit-container">
+        <div class="left-board">
+            <el-scrollbar class="left-scrollbar">
+                <div class="components-list">
+                    <div v-for="(item, listIndex) in leftComponents"
+                         :key="listIndex"
+                    >
+                        <div class="components-title">
+                            <svg-icon name="component" />
+                            {{ item.title }}
+                        </div>
+                        <draggable :clone="cloneComponent"
+                                   :group="{ name: 'componentsGroup', pull: 'clone', put: false }"
+                                   :list="item.list"
+                                   :sort="false"
+                                   class="components-draggable"
+                                   draggable=".components-item"
+                                   @end="onEnd"
+                        >
+                            <div v-for="(element, index) in item.list"
+                                 :key="index"
+                                 class="components-item"
+                                 @click="addComponent(element)"
+                            >
+                                <div class="components-body">
+                                    <svg-icon :name="element.__config__.tagIcon" />
+                                    {{ element.__config__.label }}
+                                </div>
+                            </div>
+                        </draggable>
+                    </div>
                 </div>
-              </div>
-            </draggable>
-          </div>
+            </el-scrollbar>
         </div>
-      </el-scrollbar>
-    </div>
-    <div class="center-board">
-      <el-scrollbar class="center-scrollbar">
-        <el-row v-if="formConf"
-                :gutter="formConf.gutter"
-                class="center-board-row">
-          <el-row align="middle"
-                  justify="center"
-                  type="flex">
-            <el-col class="form-head-title">
-              <h4 class="form-name-text"
-                  contenteditable="true"
-                  @blur="(event)=>{
+        <div class="center-board">
+            <el-scrollbar class="center-scrollbar">
+                <el-row v-if="formConf"
+                        :gutter="formConf.gutter"
+                        class="center-board-row"
+                >
+                    <el-row align="middle"
+                            justify="center"
+                            type="flex"
+                    >
+                        <el-col class="form-head-title">
+                            <h4 class="form-name-text"
+                                contenteditable="true"
+                                @blur="(event)=>{
                                     this.formConf.title=event.target.innerText;
-                                    this.saveProjectInfo()}">
-                {{ formConf.title }}
-              </h4>
-            </el-col>
-          </el-row>
-          <el-row align="middle"
-                  justify="center"
-                  type="flex">
-            <el-col class="form-head-desc">
-              <Tinymce v-if="editDescription"
-                       v-model="formConf.description"
-                       placeholder="请输入表单描述"
-                       @blur="editDescription=false"
-                       @input="saveProjectInfo" />
-              <div v-else
-                   class="form-name-text"
-                   @click="editDescription=true"
-                   v-html="formConf.description" />
-              <!--                            <p class="form-name-text" contenteditable="true"-->
-              <!--                               @blur="(event)=>{-->
-              <!--                                   formConf.description=event.target.innerText;-->
-              <!--                                   this.saveProjectInfo()}">-->
-              <!--                                {{ formConf.description }}-->
-              <!--                            </p>-->
-            </el-col>
-          </el-row>
-          <el-divider class="form-head-divider" />
-          <el-form :disabled="formConf.disabled"
-                   :label-position="formConf.labelPosition"
-                   :label-width="formConf.labelWidth + 'px'"
-                   :size="formConf.size">
-            <draggable :animation="340"
-                       :list="drawingList"
-                       class="drawing-board"
-                       group="componentsGroup"
-                       @end="onItemEnd">
-              <draggable-item v-for="(item, index) in drawingList"
-                              :key="item.renderKey"
-                              :active-id="activeId"
-                              :current-item="item"
-                              :drawing-list="drawingList"
-                              :form-conf="formConf"
-                              :index="index"
-                              @activeItem="activeFormItem"
-                              @changeLabel="changeLabel"
-                              @copyItem="drawingItemCopy"
-                              @deleteItem="drawingItemDelete" />
-            </draggable>
-            <div v-show="!drawingList.length"
-                 class="empty-info">
-              <img style="width: 20%"
-                   src="@/assets/images/form-bg.png">
-              <p>从左侧拖入或点选组件进行表单设计</p>
-            </div>
-          </el-form>
-        </el-row>
-      </el-scrollbar>
+                                    this.saveProjectInfo()}"
+                            >
+                                {{ formConf.title }}
+                            </h4>
+                        </el-col>
+                    </el-row>
+                    <el-row align="middle"
+                            justify="center"
+                            type="flex"
+                    >
+                        <el-col class="form-head-desc">
+                            <Tinymce v-if="editDescription"
+                                     v-model="formConf.description"
+                                     placeholder="请输入表单描述"
+                                     @blur="editDescription=false"
+                                     @input="saveProjectInfo"
+                            />
+                            <div v-else
+                                 class="form-name-text"
+                                 @click="editDescription=true"
+                                 v-html="formConf.description"
+                            />
+                            <!--                            <p class="form-name-text" contenteditable="true"-->
+                            <!--                               @blur="(event)=>{-->
+                            <!--                                   formConf.description=event.target.innerText;-->
+                            <!--                                   this.saveProjectInfo()}">-->
+                            <!--                                {{ formConf.description }}-->
+                            <!--                            </p>-->
+                        </el-col>
+                    </el-row>
+                    <el-divider class="form-head-divider" />
+                    <el-form :disabled="formConf.disabled"
+                             :label-position="formConf.labelPosition"
+                             :label-width="formConf.labelWidth + 'px'"
+                             :size="formConf.size"
+                    >
+                        <draggable :animation="340"
+                                   :list="drawingList"
+                                   class="drawing-board"
+                                   group="componentsGroup"
+                                   @end="onItemEnd"
+                        >
+                            <draggable-item v-for="(item, index) in drawingList"
+                                            :key="item.renderKey"
+                                            :active-id="activeId"
+                                            :current-item="item"
+                                            :drawing-list="drawingList"
+                                            :form-conf="formConf"
+                                            :index="index"
+                                            @activeItem="activeFormItem"
+                                            @changeLabel="changeLabel"
+                                            @copyItem="drawingItemCopy"
+                                            @deleteItem="drawingItemDelete"
+                            />
+                        </draggable>
+                        <div v-show="!drawingList.length"
+                             class="empty-info"
+                        >
+                            <img style="width: 20%"
+                                 src="@/assets/images/form-bg.png"
+                            >
+                            <p>从左侧拖入或点选组件进行表单设计</p>
+                        </div>
+                    </el-form>
+                </el-row>
+            </el-scrollbar>
+        </div>
+        <right-panel v-if="activeData"
+                     :active-data="activeData"
+                     :form-conf="formConf"
+                     :show-field="!!drawingList.length"
+                     @tag-change="tagChange"
+                     @data-change="updateProjectItemInfo"
+        />
     </div>
-    <right-panel v-if="activeData"
-                 :active-data="activeData"
-                 :form-conf="formConf"
-                 :show-field="!!drawingList.length"
-                 @tag-change="tagChange"
-                 @data-change="updateProjectItemInfo" />
-  </div>
 </template>
 
 <script>
@@ -116,12 +131,12 @@ import { debounce } from 'throttle-debounce'
 import RightPanel from './RightPanel'
 
 import {
-  assistComponents,
-  formConf,
-  imageComponents,
-  inputComponents,
-  personalInfoComponents,
-  selectComponents
+    assistComponents,
+    formConf,
+    imageComponents,
+    inputComponents,
+    personalInfoComponents,
+    selectComponents
 } from '@/components/generator/config'
 import { deepClone } from '@/utils'
 import { dbDataConvertForItemJson, formItemConvertData } from '@/utils/convert'
@@ -134,292 +149,291 @@ let tempActiveData
 let idGlobal
 
 export default {
-  components: {
-    draggable,
-    RightPanel,
-    DraggableItem
-  },
-  data () {
-    return {
-      idGlobal,
-      formConf: null,
-      editDescription: true,
-      inputComponents,
-      selectComponents,
-      labelWidth: 100,
-      drawingList: drawingDefalut,
-      drawingData: {},
-      activeId: drawingDefalut.length != 0 ? drawingDefalut[0].formId : 0,
-      formData: {},
-      dialogVisible: false,
-      generateConf: null,
-      showFileName: false,
-      activeData: drawingDefalut ? drawingDefalut[0] : null,
-      saveDrawingListDebounce: debounce(340, saveDrawingList),
-      saveIdGlobalDebounce: debounce(340, saveIdGlobal),
-      projectKey: null,
-      leftComponents: [
-        {
-          title: '联系人组件',
-          list: personalInfoComponents
-        },
-        {
-          title: '输入型组件',
-          list: inputComponents
+    components: {
+        draggable,
+        RightPanel,
+        DraggableItem
+    },
+    data() {
+        return {
+            idGlobal,
+            formConf: null,
+            editDescription: true,
+            inputComponents,
+            selectComponents,
+            labelWidth: 100,
+            drawingList: drawingDefalut,
+            drawingData: {},
+            activeId: drawingDefalut.length != 0 ? drawingDefalut[0].formId : 0,
+            formData: {},
+            dialogVisible: false,
+            generateConf: null,
+            showFileName: false,
+            activeData: drawingDefalut ? drawingDefalut[0] : null,
+            saveDrawingListDebounce: debounce(340, saveDrawingList),
+            saveIdGlobalDebounce: debounce(340, saveIdGlobal),
+            projectKey: null,
+            leftComponents: [
+                {
+                    title: '联系人组件',
+                    list: personalInfoComponents
+                },
+                {
+                    title: '输入型组件',
+                    list: inputComponents
+                },
+                {
+                    title: '图片型组件',
+                    list: imageComponents
+                },
+                {
+                    title: '辅助型组件',
+                    list: assistComponents
+                },
+                {
+                    title: '选择型组件',
+                    list: selectComponents
+                }
+            ]
+        }
+    },
+    computed: {},
+    watch: {
+        // eslint-disable-next-line func-names
+        'activeData.__config__.label': function(val, oldVal) {
+            if (
+                this.activeData.placeholder === undefined
+                || !this.activeData.__config__.tag
+                || oldActiveId !== this.activeId
+            ) {
+                return
+            }
+            this.activeData.placeholder = this.activeData.placeholder.replace(oldVal, '') + val
         },
-        {
-          title: '图片型组件',
-          list: imageComponents
+        activeId: {
+            handler(val) {
+                oldActiveId = val
+            },
+            immediate: true
         },
-        {
-          title: '辅助型组件',
-          list: assistComponents
+        drawingList: {
+            handler(val) {
+                this.saveDrawingListDebounce(val, this.projectKey)
+                if (val.length === 0) this.idGlobal = 100
+            },
+            deep: true
         },
-        {
-          title: '选择型组件',
-          list: selectComponents
+        idGlobal: {
+            handler(val) {
+                if (val) {
+                    this.saveIdGlobalDebounce(val, this.projectKey)
+                }
+            },
+            immediate: true
         }
-      ]
-    }
-  },
-  computed: {},
-  watch: {
-    // eslint-disable-next-line func-names
-    'activeData.__config__.label': function (val, oldVal) {
-      if (
-        this.activeData.placeholder === undefined
-        || !this.activeData.__config__.tag
-        || oldActiveId !== this.activeId
-      ) {
-        return
-      }
-      this.activeData.placeholder = this.activeData.placeholder.replace(oldVal, '') + val
-    },
-    activeId: {
-      handler (val) {
-        oldActiveId = val
-      },
-      immediate: true
-    },
-    drawingList: {
-      handler (val) {
-        this.saveDrawingListDebounce(val, this.projectKey)
-        if (val.length === 0) this.idGlobal = 100
-      },
-      deep: true
-    },
-    idGlobal: {
-      handler (val) {
-        if (val) {
-          this.saveIdGlobalDebounce(val, this.projectKey)
-        }
-      },
-      immediate: true
-    }
-  },
-  mounted () {
-
-    // 复制对象 避免修改改变原始对象
-    this.formConf = JSON.parse(JSON.stringify(formConf))
-    // 项目key
-    this.projectKey = this.$route.query.key
-    console.log('编辑')
-    console.log(this.projectKey)
-    // 从服务端获取
-    this.queryProjectItems()
-    // 获取表单配置
-    this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/${this.projectKey}`).then(res => {
-      this.formConf.title = res.data.name
-      this.formConf.description = res.data.describe
-    })
-    // 全局组件Id
-    this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/max-form-id`, { params: { key: this.projectKey } }).then(res => {
-      this.idGlobal = res.data ? res.data : 100
-    })
-  },
-  methods: {
-    saveProjectInfo: debounce(430, true, function () {
-      this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/update`, {
-        'key': this.projectKey,
-        'name': this.formConf.title,
-        'describe': this.formConf.description
-      }).then(() => {
-
-      })
-    }),
-    updateProjectItemInfo (val) {
-      let data = formItemConvertData(val, this.projectKey)
-      this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/update`, data).then(() => {
-
-      })
     },
-    deleteProjectItemInfo (val) {
-      let data = formItemConvertData(val, this.projectKey)
-      this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/delete`, data).then(() => {
+    mounted() {
 
-      })
-    },
-    async saveProjectItemInfo (item) {
-      let isSuccess = false
-      let params = formItemConvertData(item, this.projectKey)
-      console.log(params)
-      let pItem = item
-      await this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/create`, params).then(res => {
-        pItem.sort = res.data.sort
-        isSuccess = true
-      })
-      // 如果是分页组件 刷新所有分页的页码
-      if (item.typeId === 'PAGINATION') {
-        this.updatePaginationList()
-      }
-      return isSuccess
-    },
-    updatePaginationList () {
-      // 页总数
-      const length = this.drawingList.filter(item => item.typeId === 'PAGINATION').length
-      let curr = 1
-      this.drawingList.forEach((item, index) => {
-        if (item.typeId === 'PAGINATION') {
-          item.totalPageNum = length
-          item.currPageNum = curr++
-          this.$set(this.drawingList, index, item)
-        }
-      })
-    },
-    queryProjectItems () {
-      this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/list`, { params: { key: this.projectKey } }).then(res => {
-        this.drawingList = res.data.map(item => dbDataConvertForItemJson(item))
-        // 更新分页
-        this.updatePaginationList()
-      })
-    },
-    activeFormItem (currentItem) {
-      this.activeData = currentItem
-      this.activeId = currentItem.__config__.formId
-    },
-    changeLabel (currentItem, value) {
-      console.log(currentItem)
-      console.log(value)
-    },
-    onEnd (obj) {
-      if (obj.from !== obj.to) {
-        this.activeData = tempActiveData
-        this.activeId = this.idGlobal
-        this.saveProjectItemInfo(tempActiveData).then(() => {
-          this.onItemEnd(obj)
+        // 复制对象 避免修改改变原始对象
+        this.formConf = JSON.parse(JSON.stringify(formConf))
+        // 项目key
+        this.projectKey = this.$route.query.key
+        console.log('编辑')
+        console.log(this.projectKey)
+        // 从服务端获取
+        this.queryProjectItems()
+        // 获取表单配置
+        this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/${this.projectKey}`).then(res => {
+            this.formConf.title = res.data.name
+            this.formConf.description = res.data.describe
         })
-      }
-    },
-    onItemEnd (obj) {
-      let params = { 'projectKey': this.projectKey }
-      if (this.drawingList[obj.newIndex - 1]) {
-        let sort1 = this.drawingList[obj.newIndex - 1].sort
-        params.beforePosition = sort1
-      }
-      if (this.drawingList[obj.newIndex + 1]) {
-        let sort2 = this.drawingList[obj.newIndex + 1].sort
-        params.afterPosition = sort2
-      }
-      params.formItemId = this.drawingList[obj.newIndex].__config__.formId
-      if (params.beforePosition || params.afterPosition) {
-        this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/sort`, params).then(res => {
-          this.drawingList[obj.newIndex].sort = res.data.sort
+        // 全局组件Id
+        this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/max-form-id`, { params: { key: this.projectKey } }).then(res => {
+            this.idGlobal = res.data ? res.data : 100
         })
-      }
-    },
-    addComponent (item) {
-      const clone = this.cloneComponent(item)
-      this.saveProjectItemInfo(clone)
-      this.drawingList.push(clone)
-      this.activeFormItem(clone)
-    },
-    cloneComponent (origin) {
-      const clone = deepClone(origin)
-      const config = clone.__config__
-      config.span = this.formConf.span // 生成代码时，会根据span做精简判断
-      this.createIdAndKey(clone)
-      clone.placeholder !== undefined && (clone.placeholder += config.label)
-      tempActiveData = clone
-      return tempActiveData
-    },
-    createIdAndKey (item) {
-      const config = item.__config__
-      config.formId = ++this.idGlobal
-      config.renderKey = `${config.formId}${+new Date()}` // 改变renderKey后可以实现强制更新组件
-      if (config.layout === 'colFormItem') {
-        item.__vModel__ = `field${this.idGlobal}`
-      } else if (config.layout === 'rowFormItem') {
-        config.componentName = `row${this.idGlobal}`
-        !Array.isArray(config.children) && (config.children = [])
-        delete config.label // rowFormItem无需配置label属性
-      }
-      if (Array.isArray(config.children)) {
-        config.children = config.children.map(childItem => this.createIdAndKey(childItem))
-      }
-      return item
     },
-    empty () {
-      this.$confirm('确定要清空所有组件吗？', '提示', { type: 'warning' })
-        .then(
-          () => {
-            this.drawingList = []
-            this.idGlobal = 100
-          }
-        )
-    },
-    drawingItemCopy (item, list) {
-      let clone = deepClone(item)
-      clone = this.createIdAndKey(clone)
-      list.push(clone)
-      this.activeFormItem(clone)
-      this.saveProjectItemInfo(clone)
-    },
-    drawingItemDelete (index, list) {
-      let item = list[index]
-      list.splice(index, 1)
-      this.$nextTick(() => {
-        const len = this.drawingList.length
-        if (len) {
-          this.activeFormItem(this.drawingList[len - 1])
+    methods: {
+        saveProjectInfo: debounce(430, true, function() {
+            this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/update`, {
+                'key': this.projectKey,
+                'name': this.formConf.title,
+                'describe': this.formConf.description
+            }).then(() => {
+
+            })
+        }),
+        updateProjectItemInfo(val) {
+            let data = formItemConvertData(val, this.projectKey)
+            this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/update`, data).then(() => {
+
+            })
+        },
+        deleteProjectItemInfo(val) {
+            let data = formItemConvertData(val, this.projectKey)
+            this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/delete`, data).then(() => {
+
+            })
+        },
+        async saveProjectItemInfo(item) {
+            let isSuccess = false
+            let params = formItemConvertData(item, this.projectKey)
+            let pItem = item
+            await this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/create`, params).then(res => {
+                pItem.sort = res.data.sort
+                isSuccess = true
+            })
+            // 如果是分页组件 刷新所有分页的页码
+            if (item.typeId === 'PAGINATION') {
+                this.updatePaginationList()
+            }
+            return isSuccess
+        },
+        updatePaginationList() {
+            // 页总数
+            const length = this.drawingList.filter(item => item.typeId === 'PAGINATION').length
+            let curr = 1
+            this.drawingList.forEach((item, index) => {
+                if (item.typeId === 'PAGINATION') {
+                    item.totalPageNum = length
+                    item.currPageNum = curr++
+                    this.$set(this.drawingList, index, item)
+                }
+            })
+        },
+        queryProjectItems() {
+            this.$api.get(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/list`, { params: { key: this.projectKey } }).then(res => {
+                this.drawingList = res.data.map(item => dbDataConvertForItemJson(item))
+                // 更新分页
+                this.updatePaginationList()
+            })
+        },
+        activeFormItem(currentItem) {
+            this.activeData = currentItem
+            this.activeId = currentItem.__config__.formId
+        },
+        changeLabel(currentItem, value) {
+            console.log(currentItem)
+            console.log(value)
+        },
+        onEnd(obj) {
+            if (obj.from !== obj.to) {
+                this.activeData = tempActiveData
+                this.activeId = this.idGlobal
+                this.saveProjectItemInfo(tempActiveData).then(() => {
+                    this.onItemEnd(obj)
+                })
+            }
+        },
+        onItemEnd(obj) {
+            let params = { 'projectKey': this.projectKey }
+            if (this.drawingList[obj.newIndex - 1]) {
+                let sort1 = this.drawingList[obj.newIndex - 1].sort
+                params.beforePosition = sort1
+            }
+            if (this.drawingList[obj.newIndex + 1]) {
+                let sort2 = this.drawingList[obj.newIndex + 1].sort
+                params.afterPosition = sort2
+            }
+            params.formItemId = this.drawingList[obj.newIndex].__config__.formId
+            if (params.beforePosition || params.afterPosition) {
+                this.$api.post(`${process.env.VUE_APP_API_ROOT_TDUCK}/user/project/item/sort`, params).then(res => {
+                    this.drawingList[obj.newIndex].sort = res.data.sort
+                })
+            }
+        },
+        addComponent(item) {
+            const clone = this.cloneComponent(item)
+            this.saveProjectItemInfo(clone)
+            this.drawingList.push(clone)
+            this.activeFormItem(clone)
+        },
+        cloneComponent(origin) {
+            const clone = deepClone(origin)
+            const config = clone.__config__
+            config.span = this.formConf.span // 生成代码时，会根据span做精简判断
+            this.createIdAndKey(clone)
+            clone.placeholder !== undefined && (clone.placeholder)
+            tempActiveData = clone
+            return tempActiveData
+        },
+        createIdAndKey(item) {
+            const config = item.__config__
+            config.formId = ++this.idGlobal
+            config.renderKey = `${config.formId}${+new Date()}` // 改变renderKey后可以实现强制更新组件
+            if (config.layout === 'colFormItem') {
+                item.__vModel__ = `field${this.idGlobal}`
+            } else if (config.layout === 'rowFormItem') {
+                config.componentName = `row${this.idGlobal}`
+                !Array.isArray(config.children) && (config.children = [])
+                delete config.label // rowFormItem无需配置label属性
+            }
+            if (Array.isArray(config.children)) {
+                config.children = config.children.map(childItem => this.createIdAndKey(childItem))
+            }
+            return item
+        },
+        empty() {
+            this.$confirm('确定要清空所有组件吗？', '提示', { type: 'warning' })
+                .then(
+                    () => {
+                        this.drawingList = []
+                        this.idGlobal = 100
+                    }
+                )
+        },
+        drawingItemCopy(item, list) {
+            let clone = deepClone(item)
+            clone = this.createIdAndKey(clone)
+            list.push(clone)
+            this.activeFormItem(clone)
+            this.saveProjectItemInfo(clone)
+        },
+        drawingItemDelete(index, list) {
+            let item = list[index]
+            list.splice(index, 1)
+            this.$nextTick(() => {
+                const len = this.drawingList.length
+                if (len) {
+                    this.activeFormItem(this.drawingList[len - 1])
+                }
+            })
+            this.deleteProjectItemInfo(item)
+        },
+        tagChange(newTag) {
+            newTag = this.cloneComponent(newTag)
+            const config = newTag.__config__
+            newTag.__vModel__ = this.activeData.__vModel__
+            newTag.sort = this.activeData.sort
+            config.formId = this.activeId
+            config.span = this.activeData.__config__.span
+            this.activeData.__config__.tag = config.tag
+            this.activeData.__config__.tagIcon = config.tagIcon
+            this.activeData.__config__.document = config.document
+            this.activeData.typeId = newTag.typeId
+            if (typeof this.activeData.__config__.defaultValue === typeof config.defaultValue) {
+                config.defaultValue = this.activeData.__config__.defaultValue
+            }
+            Object.keys(newTag)
+                .forEach(key => {
+                    if (this.activeData[key] !== undefined) {
+                        newTag[key] = this.activeData[key]
+                    }
+                })
+            this.activeData = newTag
+            this.updateProjectItemInfo(newTag)
+            this.updateDrawingList(newTag, this.drawingList)
+        },
+        updateDrawingList(newTag, list) {
+            const index = list.findIndex(item => item.__config__.formId === this.activeId)
+            if (index > -1) {
+                list.splice(index, 1, newTag)
+            } else {
+                list.forEach(item => {
+                    if (Array.isArray(item.__config__.children)) this.updateDrawingList(newTag, item.__config__.children)
+                })
+            }
         }
-      })
-      this.deleteProjectItemInfo(item)
-    },
-    tagChange (newTag) {
-      newTag = this.cloneComponent(newTag)
-      const config = newTag.__config__
-      newTag.__vModel__ = this.activeData.__vModel__
-      newTag.sort = this.activeData.sort
-      config.formId = this.activeId
-      config.span = this.activeData.__config__.span
-      this.activeData.__config__.tag = config.tag
-      this.activeData.__config__.tagIcon = config.tagIcon
-      this.activeData.__config__.document = config.document
-      this.activeData.typeId = newTag.typeId
-      if (typeof this.activeData.__config__.defaultValue === typeof config.defaultValue) {
-        config.defaultValue = this.activeData.__config__.defaultValue
-      }
-      Object.keys(newTag)
-        .forEach(key => {
-          if (this.activeData[key] !== undefined) {
-            newTag[key] = this.activeData[key]
-          }
-        })
-      this.activeData = newTag
-      this.updateProjectItemInfo(newTag)
-      this.updateDrawingList(newTag, this.drawingList)
-    },
-    updateDrawingList (newTag, list) {
-      const index = list.findIndex(item => item.__config__.formId === this.activeId)
-      if (index > -1) {
-        list.splice(index, 1, newTag)
-      } else {
-        list.forEach(item => {
-          if (Array.isArray(item.__config__.children)) this.updateDrawingList(newTag, item.__config__.children)
-        })
-      }
     }
-  }
 }
 </script>