README.md · 小航/基于vue+vant技术的移动办公APP

# 云程低代码移动办公APP

#### 一、总体介绍

云程低代码移动办公APP是一款轻量化的低代码移动办公软件，基于vue.js+vant组件开发，支持移动端vue表单动态生成，支持流程提交、会签、加签、退回、转发、跳转等常用流程操作。可以在线设计流程和表单，生成移动端应用，无需手写代码，可自动生成移动端界面，满足企业日常办公需求，如：出差申请、请假申请等流程审批类应用，极大提升了移动应用开发效率，满足业务随需而变需求。

#### 二、在线体验

1.  官方网站：http://www.yunchengxc.com/
2.  扫码体验：http://www.yunchengxc.com/mobileexperience

#### 三、技术栈

1. 开发框架：vue 2.6.11
2. UI组件：Vant 2.2.0
3. 开发工具：webstorm 或者 IDEA

#### 四、下载运行

1. 拉取项目代码
git clone https://gitee.com/hibpm/yuncheng-mobile-app.git

2. 安装yarn
npm install -g yarn

3. 下载依赖
yarn install

4. 启动
yarn run serve

#### 五、使用说明

1.移动APP登录
点击“云程”APP，第一次使用将打开“登录页面”，输入用户名和密码登录即可，以后可以直接点击进入，无需输入密码。

![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183220_33836361_9319106.png "登录页.png")

2.我的工作台
工作台是移动APP的首页，希望可以显示用户最常用的内容。可以在工作台展示“常用应用”、“常用流程”、“工作提醒”、“待处理事项”。 这样，在进入APP首页，就可以查看每天需要关注的事项和日程提醒了，不用再进入每个应用去查找了。

![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183325_3a7147da_9319106.png "我的工作台.png")

3.常用应用配置
工作台是移动APP的首页，默认显示系统出厂初始化设置的应用和流程，如果不满足用户需要，允许用户自由配置工作台展示的内容，以下为自定义工作台中显示哪些应用。

![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183312_7837fcf2_9319106.png "应用配置.png")

4.流程中心
点击移动APP中间按钮+号图标，可以打开流程中心页面，用户可以看到权限允许范围内的流程，流程按照业务分类进行了分组展示，点击流程名称即可发起流程，高效有序地完成流程的审批及流转。

![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183334_b868777e_9319106.png "流程中心.png")

5.流程发起
打开“流程中心”页面，点击某一流程名称，打开该流程表单发起页面，用于快捷新增表单数据，移动端底部默认有“保存草稿”和“立即提交”按钮。
 
![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183355_f1ed2991_9319106.png "表单填写.png")

6.我的待办
进入我的工作台页面，下拉页面，查看待处理事项。
 
![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183410_9581ef88_9319106.png "我的待办事项.png")

7.流程审批
从我的工作台页面，点击待办事项，打开流程审批页面，移动端底部有“立即提交”、“驳回”、“更多操作”按钮。
 
![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183423_21a14b92_9319106.png "待办审批.png")

8.填写意见
在流程审批页面，点击移动端底部“立即提交”或“驳回”按钮，弹出“填写意见框”，输入流程审批意见，并选择下一步处理人，即可完成流程提交。

![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183435_7d1feb8d_9319106.png "流程审批填写意见.png")

选择流程处理人
 
![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183454_b320ad46_9319106.png "流程选人.png")

9.高级流程操作
在流程审批页面，除了“立即提交”或“驳回”等常用流程操作，还支持流程跳转、加签、退回、撤销、转办、传阅等特殊流程操作功能。
 
![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183510_dd5eb560_9319106.png "更多流程操作.png")

10.数据列表
从我的工作台页面，点击顶部常用应用，打开该业务应用的列表页面，可以查看“未启动”、“我发起”、“我参与”的业务流程数据，也可以点击右下方的+号图标，发起流程。
 
![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183531_ae478727_9319106.png "模块数据查询列表.png")

11.表单详情
进入应用的数据列表页面，点击某一条业务数据，打开该条数据表单详细页面，可以查看业务数据和流程审批信息。
 
![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183548_26736094_9319106.png "待办审批.png")

12.个人中心
个人中心内容包含我的考勤、本月报销、高级设置、功能索引、更新公告、问题反馈、在线帮助、退出登录等功能。

![输入图片说明](https://images.gitee.com/uploads/images/2021/0621/183556_824ea4e8_9319106.png "个人中心.png")

小航/基于vue+vant技术的移动办公APP

简介

发行版

贡献者

近期动态

小航/基于vue+vant技术的移动办公APP .gitee-modal { width: 500px !important; }

简介

发行版

贡献者

近期动态

搜索帮助

小航/基于vue+vant技术的移动办公APP