xinhuaqujiaoyujuPCOA/src/views/system/actform/fawen/iWebOffice.vue

<template>
  <div style="width:100%;height:600px; bottom:20px;">
    <el-button  type="success" value="保存文档到服务器" @click="SaveDocument()">保存文档到服务器</el-button>
    <el-button  type="primary" value="打开本地文档(有窗口)" @click="OnUnLoad(),openlocal()">打开本地文档(有窗口)</el-button>
    <el-button  type="info" value="锁定文档" @click="WebSetProtect(true, '123456')">锁定文档</el-button>
    <el-button  type="warning" value="解锁文档" @click="WebSetProtect(false, '123456')">解锁文档</el-button>
    <el-button  type="danger" value="添加区域保护" @click="WebAreaProtect()">添加区域保护</el-button>
    <el-button   type="info" style="background:#6E30B4;" value="解除区域保护" @click="WebAreaUnProtect()">解除区域保护</el-button>
    <el-button   type="info" style="background:#303133" value="禁止拷贝" @click="WebEnableCopy()">禁止拷贝</el-button>
    <el-button   type="info"  style="background:#19868E"value="允许拷贝" @click="WebEnableCopy()">允许拷贝</el-button>
    <div id="office"></div>
  </div>
</template>
<script>
  import Vue from 'vue/dist/vue.js'
  import webOfficeTpl from '../../../../../static/iweboffice/iWebOffice2015.js';
  import {WebOffice2015} from '../../../../../static/iweboffice/WebOffice.js'
  import {getToken} from "@/utils/auth";

  export default {
    props: {
      fileData: {}
    },
    data() {
      return {
        webOffice: null,
        webOfficeObj: null,
        headers: "Bearer " + getToken(),
        saveResult: '',
      }
    },
    beforeCreate() {

    },
    mounted() {

      this.$nextTick(() => {
        this.initWebOffice();
        this.initWebOfficeObject();
      })
    },
    created() {

    },
    beforeDestroy() {

    },
    methods: {
      openlocal() {
        this.webOfficeObj.WebOpenLocal()
      },
      OnUnLoad() {
        this.webOfficeObj.WebClose();
      },
      initWebOffice() {
        this.webOffice = new Vue({
          template: webOfficeTpl
        }).$mount('#office');
      },
      initWebOfficeObject() {
        this.webOfficeObj = new WebOffice2015();
        this.webOfficeObj.setObj(document.getElementById('WebOffice'));
        try {

          this.webOfficeObj.ServerUrl = "http://localhost/dev-api";
          // this.webOfficeObj.RecordID = "web";  //RecordID:本文档记录编号
          this.webOfficeObj.UserName = this.fileData.user;
          this.webOfficeObj.FileName = this.fileData.filePath;
          this.webOfficeObj.getResultJson = {};
          this.webOfficeObj.SaveServlet = "/content/upload";
          this.webOfficeObj.FileType = "." + this.fileData.filePath.split(".")[this.fileData.filePath.split(".").length - 1]; //FileType:文档类型  .doc  .xls
          this.webOfficeObj.ShowWindow = false; //显示/隐藏进度条
          this.webOfficeObj.EditType = this.fileData.EditType; //设置加载文档类型 0 锁定文档，1无痕迹模式，2带痕迹模式
          this.webOfficeObj.ShowMenu = 1;
          this.webOfficeObj.ShowToolBar = 0;
          this.webOfficeObj.SetCaption(this.webOfficeObj.UserName + "正在编辑文档"); // 设置控件标题栏标题文本信息
          //参数顺序依次为：控件标题栏颜色、自定义菜单开始颜色、自定义工具栏按钮开始颜色、自定义工具栏按钮结束颜色、
          //自定义工具栏按钮边框颜色、自定义工具栏开始颜色、控件标题栏文本颜色（默认值为：0x000000）

          if (!this.webOfficeObj.WebSetSkin(0xdbdbdb,
            0xeaeaea,
            0xeaeaea,
            0xdbdbdb,
            0xdbdbdb,
            0xdbdbdb,
            0x000000)) {
            // alert("插件皮肤发生错误，请新打开!");
            this.msgError("插件皮肤发生错误，请新打开!");

            // this.msgSuccess(this.webOfficeObj.Status);
          }    //设置控件皮肤

          if (this.webOfficeObj.WebOpen()) {
            this.msgSuccess(this.webOfficeObj.Status);

          }
          // if (this.webOfficeObj.WebOpen2(this.webOfficeObj.FileName)) {
          //     alert(webOfficeObj.Status);
          // }
          this.webOfficeObj.AppendMenu("1", "打开本地文件(&L)");
          this.webOfficeObj.AppendMenu("2", "保存本地文件(&S)");
          this.webOfficeObj.AppendMenu("3", "-");
          this.webOfficeObj.AppendMenu("4", "打印预览(&C)");
          this.webOfficeObj.AppendMenu("5", "退出打印预览(&E)");
          this.webOfficeObj.AddCustomMenu();
          this.webOfficeObj.HookEnabled();
          // this.webOfficeObj.CreateFile() // 根据FileType设置的扩展名来创建对应的空白文档
        } catch (e) {
          console.log("catch");
          console.log(e.description);
        }
      },
      closeWindow()
      {
        top.window.opener = top; top.window.open('','_self','');
        top.window.close();
      },



      //设置页面中的状态值
      StatusMsg(mValue) {
        try {
          this.msgSuccess(mValue);
        } catch (e) {
          return false;
        }
      },

      //保存文档
      SaveDocument(d) {
        // this.$emit('func', d)
        if (this.webOfficeObj.WebSave(this.headers)) {    //交互OfficeServer的OPTION="SAVEFILE"
          this.$emit('func', this.webOfficeObj.getResultJson.fileName)
          this.webOfficeObj.FileName = this.webOfficeObj.getResultJson.fileName
          this.webOfficeObj.WebClose();
          // window.close();

        } else {
          this.webOfficeObj.Alert(this.webOfficeObj.Status);
          this.StatusMsg(this.webOfficeObj.Status);
        }
      },
      //锁定/解锁文档
      WebSetProtect(Boolean, PassWord) {
        this.webOfficeObj.WebSetProtect(Boolean, PassWord);
        this.msgSuccess(this.webOfficeObj.Status);
      },

      //允许/禁止拷贝文档
      WebEnableCopy(Boolean) {
        this.webOfficeObj.WebEnableCopy(Boolean);
        this.msgSuccess(this.webOfficeObj.Status);
      },

      //添加区域保护
      WebAreaProtect() {
        //如果非ie浏览器调用HidePlugin隐藏插件避免窗体被遮挡
        this.webOfficeObj.HidePlugin(0);
        var mText = window.prompt("文档里需要先设置保护的书签，示例文档默认添加了KingGrid的书签，请输入书签名称", "KingGrid", "");
        if (mText != null) {
          this.webOfficeObj.WebAreaProtect(mText)
        }
        ;
        this.webOfficeObj.HidePlugin(1);
      },
      //取消区域保护
      WebAreaUnProtect() {
        //如果非ie浏览器调用HidePlugin隐藏插件避免窗体被遮挡
        this.webOfficeObj.HidePlugin(0);
        var mText = window.prompt("需要和保护的书签对应，示例文档默认添加了KingGrid的书签，请输入书签名称", "KingGrid", "");
        //显示HidePlugin隐藏的插件
        if (mText != null) {
          this.webOfficeObj.WebAreaUnprotect(mText)
        }
        ;
        this.webOfficeObj.HidePlugin(1);
      },
      OnCommand(ID, Caption, bCancel) {
        switch (ID) {
          case 1:
            WebOpenLocal();
            break;//打开本地文件
          case 2:
            this.webOfficeObj.WebSaveLocal();
            break;//另存本地文件
          case 4:
            this.webOfficeObj.PrintPreview();
            break;//启用
          case 5:
            this.webOfficeObj.PrintPreviewExit();
            this.webOfficeObj.ShowField();
            break;//启用
          case 17:
            this.webOfficeObj.SaveEnabled(true);
            this.StatusMsg("启用保存");
            break;//启用保存
          case 18:
            this.webOfficeObj.SaveEnabled(false);
            this.StatusMsg("关闭保存");
            break;//关闭保存
          case 19:
            this.webOfficeObj.PrintEnabled(true);
            this.StatusMsg("启用打印");
            break;//启用打印
          case 20:
            this.webOfficeObj.PrintEnabled(false);
            this.StatusMsg("关闭打印");
            break;//关闭打印
          case 301:
            this.webOfficeObj.HandWriting("255", "4");
            this.StatusMsg("手写签批");
            break;//手写签批
          case 302:
            this.webOfficeObj.StopHandWriting();
            this.StatusMsg("停止手写签批");
            break;//停止手写签批
          case 303:
            this.webOfficeObj.TextWriting();
            this.StatusMsg("文字签名");
            break;//文字签名
          case 304:
            this.webOfficeObj.ShapeWriting();
            this.StatusMsg("图形签批");
            break;//图形签批
          case 305:
            this.webOfficeObj.RemoveLastWriting();
            this.StatusMsg("取消上一次签批");
            break;//取消上一次签批
          case 306:
            this.webOfficeObj.ShowWritingUser(false, this.webOfficeObj.UserName);
            this.StatusMsg("显示签批用户");
            break;//显示签批用户
          default:
            ;
            return;
        }
      },
      //服务端Servlet方式打开文档
      LoadServlet() {
        this.webOfficeObj = new WebOffice2015();
        try {
          this.webOfficeObj.ServerUrl = "http://localhost/dev-api/";               // 用来保存文件的Server
          var downloadLink = "profile/doc/web.docx";
          this.webOfficeObj.ShowMenu = 1;
          this.webOfficeObj.ShowToolBar = 0;
          this.SetGraySkin();			//设置控件皮肤
          if (this.webOfficeObj.WebOpen3(downloadLink))  // 文件在服务器上的相对路径 FileName
          {
            this.StatusMsg(this.webOfficeObj.Status);
          }
        } catch (e) {
          this.StatusMsg(e.description);
        }
      },
      //URL地址打开文档
      LoadURL() {

        try {
          this.webOfficeObj.ServerUrl = "http://localhost/dev-api/"; //服务器地址
          this.webOfficeObj.ShowMenu = 1;
          this.webOfficeObj.ShowToolBar = 0;
          this.webOfficeObj.UserName = "xqx";
          this.webOfficeObj.FileName = "web.docx";
          this.webOfficeObj.FileType = ".docx"; //FileType:文档类型  .doc  .xls
          this.webOfficeObj.ShowWindow = true; //显示/隐藏进度条
          this.webOfficeObj.EditType = "1"; //设置加载文档类型 0 锁定文档，1无痕迹模式，2带痕迹模式
          this.webOfficeObj.setObj(document.getElementById('WebOffice'));
          if (!this.webOfficeObj.WebSetSkin(0xdbdbdb, 0xeaeaea, 0xeaeaea, 0xdbdbdb, 0xdbdbdb, 0xdbdbdb, 0x000000)) {
            alert(this.webOfficeObj.Status);
          }    //设置控件皮肤		//设置控件皮肤
          alert("1")
          if (this.webOfficeObj.WebOpen2("/profile/doc/web.docx"))  // 文件在服务器上的相对路径 FileName
          {
            this.StatusMsg(this.webOfficeObj.Status);
          }
        } catch (e) {
          this.StatusMsg(e.description);
        }
      },
      //烟枪灰皮肤
      SetGraySkin() {
        //参数顺序依次为：控件标题栏颜色、自定义菜单开始颜色、自定义工具栏按钮开始颜色、自定义工具栏按钮结束颜色、
        //自定义工具栏按钮边框颜色、自定义工具栏开始颜色、控件标题栏文本颜色（默认值为：0x000000）
        if (!this.webOfficeObj.WebSetSkin(0xdbdbdb, 0xeaeaea, 0xeaeaea, 0xdbdbdb, 0xdbdbdb, 0xdbdbdb, 0x000000))
          this.webOfficeObj.Alert(this.webOfficeObj.Status);
      }

    }
  }
</script>

<style lang="less">

</style>