organization.html 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
  6. <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  7. <meta name="format-detection"content="telephone=no">
  8. <title>index</title>
  9. <link rel="stylesheet" type="text/css" href="./../css/api.css"/>
  10. <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
  11. <link rel="stylesheet" type="text/css" href="../../css/toast.css"/>
  12. <link rel="stylesheet" href="../../css/projeck.css">
  13. <style media="screen">
  14. body,html{
  15. margin: 0;
  16. background: #fff;
  17. }
  18. .api_seach_personal{
  19. padding: 0 15px;
  20. box-sizing: border-box;
  21. position: relative;
  22. background: #f1f5f7;
  23. width: 90%;
  24. margin: auto;
  25. margin-top: 10px;
  26. /*border-bottom: 1px solid #ebebeb;*/
  27. }
  28. .api_seach_personal_box{
  29. height: 45px;
  30. }
  31. .api_seach_personal input{
  32. box-sizing: border-box;
  33. height: 44px;
  34. width: 100%;
  35. padding-left: 15px;
  36. border: none;
  37. outline: none;
  38. padding-right: 40px;
  39. -webkit-tap-highlight-color:rgba(0,0,0,0);
  40. -webkit-tap-highlight-color: transparent;
  41. }
  42. /*.seach_api{*/
  43. /*width: 44px;*/
  44. /*height: 44px;*/
  45. /*background: url("../../image/seach_api.png") no-repeat;*/
  46. /*background-size: cover;*/
  47. /*position: absolute;*/
  48. /*top: 20px;*/
  49. /*right: 20px;*/
  50. /*}*/
  51. </style>
  52. </head>
  53. <body>
  54. <header class="header-login">
  55. <img class="backBtn" src="../../image/btn_back.png" alt="" onclick="backIndex()">
  56. <p class="api_text">通讯录</p>
  57. </header>
  58. <div style="padding-bottom:10px;"class="api_seach_personal_box relative after-border">
  59. <div class="api_seach_personal" id="api_seach_personal">
  60. <input type="text" name="" value="" placeholder="" class="info" id="info_input">
  61. </div>
  62. </div>
  63. </body>
  64. </html>
  65. <script type="text/javascript" src="../../script/api.js"></script>
  66. <!-- <script src="../../script/fastclick.min.js" charset="utf-8"></script> -->
  67. <script type="text/javascript" src="../../script/config.js"></script>
  68. <script type="text/javascript">
  69. var UIInputId;
  70. apiready = function () {
  71. $api.fixStatusBar($api.dom('header') );
  72. var info = $api.getStorage('data'),
  73. user = JSON.parse(info).data.user;
  74. token = JSON.parse(info).data.access_token;
  75. // api.parseTapmode();
  76. fnInitUIInput(token);
  77. openFram();
  78. openSeachList();
  79. }
  80. function openSeachList(){
  81. var info = $api.dom('.info').value;;
  82. var UIListSearch = api.require('UIListSearch');
  83. UIListSearch.open({
  84. rect: {
  85. x: 0,
  86. y: $api.dom('header').offsetHeight + $api.dom('.api_seach_personal').offsetHeight+30,
  87. w: api.winWidth,
  88. h: api.winHeigh
  89. },
  90. contacts:[],
  91. fixedOn: api.organization_frame
  92. }, function(ret, err) {
  93. if (ret) {
  94. UIListSearch.hide();
  95. var UIInput = api.require('UIInput');
  96. UIInput.closeKeyboard({
  97. id:UIInputId
  98. });
  99. openDetails(ret.contact.name,ret.contact.mobile,ret.contact.avatar,ret.contact.position);
  100. }
  101. });
  102. UIListSearch.hide();
  103. };
  104. // 数据更新
  105. function functionName(arr) {
  106. var UIListSearch = api.require('UIListSearch');
  107. UIListSearch.show();
  108. UIListSearch.reloadData({
  109. contacts:JSON.parse(arr)
  110. });
  111. }
  112. function openFram() {
  113. api.openFrame({
  114. name: 'organization_frame',
  115. bounces: true,
  116. url: 'organization_frame.html',
  117. rect: {
  118. x: 0,
  119. y: $api.dom('header').offsetHeight + $api.dom('.api_seach_personal_box').offsetHeight+10,
  120. w: api.winWidth,
  121. h: 'auto',
  122. },
  123. pageParam: {
  124. // name: 'test'
  125. }
  126. });
  127. }
  128. function backIndex() {
  129. api.closeWin();
  130. var UIListSearch = api.require('UIListSearch');
  131. UIListSearch.close();
  132. }
  133. // input
  134. function fnInitUIInput(tokens) {
  135. var searchText = $api.byId('info_input');
  136. var rect = $api.offset(searchText);
  137. var UIInput = api.require('UIInput');
  138. UIInput.open({
  139. rect: {
  140. x: rect.l,
  141. y: rect.t,
  142. w: rect.w,
  143. h: rect.h
  144. },
  145. styles: {
  146. bgColor: '#f1f5f7',
  147. size: 14,
  148. color: '#000',
  149. placeholder: {
  150. color: '#ccc'
  151. }
  152. },
  153. autoFocus: false,
  154. maxRows: 1,
  155. placeholder: '使用姓名,工号查找',
  156. keyboardType: 'default',
  157. fixedOn: api.frameName
  158. }, function(ret, err) {
  159. // console.log(JSON.stringify(ret));
  160. UIInputId = ret.id;
  161. if (ret.eventType == "change") {
  162. UIInput.value({
  163. id: ret.id
  164. }, function(ret, err) {
  165. if (ret) {
  166. if (ret.status) {
  167. if (ret.msg == "") {
  168. var UIListSearch = api.require('UIListSearch');
  169. UIListSearch.hide();
  170. }else {
  171. selectPersonal(tokens,ret.msg);
  172. // functionName()
  173. }
  174. }
  175. }
  176. });
  177. // functionName();
  178. }
  179. });
  180. }
  181. // 查询
  182. function selectPersonal(token,name) {
  183. var headers = {
  184. "Authorization": "Bearer " + token
  185. };
  186. $http.fnReuestDataNologing(UrlRouter.searchPersonal,headers,'post',{content:name},function (ret,err) {
  187. if (ret.code === 0) {
  188. functionName(JSON.stringify(ret.data))
  189. }
  190. // console.log(JSON.stringify(ret));
  191. })
  192. }
  193. // 点击人员列表看详情
  194. function openDetails(name,phone,img,del) {
  195. var param = {
  196. username: name,
  197. mobile:phone,
  198. avatar:img,
  199. delp:del
  200. };
  201. $event.openPopup(api.winWidth,'auto','modul',param);
  202. }
  203. </script>