并不熟悉JAVA语言和编程思路,很多地方安全性和逻辑性没有过多考虑(比如没有做MD5之类的加密),仅仅是提供给新人一些思路。通讯录的电话号码,用WEX5最新版本做的,打包后,测试是能直接调用拨打电话的界面。<ignore_js_op style="word-wrap: break-word;"><ignore_js_op style="word-wrap: break-word;"> login.w <?xml version="1.0" encoding="utf-8"?><div xmlns="http://www.w3.org/1999/xhtml" component="$UI/system/components/justep/window/window" design="device:m;"> <div component="$UI/system/components/justep/model/model" xid="model1" style="width:143px;height:auto;left:14px;top:443px;" onLoad="model1Load"> <div component="$UI/system/components/justep/data/data" autoLoad="true" xid="userData" idColumn="fID" autoNew="false" confirmRefresh="false"> <column label="fID" name="fID" type="Integer" xid="default1"></column> <column label="username" name="username" type="String" xid="default1"></column> <column label="userpass" name="password" type="String" xid="default2"></column> <column label="Sname" name="sbrand" type="String" xid="default3"></column> <column label="Sarea" name="shopname" type="String" xid="default4"></column> <column label="Sbrand" name="brandsort" type="String" xid="default5"></column> <column label="Spower" name="smarket" type="String" xid="default6"></column> <column label="Sdepartment" name="sarea" type="String" xid="default7"></column> <column label="city" name="city" type="String" xid="default8"></column> <column label="mcity" name="mcity" type="String" xid="default9"></column> <column label="scity" name="scity" type="String" xid="default10"></column></div> </div> <span component="$UI/system/components/justep/messageDialog/messageDialog" xid="messageDialog" style="left:13px;top:415px;"></span><div component="$UI/system/components/justep/contents/contents" class="x-contents x-full" active="0" xid="contents1"> <div class="x-contents-content" xid="content1" style="background-image:url(img/loginbg4.jpg);"><div xid="div1" style="margin:10px 50px 0px 50px;" align="center"><img src="img/logo.png" alt="" xid="image1" height="150"></img> </div> <div class="form-vertical" component="$UI/system/components/bootstrap/form/form" xid="form1"><div xid="div12" class="form-group" style="margin-right:auto;margin-left:auto;width:95%;"> <label xid="label4" class="sr-only"><![CDATA[用户名]]></label> <div xid="div14" class="input-group"><div xid="div15" class="input-group-addon"><span class="glyphicon glyphicon-user"></span></div> <input component="$UI/system/components/justep/input/input" class="form-control" xid="username" placeHolder="请输入用户名" autoFocus="true"></input></div></div><div xid="div13" class="form-group" style="margin-right:auto;margin-left:auto;width:95%;"> <label xid="label5" class="sr-only"><![CDATA[密码]]></label> <div xid="div16" class="input-group"><div xid="div17" class="input-group-addon"><span class="glyphicon glyphicon-edit"></span></div> <input component="$UI/system/components/justep/input/password" class="form-control" xid="password" placeHolder="请输入密码"></input> </div></div></div><div component="$UI/system/components/justep/row/row" class="x-row" xid="row4"> <div class="x-col" xid="col10" style="text-align:center;"><a component="$UI/system/components/justep/button/button" class="btn btn-success btn-block" label="登录系统" xid="button1" onClick="btnCheckUserLogin"> <i xid="i1"></i> <span xid="span1">登录系统</span></a> </div> </div><div component="$UI/system/components/justep/row/row" class="x-row" xid="row1"> <div class="x-col" xid="col2"><div component="$UI/system/components/justep/labelEdit/labelEdit" class="x-label-edit x-label30" xid="labelToggle2"> <label class="x-label" xid="label3" style="text-align:center;"><![CDATA[记住密码]]></label> <span component="$UI/system/components/justep/button/toggle" class="x-toggle x-edit" xid="toggle1" ON="开启" OFF="关闭"></span></div></div> </div> <div xid="div3" style="margin:50px 20px 50px 20px;height:50px;text-align:center;"><span xid="span2"><![CDATA[ © Biyao]]></span> </div> </div></div> </div> 复制代码 login.js define(function(require){ var $ = require("jquery"); var Baas = require("$UI/blshopApp/JS/baas"); require("$UI/system/lib/cordova/cordova"); require("cordova!org.apache.cordova.device"); var Model = function(){ this.callParent(); }; Model.prototype.btnCheckUserLogin = function(event){ var self = this; var userData = this.comp("userData"); //用户名和密码为空提示 if ( $.trim(this.comp('username').val()) === "" || $.trim(this.comp('password').val()) === "") { this.comp("messageDialog").show({ "title" : "温馨提示", "message" : "忘记输入用户名或密码?" }); } else { var params = { "username":this.comp('username').val(), "password":this.comp('password').val() }; // 请求成功后的回调方法 var success = function(resultData) { userData.loadData(resultData); userData.refreshData(); if (userData.val('username')&&userData.val('password')) { localStorage.setItem('username',userData.val('username')); localStorage.setItem('password',userData.val('password')); localStorage.setItem('sbrand',userData.val('sbrand')); localStorage.setItem('brandsort',userData.val('brandsort')); localStorage.setItem('smarket',userData.val('smarket')); if(self.comp('toggle1').val()===true) //如果记住密码选中,登录成功则将用户名和密码保存到localStorage中 { localStorage.setItem('un',userData.val('username')); localStorage.setItem('pw',userData.val('password')); localStorage.setItem('remeberMe',true); }else //否则不存储localStorage { localStorage.removeItem("un"); localStorage.removeItem("pw"); localStorage.removeItem('remeberMe'); } window.location.href="./index.w"; //登录成功,跳转到APP首页 }else { self.comp("messageDialog").show({ "title" : "温馨提示", "message" : "输入的用户名或密码不正确!" }); } }; // 发送请求 Baas.sendRequest({ "url" : "/blshop", // servlet请求地址 "action" : "queryUserInfo", // action "params" : params, // action对应的参数 "success" : success // 请求成功后的回调方法 }); } }; Model.prototype.model1Load = function(event){ if(localStorage.getItem('remeberMe')){ var username = localStorage.getItem('un') ; var password = localStorage.getItem('pw') ; this.comp("username").set({value:username}); this.comp("password").set({value:password}); this.comp("toggle1").set({value:true}); } }; return Model;}); 复制代码 本主题由 make 于 2015-8-12 10:43 提升 <ignore_js_op style="word-wrap: break-word;"> QQ图片20150519072340.jpg (74.01 KB, 下载次数: 24) 评分 参与人数 1威望 +12 收起理由 Masion + 12很给力! 查看全部评分 分享到: QQ好友和群 QQ空间 腾讯微博 腾讯朋友 收藏13 回复 使用道具 举报 biyaooo 19 主题 102 帖子 427 积分 中级会员 积分 427 发消息 推荐 楼主 | 发表于 2015-5-19 07:29:29 | 只看该作者 本帖最后由 biyaooo 于 2015-5-19 18:27 编辑后端Baas添加的 Java代码 private static void queryAddressList(ServletRequest request, ServletResponse response) throws SQLException, IOException, NamingException { // 参数序列化 JSONObject params = (JSONObject) JSONObject.parse(request.getParameter("params")); // 获取参数 Object columns = params.get("columns"); // 列定义 Integer limit = params.getInteger("limit"); // 分页查询的行数 Integer offset = params.getInteger("offset"); // 分页查询的行偏移 String search = params.getString("search"); // 检索关键字 // 存放SQL中的参数值 List<Object> sqlParams = new ArrayList<Object>(); // 存放SQL中的过滤条件 List<String> filters = new ArrayList<String>(); if (!Util.isEmptyString(search)) { // 增加过滤条件 filters.add("name LIKE ? OR phone LIKE ? OR address LIKE ? OR sort LIKE ?"); // 检索关键字中如果没有%,则前后自动加% search = (search.indexOf("%") != -1) ? search : "%" + search + "%"; // sqlParams的参数个数和顺序必须与过滤条件的?相匹配 for (int i = 0; i < 4; i++) { sqlParams.add(search); } } Table table = null; // 获取数据源连接 Connection conn = Util.getConnection(DATASOURCE_BLSHOPAPP); try { // 执行单表数据查询,返回Table table = Util.queryData(conn, TABLE_APP_ADDRESS, columns, filters, "fID DESC", sqlParams, offset, limit); } finally { // 必须关闭数据源连接 conn.close(); } // 输出Table做为返回结果,这里会自动转换为Table的JSON格式 Util.writeTableToResponse(response, table); } 复制代码 回复 支持 1 反对 0 使用道具 举报 biyaooo 19 主题 102 帖子 427 积分 中级会员 积分 427 发消息 推荐 楼主 | 发表于 2015-5-19 07:32:53 | 只看该作者 本帖最后由 biyaooo 于 2015-5-19 18:27 编辑后端利用Baas添加的 queryUserInfo动作代码 private static void queryUserInfo(ServletRequest request, ServletResponse response) throws SQLException, IOException, NamingException { // 参数序列化 JSONObject params = (JSONObject) JSONObject.parse(request.getParameter("params")); // 获取参数 Object columns = params.get("columns"); // 列定义 Integer limit = params.getInteger("limit"); // 分页查询的行数 Integer offset = params.getInteger("offset"); // 分页查询的行偏移 String username = params.getString("username"); // 分页查询的行数 String password = params.getString("password"); // 检索关键字 //System.out.println(password); // 存放SQL中的参数值 List<Object> sqlParams = new ArrayList<Object>(); // 存放SQL中的过滤条件 List<String> filters = new ArrayList<String>(); filters.add("username = ? and password =?"); sqlParams.add(username); sqlParams.add(password); Table table = null; // 获取数据源连接 Connection conn = Util.getConnection(DATASOURCE_BLSHOPAPP); try { // 执行单表数据查询,返回Table table = Util.queryData(conn, TABLE_APP_USER, columns, filters, "fID DESC", sqlParams, offset, limit); } finally { // 必须关闭数据源连接 conn.close(); } // 输出Table做为返回结果,这里会自动转换为Table的JSON格式 Util.writeTableToResponse(response, table); } 复制代码 通讯录加载对应的JS代码 Content3.js Model.prototype.addresslistDataCustomRefresh = function(event){ var data = event.source; //alert(Baas.getDataColumns(data)); // 构造请求参数 var params = { // 列定义 // "columns" : data.getColumnIDs(), // 应从前端传入完整列定义(Baas.getDataColumns(data)), 以解决oracle等数据库不区分date、time、datetime,导致的数据格式转换问题; // 服务端兼容了以前只传入列名字符串(data.getColumnIDs())的写法,但是已不再推荐。 //"columns" : Baas.getDataColumns(data), // 分页信息 - 行数 "limit" : event.limit, // 分页信息 - 行偏移 "offset" : event.offset, // 检索关键字 "search" : this.getElementByXid("addressInput").value }; // 请求成功后的回调方法 var success = function(resultData) { // 通过event.options.append判断数据是否增量加载 var append = event.options && event.options.append; // 加载返回数据到data data.loadData(resultData, append); }; // 发送请求 Baas.sendRequest({ "url" : "/blshop", // servlet请求地址 "action" : "queryAddressList", // action "params" : params, // action对应的参数 "success" : success // 请求成功后的回调方法 }); }; 复制代码 通讯录的代码,我的程序分了4个Content,我只把通讯录里面Content的代码贴出来Content3.w <div class="x-contents-content" xid="content4"><div component="$UI/system/components/justep/panel/panel" class="x-panel x-full" xid="panel3"> <div class="x-panel-top" xid="top3"> <div component="$UI/system/components/justep/row/row" class="x-row" xid="row3"> <div class="x-col" xid="col15"> <div class="input-group" component="$UI/system/components/bootstrap/inputGroup/inputGroup" xid="inputGroup2"> <input type="text" class="form-control" component="$UI/system/components/justep/input/input" xid="addressInput" onChange="{operation:'addresslistData.refresh'}"></input> <div class="input-group-btn" xid="div6"> <a component="$UI/system/components/justep/button/button" class="btn x-black btn-only-icon" label="button" xid="button10" icon="icon-android-search" onClick="{operation:'addresslistData.refresh'}"> <i xid="i3" class="icon-android-search"></i> <span xid="span3"></span></a> </div> </div> </div> </div> </div> <div class="x-panel-content" xid="content7"> <div class="x-scroll" component="$UI/system/components/justep/scrollView/scrollView" xid="scrollView1"> <div class="x-content-center x-pull-down container" xid="div7"> <i class="x-pull-down-img glyphicon x-icon-pull-down" xid="i16"></i> <span class="x-pull-down-label" xid="span5">下拉刷新...</span></div> <div class="x-scroll-content" xid="div16"> <div component="$UI/system/components/justep/list/list" class="x-list" xid="list1" data="addresslistData" limit="-1"> <ul class="x-list-template" xid="listTemplateUl1"> <li xid="li1"> <div component="$UI/system/components/justep/row/row" class="x-row" xid="row2" style="padding:0px"> <div class="x-col" xid="col12"> <div component="$UI/system/components/justep/labelEdit/labelEdit" class="x-label-edit" xid="labelOutput1" style="margin:0px"> <label class="x-label" xid="label2"><![CDATA[姓名:]]></label> <div component="$UI/system/components/justep/output/output" class="x-output x-edit" xid="output5" bind-ref="ref('name')"></div></div></div> <div class="x-col" xid="col13"> <label xid="label5"><![CDATA[电话:]]></label> <a xid="a1" bind-text="ref('phone')" data-bind="attr:{href:'tel:'+val('phone')}"><![CDATA[]]></a></div> </div> <div component="$UI/system/components/justep/row/row" class="x-row" xid="row5"> <div class="x-col" xid="col16" style="padding:0px;border-bottom-style:dashed;border-bottom-width:1px;border-bottom-color:#15800D;"><div component="$UI/system/components/justep/labelEdit/labelEdit" class="x-label-edit" xid="labelOutput3" style="margin:0px"> <label class="x-label" xid="label4" style="background-color:transparent;"><![CDATA[通讯地址:]]></label> <div component="$UI/system/components/justep/output/output" class="x-output x-edit" xid="output7" bind-ref="ref('address')"></div></div></div> </div></li> </ul> </div> </div> <div class="x-content-center x-pull-up" xid="div5"> <span class="x-pull-up-label" xid="span17">加载更多...</span></div> </div> </div> </div></div> 复制代码