wex5
UI2
采用UI2进行界面的设计,有图形拖拽功能,能轻松的设计出一套webap应用框架,只是缺少数据。
其中最值得一提的是Data 与 BaasData组件
data组件(能直接映射数据到指定的行)的使用:
var orderData = this.comp("orderData");
//清楚数据
cartData.clear();
//删除指定行数据
orderData.deleteData(orderRows);
//向data中添加一行数据
var orderRows = orderData.newData({
index : 0,
defaultValues : [ {
"fID" : orderID,
"fCreateTime" : justep.Date.toString(new Date(), justep.Date.STANDART_FORMAT),
"fContent" : content,
"fUserID" : userData.val("fID"),
"fUserName" : userData.val("fName"),
"fPhoneNumber" : userData.val("fPhoneNumber"),
"fAddress" : userData.val("fAddress"),
"fSum" : cartData.sum("calcMoney") + ""
//"fPayState" : 0
} ]
});
baasData组件(与data组件不同不是本地的绑定数据库Action)
//保存数据到服务器
orderData.saveData({
"onSuccess" : success,
"onError" : error});
TableName 同时可以设置绑定数据库Action 即save与 query
设置了autoLoad = false时,需要找到组件去 orderData.refreshData(); 手动加载
Baas:
1. 通过baas服务器进行请求的转发
2. 绑定数据源,设置数据库动作。
3。 通过js向baas发送请求:
justep.Baas.sendRequest({
"url" : "/czworks/loginService",
"action" : "doWxLogin",
"async" : true,
"params" : {
code : weixinCode,
language : language,
sysname : "crm"
},
"success" : function(data) {
if (data.IsSucess) {
localStorage.setItem(LOCALSTORAGE_KEY_USERNO, data.userno.toLowerCase());
localStorage.setItem(LOCALSTORAGE_KEY_ORGNO, data.orgno);
localStorage.setItem(LOCALSTORAGE_KEY_SESSIONID, data.sessionId)
var userInfoBean = data.ParamModel;
localStorage.setItem(LOCALSTORAGE_KEY_USERNAME, userInfoBean.DB_USER_NAME);
var params = {userInfo : data.ParamModel,functionList : data.Datas.functionLis};
justep.Shell.showPage("main", params);
} else {
justep.Util.hint(loginfailed + data.ErrorMessage);
}
}
Native:
进行移动端app的编辑与编译。
PS:
1 .页面的整体架构(pages)
this.shellImpl = new ShellImpl(this, {
"contentsXid" : "pages",
"pageMappings" : {
"main" : {url : require.toUrl('./main.w')},
"login" : {url : require.toUrl('./login.w')}}
});
// 页面的替换
justep.Shell.setIsSinglePage(true);
justep.Shell.showPage("login");
//也可以作用于没有写过映射的URl
var completeListUrl = require.toUrl('$UI/czworks/crm/base/customerList.w');
justep.Shell.showPage(completeListUrl);
//将相对路径转化为绝对路径
require.toUrl('./main.w');
//本地的存储与读取
localStorage.setItem(LOCALSTORAGE_KEY_USERNO, data.userno.toLowerCase());
localStorage.getItem("LOCALSTORAGE_KEY_USERNO");
//获取这个model中的对象
model.getElementByXid("functionCol" + index);
this.comp("functionCol1")
//获取和设置model中对象的属性
checkbox.get("checked")
this.comp('mainBtn').set({icon : "img:$UI/czworks/mes/img/icon_main_1.png|$UI/czworks/mes/img/icon_main_0.png"});
//图表对象的处理(百度echarts)
1,只需要在相应的位置设置一个div来占据位置,设置宽和高
2,myChart = echarts.init(this.getElementByXid('chartReportDiv2'));ss
myChart.setOption(option); //option是用于配置的json数据,参考 http://echarts.baidu.com/index.html
//整个浏览器URL重定向
window.location.href = "./index.w";
//从row上面取数据 和 设置数据
row.val("num"); row.val("num",row.val("num")+1);