{extend name="public/base" /}

{block name="body"}
<form class="layui-form layui-form-pane admin-main" action="__SELF__">

  <div class="layui-form-item ">
    <label class="layui-form-label">标题</label>
    <div class="layui-input-block">
      <input type="text" name="title" lay-verify="required" placeholder="请输入名称" autocomplete="off" class="layui-input" value="{$info.title|default=''}">
    </div>
  </div>

  <div class="layui-form-item">
    <label class="layui-form-label">分类</label>
    <div class="layui-input-inline">
      <select name="type" lay-filter="type" class="type">
        <option value="">请选择文类</option>
        <option value="article" {eq name="info.type|default=''" value="article"}selected{/eq}>文章</option>
        <option value="video" {eq name="info.type|default=''" value="video"}selected{/eq}>视频</option>
        <option value="audio" {eq name="info.type|default=''" value="audio"}selected{/eq}>音频</option>
      </select>
    </div>
  </div>

  <div class="layui-form-item">
    <label class="layui-form-label">排序</label>
    <div class="layui-input-inline ">
      <input type="text" name="sort" lay-verify="required" placeholder="请输入序号" autocomplete="off" class="layui-input" value="{$info.sort|default=''}">
    </div>
  </div>

  <div class="layui-form-item uploadfile" {notin name="$info.type|default=''" value="video,audio"}style="display:none"{/notin}>
    <label class="layui-form-label">上传文件</label>
    <div class="layui-input-inline ">
      <input type="hidden" name="ext_id" class="ext_id" value="">
      <input name="{$info.type|default='file'}"  class="layui-upload-file file"  type="file">
      <br><span class="path">{$info.ext_path|default=''}</span>
    </div>
  </div>

  <div class="layui-form-item layui-form-text">
    <label class="layui-form-label">封面</label>
    <div class="site-demo-upload">
      <img id="LAY_demo_upload" src="{$info.cover|default='http://console.cnskl.com/static/system/images/avatar.jpg'}">
      <div class="site-demo-upbar">
        {present name="info"}
        <input type="hidden" name="id" value="{$info.id|default=''}">
        {/present}
        <input type="file" class="layui-upload-file" value="" name="image" id="image">
        <input type="hidden" name="storage_id" class="storage_id" value="{$info.storage_id|default=''}">
      </div>
    </div>
  </div>

  <div class="layui-form-item layui-form-text">
    <label class="layui-form-label">内容</label>
    <div class="layui-input-block">
     <!-- <textarea name="content" id="demo" style="display: none;">{$info.content|default=''}</textarea> -->
     <script id="ueditor" name="content" type="text/plain">{$info.content|default=''}</script>
   </div>
 </div>

 <div class="layui-form-item">
  <div class="layui-input-block">
    {present name="info"}
    <input type="hidden" name="id" value="{$info.id|default=''}">
    {/present}
    <button class="layui-btn layui-btn-primary" lay-submit lay-filter="submit"> <i class="layui-icon">&#xe650;</i> 发布 </button>
  </div>
</div>
</form>
{/block}

{block name="layui"}
<script type="text/javascript" charset="utf-8" src="__JS__/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="__JS__/ueditor/ueditor.all.min.js"> </script>
<script type="text/javascript" charset="utf-8" src="__JS__/ueditor/lang/zh-cn/zh-cn.js"></script>

<script type="text/javascript">
  var ue = UE.getEditor('ueditor', {
    autoHeightEnabled: false,
    initialFrameHeight:450
  });

  layui.use(['upload', 'layedit', 'form'], function() {
    var $ = layui.jquery, form = layui.form();
    var layedit = layui.layedit;

    var edit = layedit.build('demo', {
      uploadImage: {
        url: "{:url('storage/editor')}"
        ,type: 'post'
      }
    });

    form.on('submit(submit)', function(data) {
      ue.sync();
      // data.field.content = layedit.getText(edit);
      delete data.field.file;
      delete data.field.article;
      delete data.field.image;
      delete data.field.video;
      delete data.field.audio;
      $.post(data.form.action, data.field, function(res) {

        if (res.code == 1) {
          layer.msg(res.msg, {icon: Math.abs(res.code - 2), time: 1000}, function() {
            var index = parent.layer.getFrameIndex(window.name);
            parent.layer.close(index);
            parent.location.reload();
          });
        } else {
          layer.msg(res.msg, {icon: Math.abs(res.code - 2), time: 1000});
        }
      });
      return false;
    });

    form.on('select(type)', function(data){
      var val = data.value;
      var ext='';
      if (val=='video') {
       ext = 'mp4';
     };
     if (val=='audio') {
       ext = 'mp3';
     };

     if (val !='article') {
        $('.uploadfile').css('display','block');
        var url = "{:url('Storage/upload')}?type="+val;
        // $('.file').attr('lay-type',val);
        // $('.file').attr('lay-ext',ext);
        $('.file').attr('name',val);
        $('.file').parent(form).attr('action',url);
      };
    });

    layui.upload({
      url: "{:url('Storage/upload')}?type={$info.type|default=''}",
      title: '文件上传',
      type: 'audio|video',
      ext:'mp3|mp4',
      method: 'post',
      before: function(input) {
        layer.msg('文件上传中...', {icon: 16 ,shade: 0.3, time: 0, id: 1});
      },
      success: function(res) {
        layer.close(1);
        if (res.code == 1) {
          layer.msg('上传成功', {icon: 1});
          console.log(res);
          $('.ext_id').val(res.data.id);
          $(".file").remove();
          $('.path').html(res.data.path);
        } else {
          layer.msg(res.msg, {icon: 2});
        }
      }
    });

    layui.upload({
      url: "{:url('storage/upload')}?type=image",
      title: '图片上传',
      elem: '#image',
      method: 'post',
      type: 'image',
      before: function(input) {
        layer.msg('文件上传中...', {icon: 16 ,shade: 0.3, time: 0, id: 1});
      },
      success: function(res) {
        layer.close(1);
        if (res.code == 1) {
          layer.msg('上传成功', {icon: 1});
          LAY_demo_upload.src = res.data.path;
          $('.storage_id').val(res.data.id);
        } else {
          layer.msg(res.msg, {icon: 2});
        }
      }
    });
  });
</script>
{/block}