<!--公共弹窗信息展示-->
<!--
        <public-log-dialog ref="publicLogDialog"></public-log-dialog>
        import publicLogDialog from '@/components/publicLogDialog/publicLogDialog.vue'
        components: {
          publicLogDialog
        },
        /*
          传入2个参数(text,title)
          text-文本内容 (必传)
          title-标题 (非必传)
        */
        this.$refs.publicLogDialog.publicLogDialogOpen(text,'预览');
-->

<template>
  <el-dialog class="publicLogDialog" :title="publicLogDialogTitle?publicLogDialogTitle:'详情'"
             :visible.sync="publicLogDialogType" v-if="publicLogDialogType" width="840px" height="700"
             append-to-body @close="publicLogDialogOff()">
    <div class="copy-box">
      <el-input
        style="width:800px;"
        type="textarea"
        disabled
        resize="none"
        :autosize="{ minRows: 20, maxRows: 20}"
        placeholder="数据异常"
        v-model="publicLogDialogText">
      </el-input>
      <p class="el-icon-document-copy copy-p clickCopy"
         @click="clickCopy(publicLogDialogText)"></p>
    </div>
  </el-dialog>
</template>

<script>
  import beautify from "js-beautify";
  export default {
    name: 'publicLogDialog',
    data(){
      return{
        publicLogDialogTitle:null,
        publicLogDialogType:false,
        publicLogDialogText:null,
      }
    },
    created(){

    },
    mounted(){

    },
    methods:{
      /*
      * response:内容
      * title:标题
      * */
      publicLogDialogOpen(response,title){
        let reqBody = response//此变量为要转换的代码片段
        reqBody = beautify(reqBody, {
          indent_size: 2,//缩进两个空格
          space_in_empty_paren: true,
        });
        this.$set(this,'publicLogDialogTitle',title?title:'查看');
        this.$set(this,'publicLogDialogText',reqBody);
        this.$set(this,'publicLogDialogType',true);
      },
      publicLogDialogOff(){
        this.$set(this,'publicLogDialogType',false);
        this.$set(this,'publicLogDialogTitle',null);
        this.$set(this,'publicLogDialogText',null);
      },
    },
  }
</script>

<style scoped lang="scss">
  .publicLogDialog{

  }
</style>

<style lang="scss">
  .publicLogDialog{
    .el-textarea.is-disabled .el-textarea__inner{
      cursor: auto;
      color:#666;
    }
    .copy-box{
      margin-bottom:20px;
      position:relative;
      .copy-p{
        position: absolute;
        bottom:20px;
        right:30px;
        color:#999;
        width: 24px;
        height: 24px;
        line-height: 24px;
        text-align: center;
        padding:0;
        font-size:24px;
      }
    }
  }
</style>
