scott
/
crm


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285
							{extend name="public/layout"}
{block name="body"}
<style>
  .layui-table thead tr,
	.layui-table-header {
		background-color: #D8E6F1 !important;
	}
  .layui-form{
    margin-bottom: 10px;
  }
  .layui-btn-xs,.layui-btn-xs:hover {
		border: 1px solid #249EFB;
		background-color: #fff;
		color: #249EFB;
		padding: 0px 10px;
	}
  .layui-btn-danger,.layui-btn-danger:hover{
		color: #FF5722;
		background-color: #fff;
		border: 1px solid #FF5722;
		padding: 0px 10px;
	}
</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">
          <div class="layui-form">
            <div class="layui-inline">
              <input type="text" class="layui-input" id="name" placeholder="搜索姓名">
            </div>
            <div class="layui-inline">
              <input type="text" class="layui-input" id="nickname" placeholder="搜索昵称">
            </div>
            <div class="layui-inline">
              <input type="text" class="layui-input" id="mobile" placeholder="搜索手机号">
            </div>
            <div class="layui-inline">
              <select id="course">
                <option value="">按活动场次筛选</option>
                {volist name="course" id="item"}
                <option value="{$item.cid}">{$item.start_time} / {$item.title}</option>
                {/volist}
              </select>
            </div>
            <button class="layui-btn" data-type="reload"><i class="layui-icon layui-icon-search layuiadmin-button-btn"></i></button>
            <div class="layui-inline" style="margin-left: 80px;">
              <input type="checkbox" id="show" title="只显示带手机号的用户" lay-skin="primary"
                     lay-filter="mobile" value="0">
            </div>
            <button class="layui-btn" id="export" style="float: right;">导出</button>
          </div>
          <table class="layui-hide" id="user" lay-filter="user"></table>
        </div>
      </div>
    </div>
  </div>
</div>
{/block}
{block name="js"}
<script id="opt" type="text/html">
  <a class="layui-btn layui-btn-xs" lay-event="msg" title="消息记录">消息记录</a>
  <a class="layui-btn layui-btn-xs" lay-event="gift" title="送礼记录">送礼记录</a>
  <a class="layui-btn layui-btn-xs" lay-event="redbag" title="红包领取记录">红包领取记录</a>
  <a class="layui-btn layui-btn-xs" lay-event="visit" title="浏览记录">浏览记录</a>
  <a class="layui-btn layui-btn-xs remark" lay-event="remark" title="跟进" data-content="{{ d.remark }}">跟进</a>
