<template>
   <div>
       <input autocomplete="off" class="readonlytext" type="text" :value="valueShow" /> 
   </div>
</template>

<script> 
 

 import XEUtils from 'xe-utils'  // 加载xe-utils 
 

export default {
  name: 'MkFormInputShow',
  components: {  
  },
  props: { 
    value: {
      type:  [String,Number,Object]
    },
    params: Object,
  },
  data () {
    return {
      valueShow:''
    }
  },
  methods: {
    
  }, 
  watch: { 
    value(){

      const { params } = this

      console.log(params)
      if(params && params.dataType == "number"){
        this.valueShow = parseFloat(this.value || 0).toFixed(2);
      }
      else if(params && params.dataType == "yesorno"){
        let v = this.value; 
        this.valueShow = v ? "是" :"否";
      }
      else if(params && params.dataType == "object"){
        this.valueShow = this.value && this.value[params.textField] ?  this.value[params.textField] :"";
      }
      else if(params && params.dataType == "date"){
        let v = this.value;
        if(typeof(v) == "number"){
            v = new Date(v * 1000);
        }
        this.valueShow = XEUtils.toDateString(v, 'yyyy-MM-dd')
      }
      else if(params && params.dataType == "datetime"){
        let v = this.value;
        if(typeof(v) == "number"){
            v = new Date(v * 1000);
        }
        this.valueShow = XEUtils.toDateString(v, 'yyyy-MM-dd HH:mm:ss')
      }
      else if(params && params.dataType == "ref"){
        this.valueShow = this.value && this.value[1] ? this.value[1] : "";
      }
      else if(params && params.dataType == "enum"){
        this.valueShow = '';

        params.options.forEach(item=>{
          if(this.value == item.value){
            this.valueShow = item.label;
          }
        })
      }
      
      else{
        this.valueShow = this.value ||"";
      }
   

    }
  }
}
</script>
<style>

.readonlytext{
  width: 100%;
    height: 100%;
    border-radius: 4px;
    outline: 0;
    margin: 0;
    font-size: inherit;
    font-family: inherit;
    line-height: inherit;
    padding: 0 0.6em;
    color: #606266;
    border: 1px solid #dcdfe6;
    background-color: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;

  border:none;
  border-bottom: 1px solid #d3d3d3; 
}
</style>


