scott
/
crm


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333
							{extend name="public/layout"}
{block name="body"}
<style>
  .status .jihuo {
    display: none;
  }

  .edit {
    float: right;
    position: relative;
    top: 3px;
  }

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

  .jihuo {
    /* display: inline-block !important; */
    width: 34px !important;
    height: 18px !important;
    line-height: 18px !important;
    text-align: center !important;
    padding: 0 !important;
  }

  .btn-bg-blue {
    background-color: #249efb;
    border: none;
  }

  .layui-tab-title .layui-this {
    background-color: #249EFB;
    color: #fff;
  }

  .layui-tab-title .layui-this:after {
    border-bottom: none;
    border: none;
  }

  .layui-tab-title li {
    background-color: #F2F2F2;
    margin: 0px 5px;
  }
  .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;
	}
  .layui-btn-border,.layui-btn-border:hover {
    background-color: #fff;
    color: #249EFB;
    border: 1px solid #249EFB;
  }
</style>
<body>
<div class="layui-fluid">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md12" style="background-color:#ffffff">
      <div class="tplay-body-div">
        <div class="layui-tab">
          <ul class="layui-tab-title">
              <li class="layui-this" style="margin-left: 0px;">
              我要直播
            </li>
            <li>
              <a href="{:url('broad/goods')}">商品管理</a>
            </li>
            <li>
              <a href="{:url('broad/course_setting')}">直播设置</a>
            </li>
          </ul>
        </div>
        <div class="layui-card-body">
          <div class="layui-form">
            <div class="layui-inline">
                <div class="layui-btn layui-btn-border" data-type="add" title="新建活动"><i class="layui-icon layui-icon-add-circle-fine"></i>新建活动</div>
                <span style="color: #afb1b6;margin-left: 15px;">标准直播5秒左右延迟属于正常现象，禁止同网络下其他设备连接可有效降低延迟。</span>
              </div>
              <div class="layui-inline" style="float:right;margin-right: 100px;margin-left: 5px;">
                <button class="layui-btn layui-btn-primary btn-bg-blue" data-type="reload"><i
                    class="layui-icon layui-icon-search layuiadmin-button-btn" style="color: #fff;"></i></button>
              </div>
              <div class="layui-inline" style="float:right;">
                <input class="layui-input" name="title" id="title" autocomplete="off" placeholder="查找活动主题..">
              </div>
            </div>
            <div class="layui-row">
              <table class="layui-hide" id="user" lay-filter="user"></table>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

