<style>
  .upload-iframe {
    display: none;
  }
  .upload-btn {
    display: inline-block;
    position: relative;
    overflow: hidden;
    vertical-align: middle;
    top:-5px;
  }
  .upload-btn input[type="file"] {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 100px;
    opacity: 0;
    cursor: pointer;
  }
</style>
<template>
	<section style="margin-top:0px;">
		
  <my-tag :tag-name="tag" v-if="type == 'file'"  :class="class">
    <iframe :id="iframeName" :name="iframeName" @load="loaded" class="upload-iframe"></iframe>
    <form :id="formId" action="/file/upload/excel/{{exceltype}}" method="post" :target="iframeName" style="
      display: inline;" enctype="multipart/form-data">
      <slot>{{label}}</slot>
      <input type="file" name="uploadFile" @change="upload">
    </form>
  </my-tag>
	</section>
</template>

<script>
module.exports = {
  props: {
    label: {
      type: String,
      default: '选择文件'
    },
    class: {
      type: Array,
      default: function () {
        return [];
      },
      coerce: function (val) {
        return ['upload-btn'].concat(val || []);
      }
    },
    tag: {
      type: String,
      default: 'div'
    },
    model: {
      type: String,
      require: true,
      twoWay: true
    },
    type: {
      type: String,
      default: 'img'
    },
    multiple: false,
    exceltype:'hospital'
  },
  data: function () {
    return {
      iframeName: 'uploadVue' + Math.random().toString(32).substr(2),
      formId: 'upload-form-' + Math.random().toString(32).substr(2)
    }
  },
  methods: {
    loaded: function (event) {
      var content = "";
      var pre=event.target.contentWindow.document.body.querySelector('pre') || '';
      if(!pre){
        pre = document.getElementById(this.iframeName).contentWindow;       
        content = pre.document.body.innerText || '';
        if(content==''){
          return ;
        }
      }else{
        if(!pre){
          return ;
        }
        content=pre.innerHTML;        
      }

      try {
        var result = JSON.parse(content);
        if (result.errorCode==0) {
          this.$dispatch('file-change', result.data);
        } else {
          this.MessageBox.alert(result.message); 
        }
      } catch(e) {
        this.MessageBox.alert(e.message); 
      }
    },
    upload: function (event) {
      document.getElementById(this.formId).submit();
    }
  }
};
</script>