<template>
  <div v-if="!disabled">
    <a v-show="ofdok && !readOnly" icon="save" :class="$style.ofdbutton" @click="save">保存退出</a>
    <div :id="$style.ofd" :class="{ [$style.readonly]: readOnly }"></div>
  </div>
  <div v-else>
    <a-result status="warning" title="OFD阅读控件没有正确安装，请下载安装"> </a-result
  ></div>
</template>

<script>
import loginService from '@/login/login-service'
import OFD from '../../../lib-external/foxit.ofd.ocx.new.js'
import components from './_import-components/sd-foxit-reader-import'
export default {
  name: 'SdFoxitReader',
  components,
  props: {
    url: {
      type: String,
      default: '',
    },
    readOnly: {
      type: Boolean,
      default: true,
    },
    querystring: {
      type: String,
      default: '',
    },
    groupId: {
      type: String,
      default: '',
    },
    putSealOn: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      disabled: false,
      ocx: undefined,
      ofdok: true,
      foxitobj: {},
    }
  },
  mounted() {
    this.$nextTick(() => {
      var width = document.documentElement.clientWidth
      var height = document.documentElement.clientHeight
      loginService.updateAccessToken().then(() => {
        const foxitobj = OFD.OCX.init(this.$style.ofd, width, height)
        this.foxitobj = foxitobj
        foxitobj.ready(foxitobj._id)
        if (!('ActiveXObject' in window)) {
          foxitobj.jsCallbackFun_InitSetting()
          foxitobj.jsCallbackFun_UpdateInfo()
        }
        foxitobj.openFile(
          this.url + '?access_token=' + encodeURIComponent(loginService.getTokens().access_token),
          this.readOnly
        )
      })
    })
    window.initSetting = this.initSetting
    window.UpdateInfo = this.UpdateInfo
  },
  methods: {
    // 插件调用方法  暂写几个示例，
    // 默认回调函数,在文件打开后调用
    initSetting() {
      this.foxitobj.setCompositeVisible('sign', this.putSealOn)
    },
    // 回调事件：包括翻页、打印、打印设置
    UpdateInfo(strkey, strValue) {
      /* if (strkey === 'GetCurPageIndex') {
        // var curPageIndex=obj.getCurPageIndex();
      } else if (strkey === 'Print') {
        var log = this.foxitobj.getLogFileContent()
      } else if (strkey === 'PrintSetting') {
        alert(strValue)
      } else if (strkey === 'OpenfilePath') {
        // this.foxitobj.showContextMenu(0);
        // this.foxitobj.showToolbar(0);
        // this.foxitobj.setViewPreference("Navigate", '2');
      } else if (strkey === 'SaveFileUp') {
        // 保存文件成功后的回调操作
        // 刷新页面等
      } */
    },
    uploadurl() {
      return `${location.origin}${
        location.pathname
      }api/framework/v1/attachment-extend/attachments-upload/indi?access_token=${encodeURIComponent(
        loginService.getTokens().access_token
      )}&groupId=${encodeURIComponent(this.groupId)}&FileName=${encodeURIComponent(
        this.querystring.match(/<file_name>(.*)<\/file_name>/)[1]
      )}&querystring=${encodeURIComponent(this.querystring)}`
    },
    // 保存使用
    save() {
      if (!this.readOnly) {
        loginService.updateAccessToken().then(() => {
          this.foxitobj.saveFile(this.uploadurl())
          window.close()
        })
      } else {
        window.close()
      }
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
#ofd {
  width: 100%;
  embed {
    height: 99vh;
  }
}
#ofd.readonly {
  height: 100vh;
  overflow: hidden;
  embed {
    position: relative;
    height: calc(100vh + 40px);
  }
}
.ofdbutton {
  display: inline-block;
  width: 100px;
  height: 38px;
  margin-left: 33px;
  line-height: 2.1;
  color: $white;
  text-align: center;
  background: rgb(0, 138, 217);
  &:hover {
    color: $white;
    background: rgb(20, 96, 171);
  }
}

:global(.ant-message) {
  top: 46px;
}
</style>
