scott
/
crm


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304
							{extend name="public/layout"}
{block name="body"}
<style>
  .goback {
    float: right;
  }

  .goback a {
    color: #269efb;
  }

  .goback i {
    position: relative !important;
  }

  .layui-form-item .layui-input-inline {
    float: left;
    width: 190px;
    margin-right: 10px;
  }

  .layui-input-inline {
    display: inline-block;
    vertical-align: middle;
  }

  .upload-img {
    border: 1px dashed #e2e2e2;
    height: 100px;
    width: 100px;
  }

  .upload-img .area {
    margin-top: 40px;
    text-align: center;
  }

  .upload-img .area i {
    font-size: 50px;
    color: #009688;
  }
  .layui-btn,.layui-btn:hover {
    background-color: #fff;
    border: 1px solid #269efb;
    color: #269efb;
  }
</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-header">
            新增活动主题
            <div class="goback">
              <a href="{:url('broad/build')}"><i class="layui-icon layui-icon-return"></i>
                <span>返回列表</span>
              </a>
            </div>
          </div>
          <div class="layui-card-body">
            <form class="layui-form" enctype="multipart/form-data">
              <div class="layui-form-item">
                <label class="layui-form-label" for="title">活动主题：</label>
                <div class="layui-col-md6">
                  <input type="text" name="title" id="title" placeholder="请输入本次活动主题" autocomplete="off"
                    class="layui-input">
                </div>
              </div>
              <div class="layui-form-item">
                <label class="layui-form-label">直播封面：</label>
                <div class="layui-input-inline">
                  <div class="upload-img" id="img" style="width: 150px;height: 90px;">
                    <div class="area">
                      <i class="layui-icon">&#xe681;</i>
                    </div>
                  </div>
                </div>
                <div class="layui-form-mid layui-word-aux"
                  style="margin-top: 40px;margin-left: 80px;color: #999!important;">
                  封面图尺寸【750*450】<br />
                  jpg,png,bmp,jpeg格式，大小1M</div>
              </div>

              <div class="layui-form-item">
                <label class="layui-form-label" for="addr">活动描述：</label>
                <div class="layui-col-md6">
                  <textarea placeholder="此处填写的是分享到微信后的链接描述，请用15-30个文字正常阐述本次活动内容，禁止填写诱导转发类文字。" name="description"
                    class="layui-textarea"></textarea>
                </div>
              </div>
              <div class="layui-form-item">
                <label class="layui-form-label">直播时间：</label>
                <div class="layui-col-md2">
                  <input type="text" name="date" class="layui-input" lay-verify="datetime" autocomplete="off" id="date"
                    placeholder="选择日期时间">
                </div>
                <!-- <div class="layui-col-md2">
                   <input type="text" name="time" class="layui-input" autocomplete="off" id="time" placeholder="选择时间">
              </div> -->
                <div class="layui-col-md2">
                  <select id="hour" name="hour" lay-verify="required">
                    <option value="">直播时长</option>
                    {for start="0.5" end="5.5" step="0.5" name="h"}
                    <option value="{$h}">{$h}小时</option>
                    {/for}
                  </select>
                </div>
              </div>
              <div class="layui-form-item">
                <label class="layui-form-label">主持人：</label>
                <div class="layui-col-md4">
                  <select name="tid" id="teacher" lay-filter="teacher">
                    {volist name="teacher" id="vo"}
                    <option value="{$key}">{$vo}</option>
                    {/volist}
                    <option value="addteacherselect">新增主持人>></option>
                  </select>
                </div>
                {empty name="teacherCount"}
                <div class="layui-form-mid layui-word-aux" style="margin-left: 20px;">
                  <a id="addteacher" href="javascript:void(0)" title="添加主持人">添加主持人</a>
                </div>
                {/empty}
              </div>
              <div class="layui-form-item">
                <label class="layui-form-label">活动内容：</label>
                <div class="layui-col-md6">
                  <textarea placeholder="请输入活动内容" name="content" id="content" rows=15 class="layui-textarea"></textarea>
                </div>
              </div>

              <div class="layui-form-item">
                <input type="hidden" name="template" value="1">
                <!--                            <label class="layui-form-label">直播模版：</label>-->
                <!--                            <div class="layui-col-md3">-->
                <!--                                <input type="radio" name="template" value="1" title="家装收定" checked>-->
                <!--                                <input type="radio" name="template" value="0" title="建材爆单" >-->
                <!--                            </div>-->
                <!--                            <div class="layui-col-md4">-->
                <!--                                <p style="margin-top:8px;">[直播开始使用后，模版将不可更改。]</p>-->
                <!--                            </div>-->
              </div>

              <!-- <div class="layui-form-item">
                <label class="layui-form-label">手机获取：</label>
                <div class="layui-col-md3">
                    <input type="radio" name="need_mobile" value="1" title="获取">
                    <input type="radio" name="need_mobile" value="0" title="不获取" checked>
                </div>
            </div> -->
              <div class="layui-form-item">
                <label class="layui-form-label">是否录播：</label>
                <div class="layui-col-md3">
                  <input type="radio" name="record" value="1" title="是" checked>
                  <input type="radio" name="record" value="0" title="否">
                </div>
              </div>
              <div class="layui-form-item">
                <label class="layui-form-label">进入方式：</label>
                <div class="layui-input-inline" style="width: 260px;">
                  <input type="radio" name="open_key" value="3" title="正常" lay-filter="key" checked>
                  <input type="radio" name="open_key" value="2" title="密码" lay-filter="key">
                  <input type="radio" name="open_key" value="1" title="付费" lay-filter="key">
                </div>
                <div class="layui-form-mid layui-word-aux">*设置观看直播方式 ( 密码 / 付费 )，客户通过输入密码或支付设置费用才可观看。</div>
              </div>
              <div class="layui-form-item layui-hide" id="key">
                <label class="layui-form-label"></label>
                <div class="layui-input-inline">
                  <input type="text" name="key" placeholder="输入密码(4-6位数字或字母)" autocomplete="off" class="layui-input">
                </div>
              </div>
              <div class="layui-form-item layui-hide" id="price">
                <label class="layui-form-label"></label>
                <div class="layui-input-inline">
                  <input type="text" name="price" placeholder="输入金额(0.01-3000元区间)" autocomplete="off"
                    class="layui-input">
                </div>
              </div>
              <div class="layui-form-item">
                <div class="layui-input-block">
                  <button class="layui-btn" lay-submit lay-filter="admin">立即提交</button>
                </div>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
  {/block}
  {block name="js"}
  <script src="__STATIC__/js/jquery.min.js"></script>
  <script>
    var addTeacherUrl = '{:url("broad/teacher_add")}';
    var teacher = $('#teacher');
    layui.use(['form', 'laydate', 'layedit', 'upload'], function () {
      var $ = layui.jquery
        , form = layui.form
        , layedit = layui.layedit
        , upload = layui.upload
        , laydate = layui.laydate;
      laydate.render({
        elem: '#date'
        , type: 'datetime'
      });

    layedit.set({
      uploadImage: {
        url: '{:url("course/imgUpload")}'
      }
    });
    var textarea = layedit.build('content');
    upload.render({
      elem: '#img',
      accept: 'images',
      exts: 'jpg|png|bmp|jpeg|JPG|PNG|BMP|JPEG',
      auto: false,
      field: 'cover',
      size: 1 * 1024,
      choose: function(obj){
        file=obj.pushFile();
        obj.preview(function(index, file, result){
          $('#img').html('<img src="' + result + '" style="height: 100%;width:100%;">');
        });
      }
    });
    form.on("submit(admin)", function (obj) {
      if($(obj.elem).hasClass('layui-btn-disabled')) return false;
      $(obj.elem).addClass('layui-btn-disabled');
      var formData = new FormData(obj.form);
      formData.set('content',layedit.getContent(textarea));
      var loading = layer.load(0, {shade: 0.3});
      $.ajax({
        url:'{:url("broad/course_save")}',
        type: 'POST',
        data: formData,
        dataType: 'json',
        processData: false,
        contentType: false,
        success: function (res) {
          if (res.code === 0) {
            layer.msg(res.msg, {anim: 0}, function () {
              location.href = '{:url("broad/build")}';
            });
          } else {
            layer.msg(res.msg, {anim: 6});
            $(obj.elem).removeClass('layui-btn-disabled');
            layer.close(loading);
          }
        }});
      return false;
    });

      $('#addteacher').click(function () {
        layer.open({
          title: ['添加', 'color:#333333;background-color:#D8E6F1;'],
          type: 2,
          resize: false,
          content: addTeacherUrl,
          area: ['80%', '80%'],
        });
      });

      form.on('select(teacher)', function (data) {
        var data = data.value;
        if (data == 'addteacherselect') {
          layer.open({
            title: ['添加', 'color:#333333;background-color:#D8E6F1;'],
            type: 2,
            content: addTeacherUrl,
            resize: false,
            area: ['80%', '80%'],
            cancel: function () {
              // 右上角关闭事件的逻辑
              $("#teacher").find("option:selected").attr("selected", false);
              $("#teacher").find("option").first().attr("selected", true);
              form.render('select');//重新渲染 固定写法

          }
        });

      }
    });

    form.on('radio(key)', function(data){
      if(data.value == 2){
        $('#key').removeClass('layui-hide');
        $('#price').addClass('layui-hide');
      }else if(data.value == 1){
        $('#key').addClass('layui-hide');
        $('#price').removeClass('layui-hide');
      }else{
        $('#key').addClass('layui-hide');
        $('#price').addClass('layui-hide');
      }
    });
  });

</script>
{/block}