欢迎来到村长的小花园!
这里记录着ERP/ES最佳实践之路-
ESAP中级教程|打印记录和打印控制
客户需求
打印功能有特殊的要求，要记录打印次数，打印人，打印时间，第一次打印显示原件，其他打印显示复印件。
实现栗子
以nxt库的【发票识别】模板为例，实现客户的需求。
首先设置一下打印区域
定义两个字段，打印次数，打印人
模板右下角弄个EXCEL工时，当打印次数>0显示
复印件，否则显示原件
建个按钮，执行赋值+回写，并且打印sheet1
设置模板属性，关闭自带打印菜单，使用户只能用我们的自定义按钮打印
最终效果
找个表单打开，只有一个自定义打印按钮，右下显示原件。
点两次打印后，右下角编程复印件，同时也完成了计数。
小结
-
使用自定义按钮代替原有打印按钮。
-
使用报表命令记录次数和人员。
村长：勿忘国耻，最近忙于项目，博客更新不太勤快，但会抽空发一些小技巧
2019-09-18
-
-
ESAP高级教程|登陆抓取web订单(一)
在供应链中，大客户会给上游供应商提供一些web系统，用于接收打印新的订单、入库单等。
通常，供应商需要用客户提供的账号密码登陆这些系统，下载订单，再录入到自己的ERP系统中。
本文介绍一种自动登陆抓取WEB订单的解决方案。
解析客户web系统
先让我们来探索一下这个客户的web订单打印系统。
首先，用chrome浏览器访问客户web系统登陆页面，按
F12打开开发工具。
接下来，输入账号密码登陆，登陆后，查询一下订单，然后逐个查看右侧列表的历史请求。
我们可以发现浏览器首先把账号密码POST到Login.aspx，进行登陆。
然后下载了一大堆静态资源(css/js/png等等)，这些可以跳过不看，最后发现一个api数据请求CRUDhandler.ashx，这个POST请求的请求表单包含一系列参数。
点击
Preview标签，展开返回的json，可以发现原来数据都在这个rows数组里，包含了大量订单信息。
好了，到这里我们大概明白了这个web系统的原理：
先post账号密码到Login.aspx获取cookie，再post供应商号等到CRUDHandler.ashx获取订单信息。注册模拟登陆和数据抓取接口
以NX为例，首先在外部接口中注册一下这个网站及下面的接口。
其中Login.aspx这个登陆接口主要传入账号密码(txtusername,txtpassword)，传出随便填一个文本字段，比如test(实际没传出，但后面提数时必填，所以随便弄一个)
另一个CRUDHandler.ashx数据接口有一堆传入参数，一个不落都设置好。
传出表结构也有一堆字段，这些字段根据实际真实订单一一对应填好备注，便于识别使用。
设置模板提数公式
在订单导入模板中加两个提数，设置
通过API提取第一个叫
q登陆，使用登陆接口，传入绑定字段填入账号密码，返回字段随便找个绑定test，不然不给保存ORZ……
第二个叫
q数据，使用数据接口，传入绑定字段填入浏览器请求中使用的内容，返回的rows表结构填充给本模板明细表。
最后做个
抓订单按钮，执行这两个提数公式。
效果
改进前：我们需要登陆客户的网站，设置查询参数，点击查询按钮查询订单列表，挑选新订单，导出订单，再录入到自己的ERP系统。
改进后：直接登陆自己的ERP系统，一键自动登陆+抓取+存入。
小结
-
使用chrome分析客户web系统的请求过程。
-
使用api提数模拟登陆请求和数据请求。
-
使用按钮执行api提数。
2019-08-15
-
-
ESAP4系列教程|APP自定义列表页面
上一章讲了详情页面的自定义，这一章继续讲列表页面，更简单哦
先看疗效
将原生的列表改成直接显示商品图片的列表，改改css，还可以做淘宝的卡片列表哦。
实现步骤
第一步，制作h5模板
在NX安装目录/web/esap/下建立一个html文件，例如
goods.html，作为商品表的列表页面。goods.html文件代码如下：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"> <title>商品查询</title> <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/1.1.3/weui.min.css"> <script src="https://cdn.jsdelivr.net/npm/vue"></script> <script src="https://cdn.jsdelivr.net/npm/axios@0.12.0/dist/axios.min.js"></script> </head> <body> <div id="app"> <a v-for="item,key in data1" :href="'http://外部IP或域名/#!/myReport/1/133/' + item.RecordID + '/0/null'" class="weui-media-box weui-media-box_appmsg"> <div class="weui-media-box__hd"> <img class="weui-media-box__thumb" :src="'http://esap:9090/p/' + item.图片" alt="图片" /> </div> <div class="weui-media-box__bd"> <p>{{ item.品名 }}</p> <p>{{ item.规格 }}</p> </div> </a> <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_primary">增加</a> <a href="javascript:history.go(-1);" class="weui-btn weui-btn_mini weui-btn_primary">返回</a> </div> <script> let getUrlKey = function(name){ return decodeURIComponent((new RegExp('[?|&]'+name+'='+'([^&;]+?)(&|#|;|$)').exec(location.href)||[,""])[1].replace(/\+/g,'%20'))||null; }; var app = new Vue({ el: '#app', data: { data1: {} }, created: function() { axios.get('http://esap:9090/api2/goods?id='+getUrlKey('id')) // 需要预先在esap/sql/api2下定义goods模板 .then(r => { this.data1=r.data.data[0] }) .catch(e => { console.log(e) }) } }) </script> </body> </html>说明：
-
'http://外部IP或域名/#!/myReport/1/133/' + item.RecordID + '/0/null'是拼接详情页面的url，可以从原生详情页面的url修改，133是模板号 -
'http://esap:9090/p/' + item.图片是拼接商品图片URL，属于esap-api
第二步，定义数据查询api
本案使用esap的数据api，当然，你也可以使用NX自带的api。
在上一篇的esap/sql/api2/xs.get文件追加定义
goods模板如下：{{define "goods"}} select * from 商品表 {{end}}第三步，设置发布APP
在设计器中设置商品表模板属性-外部界面-【列表页面】，URL设为：
esap/xsdd.html?id={RecordID}
完成
通过上述3步，就实现了列表页面自定义，报表详情页面仍然使用原生页面。
回顾一下上一篇的详情页面自定义变化：
再看看列表页面自定义后的变化：
小结
-
使用vue + axios + weui编写h5页面。
-
使用esap-api获取数据，其中图片api为：
http://esap服务器:9090/p/picId -
设置外部界面中的自定义URL。
PS: NX外部界面需正式版特殊授权，试用版无此选项，特此提醒。
2019-08-02
-
-
ESAP4系列教程|APP自定义详情页
搭载esap4.0的ex-app来袭，自定义界面，快速定制你的APP
先看疗效
ex-app大量采用nxapp+自定义UI，本案采用表格展现销售订单明细数据，替换了原生详情页面的流式布局，查询时更简洁，更直观。
实现步骤
第一步，制作h5模板
在NX安装目录/web/目录下建立一个目录，例如
esap，里面建立一个html文件，例如xsdd，作为销售订单的详情页面。
xsdd.html文件代码如下：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"> <title>ESAP订单查询</title> <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/1.1.3/weui.min.css"> <script src="https://cdn.jsdelivr.net/npm/vue"></script> <script src="https://cdn.jsdelivr.net/npm/axios@0.12.0/dist/axios.min.js"></script> </head> <body> <div id="app"> <div class="weui-cells__title">主表</div> <div v-for="item,key in data1" class="weui-cells" style="margin-top:0"> <div class="weui-cell"> <div class="weui-cell__bd"> <p>{{ key }}</p> </div> <div class="weui-cell__ft">{{ item }}</div> </div> </div> <div class="weui-cells__title">明细</div> <table border="1" style="border-collapse: collapse;color: #444;border-color:#c7c7c7" width="100%"> <tr style="background-color:#f0faff"> <th style="padding:6px">品号</th> <th>品名</th> <th>规格</th> <th>数量</th> <th>单位</th> </tr> <tr v-for="item2,key2 in data2"> <td style="padding:6px">{{ item2.品号 }}</td> <td>{{ item2.品名 }}</td> <td>{{ item2.规格 }}</td> <td>{{ item2.数量 }}</td> <td>{{ item2.单位 }}</td> </tr> </table> <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_primary">增加</a> <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_primary">保存</a> <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_primary">返回</a> <a href="javascript:;" class="weui-btn weui-btn_primary">生成Excel格式打印</a> </div> <script> let getUrlKey = function(name){ return decodeURIComponent((new RegExp('[?|&]'+name+'='+'([^&;]+?)(&|#|;|$)').exec(location.href)||[,""])[1].replace(/\+/g,'%20'))||null; }; var app = new Vue({ el: '#app', data: { data1: {}, data2:[] }, created: function() { axios.get('http://esap:9090/api2/xsdd?id='+getUrlKey('id')) // 需要在esap/sql/api2下定义xsdd模板 .then(r => { this.data1=r.data.data[0][0] this.data2=r.data.data[1] }) .catch(e => { console.log(e) }) } }) </script> </body> </html>第二步，定义数据查询api
本案使用esap的数据api，当然，你也可以使用NX自带的api。
在esap/sql/api2/目录下建立xs.get文件
里面定义销售订单详情查询模板
xsdd：{{define "xsdd"}} select 单号,日期,往来,往来号,制单 from 订单表 where recordid={{.id}} select 品号,品名,规格,数量,单位 from 订单D where recordid={{.id}} {{end}}这里有两个语句，都是用URL中的id参数匹配recordid，一个查主表
订单表，一个查明细订单D，选择部分字段用于展示。第三步，设置发布APP
在设计器中设置销售订单模板属性-外部界面-【报表页面】，URL设为：
esap/xsdd.html?id={RecordID}
完成
通过上述3步，就实现了详情页面自定义。
从原生的流式布局：
变为表格布局：
小结
-
使用vue+axios编写h5页面。
-
使用esap-api获取数据。
-
设置外部界面中的自定义URL，同理，列表也可以自定义，例如列表改成卡片式。
PS: NX外部界面需正式版特殊授权，试用版无此选项，特此提醒。
2019-08-01
-
-
ESAP4系列教程|最佳实践之路——章鱼模式
esap4.0的更新通常会伴随发布一个nxt示例库，导入这个库后，稍作修改就可以同时为多个应用进行服务，像一个八爪章鱼一样，这就是ESAP最佳实践经验之一的章鱼模式
注册其他库
登陆admin，在设置-数据库中开启其他应用库，例如：
pws，esapp1等等。
多库提醒
把提醒模板单独导出导入到其他应用，在计划任务中设置相应的提醒，
任务ID第一段设为该库的数据源名。
自定义提醒同理，额外添加后缀。
多库查询
修改查询，数据源填入其他库源名，模板函数后面也可以加入。
这样，查询结果，例如身份证信息就会存入其他数据库，而不是nxt库了。
记得先在其他库建立或导入模板用于承接数据。
多库API
自定义API的sql模板位于esap/sql/api2/，多库时，只要在请求URL上加个db参数即可。
例如：请求
http://esap:9090/api2/action?id=1，会默认用esap库执行。而请求
http://esap:9090/api2/action?id=1&db=pws，就会用pws库执行。小结
-
始终使用nxt库作为主库。
-
通过不同的配置，去操作其他应用库（NX/ES/金蝶/用友等）。
本文示例应用ESAP4.0.8+支持。
2019-07-19
-