# JS插件高级操作
前面我们展示了JS插件的基本操作,通过封装可以使复杂的逻辑更加简单,这里我们演示下怎么使开发更容易。
# 数据库增删查改操作
数据库操作是开发管理类应用系统最常见的操作,下面我们演示下如何添加一个数据库操作的逻辑。
- 复制示例目录 server/plugins/js 下面的 util.js到我们的项目中,这个文件封装了一些工具类和函数,方便我们开发。
- 修改util.js中我们需要连接的数据库,示例是连接到mycon1,这里改成实际配置的值。
function getDB() {
if ( gdb == null) {
gdb = new satrda.DataBase();
//参数分别为key,sn,code,替换为自己的值
gdb.open("mycon1","","");
}
return gdb;
}
- 项目中增加testdb.js文件,输入如下代码:
(function() {
let app = {
//除了定义的函数外,/js/db 开头的所有请求都会进入该处
_all(ctx,r,w) {
let data = {msg:"操作成功",code:200};
w.write(data);
},
// 输入什么返回什么 url:js/db/test
test(ctx,r,w) {
let data = r.jsonBody;
w.write(data);
},
//查询数据库返回所有查询结果 url:js/db/queryAll
queryAll(ctx,r,w) {
let sql = 'select top 100 id,name,price from test1'
let user = getDBResult(sql);
let data = user.data;
w.write(data);
},
//查询数据库返回指定页数的查询结果 url:js/db/queryPage
queryPage(ctx,r,w) {
let sql = 'select top 100 id,name,price from test1'
let pageIndex= 0; //第1页
let pageSize = 3; //每页3条
let data = getDBResult(sql,pageIndex,pageSize);
w.write(data);
},
//插入结果集
edit(ctx,r,w) {
let {id,name} = r.jsonBody;
let sql = `update test1 set name = '${name}' where id = ${id}`;
let db = getDB();
try{
db.execute(sql);
w.write({code:200,msg:'操作成功'});
}catch(e){
w.write({code:500,msg:'失败' + e});
}
}
}
//将app对象加入到路由中,不同的以/js/db开头的请求会进入到app中的同名方法
satrda.Router.all("/js/db",app);
//插件收到http请求时,会首先调用到此方法
satrda.satrda_service = function(url,ctx,r,w) {
//路由处理请求
satrda.Router.serveHttp(url,ctx,r,w)
}
})();
- index.html中加入 testdb.js
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<script src="js/satrda.min.js"></script>
<script src="js/test.js"></script>
<script src="js/util.js"></script>
<script src="js/testdb.js"></script>
<script>
var debug = satrda.debug;
debug.start("127.0.0.1:5555","js");
</script>
</body>
</html>
- 验证结果。 浏览器中输入:
- http://127.0.0.1:5555/js/db/queryAll (opens new window)
- http://127.0.0.1:5555/js/db/queryPage (opens new window)
提示: 其它有参数的post请求,请使用 postman 或者其它 Http工具 进行验证。
# DataWindow
使用PowerBuilder用户,一定有感于数据窗口操作数据的强大。SatRDA也提供了数据窗口类,实现了数据窗口主要函数,写代码和使用原生的数据窗口一样。下面演示使用过程
- 复制示例目录 server/plugins/js 下面的 dw.bundle.js 到我们的项目中
- 项目中增加testdb.js文件,输入如下代码:
(function() {
const d_test1 = {
units:0,
processing:1,
table:{
retrieve:'select id,name,price,dt from test1 order by id',
update:'test1',
updatewhere:2,
updatekeyinplace:true,
columns:[
{name:'id',dbname:'id',type:'long',key:true,update:true},
{name:'name',dbname:'name',type:"string",update:true},
{name:'price',dbname:'price',type:'number',update:true},
{name:'dt',dbname:'dt',type:'datetime',update:true}
],
}
};
let dw = {
//除了定义的函数外,/js 开头的所有请求都会进入该处
_all(ctx,r,w) {
let data = {msg:"操作成功",code:200};
w.write(data);
},
retrieve(ctx,r,w) {
let sqlca = getDB();
let ds = new DataStore();
ds.setTransObject(sqlca);
ds.dataObject = d_test1;
ds.retrieve();
w.write({"data":ds.data});
},
update(ctx,r,w) {
let {id,name} = r.jsonBody;
let sqlca = getDB();
let ds = new DataStore();
ds.setTransObject(sqlca);
ds.dataObject = d_test1;
ds.retrieve();
ds.setFilter(`id = ${id}`);
ds.filter();
if ( ds.rowCount() === 1) {
ds.setItem(1,'name',name);
let ret = ds.update();
if (ret === 1) {
w.write({"msg":'成功'})
} else {
w.write({"msg":'失败',"code":ds.sqlerrtext});
}
} else {
w.write({'msg':'未找到'})
}
},
insert(ctx,r,w) {
let {id,name} = r.jsonBody;
let sqlca = getDB();
let ds = new DataStore();
ds.setTransObject(sqlca);
ds.dataObject = d_test1;
let row = ds.insertRow();
ds.setItem(row,'id',id);
ds.setItem(row,'name',name);
let ret = ds.update();
if (ret === 1) {
w.write({"ret":ret})
} else {
w.write({"ret":ret,"code":ds.sqlerrtext});
}
}
}
satrda.Router.all("/js/dw",dw);
})();
这里代码就不多解释了,pber看到这里肯定非常熟悉了。 3. 修改index.html,加入js文件
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<script src="js/satrda.min.js"></script>
<script src="js/test.js"></script>
<script src="js/util.js"></script>
<script src="js/testdb.js"></script>
<script src="js/dw.bundle.js"></script>
<script src="js/testdw.js"></script>
<script>
var debug = satrda.debug;
debug.start("127.0.0.1:5555","js");
</script>
</body>
</html>
- 验证结果。 浏览器中输入: