odoo list view sequence number backend solution

ODOO列表视图序号后端解决方案
市场上很多是基于前端二次开发的,比如在列表头增加首列做为序号列,由于需要对列表的页面结构进行一些覆盖式的修改,导致不同版本之间的兼容性很差,且同类型模块之间也很容易冲突

上述代码将虚拟序号的功能封装为标准抽象模型,适用于模块按需继承给视图直接使用即可

odoo one2many2many mix field model

ODOO一对多对多混合字段模型
原生的One2many和Many2many已经可以解决大部分模型之间的关系映射,但在一些特殊场景下还是需要混合两者优点形成一个新的关系模型

odoo one2many2many mix field model

如生产制造相关的部件与工序:一个部件是由多个工序所组成,而其工序之间还有调整顺序等要求;一个工序可以在多个部件里的不同位置所引用,也可以在同一个部件里不同顺序多次引用

标准的一对多模型桥接做映射可以自定义明细行顺序、独立参数。缺点是只能一个个添加,无法直接打开被桥接的模型进行操作
标准的多对多模型直接做映射可以批量选择、直接编辑。缺点是不可重复且没有顺序及独立参数,后续基本没有可扩展的灵活性
混合的一对多对多模型则是结合上述两者各自优势进行互补以达到可用性层面的最佳用户体验

odoo integrated excel xls and xlsx file read write library

ODOO集成Excel xls和xlsx文件读写库
开源物以类聚角度LibreOffice Calc的ods格式是整合电子表格的最佳选择,但由于Excel尾大不掉还有着2003及之前xls格式和2007及之后xlsx格式的历史问题

存储:原生Binary字段是最合适的,但不管最终是文件存储还是数据库存储,程序上都是以base64库的encodestring编码和decodestring解码进行出入

前端:SheetJS库可以用来做附件和报表的预览应用及所见即所得数据的快速结构化导出

后端:xlrd+xlwt、XlsxWriter、OpenPyXL三大Python库各有所长又相互制衡反垄断,根据场景自由组合起来可以做各种类型复杂应用。StringIO和BytesIO可用于中转处理过程中的内存临时存储,避免了要生成和清理文件的麻烦

odoo list view table tr hover background color

ODOO列表视图表格行悬停背景色
原生列表的鼠标悬停和点击选择一样,都是没有特别的视觉效果,有些列和数据都非常多的场景,满屏都是数据逐行浏览下来很疲劳

一段简洁的less代码轻松搞定,odoo就像纯净的简装房,其框架结构非常优秀,但不同的应用需要对其各种细节进行个性化精装修才能获得最佳体验:)

odoo search view touch device disable auto focus

ODOO搜索视图触屏设备禁用自动聚焦
标准搜索视图都是配合其他数据视图组合呈现的,其有个特性就是会自动获取焦点到搜索输入框方便用户快速进行数据筛选

如今大部分的移动设备如手机、平板等都是使用软键盘进行触控输入,当系统检测到焦点被可输入元素获取到时会自动弹出占用将近一半屏幕大小的虚拟键盘。如此搜索视图那原本人性化的设计在移动设备下日常使用动不动就被弹出键盘的行为反而变的更不友好

经过源码分析若不覆盖原设计方法冗余重构的情况下还有自动失焦的对冲方案,同时这个效果也是Web浏览器经典的UI线程和JS线程互斥表现演示:

odoo integrated raphaël visualization marketing control view

ODOO集成Raphaël可视化销控视图
Raphaël 是一个用于在网页中绘制矢量图形的 Javascript 库。它使用 SVG W3C 推荐标准和 VML 作为创建图形的基础,你可以通过 JavaScript 操作 DOM 来轻松创建出各种复杂的柱状图、饼图、曲线图等各种图表,还可以绘制任意形状的图形,可以进行图表或图像的裁剪和旋转等复杂操作

虽然 D3.js 已经非常优秀,但多一个选择也不是坏事,何况理论上各种优秀的前端图形库都可以按照 ODOO 视图规范兼容共处一起飞:)

地产销控图

odoo modal dialog window draggable

ODOO模态对话框窗口拖动
年年一个大版本推进,但其前端基础库还是很古老的Bootstrap + jQuery + Underscore组合,11版本虽然对View层进行了激进的重构,也还是基于这个基架之上。同理jQuery UI交互界面库也一脉相承的延续至今,这就可以直接调用其Draggable Widget部件以最小的代价扩展原生模态对话框的拖拽功能:

 

odoo community version toggle left nav menu

ODOO社区版切换左侧导航菜单
社区版的菜单体系是一二三级同时分别展示于顶部和左侧,非常的直观,习惯这点后用企业版的菜单系统是非常难受的。个人认为最好的体验因该是大屏幕设备用社区版菜单,小屏幕终端用企业版菜单,关于这个课题以后在深入探讨,先回归本次主题:

以上通过继承菜单对应的模版在导航区植入一个切换开关按扭的入口

以上LESS代码定义其样式外观与一级菜单和谐保持一致并定位到合适的位置,没错,导航最左也就是第一个菜单前面的空位也就是它了

最后绑定上前端行为代码就可以开关自如的控制左侧导航区,同时还有一个小小的切换动画效果。至此,社区版也可以像企业版那样间接实现整个内容区都可以用来展示视图数据,特别适合那些数据多到需要用水平滚动条来左右拖动配合使用的场景

odoo tree view x2many field display (0 records) issue

ODOO列表视图X对多字段显示(n 条记录)问题
考虑到性能和显示的原因,原生One2many多年来一直以条数内容简单显示于固定表格中,其中最为瑕疵的就是无相关数据时的0条记录,这个Many2many也一脉相承,不知道会不会成为洁癖爱好者们心中的痛:)

今天终于等到一个机会忍无可忍精炼代码一并解决名称显示和零记录问题:

 

odoo integrated d3.js visualization position size state view

ODOO集成D3.js可视化位置尺寸状态视图
10版本开始视图根据multi_record布尔属性分为多记录和单记录两种,前者以列表为代表的大部分视图,后者则是表单为经典的单一视图以及神秘的Diagram视图

虽然原生的视图可以满足大部分需求,但是一些特殊的场景用专业的视图展现可以达到事半功倍的效果,如销控图、拓扑图、树状图等

D3.js是一个非常优秀的前端可视化库,其数据驱动的理念与ODOO完美互补:前者负责美丽娇艳,后者提供关系数据:)

销控图