# 基于vue+vant技术的移动办公APP **Repository Path**: cgb-lowcode/yuncheng-mobile-app ## Basic Information - **Project Name**: 基于vue+vant技术的移动办公APP - **Description**: 云程移动办公APP是一款轻量化的低代码移动办公软件，基于vue.js+vant技术开发，支持移动端vue表单动态生成，支持流程提交、会签、加签、退回、转发、跳转等常用流程操作。可以在线设计流程和表单，生成移动端应用，无需手写代码，可自动生成移动端界面，满足企业日常办公需求，如：出差申请、请假申请等流程审批类应用，极大提升了移动应用开发效率，满足业务随需而变需求。 - **Primary Language**: JavaScript - **License**: MIT - **Default Branch**: master - **Homepage**: http://www.yunchengxc.com - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 27 - **Created**: 2024-09-06 - **Last Updated**: 2024-09-06 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 云程低代码移动办公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")