<!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" href="../../css/apiToast.css">
    <link rel="stylesheet" href="../../css/projeck.css">
    <style>
    html,body{
       background: #fff;
       }
       .api_layout{
            width: 100%;
            position: relative;
        }
        .List_QRcode{
            width: 100%;
            padding: 10px;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }
        .List_QRcode li{
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            position: relative;
            margin-bottom: 25px;
            border-bottom: 1px solid #ecf0f1;
        }
        .List_QRcode li:first-child{
            padding: 20px 10px 15px 20px;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            border-bottom: 0;
            background-color: #009fe8;
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            border-radius: 3px;
        }
        .List_QRcode li:first-child .time{
            font-size: 18px;
            color: #fff;
            margin-bottom: 30px;
            position: relative;
        }
        .btn{
            width: 80px;
            height: 32px;
            line-height: 32px;
            font-size: 12px;
            background: #fff;
            color: #41c1fc;
            -webkit-border-radius: 50px;
            -moz-border-radius: 50px;
            border-radius: 50px;
        }
        .texts{
            font-size: 16px;
            color: #fff;
            line-height: 18px;
            width: 65%;
            line-height: 1.5;
        }
        .start1{
            position: absolute;
            top: -10px;
            right: 127px;
            background: url("../../image/Star2.png") no-repeat;
            background-size: cover;
            width: 14px;
            height: 14px;
        }
        .bg_start{
            display: inline-block;
            width: 20px;
            height: 20px;
            background: url("../../image/star.png");
            background-size: cover;
            position: relative;
            top: 4px;
        }
        .bord{
           border: 1px solid #41c1fc;
        }
        .List_QRcode li:not(:first-child){
            padding: 0 10px 10px 13px;
        }
        .List_QRcode li:not(:first-child) .btn{
            position: absolute;
            top: 15px;
            right: 10px;
        }
        .List_QRcode li:not(:first-child) .list_title{
            font-size: 16px;
            color: #97a3b4;
            height: 23px;
            line-height: 23px;
            margin-bottom: 18px;
        }
        .List_QRcode li:not(:first-child) .texts01{
            color: #1d1e2c;
        }
        .List_QRcode li:not(:first-child) .list_title .start1{
            width:0;
        }
        .List_QRcode li:first-child .time .bg_start{
            display:inline;
        }
        .List_QRcode li:first-child .bord{
            display:none;
        }
        .List_QRcode li:not(:first-child) .bords{
            display: none;
        }
    </style>
</head>
<body>
<div class="api_layout">
    <div class="List_QRcodes">
        <ul class="List_QRcode" id="List_QRcode">

        </ul>
    </div>
</div>
<div class="Nonews" id="nocode"></div>
</body>
</html>
<script type="text/template" id="template">
  {{~it:value}}
  <li>
      <p class="time list_title">
            <i class="bg_start"></i>
            <span>{{=value.createDate}}</span>
            <i class="start1"></i>
      </p>
      <p class="texts texts01">{{=value.dataContent}}</p>
      <div style="text-align: right">
          <button class="btn bords" style="background:#009fe8;color: #ffffff;border: 1px solid #ffffff;" onclick="QRcodeDetaile('{{=value.pageId}},{{=value.id}},{{=value.departmentId}}','{{=value.pageName}}')">查看详情</button>
          <button class="btn bord" onclick="QRcodeDetaile('{{=value.pageId}},{{=value.id}},{{=value.departmentId}}','{{=value.pageName}}')">查看详情</button>
      </div>
  </li>
  {{~}}
  </script>

<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/doT.min.js"></script>
<!-- <script src="../../script/aui-toast.js" charset="utf-8"></script> -->
<!-- <script src="../../script/fastclick.min.js"></script> -->
<script src="../../script/config.js" charset="utf-8"></script>
<script type="text/javascript">
    var depIDs = '',uuid='';
    var isLoadding = false;
		var skip = 1;
    var apiToast = new apiToast();
    apiready = function () {
        depIDs = api.pageParam.depIDs;
        var info = $api.getStorage('data'),
        user = JSON.parse(info).data.user;
        uuid = JSON.parse(info).data.user.staff_num;
        QRcodeListFun(uuid,depIDs,true);
        resetWidth();
        api.addEventListener({
  				name : 'scrolltobottom',
  				extra : {
  					threshold : 0 //设置距离底部多少距离时触发，默认值为0，数字类型
  				}
  			}, function(ret, err) {
  				if (!isLoadding) {
  					isLoadding = true;
  					QRcodeListFun(uuid,depIDs,true);
  				}
  			});
    }
    function QRcodeListFun(uuid,depID,isLoadMore){
      var filter = {
				"departmentId" : depID,
        'userId':uuid,
				"pageNumber" : skip,
				"pageSize" : 10
			};
     $http.fnReuestDataNoW(UrlRouter.getPageDynamicApi,'','get',filter,function (ret, err) {
         apiToast.hide();
        if (ret.data.length == 0 && skip == 1) {
            document.getElementById("nocode").style.display = 'block';
            return false;
        }else {
            document.getElementById("nocode").style.display = 'none';
        }
         if (ret) {
             if (ret.data.length > 0) {
                 skip += 1;
                 $apis.append(List_QRcode,'#template',ret.data);
             } else {
                 isLoadding = true;
                 api.toast({
                     msg: '没有更多数据',
                     duration: 2000,
                     location: 'bottom'
                 });
             }
         } else {
             apiToast.hide();
             api.toast({
                 msg: '加载超时，请检查网络',
                 duration: 2000,
                 location: 'bottom'
             });
         }
     });
    }
    function resetWidth() {
        var items = document.getElementsByClassName("texts");
        for (var i = 0; i < items.length; i++) {
            items[i].style.width = (api.frameWidth - 130) + "px";
        }
    }
    function QRcodeDetaile(pageid,title) {
      var pageidA = pageid.split(',');
      $event.openWin('browseQrcode_win','../browseQrcode/browseQrcode_win',{pageId:pageidA[0],id:pageidA[1],departmentId:pageidA[2],title:title},'');
      // $event.openWin('QrcodeDetaile','QrcodeDetaile',{pageId:pageidA[0],id:pageidA[1],departmentId:pageidA[2],flag:true},'');
    }
</script>
