mailList_frm.html 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  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. <title></title>
  8. <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
  9. <link rel="stylesheet" type="text/css" href="../../css/toast.css"/>
  10. <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
  11. <link rel="stylesheet" href="../../css/projeck.css">
  12. <style>
  13. html,body{
  14. background: #fff;
  15. }
  16. .api_layout{
  17. width: 100%;
  18. position: relative;
  19. }
  20. .api_mail_name{
  21. font-size: 16px;
  22. }
  23. .header-title{
  24. width: 50px;
  25. height: 50px;
  26. line-height: 50px;
  27. text-align: center;
  28. border-radius: 50%;
  29. display: block;
  30. background: red;
  31. /*margin-bottom: 10px;*/
  32. margin: 0px auto 10px auto;
  33. color: #fff;
  34. font-size: 16px;
  35. font-weight: bold;
  36. }
  37. .api_mail_post{
  38. width: 100%;
  39. overflow: hidden;
  40. text-overflow: ellipsis;
  41. white-space: nowrap;
  42. }
  43. .api_mail_items .api_mail_item{
  44. text-align: center;
  45. padding: 15px;
  46. }
  47. .api_mail_items .api_mail_item p {
  48. margin-bottom: 12px;
  49. font-size: 14px;
  50. color: #97a3b4;
  51. }
  52. .api_mail_items .api_mail_item p.api_mail_name {
  53. color: #232627;
  54. }
  55. .api_mail_items .api_mail_item p span {
  56. font-size: 14px;
  57. color: #232627;
  58. }
  59. .api_mail_items .api_mail_item .api_mail_details {
  60. font-size: 14px;
  61. color: #0064FF;
  62. }
  63. </style>
  64. </head>
  65. <body>
  66. <div class="api_layout" id="wrap">
  67. <div class="api_mail_info">
  68. <p class="api_title_text">部门人员:</p>
  69. <ul class="api_mail_items" id="api_mail_items">
  70. <!-- <li class="api_mail_item">
  71. <img src="http://jiewei-icon.oss-cn-beijing.aliyuncs.com/icon/default-avatar.png" alt="" class="api_mail_logo">
  72. <p class="api_mail_name">19995262241</p>
  73. <p class="api_mail_tel">TEL:<span>19995262241</span></p>
  74. <p class="api_mail_post">职务:<span>飒飒飒飒飒飒飒飒飒飒飒飒阿萨飒飒</span></p>
  75. <span class="api_mail_details">查看详情</span>
  76. <img src="../../image/more01.png" alt="" class="api_more01">
  77. </li>
  78. <li class="api_mail_item">
  79. <span class="header-title">惠</span>
  80. <p class="api_mail_name">19995262241</p>
  81. <p class="api_mail_tel">TEL:<span>19995262241</span></p>
  82. <p class="api_mail_post">职务:<span>飒飒飒飒飒飒飒飒飒飒飒飒阿萨飒飒</span></p>
  83. <span class="api_mail_details">查看详情</span>
  84. <img src="../../image/more01.png" alt="" class="api_more01">
  85. </li> -->
  86. </ul>
  87. </div>
  88. </div>
  89. </body>
  90. </html>
  91. <script type="text/template" id="template_mail">
  92. {{~it:value}}
  93. <li class="api_mail_item">
  94. <div onclick="openDetails('{{=value.name}}','{{=value.mobile}}','{{=value.avatar}}','{{=value.position_name}}')">
  95. {{?value.avatar!=null }}
  96. <img src="{{=value.avatar}}" class="api_mail_logo">
  97. {{??}}
  98. <span class="header-title" style="background:#{{=Math.floor(Math.random()*0xffffff).toString(16)}}">{{=value.name.substr(value.name.length-1,1)}}</span>
  99. {{?}}
  100. <p class="api_mail_name" style="font-size:16px;">{{=value.name}}</p>
  101. <p class="api_mail_tel">电话:<span>{{=value.mobile == null?'无':value.mobile}}</span></p>
  102. <p class="api_mail_post">职务:<span>{{=value.position_name == 'null'?'无':value.position_name}}</span></p>
  103. </div>
  104. <span class="api_mail_details" onclick="openPersonalInfo('{{=value.staff_num}}')">查看详情</span>
  105. <img src="../../image/more01.png" alt="" class="api_more01">
  106. </li>
  107. {{~}}
  108. </script>
  109. <script type="text/javascript" src="../../script/api.js"></script>
  110. <script type="text/javascript" src="../../script/doT.min.js"></script>
  111. <!-- <script src="../../script/fastclick.min.js" charset="utf-8"></script> -->
  112. <script src="../../script/config.js" charset="utf-8"></script>
  113. <script type="text/javascript">
  114. var toast = new auiToast();
  115. apiready = function () {
  116. api.parseTapmode();
  117. var info = $api.getStorage('data'),
  118. user = JSON.parse(info).data.user;
  119. token = JSON.parse(info).data.access_token;
  120. getPersonalInfo(token,api.pageParam.id);
  121. }
  122. function getPersonalInfo(token,ids) {
  123. var headers = {
  124. "Authorization": "Bearer " + token
  125. };
  126. var data={
  127. id:ids
  128. }
  129. $http.fnReuestData(UrlRouter.getPersonalList,headers,'post',data,function (ret,err) {
  130. if (ret && ret.code === 0) {
  131. $apis.append(api_mail_items,'#template_mail',ret.data);
  132. toast.hide();
  133. }else {
  134. toast.hide();
  135. api.toast({
  136. msg: '网络错误',
  137. duration: 2000,
  138. location: 'bottom'
  139. });
  140. }
  141. })
  142. }
  143. function openDetails(name,phone,img,del) {
  144. var param = {
  145. username: name,
  146. mobile:phone,
  147. avatar:img,
  148. delp:del
  149. };
  150. $event.openPopup(api.winWidth,'auto','modul',param)
  151. }
  152. function openPersonalInfo(ids){
  153. $event.openPopup('auto','auto','personalInfo',{id: ids})
  154. }
  155. </script>