<!doctype html>
  <html class="no-js">
  <head>

    <include file="Common/head" />
    <style type="text/css">
      .am-form{width:500px;margin-left:20px;float: left;}
      #editor {font-size: 12px;}
      .am-form label span{font-size: 13px;font-weight:normal;}
      .am-form label p{display: inline;color: #f00;}
      .am-form .am-form-inline-2 input[type=file]{width: 246px}
      .am-form .am-form-inline-3 input[type=text]{width: 160px}
      .am-form .am-form-inline-3 select{width: 160px}
      .am-form .am-form-inline-4 input[type=text]{width: 120px}
      .am-form .am-form-inline-4 select{width: 120px}
      .two-input {display: flex;}
      .am-form .am-form-inline-4 .two-input input[type=text]{width: 50px;}
      .am-form .am-form-inline-4 .two-input input[type=text]:nth-of-type(2){width: 20px;padding: 8px 2px;cursor: default;background: #fff; border-left: 0; border-right: 0;}

      .am-form input[type=file]{display:none;}
      .am-form .am-form-group img{height: 60px;min-width: 60px;max-width: 100px;margin-top: 2px;display: block;cursor: pointer;}
      input[readonly]{background-color: #fff!important;cursor: default!important;}
      .am-form-group input{
        height: 30px;font-size: 14px;margin-bottom: 10px !important;
      }
      .am-form-group select{
        height: 30px;font-size: 14px;margin-bottom: 10px !important;
      }
    </style>
  </head>
  <body>
  <include file="Common/header" />

  <div class="am-cf admin">

    <include file="Common/sidebar" nav="$nav" navv="$nav"/>
    <div class="content-page" style="background: white;">

      <div class="admin-content" style="background: white;">
        <div class="admin-content-body">
          <div class="am-cf am-padding">
            <div class="am-fl am-cf">
              <strong class="am-text-primary am-text-lg">Video Management</strong> /
              <small>{$op}<span style="color: red;">(Cover 375*260)</span></small>
            </div>
          </div>
          <hr style="margin-top:0px;">
          <form action="" method="POST" id="saveForm" enctype="multipart/form-data">
            <div class="am-form">
              <input type="hidden" name="id" value="{$info.id}" />

                <!--<div class="am-form-group">
                  <label>标题</label>
                  <input type="text" name="title" value="{$info.title}" required="required">
                </div>-->

                <label>Video Cover(375*260)</label>
                <div class="am-form-group">
                  <img src="" id="img_preview" onerror="this.src='<?php echo $info[img]?:'__PUBLIC__/img/add.png'?>'">
                  <input type="file" name="img" value="" accept="image/jpg,image/jpeg,image/png" >
                </div>

                <label>Video</label>
                <div class="am-form-group">
                  <video src="" controls="controls" id="myvedio">
               
                 </video>
                  <img src="" id="vedio" onerror="this.src='<?php echo '__PUBLIC__/img/add.png'?>'">
                  <input type="file" name="vedio" value="">
                </div>

                <div class="am-form-group">
                  <label>Status</label><br>
                  <label class="am-radio-inline">
                    <input type="radio" name="status" value="1" data-am-ucheck <?php if ($info['status'] == 1) : ?>checked<?php endif;?>> Enable
                  </label>
                  <label class="am-radio-inline">
                    <input type="radio" name="status" value="2" data-am-ucheck <?php if ($info['status'] == 2) : ?>checked<?php endif;?>> Disable
                  </label>
              </div>

                <!-- <div class="am-form-group">
                  <label>排序<span>（PS：数字越小排序越靠前）</span></label>
                  <input type="text" name="sort" data-type="zs" value="{$info.sort}">
                </div> -->

              <button type="submit" class="am-btn am-btn-success" id="form_submit" style="margin-bottom: 50px;">Save</button>&nbsp;
              <button type="button" class="am-btn" style="margin-bottom: 50px;" onclick='javascript:location.href="{:U('index')}";'>Back</button>
          </form>
        </div>
        <footer class="admin-content-footer"><hr></footer>

      </div>

    </div>



  </div>
  <include file="Common/footer" />
  </body>

<script src="__ASSETS__/ueditor/ueditor.config.js"></script>
<script src="__ASSETS__/ueditor/ueditor.all.min.js"></script>
<script type="text/javascript">
    $(function() {
          // var $textArea = $('[name=content');
          // var editor = UE.getEditor('content');
          // var $form = $('#ue-form');

          // $form.validator({
          //   submit: function() {
          //     // 同步编辑器数据
          //     editor.sync();

          //     var formValidity = this.isFormValid();

          //     // 表单验证未成功，而且未成功的第一个元素为 UEEditor 时，focus 编辑器
          //     if (!formValidity && $form.find('.' + this.options.inValidClass).eq(0).is($textArea)) {
          //       editor.focus();
          //     }

          //     console.warn('验证状态：', formValidity ? '通过' : '未通过');

          //     if (formValidity) {
          //       $form,submit();
          //     }
              
          //     return false;
          //   }
          // });

          // // 编辑器内容变化时同步到 textarea
          // editor.addListener('contentChange', function() {
          //   editor.sync();

          //   // 触发验证
          //   $('[name=content]').trigger('change');
          // });

          $("#img_preview").on('click',function(){
              $("input[name=img]").click();
          });

          $("#vedio").on('click',function(){
              $("input[name=vedio]").click();
          });

          $("input[name=img]").on('change', function() {
              var reader = new FileReader();
              reader.onload = function(e){
                  $('#img_preview').attr('src', e.target.result);
              }
              if(this.files[0]){
                  reader.readAsDataURL(this.files[0]);
              }else{
                  $('#img_preview').attr('src','');
              }
          });

          $("input[name=vedio]").on('change', function() {
              var reader = new FileReader();
              reader.onload = function(e){
                  $('#myvedio').attr('src', e.target.result);
              }
              if(this.files[0]){
                  reader.readAsDataURL(this.files[0]);
              }else{
                  $('#myvedio').attr('src','');
              }
          });
    });
</script>

  </html>