</script>
<script id="sex" type="text/html">
  {{# if(d.sex == 1){ }}
  <i class="layui-icon" style="color:#4343ee">&#xe662;</i>
  {{# }else{ }}
  <i class="layui-icon" style="color:#e04e4e">&#xe661;</i>
  {{# } }}
</script>
<script id="equip" type="text/html">
  {{# if(d.equip == '安卓'){ }}
  <i class="layui-icon" style="color:#43c343">&#xe684;</i>
  {{# }else if(d.equip == 'Iphone') { }}
  <i class="layui-icon" style="color:#b0b0b0">&#xe680;</i>
  {{# }else if(d.equip == 'MAC'){ }}
  <i class="iconfont" style="color:#b0b0b0">&#xe689;</i>
  {{# }else{ }}
  <i class="layui-icon" style="color:#04e1fdcf">&#xe67f;</i>
  {{# } }}
</script>
<script id="mb" type="text/html">
  {{# if(d.mobile != ""){ }}
  <span class="mb" data-type="{{d.type}}">{{ d.mobile }}</span>
  {{# }else{ }}
  <span style="color:#c0c4cc">未采集</span>
  {{# } }}
</script>
<script>
  var indexurl = '{:url("broad/customer")}';
  var msgurl = '{:url("broad/customer_msg")}';
  var visiturl = '{:url("broad/customer_visit")}';
  var redbagurl = '{:url("broad/customer_redbag")}';
  var gifturl = '{:url("broad/customer_gift")}';
  var remarkurl = '{:url("broad/customer_remark")}';
  var active;
  layui.use(['table', 'laydate', 'layer'], function () {
    var laydate = layui.laydate,
        form = layui.form,
        table = layui.table,
        layer = layui.layer,
        $ = layui.jquery;
    active = {
      reload: function () {
        var name = $('#name');
        var nickname = $('#nickname');
        var mobile = $('#mobile');
        var show = $('#show');
        var course = $('#course');
        table.reload('userTable', {
          page: {
            curr: 1
          }
          , where: {
            name: name.val(),
            nickname: nickname.val(),
            mobile: mobile.val(),
            show: show.val(),
            courseId: course.val()
          }
        });
      }
      , msg: function () {
        var uid = this.data.uid;
        var url = msgurl + '?uid=' + uid;
        log(url, '消息记录');
      }
      , visit: function () {
        var uid = this.data.uid;
        var url = visiturl + '?uid=' + uid;
        log(url, '浏览记录');
      }
      , redbag: function () {
        var uid = this.data.uid;
        var url = redbagurl + '?uid=' + uid;
        log(url, '红包记录');
      }
      , gift: function () {
        var uid = this.data.uid;
        var url = gifturl + '?uid=' + uid;
        log(url, '送礼记录');
      }
      , remark: function () {
        var uid = this.data.uid;
        var url = remarkurl + '?uid=' + uid;
        log(url, '备注');
      }
    };
    function log(url, title) {
      layer.open({
        type: 2,
        shadeClose: true,
        closeBtn: 0,
        title: [title, 'color:#333333;background-color:#D8E6F1;'],
        area: ['80%', '80%'],
        resize: false,
        content: url
      });
    }

    laydate.render({
      elem: '#date'
      , range: true
    });

    //展示已知数据
    table.render({
      elem: '#user'
      , url: indexurl
      , page: true
      , limit: 15
      , limits: [15, 20, 30, 40, 50, 60, 70, 80, 90]
      , autoSort: true
      , cols: [[ //标题栏
        { type: 'numbers', title: '序号', fixed: 'left', width: 50 }
        , { field: 'nickname', title: '昵称' }
        , {
          field: 'name', title: '姓名', templet: function (d) {
            return d.name == '' ? '<span style="color:#c0c4cc">未采集</span>' : '<span style="color:#009688;">' + d.name + '</span>';
          }
        }
        , { templet: '#mb', title: '电话', minWidth: 120 }
        , { templet: '#sex', title: '性别', width: 60, align: 'center' }
        , {
          templet: function (d) {
            return d.city == '' ? '<span style="color:#c0c4cc">未知</span>' : d.province + d.city;
          }, title: '地域', width: 100
        }
        , { field: 'from', title: '邀请人', width: 100 }
        , { templet: '#equip', title: '设备', width: 60, align: 'center' }
        , {
          title: '累计访问时间', field: 'time', width: 150,
          templet: function (d) {
            var time = '';
            if (d.time >= 3600) {
              time += parseInt(d.time / 3600) + '时';
            }
            if (d.time >= 60) {
              time += parseInt(d.time % 3600 / 60) + '分';
            }
            time += parseInt(d.time % 3600 % 60) + '秒';
            return time;
          }
        }
        , { field: 'num', title: '访问次数', width: 90 }
        , { fixed: 'right', title: '操作', toolbar: '#opt', width: 350, align: 'center' }
      ]]
      , id: 'userTable'
    });
    table.on('tool(user)', function (obj) {
      var type = obj.event;
      active[type] ? active[type].call(obj) : '';
    })
    $('.layui-form>.layui-btn').on('click', function () {
      var type = $(this).data('type');
      active[type] ? active[type].call(this) : '';
    });

    table.on('sort(user)', function (obj) {
      table.reload('userTable', {
        initSort: obj
        , where: obj
      });
    });

    $('body').on('mouseover', '.mb', function () {
      var type = $(this).data('type');
      layer.tips(type, this, {
        tips: [1, '#3595CC'],
        time: 2000
      });
    });
    $('body').on('mouseover', '.remark', function () {
      var content = $(this).data('content');
      if (content != '') {
        layer.tips(content, this, {
          tips: [1, '#3595CC'],
          time: 2000
        });
      }
    });

    form.on('checkbox(mobile)', function (data) {
      var that = $(data.elem);
      if (data.elem.checked) {
        that.val(1);
        active.reload();
      } else {
        that.val(0);
        active.reload();
      }
    });

    $('#export').click(function () {
      var loading = layer.load(1, {shade: [0.6,'#fff']});
      var name = $('#name');
      var nickname = $('#nickname');
      var mobile = $('#mobile');
      var show = $('#show');
      var course = $('#course');
      var page = $('.layui-table-page').find('.layui-laypage-curr').find('em').eq(1).html();
      var limit = $('.layui-table-page').find('select').val();
      $.ajax({
        type: 'post',
        url: '{:url("broad/customer_export")}',
        data: {name: name.val(),nickname: nickname.val(),mobile: mobile.val(),show: show.val(),courseId: course.val(),page: page,limit: limit},
        success: function (resp) {
          var res = JSON.parse(resp);
          table.exportFile(['昵称','姓名','电话','性别','地域','邀请人','设备','累计访问时间','访问次数'], res, 'xls');
          layer.close(loading);
        }
      });
    });

  });
</script>

{/block}