自定义前端页面

获取前端基础项目

平台开发应用使用专有的前端的,可以和\jpaas_sources\jpaas-web主前端分开部署。
从Git服务器获取/jpaas_web/jpaas-common-front.git的代码,项目是基于vue@2.6.12,vue@1.7.5"">ant-design-vue@1.7.5开发。

前端自定义页面开发

用开发工具(比如WebStrom,Idea等)打开你的前端项目,在src/views目录下(想要发布到菜单上的Vue组件,一定要建在这个目录下),再新建一个oa目录,然后目录下新建一个test.vue文件,文件内容如下图:

示例只是简单地显示一行文本,如果调用后台的接口,可以参考src/api目录下的文件。

发布自定义页面到菜单

在应用设计页面,点击“菜单管理”功能,

然后点击“新建”按钮,录入菜单的信息如下图:

“应用”字段默认当前的应用,“名称”字段输入菜单的名称,“标识键”为菜单的关键字(一般为英文数字组合),“菜单类型”默认为“菜单”,“访问方式”默认为“URL访问”,“配置类型”默认为VUE组件,“组件路径”输入刚才创建的前端页面的路径(不包括src/views/前缀),然后选择一个图标,录入“显示顺序”,点击“提交”按钮即可完成。

菜单授权

需要将菜单授权到机构/租户,然后才能进行用户组/角色授权。点击“组织中心”-“机构管理”-“机构类型”,对指定的机构授权你的应用及应用下面的菜单。

如果不是管理员或机构管理员账号登录的话,还需要用户组/角色授权。点击“组织中心”-“组织部门”-“资源授权”,选择指定的用户组或角色,然后勾选右边的菜单项(也可以只勾选第一层,再勾选“级联选择”),点击“保存菜单权限”按钮完成授权。

预览/运行

重启前端代码之后,刷新一下页面即可在顶部的导航栏看到发布后的应用,点击进去后即可看到刚才新建的示例页面了。

文档更新时间: 2021-09-07 14:33   作者:张敏