<?php
/**
 * 合集视频编辑
 * $Id: collection_media_edit_input.inc,v 1.1 2015/10/08 11:18:53 wanggb Exp $
 * @author lixq
 * @access public
 * @package manager.templates
 **/

?>
<div id="change">
	<p class="edit_title">合集视频编辑</p>
	<form id="collection_media_edit" action="collection_media_edit_result.php" method="post" enctype="multipart/form-data">
	<input type="hidden" name="id" value="<?=$id?>"/>
	<input type="hidden"  name="parent_category_id" value="<?=$parent_category_id?>"/>
	<input type="hidden"  name="sub_category_id" value="<?=$sub_category_id?>"/>
	<input type="hidden" name="action_type" value="<?=$action_type?>"/>
	<div class="edit_content">
		<p><b>一级分类名称：</b><el-select v-model="parent_category_id" size="small">
        <el-option
            v-for="item in parent_category_list"
            :key="item.id"
            :label="item.title"
            :value="item.id">
        </el-option>
    	</el-select></p>
			
    <p><b>二级分类名称：</b><el-select v-model="sub_category_id" size="small">
        <el-option
            v-for="item in new_sub_category_list"
            :key="item.id"
            :label="item.title"
            :value="item.id">
        </el-option>
    	</el-select></p>
			
    <p><b>合集名称：</b><el-input v-model="title" name="title" class="input_200"></el-input></p>
		
		<p><b>封面图：</b><a href='javascript:void(0);' class="el-button el-button--primary blueButton">选择文件</a><input id="image_file" class="myFileUpload" name="front_image" type="file" accept="image/*"/></p>
		
				
		<div id="img_thumbnail">
    	<img id="imgshow" height="150px" alt="学校封面图" />
		</div>
		<p><b>讲师名称：</b><el-input v-model="teacher_name" name="teacher_name" class="input_200"></el-input></p>
		
		<p><b>讲师介绍：</b><textarea v-model="teacher_profile" name="teacher_profile" rows="5"></textarea><br /></p>
		
		<el-button type="primary" @click="edit()" class="edit_btn" style="margin-left: 100px;">编辑</el-button>
		<el-button type="primary" @click="back()" class="edit_btn">返回</el-button>
		<br/><br/><br/>
	</div>
	</form>
</div>


<script type="text/javascript">
	
	new Vue({
		el:'#change',
		data:{
		  action_type:'<?=$action_type?>',
		  parent_category_id:<?=$parent_category_id?>,
		  sub_category_id:'<?=$sub_category_id?>',
			title:'<?=$title?>',
			front_image:'<?=$front_image?>',
			teacher_name:'<?=$teacher_name?>',
			teacher_profile:'<?=$teacher_profile?>',
			sub_category_list:<?=json_encode($sub_category_list)?>,
			new_sub_category_list:<?=json_encode($new_sub_category_list)?>,
			parent_category_list:<?=json_encode($parent_category_list)?>
		},
	  watch:{
	    parent_category_id(val,oldval){
        var new_list = [];
        this.sub_category_list.map(function(item) {
          if (item.parent_id == val) {
            new_list.push(item);
          }
        });
      	this.new_sub_category_list = new_list;
      	this.sub_category_id = this.new_sub_category_list[0]["id"];
      }
    },
		methods:{
		  back:function(){
			  window.history.go(-1);
			},
			edit:function(){
				if(!this.sub_category_id){
					this.$message({
		            type: 'error',
		            message: '选择二级分类!'
		          });
		      return;
				}
				if(!this.title){
					this.$message({
		            type: 'error',
		            message: '请输入合集名称!'
		          });
		      return;
				}
				if(!$('#image_file').get(0).files[0] && this.action_type == "new"){
					this.$message({
		            type: 'error',
		            message: '请选择封面图!'
		          });
		      return;
				}
				if(!this.teacher_name){
					this.$message({
		            type: 'error',
		            message: '请输入讲师名称!'
		          });
		      return;
				}
				$("input[name='parent_category_id']").val(this.parent_category_id);
				$("input[name='sub_category_id']").val(this.sub_category_id);
				$('#collection_media_edit').submit();
			}
		}
	})
	window.onload = function(){
	  if(<?=$front_image?1:0 ?>){
		  $('#imgshow').get(0).src = '<?=$front_image?>';
		  $('#img_thumbnail').css("visibility","visible");
		  $('#img_thumbnail').css("display","block");
		}
    $('#image_file').change(function(){
      var file = $('#image_file').get(0).files[0];
      var reader = new FileReader();
      reader.readAsDataURL(file);
      reader.onload=function(e){
        $('#imgshow').get(0).src = e.target.result;
      }
      $('#img_thumbnail').css("visibility","visible");
      $('#img_thumbnail').css("display","block");
    })
	}
</script>