{/block}
{block name="js"}
<script type="text/html" id="result">
  <div class="status">
    {{# if(d.status == 1){ }}
    <a class="layui-btn layui-btn-xs" title="去直播" lay-event="links">去直播</a>
    {{# }else{ }}
    <a class="layui-btn layui-btn-normal layui-btn-xs jihuo" title="激活" lay-event="jihuo">激活</a>
    {{# } }}

    <a class="layui-btn layui-btn-primary layui-btn-xs" title="观摩统计" lay-event="data">统计</a>
    <a class="layui-btn layui-btn-primary layui-btn-xs" title="录播" lay-event="vod">录播</a>

    <a class="layui-btn layui-btn-primary layui-btn-xs" title="用户" lay-event="useLog">用户</a>
  </div>
</script>

<script type="text/html" id="scqr">
  <a class="layui-btn layui-btn-primary layui-btn-xs" title="小程序推流" lay-event="scqr"><i class="layui-icon">&#xe610;</i></a>
</script>

<script type="text/html" id="bt">
  {{d.title}}

  <a class="layui-btn layui-btn-primary layui-btn-xs edit" title="修改" lay-event="edit" style="margin-left: 10px;"><i class="layui-icon">&#xe642;</i></a>
  <a class="layui-btn layui-btn-primary layui-btn-xs edit" title="用户预约" lay-event="appoint"><i class="layui-icon">&#xe68d;</i></a>
  {{# if(d.key){ }}
  <a href="javascript:;" title="{{d.key}}" style="color:#9c9c9c;"><i class="layui-icon">&#xe673;</i></a>
  {{# } }}
  {{# if(d.price != 0.00){ }}
  <a href="javascript:;" title="{{d.price}}" style="color:#9c9c9c;"><i class="layui-icon">&#xe65e;</i></a>
  {{# } }}
</script>
<script>
  var indexurl = '{:url("broad/build")}';
  var addurl = '{:url("broad/course_add")}';
  var editurl = '{:url("broad/course_edit")}';
  var delurl = '{:url("course/delete")}';
  var linksurl = '{:url("broad/course_links")}';
  var lookurl = '{:url("broad/course_total")}';
  var vodthemeurl = '{:url("broad/course_recordtheme")}';
  var useLog = '{:url("broad/course_use_log")}';
  var appointUrl = '{:url("broad/course_appoint")}';
  var t;
  layui.use(['table', 'form'], function () {
    var liveplay = '';
    var form = layui.form
            , table = layui.table
            , $ = layui.jquery
            , active = {
      reload: function () {
        var title = $('#title');

        //执行重载
        table.reload('userTable', {
          page: {
            curr: 1 //重新从第 1 页开始
          }
          , where: {
            title: title.val()
          }
        });
      }
      , links: function () {
        liveplay = layer.open({
              title: ['您可使用以下几种方式推流或进入直播间', 'color:#333333;background-color:#D8E6F1;']
              , type: 2
              , content: linksurl
              ,resize: false
              , area: ['80%', '80%']
        });
      }

      , add: function () {
        location.href = addurl;
      }
      , edit: function () {
        var id = this.data.cid;
        location.href = editurl + '?id=' + id;
      }
      , data: function () {
        var id = this.data.cid;
        $.get(lookurl + '?id=' + id, function (res) {
          var resp = JSON.parse(res);
          layer.open({
            type: 1,
                title: ['观摩统计', 'color:#333333;background-color:#D8E6F1;'],
                content: resp.data,
                resize: false,
                area: ['50%','35%']
          });
        })
      }
      , vod: function () {
        var id = this.data.cid;
        layer.open({
              title: ['录播设置', 'color:#333333;background-color:#D8E6F1;'],
              type: 2,
              content: vodthemeurl + '?cid=' + id,
              resize: false,
              area: ['80%', '80%']
        });
      }
      , useLog: function () {
        var id = this.data.cid;
        layer.open({
              title: ['活动用户数据统计', 'color:#333333;background-color:#D8E6F1;'],
              type: 2,
              content: useLog + '?cid=' + id,
              resize: false,
              area: ['80%', '80%']
        });
      }
      , del: function () {
        var checkStatus = table.checkStatus('userTable');
        var cidArr = checkStatus.data.map(function (x) {
          return x['cid'];
        });
        layer.confirm('确定要删除选中的活动么？',{title: ['信息', 'color:#333333;background-color:#D8E6F1;'],}, function (index) {
          $.post(delurl, { 'cid': cidArr }, function (res) {
            if (res.code == 0) {
              layer.msg('删除成功', { anim: 0 }, function () {
                location.reload();
              });
            } else {
              layer.msg(res.mgs, { anim: 6 });
            }
          });
          layer.close(index);
        });
      }
      , jihuo: function () {
        var that = this;
        var id = this.data.cid;
        $.post('{:url("broad/course_state")}', { id: id }, function (res) {
          var resp = JSON.parse(res);
          if (resp.code == 0) {
            layer.msg(resp.msg, { anim: 0 }, function () {
              active.links();
              active.reload();
            });
          } else {
            layer.msg(resp.msg, { anim: 6 });
          }
        });
      }
      , appoint: function () {
        var cid = this.data.cid;
            layer.open({
              title: ['预约记录', 'color:#333333;background-color:#D8E6F1;'],
              type: 2,
              content: appointUrl + '?cid=' + cid,
              resize: false,
              area: ['80%', '80%']
        });
      }
    };

    //展示已知数据
    t = table.render({
      elem: '#user'
      , url: indexurl
      , page: true
      , autoSort: true
      , cols: [[ //标题栏
        { type: 'numbers', title: '序号', fixed: 'left', width: 50 }
        , { templet: '#bt', title: '活动主题' }
        , { field: 'date', title: '直播时间', width: 200, sort: true, align: 'center' }
        // , { field: 'name', title: '主持人', width: 100, align: 'center' }
        , { fixed: 'right', title: '操作', toolbar: '#result', width: 260, align: 'right' }
      ]]
      , id: 'userTable'
    });

    $('.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
      });
    });

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

    table.on('tool(user)', function (obj) {
      var type = obj.event;
      active[type] ? active[type].call(obj) : '';
    })
    form.on('switch(state)', function (obj) {
      var id = this.value;
      $.post('{:url("course/state")}', { id: id }, function (res) {
        if (res.code == 0) {
          layer.msg(res.msg, { anim: 0 }, function () {
            layer.open({
              title: '直播流地址'
              , type: 2
              , content: linksurl + '?cid=' + id
              , area: ['700px', '385px']
            });
            active.reload();
          });
        } else {
          layer.msg(res.msg, { anim: 6 });
        }
      });
    });

    $('.layui-card-body').on('mouseover', 'tr', function () {
      if ($(this).find('.jihuo').length != '0') {
        $(this).find('.jihuo')[0].style.display = "inline-block";
      }

    })
    $('.layui-card-body').on('mouseout', 'tr', function () {
      $(this).find('.jihuo').hide();
    })
  });

</script>
{/block}