<template>
  <div>
    <div v-if="record.options.showHtml" v-html="textValue" @click="click"></div>
    <div :style="textStyleDiv" v-else>
      <label :style="textStyleLabel"
             :class="{ 'ant-form-item-required': record.options.showRequiredMark }"
             v-text="textValue" @click="click">
      </label>
    </div>
  </div>
</template>

<script>

  import {postAction} from '../../utils/manage'
  import YchConstant from "../../utils/YchConstant"
  import LocleUtil from "../../utils/LocleUtil";

  export default {
    name: 'TextTag',
    props: {
      value: String | Number,
      textStyleLabel: Object,
      textStyleDiv: Object,
      record: Object,
      canvas: Boolean
    },
    data() {
      return {
        textValue:"",
        url: {
          conversionText: YchConstant.PREFIX_EFORM + '/engine/viewEngine/conversionText',
        },
      }
    },
    created() {
      this.init()

    },
    watch: {
      value: {
        handler() {
          this.init()
        },
        immediate: true
      }
    },
    methods: {
      click(){
        this.$emit("click")
      },
      init(){
        if(!this.canvas){
          let value = this.record.options.defaultValue
          if(this.record.options.dataConfig){
            let param = {
              value:value,
              dataConfig:this.record.options.dataConfig
            }
            postAction(this.url.conversionText,param).then((res) => {
              if (res.success) {
                this.textValue = res.result
              }
            })
          }else{
            this.textValue = value
          }
        } else {
          this.textValue = LocleUtil.getLocale('m.eform.formDesign.label.wen-zi-lai-yuan-yu-shu-ju-zi-duan')
        }
      },

    }
  }
</script>
