<?php
/**
 * 管理员管理
 * $Id: account_list.inc,v 1.1 2015/10/08 11:18:50 wanggb Exp $
 * @author netvillage
 * @access public
 * @package manager.templates
 */


?>
<style type="text/css">
	.result_list{
		width: 701px;
	}
</style>
<div id="classSetting">
	<div class="list_title">
		班级设定<!-- <el-button type="primary" style="margin-right: 10px;" @click="addClass()">年级添加</el-button>-->
	</div>
	<br/>
	学校名称:
	<?if(isset($school_mst)){?>
  	<?=$school_mst->title?>
  <?}else{?>
  	<el-select v-model="school_id" size='medium' >
    		<div class="el-select-dropdown__item"><input  v-model="searchVal" style="border-radius: 4px;background: url(images/search_icon.png) no-repeat 150px;"type="text" autocomplete="off"></div>
        <el-option
            v-for="item in new_school_list"
            :key="item.id"
            :label="item.title"
            :value="item.id">
        </el-option>
    	</el-select>
	<?}?>
	<br/>
	<div class="result_list">
		<el-table :data="tableData" border style="width: 100%">
		    <el-table-column
		      prop="grade_title"
		      label="年级名称"
		      >
		    </el-table-column>
		    <el-table-column
		      prop="title"
		      label="班级名称"
		      >
		    </el-table-column>
		    <el-table-column
		      prop="member_count"
		      label="班级人数"
		      >
		    </el-table-column>
		     <el-table-column
		      label="操作"
		      width="100">
		      <template slot-scope="scope">
		        <el-button @click="handleChange(scope.row)" type="text" size="small">编辑</el-button>
		      </template> 
		    </el-table-column>
		</el-table>
	</div>
</div>
<script type="text/javascript">
	var list=[];
	<?
	 foreach ($class_list as $class_mst) {
		  $school_id = isset($school_id)?$school_id:$school_list[0]->id;
		  if($class_mst["school_id"] == $school_id){
	?>
		var data={
			id:<?=$class_mst["id"] ?>,
			title:'<?=$class_mst["title"] ?>',
			grade_title:'<?=$class_mst["grade_title"] ?>',
			member_count:'<?=$class_mst["member_count"]?>'
		};
		list.push(data);
	<?
	 }
  }
	?>

	new Vue({
		el:'#classSetting',
		data:{
			tableData: list,
			school_id:'<?=isset($school_list)?$school_list[0]->id:0?>',
			school_list:<?=isset($school_list)?json_encode($school_list):''?>,
			class_list:<?=json_encode($class_list)?>,
			searchVal:''
		},
		methods:{
			handleChange(row) {
		        console.log(row);
		        window.location.href='class_edit_input.php?id='+row.id;
		   }
		},
	  watch:{
	    school_id(val,oldval){
	      var new_list=[];
	      this.class_list.map(function(item) {
	        if (item.school_id == val) {
	          new_list.push(item);
	        }
	       });
	    	this.tableData = new_list;
      }
    },
		 computed: {
	      new_school_list() {
	       var _this = this;
	       var new_school_list = [];
	       _this.school_list.map(function(item) {
	        if (item.title.search(_this.searchVal) != -1) {
	          new_school_list.push(item);
	        }
	       });
	       if(new_school_list.length == 0){
	         new_school_list = _this.school_list;
	        }
	       return new_school_list;
	      }
	    }
	})
</script>