<template>
  <div> </div>
</template>

<script>
import loginService from '@/login/login-service'
import axios from '@/common/services/axios-instance'
import WebOfficeSDK from '@external/web-office-sdk'
import crossWindowWatcher from '@/common/services/cross-window-watcher'
import components from './_import-components/sd-wps-editor-import'

export default {
  name: 'SdWpsEditor',
  metaInfo() {
    return {
      title: decodeURIComponent(location.hash.split('&filename=')[1]),
    }
  },
  components,
  props: {
    code: {
      type: String,
      default: '',
    },
    editable: {
      type: Boolean,
      default: true,
    },
    mode: {
      type: String,
      default: 'VIEW',
    },
    activeStepId: {
      type: Number,
      default: 0,
    },
    url: {
      type: String,
      default: '',
    },
    fileStatus: {
      type: Number,
      default: -1,
    },
  },
  data() {
    return {
      isNewWindow: false,
    }
  },
  created() {
    this.isNewWindow = this.$route.path === '/sd-wps-editor'
  },
  mounted() {
    // 新窗口打开时添加onunload事件
    if (this.isNewWindow) {
      window.addEventListener('unload', () => {
        crossWindowWatcher.notifyChange(true)
      })
    }
    let p
    if (this.url) {
      p = Promise.resolve(this.url)
    } else {
      // mode:EDIT/VIEW 和 editable有一个不为编辑就不能编辑
      // mode前端控制，editable是用后端返回的值
      var m = this.fileStatus > 1 ? 'VIEW' : 'EDIT'
      const { openAuthType, openAuthParameter } = this.$route.query
      p = axios
        .get(
          `api/framework/v1/wps-doc-middle-end/edit-url/${this.code}?editable=${
            this.editable
          }&mode=${m}&activeStepId=${this.activeStepId}&environment=${
            this.sdPlatform.isXC ? 'xc' : 'x86'
          }&openAuthType=${openAuthType}&openAuthParameter=${openAuthParameter}`
        )
        .then((res) => res.data.url)
    }
    p.then((url) => {
      // 以下具体说明请见wps提供的在线开发手册，https://wwo.wps.cn/docs/front-end/introduction/
      loginService.updateAccessToken().then((token) => {
        const timeout = 2 * 60 * 1000
        const jssdk = WebOfficeSDK.config({
          url,
          refreshToken() {
            return loginService.updateAccessToken().then((token) => {
              return { token, timeout }
            })
          },
          mount: this.isNewWindow ? null : this.$el,
        })
        jssdk.setToken({
          token,
          timeout,
        })
        jssdk.ready().then(() => {
          // 定制工具栏
          const app = jssdk.Application

          // 将当前文档的编辑状态切换成修订模式
          app.ActiveDocument.TrackRevisions = this.fileStatus === 0
          // 右边菜单-历史版本入口按钮
          app.CommandBars('HeaderHistoryMenuBtn').Visible = false
          // 顶部状态栏-历史记录菜单-历史版本
          app.CommandBars('HistoryVersion').Visible = false
          // 顶部状态栏-历史记录菜单-协作记录
          app.CommandBars('HistoryRecord').Visible = false
          // 顶部状态栏-历史记录菜单-历史版本-预览版本-下载
          app.CommandBars('PreviewDownload').Visible = false
          // 头部-分享按钮
          app.CommandBars('ShareLink').Visible = false
          // 右键-召唤在线协助者
          app.CommandBars('ContextMenuConvene').Visible = false
          // 文字-右边菜单-历史记录-查看最新改动
          app.CommandBars('RightMenuHistory').Visible = false
          // 头部-更多菜单
          app.CommandBars('MoreMenus').Visible = false

          // 审核-Tab
          app.CommandBars('TabReviewWord').Visible = false
        })
      })
    })
  },
  methods: {},
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
#wps {
  * {
    padding: 0;
    margin: 0;
  }

  width: 100%;
  height: 100%;
}
</style>
