<template>
  <div class="patent-instruction height_100" @mouseup="mouseup">
    <el-container>
      <el-header>
        <el-tabs v-model="name" @tab-click="handleClick">
          <el-tab-pane v-for="item in tabs" :key="item.label" :label="item.label" :name="item.name"></el-tab-pane>
        </el-tabs>
      </el-header>
      <el-main>
        <div v-html="getViewDom(patent.publicFullText, '说明书文本' + tabItem.label, tabItem.field)" :style="setStyle()"
          :data-type="'说明书文本' + tabItem.label"></div>
      </el-main>
    </el-container>
  </div>
</template>

<script>
import { patentDetails } from './mixins';
export default {
  mixins: [patentDetails],
  data() {
    return {
      height: null,
      fullHeight: document.documentElement.clientHeight,
      tabs: [
        {
          label: '原文',
          name: '0',
          field: 'manual'
        },
        {
          label: '译文',
          name: '1',
          field: 'manualOut'
        },
      ],
      tabItem: {
        label: '原文',
        name: '0',
        field: 'manual'
      },
    }
  },
  watch: {
    // fullHeight() {
    //   this.refresh()
    // },
    patentNo() {
      if (this.outside) {
        this.getData()
      }
    }
  },
  created() {
    window.addEventListener('resize', this.handleResize)
  },
  mounted() {
    this.handleResize()
    if (this.outside) {
      this.getData()
    }
  },
  methods: {
    handleClick() {
      this.tabItem = this.tabs.find(item => {
        return item.name == this.name
      })
    },
    getData() {
      var params = {
        patentCell: 2,
        patentNo: this.patent.publicNo,
        appNo: this.patent.rowApplicationNo,
      }
      this.$api.getCnFullText(params).then(response => {
        if (response.code == 200) {
          this.$set(this.patent, 'publicFullText', response.data)
        }
      })
    },
    handleResize(event) {
      this.fullHeight = document.documentElement.clientHeight
      this.height = this.fullHeight - 300
    },
  }
}
</script>

<style lang="scss">
.patent-instruction {
  margin-bottom: 20px;

  .common {
    overflow-y: auto;
    white-space: pre-line;
    font-size: 14px;
    margin-top: 0;
    padding-right: 5px;
    word-break: break-all;
  }
}
</style>