From 8e9d798762d25c3c9715738afdc48d90740795e7 Mon Sep 17 00:00:00 2001
From: wangqing <250543222@qq.com>
Date: Thu, 19 Nov 2020 23:20:22 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E5=96=84=E8=A1=A8=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/project.js                 |   0
 src/components/generator/config.js | 228 ++++++++++++++---------------
 src/utils/formDataConvert.js       |  14 +-
 src/views/form/RightPanel.vue      |   2 +-
 src/views/form/index.vue           |  25 ++--
 5 files changed, 140 insertions(+), 129 deletions(-)
 create mode 100644 src/api/project.js

diff --git a/src/api/project.js b/src/api/project.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/generator/config.js b/src/components/generator/config.js
index 055dd0d..88e7c07 100644
--- a/src/components/generator/config.js
+++ b/src/components/generator/config.js
@@ -529,117 +529,117 @@ export const selectComponents = [
     }
 ]
 
-// 布局型组件 【左面板】
-export const layoutComponents = [
-    {
-        __config__: {
-            layout: 'rowFormItem',
-            tagIcon: 'row',
-            label: '行容器',
-            layoutTree: true,
-            document: 'https://element.eleme.cn/#/zh-CN/component/layout#row-attributes'
-        },
-        type: 'default',
-        justify: 'start',
-        align: 'top'
-    },
-    {
-        __config__: {
-            label: '按钮',
-            showLabel: true,
-            changeTag: true,
-            labelWidth: null,
-            tag: 'el-button',
-            tagIcon: 'button',
-            span: 24,
-            layout: 'colFormItem',
-            document: 'https://element.eleme.cn/#/zh-CN/component/button'
-        },
-        __slot__: {
-            default: '主要按钮'
-        },
-        type: 'primary',
-        icon: 'el-icon-search',
-        round: false,
-        size: 'medium',
-        plain: false,
-        circle: false,
-        disabled: false
-    },
-    {
-        __config__: {
-            layout: 'colFormItem',
-            tagIcon: 'table',
-            tag: 'el-table',
-            document: 'https://element.eleme.cn/#/zh-CN/component/table',
-            span: 24,
-            formId: 101,
-            renderKey: 1595761764203,
-            componentName: 'row101',
-            showLabel: true,
-            changeTag: true,
-            labelWidth: null,
-            label: '表格[开发中]',
-            children: [{
-                __config__: {
-                    layout: 'raw',
-                    tag: 'el-table-column',
-                    renderKey: 15957617660153
-                },
-                prop: 'date',
-                label: '日期'
-            }, {
-                __config__: {
-                    layout: 'raw',
-                    tag: 'el-table-column',
-                    renderKey: 15957617660152
-                },
-                prop: 'address',
-                label: '地址'
-            }, {
-                __config__: {
-                    layout: 'raw',
-                    tag: 'el-table-column',
-                    renderKey: 15957617660151
-                },
-                prop: 'name',
-                label: '名称'
-            }, {
-                __config__: {
-                    layout: 'raw',
-                    tag: 'el-table-column',
-                    renderKey: 1595774496335,
-                    children: [
-                        {
-                            __config__: {
-                                label: '按钮',
-                                tag: 'el-button',
-                                tagIcon: 'button',
-                                layout: 'raw',
-                                renderKey: 1595779809901
-                            },
-                            __slot__: {
-                                default: '主要按钮'
-                            },
-                            type: 'primary',
-                            icon: 'el-icon-search',
-                            round: false,
-                            size: 'medium'
-                        }
-                    ]
-                },
-                label: '操作'
-            }]
-        },
-        data: [{
-            date: '2016-05-02',
-            name: '王小虎',
-            address: '上海市普陀区金沙江路 1518 弄'
-        }],
-        border: true,
-        type: 'default',
-        justify: 'start',
-        align: 'top'
-    }
-]
-
+// // 布局型组件 【左面板】
+// export const layoutComponents = [
+//     {
+//         __config__: {
+//             layout: 'rowFormItem',
+//             tagIcon: 'row',
+//             label: '行容器',
+//             layoutTree: true,
+//             document: 'https://element.eleme.cn/#/zh-CN/component/layout#row-attributes'
+//         },
+//         type: 'default',
+//         justify: 'start',
+//         align: 'top'
+//     },
+//     {
+//         __config__: {
+//             label: '按钮',
+//             showLabel: true,
+//             changeTag: true,
+//             labelWidth: null,
+//             tag: 'el-button',
+//             tagIcon: 'button',
+//             span: 24,
+//             layout: 'colFormItem',
+//             document: 'https://element.eleme.cn/#/zh-CN/component/button'
+//         },
+//         __slot__: {
+//             default: '主要按钮'
+//         },
+//         type: 'primary',
+//         icon: 'el-icon-search',
+//         round: false,
+//         size: 'medium',
+//         plain: false,
+//         circle: false,
+//         disabled: false
+//     },
+//     {
+//         __config__: {
+//             layout: 'colFormItem',
+//             tagIcon: 'table',
+//             tag: 'el-table',
+//             document: 'https://element.eleme.cn/#/zh-CN/component/table',
+//             span: 24,
+//             formId: 101,
+//             renderKey: 1595761764203,
+//             componentName: 'row101',
+//             showLabel: true,
+//             changeTag: true,
+//             labelWidth: null,
+//             label: '表格[开发中]',
+//             children: [{
+//                 __config__: {
+//                     layout: 'raw',
+//                     tag: 'el-table-column',
+//                     renderKey: 15957617660153
+//                 },
+//                 prop: 'date',
+//                 label: '日期'
+//             }, {
+//                 __config__: {
+//                     layout: 'raw',
+//                     tag: 'el-table-column',
+//                     renderKey: 15957617660152
+//                 },
+//                 prop: 'address',
+//                 label: '地址'
+//             }, {
+//                 __config__: {
+//                     layout: 'raw',
+//                     tag: 'el-table-column',
+//                     renderKey: 15957617660151
+//                 },
+//                 prop: 'name',
+//                 label: '名称'
+//             }, {
+//                 __config__: {
+//                     layout: 'raw',
+//                     tag: 'el-table-column',
+//                     renderKey: 1595774496335,
+//                     children: [
+//                         {
+//                             __config__: {
+//                                 label: '按钮',
+//                                 tag: 'el-button',
+//                                 tagIcon: 'button',
+//                                 layout: 'raw',
+//                                 renderKey: 1595779809901
+//                             },
+//                             __slot__: {
+//                                 default: '主要按钮'
+//                             },
+//                             type: 'primary',
+//                             icon: 'el-icon-search',
+//                             round: false,
+//                             size: 'medium'
+//                         }
+//                     ]
+//                 },
+//                 label: '操作'
+//             }]
+//         },
+//         data: [{
+//             date: '2016-05-02',
+//             name: '王小虎',
+//             address: '上海市普陀区金沙江路 1518 弄'
+//         }],
+//         border: true,
+//         type: 'default',
+//         justify: 'start',
+//         align: 'top'
+//     }
+// ]
+//
diff --git a/src/utils/formDataConvert.js b/src/utils/formDataConvert.js
index e556b87..7ecfac9 100644
--- a/src/utils/formDataConvert.js
+++ b/src/utils/formDataConvert.js
@@ -5,8 +5,10 @@ import _ from 'lodash'
  * @param item
  */
 export function formItemConvertData(item) {
+    console.log(item)
     let data = {
         'type': item.typeId,
+        'formItemId': item.__config__.formId,
         'label': item.__config__.label,
         'defaultValue': item.defaultValue,
         'required': item.__config__.required,
@@ -15,11 +17,13 @@ export function formItemConvertData(item) {
     }
     let extend = {}
     let param = dataParams[item.typeId]
-    Object.keys(param).forEach(key => {
-        let value = _.get(item, param[key])
-        _.set(extend, key, value)
-    })
-    _.set(data, 'extend', extend)
+    if (param) {
+        Object.keys(param).forEach(key => {
+            let value = _.get(item, param[key])
+            _.set(extend, key, value)
+        })
+        _.set(data, 'extend', extend)
+    }
     console.log(data)
 }
 
diff --git a/src/views/form/RightPanel.vue b/src/views/form/RightPanel.vue
index dfd896f..98f48f9 100644
--- a/src/views/form/RightPanel.vue
+++ b/src/views/form/RightPanel.vue
@@ -647,7 +647,7 @@ import TreeNodeDialog from '@/views/form/TreeNodeDialog'
 import { isNumberStr } from '@/utils/index'
 import IconsDialog from './IconsDialog'
 import {
-  inputComponents, selectComponents, layoutComponents
+  inputComponents, selectComponents
 } from '@/components/generator/config'
 import { saveFormConf } from '@/utils/db'
 
diff --git a/src/views/form/index.vue b/src/views/form/index.vue
index ab0df82..54043d1 100644
--- a/src/views/form/index.vue
+++ b/src/views/form/index.vue
@@ -76,13 +76,14 @@
                     <el-row type="flex" justify="center" align="middle">
                         <el-col :span="20" style="text-align: center">
                             <h4 class="form-name-text" contenteditable="true"
-                                @input="(event)=>{formConf.title=event.target.innerText}">{{formConf.title}}</h4>
+                                @input="(event)=>{formConf.title=event.target.innerText;this.saveProjectInfo()}">
+                                {{formConf.title}}</h4>
                         </el-col>
                     </el-row>
                     <el-row type="flex" justify="center" align="middle">
                         <el-col :span="20" style="text-align: center">
                             <p class="form-name-text" contenteditable="true"
-                               @input="(event)=>{formConf.description=event.target.innerText}">
+                               @input="(event)=>{formConf.description=event.target.innerText;this.saveProjectInfo()}">
                                 {{formConf.description}}
                             </p>
                         </el-col>
@@ -158,7 +159,7 @@ import RightPanel from './RightPanel'
 // import '@/assets/styles/index.scss'
 
 import {
-    inputComponents, selectComponents, layoutComponents, formConf
+    inputComponents, selectComponents, formConf
 } from '@/components/generator/config'
 import {
     exportDefault, beautifierConf, isNumberStr, titleCase, deepClone
@@ -204,7 +205,6 @@ export default {
             formConf,
             inputComponents,
             selectComponents,
-            layoutComponents,
             labelWidth: 100,
             drawingList: drawingDefalut,
             drawingData: {},
@@ -227,10 +227,6 @@ export default {
                 {
                     title: '选择型组件',
                     list: selectComponents
-                },
-                {
-                    title: '布局型组件',
-                    list: layoutComponents
                 }
             ]
         }
@@ -310,6 +306,15 @@ export default {
 
     },
     methods: {
+        saveProjectInfo: debounce(430, true, function() {
+            this.$api.post('/project/update', {
+                'key': this.projectKey,
+                'name': this.formConf.title,
+                'describe': this.formConf.description
+            }).then((res) => {
+
+            })
+        }),
         activeFormItem(currentItem) {
             this.activeData = currentItem
             this.activeId = currentItem.__config__.formId
@@ -319,6 +324,7 @@ export default {
             console.log(value)
         },
         onEnd(obj) {
+            console.log(11)
             if (obj.from !== obj.to) {
                 this.activeData = tempActiveData
                 this.activeId = this.idGlobal
@@ -328,7 +334,6 @@ export default {
             const clone = this.cloneComponent(item)
             this.drawingList.push(clone)
             this.activeFormItem(clone)
-            formItemConvertData(clone)
         },
         cloneComponent(origin) {
             const clone = deepClone(origin)
@@ -337,6 +342,7 @@ export default {
             this.createIdAndKey(clone)
             clone.placeholder !== undefined && (clone.placeholder += config.label)
             tempActiveData = clone
+            formItemConvertData(clone)
             return tempActiveData
         },
         createIdAndKey(item) {
@@ -431,6 +437,7 @@ export default {
             this.operationType = 'copy'
         },
         tagChange(newTag) {
+            console.log('tagChange')
             newTag = this.cloneComponent(newTag)
             const config = newTag.__config__
             newTag.__vModel__ = this.activeData.__vModel__