<template>
  <fm-making-form ref="formMaker" :preview="true">
    <template slot="action">
      <el-button @click="save">保存</el-button>
    </template>
  </fm-making-form>
</template>

<script>
export default {
    data () {
        return {
            data: {
                "list": [
                    {
                        "type": "split-line",
                        "name": "分隔线",
                        "icon": "grip-horizontal",
                        "options": {
                            "defaultValue": "",
                            "remoteFunc": "func_1547100053000_54412"
                        },
                        "key": "1547100053000_54412",
                        "model": "split-line_1547100053000_54412",
                        "rules": []
                    },
                    {
                        "type": "imgupload",
                        "name": "图片",
                        "icon": "regular/image",
                        "options": {
                            "defaultValue": [],
                            "size": {
                                "width": 100,
                                "height": 100
                            },
                            "width": "",
                            "tokenFunc": "funcGetToken",
                            "token": "",
                            "domain": "http://pfp81ptt6.bkt.clouddn.com/",
                            "disabled": false,
                            "length": 8,
                            "multiple": true,
                            "remoteFunc": "func_1547100055000_50916"
                        },
                        "key": "1547100055000_50916",
                        "model": "imgupload_1547100055000_50916",
                        "rules": []
                    },
                    {
                        "type": "address",
                        "name": "地址",
                        "icon": "map-marked-alt",
                        "options": {
                            "defaultValue": [],
                            "width": "",
                            "clearable": false,
                            "options": [
                                {
                                    "value": "重庆市",
                                    "label": "重庆市",
                                    "children": [
                                        {
                                            "value": "主城区",
                                            "label": "主城区",
                                            "children": [
                                                {
                                                    "value": "渝北区",
                                                    "label": "渝北区"
                                                },
                                                {
                                                    "value": "江北区",
                                                    "label": "江北区"
                                                },
                                                {
                                                    "value": "渝中区",
                                                    "label": "渝中区"
                                                },
                                                {
                                                    "value": "沙坪坝区",
                                                    "label": "沙坪坝区"
                                                }
                                            ]
                                        }
                                    ]
                                }
                            ],
                            "remote": true,
                            "remoteOptions": [],
                            "props": {
                                "value": "value",
                                "label": "label"
                            },
                            "remoteFunc": "func_1547100057000_24186"
                        },
                        "key": "1547100057000_24186",
                        "model": "address_1547100057000_24186",
                        "rules": []
                    },
                    {
                        "type": "phone",
                        "name": "手机",
                        "icon": "mobile-alt",
                        "options": {
                            "defaultValue": 0,
                            "remoteFunc": "func_1547100058000_21876"
                        },
                        "key": "1547100058000_21876",
                        "model": "phone_1547100058000_21876",
                        "rules": []
                    }
                ],
                "config": {
                    "labelWidth": 100,
                    "labelPosition": "top"
                }
            }
        }
    },
    mounted: function () {
        this.$refs.formMaker.setJSON(this.data)
    },
    methods: {
        save () {
            console.log(this.$refs.formMaker.getJSON())
        }
    }
}
</script>
