<!--
 * @Description: 
 * @Author: gcz
 * @Date: 2023-09-12 10:01:28
 * @LastEditors: gcz
 * @LastEditTime: 2023-09-13 11:28:26
 * @FilePath: \gybank_webui\src\views\tool\customerform\fdform\view.vue
 * @Copyright: Copyright (c) 2016~2023 by gcz, All Rights Reserved. 
-->
<template>
    <div >
      <preview ref="preview" :itemList="itemList" :formConf="formConf" v-if="itemList.length > 0"/>
      <div v-else style="text-align: center;margin-top: 10vh;font-size: 20px;color: #333;;"> 请传表单ID查看 </div>
    </div>
  </template>
  
  <script>
  import { saveAndEdit,selectById } from "@/api/customerform/customerformapi";
  import preview from "@/components/formDesigner/preview";
  export default {
    components:{
      preview
    },
    data(){
      return{
        formContent:{},
        itemList:[],
        formConf:{},
      }
    },
    mounted(){
      this.formID = this.$route.query.formID;
      if(this.formID){
        this.handleSelectById();
      }
    },
    methods:{
      handleSelectById(){
        selectById({id:this.formID}).then(res=>{
          // console.log('selectById',res);
          // this.formName = res.data.formName;
          this.formContent = JSON.parse(res.data.formContent);
          // console.log('this.formContent',this.formContent);
          let temp = {};
        temp.list = this.formContent.list;
        temp.config = this.formContent.config;
        temp.formName = res.data.formName;
          this.itemList = this.formContent.list;
        //   console.log('this.itemList',this.itemList);
          this.formConf = this.formContent.config;
        //   console.log('this.formConf',this.formConf);
          let tempString = JSON.stringify(temp)
          this.$nextTick(()=>{
            this.$refs.preview.setData(tempString)
          })
          
        })
      },
    },

  }
  </script>
  
  <style scoped>
  #app{
    position: relative;
  }
  </style>
  