<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title></title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/toast.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
    <link rel="stylesheet" href="../../css/projeck.css">
    <style>
      html,body{
        background: #fff;
      }
      .api_layout{
        width: 100%;
        position: relative;
      }
      .api_mail_name{
        font-size: 16px;
      }
      .header-title{
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        border-radius: 50%;
        display: block;
        background: red;
        /*margin-bottom: 10px;*/
        margin: 0px auto 10px auto;
        color: #fff;
        font-size: 16px;
        font-weight: bold;
      }
      .api_mail_post{
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      .api_mail_items .api_mail_item{
        text-align: center;
        padding: 15px;
      }

      .api_mail_items .api_mail_item p {
          margin-bottom: 12px;
          font-size: 14px;
          color: #97a3b4;
      }
      .api_mail_items .api_mail_item p.api_mail_name {
          color: #232627;
      }
      .api_mail_items .api_mail_item p span {
          font-size: 14px;
          color: #232627;
      }
      .api_mail_items .api_mail_item .api_mail_details {
          font-size: 14px;
          color: #0064FF;
      }
</style>
</head>
<body>
    <div class="api_layout" id="wrap">
      <div class="api_mail_info">
        <p class="api_title_text">部门人员：</p>
        <ul class="api_mail_items" id="api_mail_items">
          <!-- <li class="api_mail_item">
            <img src="http://jiewei-icon.oss-cn-beijing.aliyuncs.com/icon/default-avatar.png" alt="" class="api_mail_logo">
            <p class="api_mail_name">19995262241</p>
            <p class="api_mail_tel">TEL:<span>19995262241</span></p>
            <p class="api_mail_post">职务:<span>飒飒飒飒飒飒飒飒飒飒飒飒阿萨飒飒</span></p>
            <span class="api_mail_details">查看详情</span>
            <img src="../../image/more01.png" alt="" class="api_more01">
          </li>
          <li class="api_mail_item">
            <span class="header-title">惠</span>
            <p class="api_mail_name">19995262241</p>
            <p class="api_mail_tel">TEL:<span>19995262241</span></p>
            <p class="api_mail_post">职务:<span>飒飒飒飒飒飒飒飒飒飒飒飒阿萨飒飒</span></p>
            <span class="api_mail_details">查看详情</span>
            <img src="../../image/more01.png" alt="" class="api_more01">
          </li> -->
        </ul>
      </div>
    </div>
</body>
</html>
<script type="text/template" id="template_mail">
    {{~it:value}}
    <li class="api_mail_item">
      <div onclick="openDetails('{{=value.name}}','{{=value.mobile}}','{{=value.avatar}}','{{=value.position_name}}')">
        {{?value.avatar!=null }}
          <img src="{{=value.avatar}}" class="api_mail_logo">
        {{??}}
          <span class="header-title" style="background:#{{=Math.floor(Math.random()*0xffffff).toString(16)}}">{{=value.name.substr(value.name.length-1,1)}}</span>
        {{?}}
        <p class="api_mail_name" style="font-size:16px;">{{=value.name}}</p>
        <p class="api_mail_tel">电话：<span>{{=value.mobile == null?'无':value.mobile}}</span></p>
        <p class="api_mail_post">职务：<span>{{=value.position_name == 'null'?'无':value.position_name}}</span></p>
      </div>
      <span class="api_mail_details" onclick="openPersonalInfo('{{=value.staff_num}}')">查看详情</span>
      <img src="../../image/more01.png" alt="" class="api_more01">
    </li>
    {{~}}
</script>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/doT.min.js"></script>
<!-- <script src="../../script/fastclick.min.js" charset="utf-8"></script> -->
<script src="../../script/config.js" charset="utf-8"></script>
<script type="text/javascript">
  var toast = new auiToast();
  apiready = function () {
      api.parseTapmode();
      var info = $api.getStorage('data'),
      user = JSON.parse(info).data.user;
      token = JSON.parse(info).data.access_token;
      getPersonalInfo(token,api.pageParam.id);
  }
  function getPersonalInfo(token,ids) {
    var headers = {
        "Authorization": "Bearer " + token
    };
    var data={
      id:ids
    }
    $http.fnReuestData(UrlRouter.getPersonalList,headers,'post',data,function (ret,err) {
      if (ret && ret.code === 0) {
        $apis.append(api_mail_items,'#template_mail',ret.data);
        toast.hide();
      }else {
        toast.hide();
        api.toast({
            msg: '网络错误',
            duration: 2000,
            location: 'bottom'
        });
      }
    })
  }
  function openDetails(name,phone,img,del) {
    var param = {
        username: name,
        mobile:phone,
        avatar:img,
        delp:del
    };
    $event.openPopup(api.winWidth,'auto','modul',param)
  }
  function openPersonalInfo(ids){
    $event.openPopup('auto','auto','personalInfo',{id: ids})
  }
</script>
