Die Chat -Funktion wurde im vorherigen Artikel eingeführt, und hier stellen wir vor, wie Adressbuch implementiert wird. Erstens müssen Sie alle Abteilungen des Unternehmens und eine Baumstruktur laden und dann klicken, um die Personalliste der Abteilung einzugeben. Klicken Sie, um die detaillierten Informationen anzuzeigen.
1. Schnittstelle
Baumstruktur der Unternehmensabteilung:
Abteilungsmitgliedsliste:
Persönliche Daten:
2. Code -Implementierung
1.Kontroller
/*** Ladeabteilungsliste*/@RequestMapping ("/adressListdepartmentjsp.do") public void addreslistdepartment (httpServletRequest-Anforderung, HttpServletResponse-Antwort) löst IOException {Request.SetcharacterEnCoding ("UTF-8"); response.setcharactercoding ("utf-8"); Liste <JsonTree> jSlist = addreslistService.gettree (); JsonArray jsonArray = jsonArray.fromObject (JSLIST); Printwriter out = response.getWriter (); out.print (jsonArray); }/*** Laden Sie die Liste der Abteilungsmitgliedsliste*/@RequestMapPing ("/adressListUserList.do") öffentliche String-Adressliste (httpServletRequest-Anforderung, httpServletResponse-Antwort). response.setcharactercoding ("utf-8"); String Deptid = Request.GetParameter ("AbteilungID"); String D = Request.GetParameter ("Abteilungsname"); String departmentName = new String (D.GetBytes ("ISO-8859-1"), "UTF-8"); LIST <BENEDetail> userDetail = addreslistservice.getUserDetail (Deptid); request.setAttribute ("userDetail", userDetail); Request.SetAttribute ("Abteilungsname", Abteilungsname); zurück "adressListUserList" zurückgeben; }/*** Mitarbeiterdetails anzeigen*/@RequestMapping ("/adressListUserInfo.do") public String addressListUserInfo (httpServletRequest-Anforderung, httpServletResponse-Antwort) löst nicht supportedEcodingException {Request.Setcharactercoding ("utf-8"); response.setcharactercoding ("utf-8"); String n = request.getParameter ("Name"); String name = new String (n.getBytes ("ISO-8859-1"), "UTF-8"); String mobil = request.getParameter ("mobil"); String -E -Mail = Request.GetParameter ("E -Mail"); String weixinid = request.getParameter ("wixinid"); String avatar = request.getParameter ("avatar"); String D = Request.GetParameter ("Abteilungsname"); String departmentName = new String (D.GetBytes ("ISO-8859-1"), "UTF-8"); Request.SetAttribute ("Name", Name); Request.SetAttribute ("Mobile", Mobile); Request.SetAttribute ("E -Mail", E -Mail); Request.SetAttribute ("wixinid", wixinid); request.setattribute ("avatar", avatar); Request.SetAttribute ("Abteilungsname", Abteilungsname); zurück "adressListUserInfo"; } 2.ServiceImpl
/*** Lade der Abteilungsliste*/publiclist <JsonTree> getTree () {// 1. Get Token String AccessToken = CommonUtil.getAccessToken ("WXE510946434680DAB", "Ewtaho766invp4e1mcsz1mhyut2daleb62Req3vsfizhy4vtmwzpkweuxuvh33333333g0. // 2. Abteilungslistenliste <Abreitsätze> Abteilungsliste = Advancedutil.getDepartment (AccessToken); // Konvertieren Sie in das von der Seite geforderte Format gemäß der Liste der Abteilungsliste <JsonTree> jSlist = this.convertList (Abteilungsliste); JSLIST zurückgeben; } / *** in Ztree Format konvertieren* / publiclist <JsonTree> convertList (Liste <Atministrators> Abteilung) {Liste <JsonTree> rootnode = new ArrayList <JsonTree> (); für (int i = 0; i <Departmentlist.size (); i ++) {für (int j = i+1; j <Abteilungsliste.size (); j ++) {if (Abteilungsliste.get (i) .getId () == Abteilungliste.get (j) .getParentID ()) {JsonTree jt = new jsonree (); jt.setId (Abteilungsliste.get (i) .getId ()); jt.setName (Abteilungliste.get (i) .getName ()); jt.setpid (Abteilungsliste.get (i) .GetParentid ()); jt.setopen (falsch); jt.seturl (""); rootNode.add (jt); brechen; } else {jsonTree jt = new JsonTree (); jt.setId (Abteilungsliste.get (i) .getId ()); jt.setName (Abteilungliste.get (i) .getName ()); jt.setpid (Abteilungsliste.get (i) .GetParentid ()); jt.setopen (falsch); jt.seturl ("adressListUserList.do?departmentId ="+DepartmentList.get (i) .getId ()+"& montageName ="+DepartmentList.get (i) .getName ()); rootNode.add (jt); brechen; }}} return rootnode; } /*** Laden Sie die Liste der Abteilungsmitgliedsliste* /publiclist <Bedetetail> GetUserDetail (String Deptid) {// 1. Get Token First String AccessToken = CommonUtil.getAccessToken ("WXE510946434680dab", "Ewtaho766invp4e1mcsz1mhyut2Daleb62Req3vsfizhy4vtmwzpkweuxuvh333g0G0. // 2. Holen Sie sich die Liste der Abteilungsmitglieder basierend auf der Liste der Abteilungs -ID- und Token -Werte. Benutzerdetail zurückgeben; } 3. Werkzeuge
// Die Abteilungsliste öffentliche statische Liste <Abreitabteilung> getEpartment (String AccessToken) {List <Abreitabteilung> Abteilungsliste = NULL; // https://qyapi.weixin.qq.com/cgi-ner/department/List?access_token=access_token String Requesturl = "https://qyapi.weixin.qq.com/cgi-bin/department/list?access_Token===token=- Requesturl = Requesturl.Replace ("Access_Token", AccessToken); JsonObject jsonObject = CommonUtil.httpsRequest (Requesturl, "get", null); if (null! } catch (jSonexception e) {DepartmentList = null; int errorCode = jsonObject.getInt ("errcode"); String errormsg = jsonObject.getString ("errmsg"); }} Rückgabe der Abteilungsliste; } // Die Details der Abteilung Member Public Static List <Bedetetail> GetUserDetail (String AccessToken, String DepartmentID) {List <Bedetetail> userDetail = null; String Requesturl = "https://qyapi.wexin.qq.com/cgi-ner/user/List?access_token=access_token&department_id=department_id&fetch_child=1&status=0"; Requesturl = Requesturl.Replace ("Access_Token", AccessToken) .Replace ("Abteilung_ID", Abteilung ID); JsonObject jsonObject = CommonUtil.httpsRequest (Requesturl, "get", null); if (null! } catch (jSonexception e) {userDetail = null; int errorCode = jsonObject.getInt ("errcode"); String errormsg = jsonObject.getString ("errmsg"); }} userDetail zurückgeben; } 4.JS
<script type = "text/javaScript"> var curmenu = null, ztree_menu = null; var Setting = {Ansicht: {Showline: false, showicon: false, selectedMulti: false, dblcickexpand: false, addDiydom: addDiydom}, data: {simpledata: {enable: true}}; var znodes = null; $ .ajax ({type: "post", async: false, url: "adresslistdepartmentjsp.do", Erfolg: Funktion (Daten) {Znodes = eval ('(' + data + ');}, Fehler: Funktion (Daten) {}}); Funktion addDiydom (TreeId, Treenode) {var spacewidth = 5; var switchObj = $ ("#" + treeenode.tid + "_switch"), icoobj = $ ("#" + treenode.tid + "_ico"); switchObj.remove (); icoobj.before (switchObj); if (treenode.level> 1) {var spacestr = "<span style = 'display: inline-block; width:" + (SpaceWidth * treenode.level) + "px'> </span>"; switchObj.before (spacestry); }} Funktion beforeclick (baumId, treenode) {var str = ''; str = getAllchildrennodes (Treenode, str); if (str.substr (0,1) == ',') str = str.Substr (1); if (str! = "") {treenode.url = ""; var ztree = $ .fn.ztree.getZtreeObj ("Treedemo"); ztree.expandnode (treenode); false zurückgeben; } if (str == "") {} return true; } // Zhang Xiaozhu Dan Funktion getAllchildrennodes (Treenode, Ergebnis) {// var Strresult = Ergebnis; if (treenode.issparent) {var childrennodes = treenode.children; if (kindesnodes) {für (var i = 0; i <kindesnodes.length; i ++) {result += ',' +Kindernodes [i] .id; }}} Rückgabeergebnis; } $ (document) .ready (function () {var baumObj = $ ("#treedemo"); ztree_menu.getnodes () [0] .Children [0] .Children [0]; TreeObj.removeclass ("Showicon"); </script> <style type="text/css"> .ztree * {font-size: 13pt;font-family:"Microsoft Yahei",Verdana,Simsun,"Segoe UI Web Light","Segoe UI Light","Segoe UI Web Regular","Segoe UI","Segoe UI Web Regular","Segoe UI","Segoe UI Symbol "," Helvetica Neue ", Arial} .Ztree li ul {margin: 0; Padding: 0} .Ztree li {Zeilenhöhe: 30px;} .Ztree li a {width: 100%; Höhe: 30px; Padding-Top: 0px; Border-Bottom: 1px #eeee Solid} .zree li a: hover {text-dekoration: keine; Hintergrundfarbe: #e7e7e7;}/ * .zree li a span {Zeilenhöhe: 30px;} .zree li span.button {margin-top: -7px; {Hintergrund-Image: URL ("Bilder/Left_MenUforoutlook.png"); *Hintergrund-Image: URL ("./ Left_MenUforoutlook.gif")} .zree li span.button.switch.level0 {width: 20px; Höhe: 20px} .zree li span.button.switch.level1 {width: 20px; Höhe: 20px} .zree li span.button.noline_open {Hintergrundposition: 0 0; span.button.noline_close.level0 {background-position: -18px -18px;} </style> </head> <body> <div data-role="page" id="UserMain"> <div > <ul id="treeDemo" ></ul> </div> </div> <span id="zNodes"></span> </div> </body> 3. Zusammenfassung
Die Adressbuchfunktion ist nicht so schwierig wie im Voraus. Die Baumstruktur übernimmt das Ztree -Framework. Die im Hintergrund gefundenen Daten müssen in den von Ztree definierten Namen konvertiert werden. Anschließend werden die Anzeige und Abfrage der Abteilungsmitgliedsliste verwendet, um das JQuery -Mobiltelefon anzuzeigen und abzufragen. In zukünftigen Artikeln wird die Verwendung dieses JS eingeführt. Aus dem Namen wissen wir, dass es speziell für mobile Seiten entwickelt wurde.
Das obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, es wird für das Lernen aller hilfreich sein und ich hoffe, jeder wird Wulin.com mehr unterstützen.