<?php
/**
 * 管理员管理
 * $Id: account_edit_input.inc,v 1.1 2015/10/08 11:18:53 wanggb Exp $
 * @author wanggb
 * @access public
 * @package manager.templates
 **/
global $id;
global $login;
global $password;
global $name;
global $contact;
global $comment;
global $government_id;
global $school_id;
global $role_id;
global $error_message;
global $role;
global $modules;
?>
<div id="change">
	<p class="edit_title">编辑账号</p>
	<div class="edit_content">
		<form id="form" method="post" action="account_edit_result.php" enctype="multipart/form-data">
			<input type="hidden" name="account_role"/>
			<input type="hidden" name="organization"/>
			<input type="hidden" name="id" value="<?=$id?>"/>
			<p><b>登陆帐号：</b><el-input v-model="login" name="login" class="input_200"></el-input><br /></p>
			
			<p><b>登陆密码：</b><el-input v-model="password" name="password" class="input_200"></el-input><br /></p>
			
			<p><b>账户名称：</b><el-input v-model="name" name="name" class="input_200"></el-input><br /></p>
			
			<p><b>联系方式：</b><el-input v-model="contact" name="contact" class="input_200"></el-input><br /></p>
			
			<p><b>用户角色：</b> <el-select v-model="selected" size='medium' >
        <el-option
            v-for="item in account_role"
            :key="item.id"
            :label="item.title"
            :value="item.id">
        </el-option>
    	</el-select></p>
			
    	<div v-if="isShow">
    		<p><b>机构选择：</b> <el-select v-model="organization" size='medium' >
    		<div class="el-select-dropdown__item" style="margin-left: 100px;"><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_org_list"
            :key="item.id"
            :label="item.title"
            :value="item.id">
        </el-option>
    	</el-select></p>
    		
    	</div>
    	
			<p style="padding-left: 44px;">权限 <span style="color:#FF0000">※全不选即为超级管理员</span></p>
<!-- 			<template v-for="(modules, index) in modules_list"> -->
<!--         <input type="checkbox" name="modules[]" :value="modules.id" v-model='checked' :id="modules.id" /> -->
<!--         <label :for="modules.id">{{ modules.module }}</label> -->
<!--         <br> -->
<!--     	</template> -->
      <template>
        <el-checkbox-group v-model="checked">
          <el-checkbox name="modules[]" style="display:block;" v-for="modules in modules_list" :label="modules.id" :key="modules.id" >{{modules.module}}</el-checkbox>
        </el-checkbox-group>
			</template>
    	<p><b>备注：</b><el-input v-model="comment" name="comment"  class="input_300"></el-input><br /></p>
			
			<br/><br/>
			<el-button type="primary" class="edit_btn"  @click="submitForm()" style="margin-left: 110px;">编辑</el-button>
			<el-button type="primary" class="edit_btn"  @Click="window.location='./account_list.php'" />返回</el-button>
			<br/><br/>
		</form>
	</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
  var vm = new Vue({
    el: '#form',
    data: {
        login: '<?=htmlspecialchars($login) ?>',
        password:'<?=htmlspecialchars($password) ?>',
        contact:'<?=htmlspecialchars($contact) ?>',
        name:'<?=htmlspecialchars($name) ?>',
        comment:'<?=htmlspecialchars($comment) ?>',
        modules_list:<?=json_encode($modules_list)?>,
    		account_role:<?=json_encode($account_role_list)?>,
    		school_list:[{id:'1',title:"aa"},{id:'2',title:"bb"}],
    		government_list:<?=json_encode($government_list)?>,
        selected:<?=$role_id?>,
        checked:[<?=$modules?>],
        isShow:true,
        organization:'<?=$government_id?>',
        org_list:<?=json_encode($government_list)?>,
        searchVal:''
        
    },
    watch:{
      selected(val,oldval){
				if(val > 8){
				  this.isShow = false;
				}else{
				  this.isShow = true;
					if(val >= 7){
						this.org_list = this.school_list;
						this.organization = '2';
					}else{
					  this.org_list = this.government_list;
					  this.organization = '<?=$government_list[0]["id"]?>';
					}
				}
      }
    },
    methods: {
        submitForm() {
          if(!this.login){
  					this.$message({
  		            type: 'error',
  		            message: '请输入登陆帐号。'
  		          });
  		          return;
  				}
          if (!isAlpaNum(this.login)) {
  					this.$message({
  		            type: 'error',
  		            message: '登陆帐号只能使用半角英文或数字。'
  		          });
  		          return;
  				}
          if (!this.password) {
  					this.$message({
  		            type: 'error',
  		            message: '请输入登陆密码。'
  		          });
  		          return;
  				}
          if (!isAlpaNum(this.password)) {
  					this.$message({
  		            type: 'error',
  		            message: '登陆密码只能使用半角英文或数字。'
  		          });
  		          return;
  				}
          if (!this.name) {
  					this.$message({
  		            type: 'error',
  		            message: '请输入账户名称。'
  		          });
  		          return;
  				}
  				$("input[name='account_role']").val(this.selected);
  				$("input[name='organization']").val(this.organization);
  				$('#form').submit();
        }
    },
    computed: {
      new_org_list() {
       var _this = this;
       var new_org_list = [];
       _this.org_list.map(function(item) {
        if (item.title.search(_this.searchVal) != -1) {
          new_org_list.push(item);
        }
       });
       if(new_org_list.length == 0){
         new_org_list = _this.org_list;
        }
       return new_org_list;
      }
    }
})
  if(<?=$error_message?1:0 ?>){
    vm.$message({
      type: 'error',
      message: '<?=$error_message?>'
    });
  }
  if(<?=$role_id?> > 8){
    vm.isShow = false;
  }
})

</script>
