scott
/
crm


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190
							{extend name="public/layout"}
{block name="body"}
<style>
  html,body {
    background-color: #fff;
  }
  .layui-table thead tr,
	.layui-table-header {
		background-color: #D8E6F1 !important;
	}
</style>
<body>
  <div class="layui-fluid">
    <div class="layui-row layui-col-space15">
      <div class="layui-col-md12">
        <div class="layui-card">

          <div class="layui-card-body">
            <form class="layui-form" enctype="multipart/form-data" lay-filter="records">
              <div class="layui-form">
                <div class="layui-inline" style="width: 100%;">
                  <!--                                <span style="float:left"><a class="layui-btn layui-btn-xs" id="hotseting" >人气管理</a></span>-->
                  <p style="text-align: right; float:right">当前在线：<span id="onlinenumber" style="color:green"></span>
                    人<span>
                      <!-- <a class="layui-btn layui-btn-xs" id="refreshbutton">刷新</a></span> -->
                  </p>
                </div>
              </div>
            </form>
            <table class="layui-hide" id="records" lay-filter="records"></table>
          </div>
        </div>
      </div>
    </div>
  </div>
  {/block}
  {block name="js"}
  <script src="__STATIC__/js/jquery.min.js"></script>
  <script type="text/html" id="onlineTpl">
  {{# if(d.online) { }}
  <div style="text-align: center; color:green">在线</div>
  {{# }else{}}
  <div style="text-align: center; color:#c0c4cc;">离线</div>
  {{# } }}
</script>
  <script type="text/html" id="switchTpl">
  <input type="checkbox" name="state" value="{{d.id}}" lay-skin="switch" lay-text="开|关" lay-filter="state" {{
         d.state== 1 ? 'checked disabled' : '' }}>
</script>
  <script type="text/html" id="sex">
  {{#  if(d.sex == 1){ }}
  男
  {{#  }else if(d.sex==2){ }}
  女
  {{# }else { }}
  未知
  {{# } }}
</script>
  <script type="text/html" id="time">
  var time = math.floor({{d.time}});
</script>

  <script>
    var courseid = '{$cid}';
    var useLog = '{:url("broad/course_use_log")}';
    var hotsetting = '{:url("course/hotsetting")}';
    var ta;
    layui.use(['table', 'form'], function () {
      var date = new Date();
      var form = layui.form
        , table = layui.table
        , $ = layui.jquery
        , active = {
        };

      //展示已知数据
      ta = table.render({
        elem: '#records'
        , initSort: {
          field: 'online'
          , type: 'desc'
        }
        , height: 'full-110'
        , url: useLog + '?cid=' + courseid
        , parseData: function (res) { //res 即为原始返回的数据
          $('#onlinenumber').text(res.onlinenum);
          return {
            "code": res.code, //解析接口状态
            "count": res.count, //解析数据长度
            "data": res.data, //解析数据列表
          };
        }
        , page: true
        , autoSort: true
        , cols: [[ //标题栏
          { type: 'numbers', title: '序号', fixed: 'left', width: 50 }
          , { field: 'nickname', title: '微信昵称', width: 120 }
          , { field: 'sex', title: '性别', width: 80, templet: '#sex' }
          , { field: 'first_login_time', title: '第一次访问时间', sort: true }
          , {
            field: 'total_duration', title: '累计访问时间', templet: function (d) {
              total_i = parseInt(d.total_duration / 60); //总分钟
              i = total_i % 60;
              h = parseInt(total_i / 60);
              s = d.total_duration % 60;           //秒
              time = '';
              if (h !== 0) {
                time += h + '时';
              }
              if (i !== 0) {
                time += i + '分';
              }
              if (s !== 0) {
                time += s + '秒';
              }
              return time;
            }
          }
          , { field: 'online', title: '状态', toolbar: '#onlineTpl', width: 100, sort: true }
        ]]
        , id: 'recordTable'
      });

      $('.layui-form>.layui-btn').on('click', function () {
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
      });

      table.on('sort(records)', function (obj) {
        if (obj.type == null) obj.field = 'last_login_time';
        table.reload('recordTable', {
          initSort: obj
          , where: obj
        });
      });

      table.on('toolbar(records)', function (obj) {
        var type = obj.event;
        active[type] ? active[type].call(this) : '';
      });

      table.on('tool(records)', function (obj) {
        var type = obj.event;
        active[type] ? active[type].call(obj) : '';
      })
      form.on('switch(state)', function (obj) {
        var id = this.value;
        var cid = '{$cid}';

        $.post('{:url("course/vodstate")}', { id: id, cid: cid }, function (res) {
          if (res.code == 0) {
            layer.msg(res.msg, { anim: 0 }, function () {

            });
          } else {
            layer.msg(res.msg, { anim: 6 });
          }

          table.reload('recordTable', {
            page: {
              curr: 1 //重新从第 1 页开始
            }
          });
        });

      });

      $('#refreshbutton').on('click', function () {
        table.reload('recordTable', {
          page: {
            curr: 1 //重新从第 1 页开始
          }
        });
      });

      $('#hotseting').on('click', function () {
        layer.open({
          title: ['人气设置', 'color:#333333;background-color:#D8E6F1;'],
          type: 2,
          content: hotsetting + '?cid=' + courseid,
          resize: false,
          area: ['80%', '80%']
        });
      });


    });
  </script>

  {/block}