Odoo｜Odoo客户端如何延伸至小程序？

概述

采用前后端分离的Odoo底层架构对Uniapp接入到Odoo提供了支持。

Web开发同样可以复用这种接入能力，降低前端定制化开发成本。这是本文将Web纳入一起讨论而不是单独分析的主要原因。

前后端的接口依赖于 Odoo RPC Web Service，掌握其设计接口规范是该方案的核心与难点。

随着对于 Odoo RPC 接口规范的逐步掌握，开发成本会显著降低。

学习成本, 开发成本是本文评估最优方案的主要两个纬度。

odoo架构-三层架构

Odoo Web 客户端对业务应用提供完整的支持，包括登陆会话、导航菜单、数据列表和表单等等。虽然定制化程度受到约束, 但是能很容易创建一致性的用户体验。

UI 定制化不是Odoo核心功能。

Odoo Website相对而言让定制化UI更为灵活,  客户端通过 Controller 与Odoo 业务层对接。

以下章节摘录《Odoo 12 Development Essentials - Fourth Edition》下划线部分文字表明Odoo 具备 完全定制化展现层 的能力 可以和任何平台客户端进行对接.

“ The Odoo server API is very open, and all server functions are available through it. The server API used by the official web client is the same as the one available to any other application. So, other client implementations are possible, and could be built in almost any platform or programming language. Desktop and smartphone applications can be built to provide specific user interfaces, leveraging the Odoo data and logic tiers for business logic and data persistence. ”

ORM

RPCs ( Remote Procedure Call )

客户端(展现层) 通过调用PRCs ORM API进行CRUD操作

* 调研期间，我们在官方开发者文档中并未发现相关的 API 文档

UI相关技术栈

一、Q-Web

除了框架代码, Odoo所有代码都是基于 Module 单位进行包装。这些 Module 可以随时安装卸载，Module 可以是一个 App 也可以是一段业务逻辑，可以是对既有App增加新功能。

简而言之，所有 Odoo 的开发都是从 Module 开始。

• models

  模型描述业务对象与业务逻辑，例如商机、订单、 合作伙伴及供应商

• views

  XML 文件用于定义 UI，Odoo 特有的模版语法。针对一个 Module 一般需要定义 Menu Items,Form Views, List Views, Search Views

• data

  数据文件，例如初始化数据

• controllers

  通过在控制器中定义路由结合 View 模版，可以轻松创建一个自定义页面

• statics

  静态页面资源文件

Cross-pages & Unique

一个Odoo页面由2类元素组成, Cross-pages 是跨页面使用的元素 例如 header footer. Unique是...

Snippets

一小段 HTML 代码

Styles

样式

Pages

Website

内置的 Website Module 让 Odoo 能提供 CMS 功能.

Widget

Odoo 提供的 Web Client 定义化 中 前端组件 化方案.

Mobile app JS

企业版 Web 移动端 JS 库.

Odoo Owl 框架

一、为什么要用 Owl

Odoo 是由 不同 module 组合而成,  因为这种机制导致 UI 可能出现不可预期的行为。

目前的前端框架不能满足 Odoo 的需求, 比如较长时间的响应时间。

更为先进的前端架构, 吸纳了React/Vue的设计思想和核心技术。

二、开销

Odoo 企业版

定制化 UI 架构

从早期开始 Odoo 产品内部逻辑分层，前端层和后端层 即已分开, 并且通过 RPC 风格 接口暴露给 Odoo 客户端.

从我司Odoo实战项目经验来分析, 传统的Odoo Web开发在对原有模块视图的简单拓展（字段的增减、组件的增加、比如按钮）是高效且可插拔的（通过拓展模块的安装和卸载)  但是，涉及到 UI 高度定制化，则效率会受到 Odoo Web Client 规则的约束影响, 学习成本高, 开发效率低。

新模块基础功能（非定制化功能）的开发在按Odoo Web Client规则下是高效的。

通过源码可以找到 RPC - JSON 风格 API 的规范, 基于此我们成功实现了 Uniapp 与 Web 移动端的登陆/登出/指定业务模块的CRUD功能。

下图中虚线内Odoo 与虚线外的自定义客户端通过 Odoo RPC 风格接口进行通信。

前后端分离 后端与前端的约束与依赖关系

• 静态数据

  静态数据, 即是 在 运行时 UI上不会变化的数据, 例如 每个页面的 Title, 导航栏目 等等

  理论上可以通过 Odoo API 获取 其依赖于 Odoo

• 动态数据

  运行时 动态数据 是通过 RPC 接口进行操作, 其依赖于 Odoo 的 RPC 接口规范

• 动作/controller

  如果要实现RPC接口范围外的功能,  Odoo 端需要做定制化开发

Odoo 作为企业级 CRM/ERP 解决方案产品，其内部架构设计是组件化的。同样，如果采用前后端分离方式前端组件可以遵循 Odoo 的设计模式进行组件化封装.

这种方式从根本上改变以页面为单位的开发模式与交付模式 。

小程序端

一、Uniapp

Uniapp 是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到 iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。

在跨平台的过程中，不牺牲平台特色，可优雅的调用平台专有能力。

跨段兼容 / 条件编译

uni-app 已将常用的组件、JS API 封装到框架中，开发者按照 uni-app 规范开发即可保证多平台兼容，大部分业务均可直接满足。

但每个平台有自己的一些特性，因此会存在一些无法跨平台的情况。

• 大量写 if else，会造成代码执行性能低下和管理混乱。

• 编译到不同的工程后二次修改，会让后续升级变的很麻烦。

在 C 语言中，通过#ifdef、#ifndef 的方式，为 windows、mac 等不同 os 编译不同的代码。uni-app参考这个思路，为uni-app提供了条件编译手段，在一个工程里优雅的完成了平台个性化实现。

UI 定制化

推荐开发模式

Uniapp / Web

开发流程如下图所示, 和主流前后端开发模式没有本质区别

Web

传统 Web UI 开发模式 沿用 已经使用的 低代码开发框架进行

截图

基于 销售/报价单 模块完成 Web 定制化开发

• 自研Web

odoo与企业微信融合

参考文献：

OpenERP Technical Architecture

Odoo 12 Development Essentials - Fourth Edition

Odoo 14 - 主题定制

Odoo 14 - 定制化 Web Client

Odoo 14 - Mobile Javascript

Odoo 14 - Views

Odoo 14 - 对外API

Odoo 14 - QWeb模版引擎