crm/app/sys/view/statistics/customer_list.html

{extend name="public/layout" /}
{block name="title"}客户统计列表{/block}
{block name="head"}
{include file="public/head"}
<style>
  html,
  body {
    min-width: 1100px;
  }

  .layui-table th:last-child {
    border-right: none;
  }

  .layui-table-view .layui-table {
    /* width:100% */
  }

  .layui-table thead tr,
  .layui-table-header {
    background-color: #D8E6F1 !important;
  }

  .line-middle {
    width: 10px;
    height: 100%;
    margin: 0px 10px;
  }

  .line {
    width: 10px;
    height: 2px;
    background-color: #999999;
  }

  .mb0 {
    margin-bottom: 0px;
  }

  .layui-btn {
    background-color: #fff;
    color: #555;
    border: 1px solid #c9c9c9
  }

  .layui-btn:hover {
    background-color: #fff;
    color: #555;
    border: 1px solid #249efb;
  }

  .layui-btn-primary,
  .sBtn {
    background-color: #249efb;
    color: #fff;
    border: 1px solid #249efb;
  }

  .layui-btn-primary:hover {
    background-color: #249efb;
    color: #fff;
    border: 1px solid #249efb;
  }

  .sBtn:hover {
    background-color: #249efb;
    color: #fff;
    border: 1px solid #249efb;
  }

  .flex-row,
  .row {
    display: flex;
  }

  .align-center {
    align-items: center;
  }

  .ml10 {
    margin-left: 10px;
  }

  .mt10 {
    margin-top: 10px;
  }

  .padding-tlr {
    padding: 15px 15px 0px;
  }

  .layui-input-block {
    margin-left: 0px;
  }

  .justify-between {
    justify-content: space-between;
  }

  table tr td a {
    color: #249EFB;
  }

  .qdtj_m {
    padding: 0 15px;
    width: 100%;
    box-sizing: border-box;
    margin: 20px 0 10px;
  }

  .qdtj_ul {
    overflow: hidden;
    border: 1px solid #94D0FF;
    padding: 15px 0;
    background-color: #FBFDFF;
  }

  .qdtj_ul li {
    float: left;
    position: relative;
    text-align: center;
    width: 10%;
  }

  .qdtj_1 {
    font-size: 20px;
    font-weight: 400;
  }

  .qdtj_2 {
    font-size: 14px;
    color: #888;
    margin-top: 5px
  }

  .qdtj_r_x {
    height: 40px;
    width: 1px;
    background: #D8D8D9;
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -20px;
  }

  .layui-card-body .layui-table-body {
    overflow-y: auto !important;
    height: 75vh;
  }

  .layui-table td,
  .layui-table th,
  .layui-table-col-set,
  .layui-table-fixed-r,
  .layui-table-grid-down,
  .layui-table-header,
  .layui-table-page,
  .layui-table-tips-main,
  .layui-table-tool,
  .layui-table-total,
  .layui-table-view,
  .layui-table[lay-skin=line],
  .layui-table[lay-skin=row] {
    border-color: #ccc !important;
  }

  .layui-table-fixed-r .layui-table-body {
    overflow: hidden !important;
  }

  .relative {
    position: relative;
  }

  .lay-setting {
    position: absolute;
    right: 40px;
    top: 20px;
    z-index: 999 !important;
    cursor: pointer;
  }

  .selectDateBox {
    position: absolute;
    width: 330px;
    height: 100px;
    box-shadow: 0 2px 4px rgb(0 0 0 / 12%);
    background-color: #fff;
    z-index: 99999 !important;
    top: 45px;
    box-sizing: border-box;
    padding: 5px 8px;
  }

  .selecstDateBox {
    position: absolute;
    width: 330px;
    height: 100px;
    box-shadow: 0 2px 4px rgb(0 0 0 / 12%);
    background-color: #fff;
    z-index: 99999 !important;
    top: 45px;
    right: 0;
    box-sizing: border-box;
    padding: 5px 8px;
  }

  .date-flex,
  .date-flex1 {
    display: flex;
    align-items: center;
  }

  .date-box {
    padding: 15px 0px 10px;
  }

  #rangeDepart {
    width: 260px;
    height: 38px;
  }

  xm-select>.xm-body {
    z-index: 99999 !important;
  }
  xm-select > .xm-label .scroll .label-content {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
  }
  xm-select > .xm-label .scroll .label-content::-webkit-scrollbar {
    display: none;
  }
