第一章: 单一渠道 —— 柜面
概述:
柜面采用 ABC5 壳子来做容器,开发环境 运行咱们前端工程TEClient -- npm run dev, 双击aui.exe 打开AB 5.0壳子;
该壳子可以视为普通浏览器,也是F12调取开发者工具;
可以通过输入vue文件路径打开界面,查看效果;
第一节 、了解ABC5
作为柜面客户端,ABC5 贴合柜面 真实场景,可以作为柜面模拟浏览器来调试我们 的 TEClient界面
properties:
此外,还可以做日志脱敏配置:cn.com.agree.commons.logging
①是否对日志进行脱敏/desensitization
②需要脱敏的参数 /params (前面 代表需要脱敏的字段key值,后面代表 脱敏规则)
③每条交易日志最大长度/maxLength
第二节、前端工程了解
前端工程是C端的重中之重了,虽然后面打出来的就是个www包,但是是最奇妙,最硬核的一块重要内容,是整个C端的灵魂所在。
了解这个工程之前,先了解下我司自主研发的开发工具AgreeStudio(AB5.0、ABX交易集成开发环境,以下称为AS),该工具可以开发C(客户端/前台)也可以开发S(服务端/后台),具体内容不一一赘述,直接来吧!
1 术语和缩略词
l Vue: 交易界面展示。
l Java: 交易技术逻辑。
l AFT: Agree Flow Print 流程打印。
l AUF: Agree UI Flow 流程画面。
l CSD: Configuration Service Data 服务数据接口配置文件。
l LFC: Logic Flow Configuration 业务流程配置文件。
l RCD: Render Communication Data 通讯报文数据。
l XM: X Model 数据模型配置文件。
l ADE:lAgree Data Entr Entry 数据字典条目。
l CSP:lConfiguration Service Properties 服务属性描述。
l Flow.bpmn: 业务流程主交易入口。
l Task.bpmn: 交易任务节点流程。
l Rcdx: Render Communication Data X 通讯报文数据。
l Adm: Agree Data Model 新数据模型。
l Adt: Agree Data Type数据类型。
l Node.bpmn:云柜业务流程交易入口。
l Step.bpmn: 云柜业务流程交易步骤。
2 工作台说明
开发平台有菜单栏、工具栏、视图、编辑器及开发相关功能套件组合构成,同时平台还内嵌前端开发需要使用的AUI、SDK等资源,支持交易开发时实施输入提示使用。使用平台中各功能套的相互搭配使用到达可快速完成交易、服务资源文件的开发编辑。
3 导入工程/进行开发
AS 支持新工程快速创建以外还支持对已开发的工程再维护编辑,可通过导入工程将用户已开发的工程导入至平台中。选择菜单栏:工程 -> 导入工程-> 浏览文件夹。
工程结构:
目录及文件说明
l @type: 为TypeScript引用的js写声明文件。
l MEClientTrade: 移动端项目交易模块。
n message: 通讯请求管理目录。
n modules: 交易画面资源文件管理目录。
n print: 打印配置管理目录。
n static:静态资源文件管理目录。
l TEClientFM: 项目框架模块
n activities: 交易画面入口集合。
n modules: 公共框架交易
n static: 框架静态文件
n styles: 框架样式
n app-loader.js : 工程入口
n App.vue: 工程入口
n main.js : 工程入口
l script 脚手架
n build: 编译工具。
n env: 环境变量配置目录。
n utils: 工具文件。
l TEClientTrade: 移动端项目交易模块。
n message: 通讯请求管理目录。
n modules: 交易画面资源文件管理目录。
n print: 打印配置管理目录。
n static:静态资源文件管理目录。
l SSClientTrade: 自助项目交易模块。
n message: 通讯请求管理目录。
n modules: 交易画面资源文件管理目录。
n print: 打印配置管理目录。
n static:静态资源文件管理目录。
l TEProject: 公共模块。
n common: 公共函数管理目录:工具类、实体类、实现类、接口类。
n mixins: 公共混入模板
n components:自定义组件管理目录。
l README.md: 应用开发过程中一些公共的使用方法及注意事项
l styles: 样式配置目录。
l app.vue: 项目主组件,页面入口文件
l tsconfig.json: ts编译解析文件
l package.json: 工程信息定义、模块名、作者、版本、依赖、扩展配置等。对项目以及模块包的描述,里面包含许多元信息
内置组件资源: