# WPS集成代码解读 1)前台页面路径 ``` wps页面总路径: src/view/moudles/eoa/wps (图一) 公文页面总路径: src/view/moudles/eoa/officialdoc(图一) wps配置文件路径: src/components/wps(图二) ``` :-: ![](https://img.kancloud.cn/12/48/12484c547f1390faba6fe27854a86136_558x384.png) 图一 ![](https://img.kancloud.cn/e2/53/e2531c8d55b67660b93a3dafe3e07d36_613x123.png) 图二 2)前台页面WPS路径跳转配置及页面介绍 WPS路径: ``` webFile 页面为WPS主页面 viewFile 页面为WPS浏览在线编辑页面 createFile页面为WPS新建模板页面 ``` 跳转配置: webFile跳转createFile(如需修改请手动更改代码): ``` let routeUrl = this.$router.resolve({ path: '/modules/eoa/wps/createFile' }) ``` ![](https://img.kancloud.cn/e4/ee/e4ee65d4967ff55114d96a25211e2fce_1535x405.png) webFile跳转viewFile(如需修改请手动更改代码): ``` let routeUrl = this.$router.resolve({ path: '/modules/eoa/wps/viewFile' }) ``` ![](https://img.kancloud.cn/c3/7e/c37ebeac8572cc2d702205ff44ed85a1_678x43.png) ![](https://img.kancloud.cn/7e/a0/7ea0b2f7e8d50050daf987e0f7043fbc_919x616.png) 公文起草正文在线编辑 ``` let routeUrl = this.$router.resolve({ path: '/modules/eoa/wps/viewFile' }) ``` ![](https://img.kancloud.cn/8e/73/8e73897a0ba88f55963372c242db3845_1522x572.png) wps依赖引入: main.js引入依赖: ``` import * as WPS from '@/components/wps/util/jwps.es6' Vue.prototype.wps = WPS ``` ![](https://img.kancloud.cn/82/a2/82a2fe4d5d746a2688845df53101e2a4_755x74.png) ``` viewFile引入view.vue: import { fileSuffix } from '@/components/wps/util/common-data' ``` ![](https://img.kancloud.cn/36/84/3684c1680996c4f0e6085109b36e8155_780x331.png)