</style>
{/block}
{block name="body"}
<div class="layui-fluid" style="background-color: #fff;">
  <div class="layui-card">
    <div class="search-form layui-form padding-tlr">
      <div class="flex-row align-center justify-between">
        <div class="flex-row align-center">
          <div class="layui-input-block" style="margin-right: 10px;">
            <button class="layui-btn ml10" id="tablebtn">导出</button>
          </div>
          <div class="layui-input-block" style="line-height:36px;">
            <a href="javascript:void(0)" id="customer-export-list" style="color:#249efb;">查看</a>
          </div>
        </div>
        <div class="flex-row align-center">
          <div class="layui-input-block">
            <input type="text" class="layui-input" id="employee_name" autocomplete="off" name="employee_name"
              placeholder="请输入员工名称">
          </div>
          <div class="layui-input-inline layui-form ml10">
            <div id="rangeDepart"></div>
          </div>

          <div class="layui-input-inline layui-form ml10" style="display:inline-block;width:210px;">
            <!-- <label class="layui-form-label" style="width: 60px;">跟进时间</label> -->
            <div class="layui-input-inline select-date relative">
              <!-- 注意：这一层元素并不是必须的 -->
              <input type="text" class="layui-input" id="sDate" name="start_date" placeholder="开始日期 - 结束日期"
                autocomplete="off">
              <div data-type="" class="selecstDateBox layui-hide">
                <div data-type="" class="date-flex1">
                  <div data-type="today" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">今日
                  </div>
                  <div data-type="yesterday" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">昨日</div>
                  <div data-type="week" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">本周
                  </div>
                  <div data-type="lastWeek" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">上周</div>
                  <div data-type="month" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">本月
                  </div>
                  <div data-type="lastMonth" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">上月</div>
                  <div data-type="all" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">
                    累计</div>
                </div>
                <div data-type="" class="date-box">
                  <input data-type="" type="text" id="select_sDate" placeholder="选择开始时间 - 结束时间" readonly
                    autocomplete="off" class="layui-input">
                </div>
              </div>
            </div>
          </div>

          <div class="layui-input-inline layui-form ml10">
            <select name="source_id" class="type_id" id="source_id" lay-search>
              <option value="">请选择来源</option>
              {volist name="source" id="i"}
              <option value="{$i.id}">{$i.source}</option>
              {/volist}
            </select>
          </div>
                    <div class="layui-input-inline layui-form ml10">
                        <select name="customer_type" id="customer_type_ele" lay-search>
                            <option value="">客户种类</option>
                            <option value="1">资源库</option>
                            <option value="2">活动报名</option>
                            <option value="3">装修推荐官</option>
                            <option value="4">自建</option>
                            <option value="5">公海获取</option>
                        </select>
                    </div>
                </div>
                <div style="width:160px;display: flex;">
                    <button class="layui-btn sBtn ml10 submitbtn" lay-submit lay-filter="table-search">筛选</button>
                    <button class="layui-btn sBtn" style="margin-left: 18px;" id="resetbtn" type="reset">重置</button>
                </div>
            </div>
        </div>
        <div class="layui-card-body relative">
			<i class="layui-icon layui-icon-set-fill lay-setting"></i>
            <table lay-filter="datalist" id="list"></table>
        </div>
    </div>
</div>
{/block}
{block name="js"}
<script src="__STATIC__/layui/layui/lay/modules/xm-select.js" type="text/javascript" charset="utf-8"></script>
<script type="text/html" id="name">
    {{# if(d.name == '未知'){ }}
    <span style="color: #CCCCCC">{{d.name}}</span>
    {{# }else{ }}
    <span>{{d.name}}</span>
    {{# } }}
</script>
<script type="text/html" id="community_name">
    {{# if(d.community_name == '未知'){ }}
    <span style="color: #CCCCCC">{{d.community_name}}</span>
    {{# }else{ }}
    <span>{{d.community_name}}</span>
    {{# } }}
</script>
<script type="text/html" id="house_type">
    {{# if(d.house_type == '未知'){ }}
    <span style="color: #CCCCCC">{{d.house_type}}</span>
    {{# }else{ }}
    <span>{{d.house_type}}</span>
    {{# } }}
</script>
<script type="text/html" id="house_delivery_time">
    {{# if(d.house_delivery_time == '未知'){ }}
    <span style="color: #CCCCCC">{{d.house_delivery_time}}</span>
    {{# }else{ }}
    <span>{{d.house_delivery_time}}</span>
    {{# } }}
</script>
<script type="text/html" id="square">
    {{# if(d.square == '未知'){ }}
    <span style="color: #CCCCCC">{{d.square}}</span>
    {{# }else{ }}
    <span>{{d.square}}</span>
    {{# } }}
</script>
<script type="text/html" id="employee">
    {{# if(d.employee_name == '无'){ }}
    <span style="color: #CCCCCC">{{d.employee_name}}</span>
    {{# }else{ }}
    <span>{{d.employee_name}}</span>
    {{# } }}
</script>
<script type="text/html" id="source">
    {{# if(d.source_name == '未知'){ }}
    <span style="color: #CCCCCC">{{d.source_name}}</span>
    {{# }else{ }}
    <span>{{d.source_name}}</span>
    {{# } }}
</script>
<script type="text/html" id="assigned_personal_manager">
    {{# if(d.assigned_personal_manager == '无'){ }}
    <span style="color: #CCCCCC">{{d.assigned_personal_manager}}</span>
    {{# }else{ }}
    <span>{{d.assigned_personal_manager}}</span>
    {{# } }}
</script>
<script type="text/html" id="assigned_personal_designer_org">
    {{# if(d.assigned_personal_designer_org == '无'){ }}
    <span style="color: #CCCCCC">{{d.assigned_personal_designer_org}}</span>
    {{# }else{ }}
    <span>{{d.assigned_personal_designer_org}}</span>
    {{# } }}
</script>
<script type="text/html" id="assigned_personal_designer">
    {{# if(d.assigned_personal_designer == '无'){ }}
    <span style="color: #CCCCCC">{{d.assigned_personal_designer}}</span>
    {{# }else{ }}
    <span>{{d.assigned_personal_designer}}</span>
    {{# } }}
</script>
<script type="text/html" id="add_wechat_type">
    {{# if(d.add_wechat_type == '无'){ }}
    <span style="color: #CCCCCC">{{d.add_wechat_type}}</span>
    {{# }else{ }}
    <span>{{d.add_wechat_type}}</span>
    {{# } }}
</script>
<script type="text/html" id="add_wechat_time">
    {{# if(d.add_wechat_time == '无'){ }}
    <span style="color: #CCCCCC">{{d.add_wechat_time}}</span>
    {{# }else{ }}
    <span>{{d.add_wechat_time}}</span>
    {{# } }}
</script>
<script type="text/html" id="group_building_date">
    {{# if(d.group_building_date == '无'){ }}
    <span style="color: #CCCCCC">{{d.group_building_date}}</span>
    {{# }else{ }}
    <span>{{d.group_building_date}}</span>
    {{# } }}
</script>
<script type="text/html" id="liangfang_date">
    {{# if(d.liangfang_date == '无'){ }}
    <span style="color: #CCCCCC">{{d.liangfang_date}}</span>
    {{# }else{ }}
    <span>{{d.liangfang_date}}</span>
    {{# } }}
</script>
<script type="text/html" id="once_liangfang_days">
    {{# if(d.once_liangfang_days == '无'){ }}
    <span style="color: #CCCCCC">{{d.once_liangfang_days}}</span>
    {{# }else{ }}
    <span>{{d.once_liangfang_days}}</span>
    {{# } }}
</script>
<script type="text/html" id="plan_issuing_date">
    {{# if(d.plan_issuing_date == '无'){ }}
    <span style="color: #CCCCCC">{{d.plan_issuing_date}}</span>
    {{# }else{ }}
    <span>{{d.plan_issuing_date}}</span>
    {{# } }}
</script>
<script type="text/html" id="daodian_date">
    {{# if(d.daodian_date == '无'){ }}
    <span style="color: #CCCCCC">{{d.daodian_date}}</span>
    {{# }else{ }}
    <span>{{d.daodian_date}}</span>
    {{# } }}
</script>
<script type="text/html" id="once_daodian_shop">
    {{# if(d.once_daodian_shop == '无' || d.once_daodian_shop == '未知'){ }}
    <span style="color: #CCCCCC">{{d.once_daodian_shop}}</span>
    {{# }else{ }}
    <span>{{d.once_daodian_shop}}</span>
    {{# } }}
</script>
<script type="text/html" id="twice_daodian_shop">
    {{# if(d.twice_daodian_shop == '无' || d.twice_daodian_shop == '未知'){ }}
    <span style="color: #CCCCCC">{{d.twice_daodian_shop}}</span>
    {{# }else{ }}
    <span>{{d.twice_daodian_shop}}</span>
    {{# } }}
</script>
<script type="text/html" id="once_daodian_days">
    {{# if(d.once_daodian_days == '无'){ }}
    <span style="color: #CCCCCC">{{d.once_daodian_days}}</span>
    {{# }else{ }}
    <span>{{d.once_daodian_days}}</span>
    {{# } }}
</script>
<script type="text/html" id="liangfang_daodian_days">
    {{# if(d.liangfang_daodian_days == '无'){ }}
    <span style="color: #CCCCCC">{{d.liangfang_daodian_days}}</span>
    {{# }else{ }}
    <span>{{d.liangfang_daodian_days}}</span>
    {{# } }}
</script>
<script type="text/html" id="twice_daodian_date">
    {{# if(d.twice_daodian_date == '无'){ }}
    <span style="color: #CCCCCC">{{d.twice_daodian_date}}</span>
    {{# }else{ }}
    <span>{{d.twice_daodian_date}}</span>
    {{# } }}
</script>
<script type="text/html" id="twice_daodian_days">
    {{# if(d.twice_daodian_days == '无'){ }}
    <span style="color: #CCCCCC">{{d.twice_daodian_days}}</span>
    {{# }else{ }}
    <span>{{d.twice_daodian_days}}</span>
    {{# } }}
</script>
<script type="text/html" id="deposit_date">
    {{# if(d.deposit_date == '无'){ }}
    <span style="color: #CCCCCC">{{d.deposit_date}}</span>
    {{# }else{ }}
    <span>{{d.deposit_date}}</span>
    {{# } }}
</script>
<script type="text/html" id="drawing_date">
    {{# if(d.drawing_date == '无'){ }}
    <span style="color: #CCCCCC">{{d.drawing_date}}</span>
    {{# }else{ }}
    <span>{{d.drawing_date}}</span>
    {{# } }}
</script>
<script type="text/html" id="sign_date">
    {{# if(d.sign_date == '无'){ }}
    <span style="color: #CCCCCC">{{d.sign_date}}</span>
    {{# }else{ }}
    <span>{{d.sign_date}}</span>
    {{# } }}
</script>
<script type="text/html" id="sign_days">
    {{# if(d.sign_days == '无'){ }}
    <span style="color: #CCCCCC">{{d.sign_days}}</span>
    {{# }else{ }}
    <span>{{d.sign_days}}</span>
    {{# } }}
</script>
<script type="text/html" id="signed_money">
    {{# if(d.signed_money_data){ }}
    <span>{{d.signed_money_data}}</span>
    {{# }else{ }}
    <span style="color: #CCCCCC">无</span>
    {{# } }}
</script>
<script type="text/html" id="first_visit_no_sign">
    {{# if(d.first_visit_no_sign == '无'){ }}
    <span style="color: #CCCCCC">{{d.first_visit_no_sign}}</span>
    {{# }else{ }}
    <span>{{d.first_visit_no_sign}}</span>
    {{# } }}
</script>
<script type="text/html" id="manager_visit_times">
    {{# if(d.manager_visit_times == '无'){ }}
    <span style="color: #CCCCCC">{{d.manager_visit_times}}</span>
    {{# }else{ }}
    <span>{{d.manager_visit_times}}</span>
    {{# } }}
</script>
<script type="text/html" id="manager_visit_cycle">
    {{# if(d.manager_visit_cycle == '无'){ }}
    <span style="color: #CCCCCC">{{d.manager_visit_cycle}}</span>
    {{# }else{ }}
    <span>{{d.manager_visit_cycle}}</span>
    {{# } }}
</script>
<script type="text/html" id="employee_visit_times">
    {{# if(d.employee_visit_times == '无'){ }}
    <span style="color: #CCCCCC">{{d.employee_visit_times}}</span>
    {{# }else{ }}
    <span>{{d.employee_visit_times}}</span>
    {{# } }}
</script>
<script type="text/html" id="employee_visit_cycle">
    {{# if(d.employee_visit_cycle == '无'){ }}
    <span style="color: #CCCCCC">{{d.employee_visit_cycle}}</span>
    {{# }else{ }}
    <span>{{d.employee_visit_cycle}}</span>
    {{# } }}
</script>
<script type="text/html" id="group_building_date">
    {{# if(d.group_building_date == '无'){ }}
    <span style="color: #CCCCCC">{{d.group_building_date}}</span>
    {{# }else{ }}
    <span>{{d.group_building_date}}</span>
    {{# } }}
</script>
<script type="text/html" id="cz">
    <a class="layui-btn layui-btn-xs " lay-event="toview">详情</a>
    <a class="layui-btn layui-btn-xs layui-btn-warm" lay-event="foot">足迹</a>
    <a class="layui-btn layui-btn-xs " lay-event="log">跟进记录</a>
</script>
<script>
  layui.use(['table', 'form', 'laydate', 'element'], function () {
    let table = layui.table,
      laydate = layui.laydate,
      form = layui.form,
      element = layui.element,
      $ = layui.$;
    $('body').attr('layadmin-themealias', 'default');
    var bodyH = $('.body-h').height() * 0.82;
    var istypes = 0;
    //执行一个laydate实例
    // laydate.render({
    //     elem: '#sDate' //指定元素
    // });
    // laydate.render({
    //     elem: '#eDate' //指定元素
    // });

    $('#addWechatTime').click(function () {
      $('.selectDateBox').toggleClass('layui-hide');
      $('.selecstDateBox').addClass('layui-hide');
    })
    $('#sDate').click(function () {
      $('.selecstDateBox').toggleClass('layui-hide');
      $('.selectDateBox').addClass('layui-hide');
    })
    laydate.render({
      elem: '#select_date'
      , type: 'date'
      , range: true
      , format: 'yyyy/MM/dd'
      , trigger: 'click',//呼出事件改成click
      done: function (value, date, endDate) {
        $('.selectDateBox').addClass('layui-hide');
        $('#addWechatTime').val(value);
      }
    });
    laydate.render({
      elem: '#select_sDate' //指定元素
      , type: 'date'
      , format: 'yyyy/MM/dd'
      , range: true
      , trigger: 'click',//呼出事件改成click
      done: function (value, date, endDate) {
        $('.selecstDateBox').addClass('layui-hide');
        $('#sDate').val(value);
      }
    });
    var dateObj = {};
    setDate();
    function setDate() {
      let date = new Date();
      let year = date.getFullYear();
      let month = date.getMonth() + 1;
      let day = date.getDate();
      let lastDate = new Date(new Date().getTime() - (1 * 24 * 60 * 60 * 1000));
      let lastYear = lastDate.getFullYear();
      let lastMonth = lastDate.getMonth() + 1;
      let lastDay = lastDate.getDate();

      let weekObj = getMondayAndSunday();
      let monthObj = getMonthFirstDayAndLastDay();
      dateObj = {
        today: `${year}/${month}/${day}`,
        yesterday: `${lastYear}/${lastMonth}/${lastDay}`,
        ...weekObj,
        ...monthObj
      }
    }


    var departTree = xmSelect.render({
      el: "#rangeDepart",
      name: 'select_org_id',
      autoRow: true,
      filterable: true,
      tips: '请选择',
      tree: {
        show: true,
        showFolderIcon: true,
        showLine: true,
        indent: 20,
        expandedKeys: [-3],
        //是否严格遵守父子模式
        strict: false,
      },
      height: "200px",
      data: [],
      //文本显示模式
      //处理方式
    });

    $.ajax({
      url: '{:url("statistics/get_person")}',
      type: "post",
      data: {},
      success: function (res) {
        departTree.update({ data: res })
      }
    })




    $('.date-flex div').click(function () {
      let type = $(this).prop('dataset').type;
      if (type == 'today') {
        $('#select_date').val(`${dateObj.today} - ${dateObj.today}`);
        $('#addWechatTime').val(`${dateObj.today} - ${dateObj.today}`);
      } else if (type == 'yesterday') {
        $('#select_date').val(`${dateObj.yesterday} - ${dateObj.yesterday}`);
        $('#addWechatTime').val(`${dateObj.yesterday} - ${dateObj.yesterday}`);
      } else if (type == 'week') {
        $('#select_date').val(`${dateObj.thisWeekMonday} - ${dateObj.thisWeekSunday}`);
        $('#addWechatTime').val(`${dateObj.thisWeekMonday} - ${dateObj.thisWeekSunday}`);
      } else if (type == 'lastWeek') {
        $('#select_date').val(`${dateObj.lastWeekMonday} - ${dateObj.lastWeekSunday}`);
        $('#addWechatTime').val(`${dateObj.lastWeekMonday} - ${dateObj.lastWeekSunday}`);
      } else if (type == 'month') {
        $('#select_date').val(`${dateObj.thisMonthFirstDay} - ${dateObj.thisMonthLastDay}`);
        $('#addWechatTime').val(`${dateObj.thisMonthFirstDay} - ${dateObj.thisMonthLastDay}`);
      } else if (type == 'lastMonth') {
        $('#select_date').val(`${dateObj.lastMonthFirstDay} - ${dateObj.lastMonthLastDay}`);
        $('#addWechatTime').val(`${dateObj.lastMonthFirstDay} - ${dateObj.lastMonthLastDay}`);
      } else {
        $('#select_date').val('');
        $('#sDate').val('')
        $('#addWechatTime').val('');
      }
      $('.selectDateBox').addClass('layui-hide');
    })

    $('.date-flex1 div').click(function () {
      let type = $(this).prop('dataset').type;
      if (type == 'today') {
        itmesss = dateToYYYYMMDD(dateObj.today);
        itmesss2 = dateToYYYYMMDD(dateObj.today);
        $('#select_sDate').val(itmesss + ' - ' + itmesss2);
        $('#sDate').val(itmesss + ' - ' + itmesss2);
      } else if (type == 'yesterday') {
        itmesss = dateToYYYYMMDD(dateObj.yesterday);
        itmesss2 = dateToYYYYMMDD(dateObj.yesterday);
        $('#select_sDate').val(itmesss + ' - ' + itmesss2);
        $('#sDate').val(itmesss + ' - ' + itmesss2);
      } else if (type == 'week') {
        $('#select_sDate').val(`${dateObj.thisWeekMonday} - ${dateObj.thisWeekSunday}`);
        $('#sDate').val(`${dateObj.thisWeekMonday} - ${dateObj.thisWeekSunday}`);
      } else if (type == 'lastWeek') {
        $('#select_sDate').val(`${dateObj.lastWeekMonday} - ${dateObj.lastWeekSunday}`);
        $('#sDate').val(`${dateObj.lastWeekMonday} - ${dateObj.lastWeekSunday}`);
      } else if (type == 'month') {
        $('#select_sDate').val(`${dateObj.thisMonthFirstDay} - ${dateObj.thisMonthLastDay}`);
        $('#sDate').val(`${dateObj.thisMonthFirstDay} - ${dateObj.thisMonthLastDay}`);
      } else if (type == 'lastMonth') {
        $('#select_sDate').val(`${dateObj.lastMonthFirstDay} - ${dateObj.lastMonthLastDay}`);
        $('#sDate').val(`${dateObj.lastMonthFirstDay} - ${dateObj.lastMonthLastDay}`);
      } else {
        $('#select_sDate').val('');
        $('#sDate').val('');
      }
      $('.selecstDateBox').addClass('layui-hide');
    })

    function getMondayAndSunday() {
      var today = new Date();

      //构建当前日期,格式：2022-08-22 00:00:00
      var year = today.getFullYear(); //本年 
      var month = today.getMonth() + 1; //本月
      var day = today.getDate(); //本日
      var newDate = new Date(year + "/" + month + "/" + day + " 00:00:00"); //年月日拼接

      var nowTime = newDate.getTime(); //当前的时间戳
      var weekDay = newDate.getDay(); //当前星期 0.1.2.3.4.5.6 【0 = 周日】

      var oneDayTime = 24 * 60 * 60 * 1000; //一天的总ms

      // 当前星期减去天数，如今天为周五，则本周一为周五的时间戳减去4天的时间戳。但周日特殊，周一至周六是周几的到的weekDay就是几，但是周日的到的为0，需特殊处理
      var thisWeekMondayTime = (1 - weekDay) * oneDayTime + nowTime; //本周一的时间戳
      if (weekDay == 0) {
        // weekDay = 0 为周日，此时本周一时间为周日减去6天的时间
        thisWeekMondayTime = nowTime - 6 * oneDayTime
      }

      var thisWeekSundayTime = thisWeekMondayTime + 6 * 24 * 60 * 60 * 1000 // 本周日

      var lastWeekMondayTime = thisWeekMondayTime - 7 * oneDayTime // 上周一
      var lastWeekSundayTime = thisWeekMondayTime - oneDayTime // 上周日

      var res = {
        thisWeekMonday: dateToYYYYMMDD(thisWeekMondayTime),
        thisWeekSunday: dateToYYYYMMDD(thisWeekSundayTime),
        lastWeekMonday: dateToYYYYMMDD(lastWeekMondayTime),
        lastWeekSunday: dateToYYYYMMDD(lastWeekSundayTime),
      }
      return res;
    }

    function getMonthFirstDayAndLastDay() {
      var date = new Date()
      // 值得注意的是，如果day取值为0，意味着取的是date时间的上一个月的最后一天，简单理解：date当前月的第一天，再减去一天
      var thisMonthFirstDay = date.setDate(1) // 本月第一天
      var thisMonthLastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0) // 本月最后一天

      var lastMonthFirstDay = new Date(date.getFullYear(), date.getMonth() - 1, 1) // 上月第一天

      var lastMonthLastDay = date.setDate(0) // 上月最后一天
      // var day = new Date(date.getFullYear(), date.getMonth(), 0).getDate()
      // var lastMonthLastDay = new Date(date.getFullYear(), date.getMonth() - 1, day) // 上月最后一天
      var res = {
        thisMonthFirstDay: dateToYYYYMMDD(thisMonthFirstDay),
        thisMonthLastDay: dateToYYYYMMDD(thisMonthLastDay),
        lastMonthFirstDay: dateToYYYYMMDD(lastMonthFirstDay),
        lastMonthLastDay: dateToYYYYMMDD(lastMonthLastDay),
      }
      return res
    }

    function dateToYYYYMMDD(date) {
      var time = new Date(date);
      var y = time.getFullYear();
      var m = (time.getMonth() + 1);
      m = m > 9 ? m : '0' + m;
      var d = time.getDate();
      d = d > 9 ? d : '0' + d;

      return y + "/" + m + "/" + d;
    }

    window.parent.ajaxslist = function () {
      ajaxlist();
    };
    ajaxlist();
    function ajaxlist() {
      $.ajax({
        type: "post",
        url: '{:url("statistics/fieldList")}',
        data: {
          type: 4
        },
        success: function (res) {
          data = res.data;
          tableData = JSON.parse(JSON.stringify(data));
          renderTableHtml(data);
        }
      });
    }
    function renderTableHtml(data) {
      msgindex = layer.msg('加载中...', {
        icon: 16, time: -1
      })
      let cols = [[]];
      Object.keys(data).forEach(key => {
        if (key == 'name' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#name', ...data[key] });
        } else if (key == 'community_name' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#community_name', ...data[key] });
        } else if (key == 'house_type' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#house_type', ...data[key] });
        } else if (key == 'house_delivery_time' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#house_delivery_time', ...data[key] });
        } else if (key == 'square' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#square', ...data[key] });
        } else if (key == 'employee_name' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#employee', ...data[key] });
        } else if (key == 'source_name' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#source', ...data[key] });
        } else if (key == 'assigned_personal_manager' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#assigned_personal_manager', ...data[key] });
        } else if (key == 'assigned_personal_designer_org' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#assigned_personal_designer_org', ...data[key] });
        } else if (key == 'assigned_personal_designer' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#assigned_personal_designer', ...data[key] });
        } else if (key == 'add_wechat_type' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#add_wechat_type', ...data[key] });
        } else if (key == 'add_wechat_time' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#add_wechat_time', ...data[key] });
        } else if (key == 'group_building_date' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#group_building_date', ...data[key] });
        } else if (key == 'liangfang_date' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#liangfang_date', ...data[key] });
        } else if (key == 'once_liangfang_days' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#once_liangfang_days', ...data[key] });
        } else if (key == 'plan_issuing_date' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#plan_issuing_date', ...data[key] });
        } else if (key == 'daodian_date' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#daodian_date', ...data[key] });
        } else if (key == 'once_daodian_shop' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#once_daodian_shop', ...data[key] });
        } else if (key == 'once_daodian_days' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#once_daodian_days', ...data[key] });
        } else if (key == 'liangfang_daodian_days' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#liangfang_daodian_days', ...data[key] });
        } else if (key == 'twice_daodian_date' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#twice_daodian_date', ...data[key] });
        } else if (key == 'twice_daodian_shop' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#twice_daodian_shop', ...data[key] });
        } else if (key == 'twice_daodian_days' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#twice_daodian_days', ...data[key] });
        } else if (key == 'deposit_date' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#deposit_date', ...data[key] });
        } else if (key == 'drawing_date' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#drawing_date', ...data[key] });
        } else if (key == 'sign_date' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#sign_date', ...data[key] });
        } else if (key == 'sign_days' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#sign_days', ...data[key] });
        } else if (key == 'signed_money_data' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#signed_money', ...data[key] });
        } else if (key == 'first_visit_no_sign' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#first_visit_no_sign', ...data[key] });
        } else if (key == 'manager_visit_times' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#manager_visit_times', ...data[key] });
        } else if (key == 'manager_visit_cycle' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#manager_visit_cycle', ...data[key] });
        } else if (key == 'employee_visit_times' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#employee_visit_times', ...data[key] });
        } else if (key == 'employee_visit_cycle' && data[key].show == 1) {
          cols[0].push({ title: data[key]['name'], align: 'center', field: key, templet: '#employee_visit_cycle', ...data[key] });
        } else {
          if (data[key].show == 1) {
            cols[0].push({ title: data[key]['name'], align: 'center', field: key, ...data[key] });
          }
        }
      })
      cols[0].push({ title: '', width: 30, align: 'center', fixed: "right" })
      let url = '{:url("statistics/customer_list_data")}';
      table.render({
        elem: '#list'
        , url: url
        , page: true
        , height: bodyH
        , cols: cols
        , id: 'tablelist'
        , limit: 50,
        done: function () {
          layer.close(msgindex);
        }
      });
    }

    $('.lay-setting').click(function () {
      let arr = [];
      $.each(data, function (key, val) {
        arr.push({ ...val, field: key });
      })
      localStorage.setItem('XQ$SORT', '4');
      window.parent.dialogFunc(arr, 4);
    })

    function setYMD(time) {
      let dateTime = new Date(time);
      let year = dateTime.getFullYear();
      let Month = dateTime.getMonth() + 1;
      let days = dateTime.getDate();
      return `${year}-${Month > 9 ? Month : '0' + Month}-${days > 9 ? days : '0' + days}`;
    }
    document.onkeydown = function (event) {
      var e = event || window.event || arguments.callee.caller.arguments[0];
      if (e && e.keyCode == 13) {
        $(".submitbtn").trigger("click");
      }
    };
    var dateArr = {};
    var today = new Date().getTime();
    var oneTime = 24 * 60 * 60 * 1000;
    var threeDay1 = today - 3 * oneTime;
    var sevenDay1 = today - 6 * oneTime;
    var oneMonth = today - 30 * oneTime;
    dateArr = {
      nowS: setYMD(today),
      nowE: setYMD(today),
      threeDayS: setYMD(threeDay1),
      threeDayE: setYMD(today),
      sevenDayS: setYMD(sevenDay1),
      sevenDayE: setYMD(today),
      oneMonthS: setYMD(oneMonth),
      oneMonthE: setYMD(today),
    }

    $('#timeBtn').on('click', function (e) {
      if (!!(e.target.localName != 'input')) return;
      let o = document.querySelector('#timeBtn').children;
      if (e.target.classList.contains('layui-btn-primary') == true) {
        for (var i = 0; i < o.length; i++) {
          o[i].className = 'layui-btn';
        }
        $('#sDate').val('');
        $('#eDate').val('');
        return;
      } else {
        for (var i = 0; i < o.length; i++) {
          o[i].className = 'layui-btn';
        }
        e.target.className = 'layui-btn layui-btn-primary';
        if (!!(e.target.className.indexOf('layui-btn-primary') > 0)) {
          if (e.target.value == '今日') {
            $('#sDate').val(dateArr.nowS);
            $('#eDate').val(dateArr.nowE);
          } else if (e.target.value == '3天') {
            $('#sDate').val(dateArr.threeDayS);
            $('#eDate').val(dateArr.threeDayE);
          } else if (e.target.value == '7天') {
            $('#sDate').val(dateArr.sevenDayS);
            $('#eDate').val(dateArr.sevenDayE);
          } else {
            $('#sDate').val(dateArr.oneMonthS);
            $('#eDate').val(dateArr.oneMonthE);
          }
        }
      }
    })

    form.on('submit(table-search)', function (data) {
      let field = data.field;
      let element = $('.layui-btn-primary');
      if (element && element[0]) {
        let el = element[0].value;
      }
      let option = {
        where: field
        , page: {
          curr: 1
        }
      };
      //执行重载
      table.reload('tablelist', option);
    });
    //重置
    $('#resetbtn').click(function () {
      $('#employee_name').val('');
      $('#select_org_id').val('');
      $('#customer_type_ele').val('');
      $('#source_id').val('');
      $('#sDate').val('');
      $('#eDate').val('');
      $('#timeBtn').children().each(function () {
        $(this).removeClass('layui-btn-primary')
      })
      form.render();
      departTree.setValue([]);
      let option = {
        where: { start_date: "", end_date: "", select_org_id: "", employee_name: "" }
        , page: {
          curr: 1
        }
      };
      table.reload('tablelist', option);
    })

    //导出
    $('#tablebtn').click(function () {
      let sdate = $('#sDate').val();
      let edate = $('#eDate').val();
      // let select_org_id = $('#select_org_id').val();
      let select_org_id = departTree.getValue();
      orgid = select_org_id.length == 0 ? '' : select_org_id[0].id;
      let employee_name = $('#employee_name').val();
      let url = "{:url('statistics/export2',['m'=>'customer_list_data'])}";

      layer.confirm('确定要导出该查询结果么？', function () {
        $.post(url, { start_date: sdate, end_date: edate, employee_name: employee_name, select_org_id: orgid }, function (rs) {
          if (typeof rs == 'string') rs = JSON.parse(rs);
          layer.msg(rs.msg);
        })
      })
    })
    //调用内容
    table.on('tool(datalist)', function (obj) {
      var id = obj.data.id;
      var layEvent = obj.event;
      if (layEvent === 'foot') {
        layer.open({
          type: 2,
          title: ['客户足迹', 'color:#333333;background-color:#D8E6F1;'],
          content: '{:url("crm/foot")}?id=' + id,
          resize: false,
          area: ['80%', '80%']
        });
      } else if (layEvent === 'log') {
        layer.open({
          type: 2,
          title: ['跟进记录', 'color:#333333;background-color:#D8E6F1;'],
          content: '{:url("crm/log")}?id=' + id,
          resize: false,
          area: ['80%', '80%'],
          yes: function (index, layero) {
          }
        });
      } else if (layEvent === 'toview') {
        layer.open({
          type: 2,
          title: ['客户详情', 'color:#333333;background-color:#D8E6F1;'],
          content: '{:url("crm/view")}?id=' + id,
          resize: false,
          area: ['80%', '80%'],
          yes: function (index, layero) {
          }
        });
      }
    })

    $('#customer-export-list').click(function () {
      layer.open({
        type: 2,
        area: ['600px', '600px'],
        content: '{:url("statistics/exportList2",array("type"=>"customer_list_data"))}'
      });
    });
  })
</script>
{/block}