  <template>
   <d2-container>
     <div v-if="isExpend" class="d2-fl d2-tree-view" >
        <pubilc-tree ref="Tree" :type="type" @orgId="getOrgId"  @action="action" ></pubilc-tree>
     </div>
    <div @click="isExpend = !isExpend" :class="[{'angle-view':isExpend},{'angle-view-none':!isExpend}]">
    	<i :class="['fa', {'fa-angle-left':isExpend},{'fa-angle-right':!isExpend}]"></i>
    </div>
    <div :class="[{'d2-fl':isExpend},{'d2-table-view':isExpend},{'d2-table-view-full':!isExpend}]" >
       <div class="d2-table-view-header">
       <el-form size="small" :inline="true" :model="filter" @keyup.enter.native="handleList" class="demo-form-inline">
         <el-form-item label="学生学号">
           <el-input v-model="filter.userNo" placeholder="学生学号" clearable/>
         </el-form-item>
         <el-form-item label="姓名">
           <el-input v-model="filter.userNm" placeholder="姓名" clearable/>
         </el-form-item>
         <el-form-item>
           <el-button   type="primary" @click="handleList('1')">查询</el-button>
         </el-form-item>
       </el-form>
       </div>
       <div class="d2-table-view-content">
 				<div class="d2-table-view-handle">
					<el-button :disabled="falg"  @click="operVisible = !operVisible" size="small" icon="el-icon-plus" >新增</el-button>
					<label for="upload-input"  >
					  <span  class="import-button">批量导入学生</span>
					</label>
					 <el-button  size="small" type="primary"  >班级调动</el-button>
					  <el-button  @click="exportOperation" size="small" type="success"  >导出</el-button>
					 <el-button  size="small" type="primary"  >毕业/肄业</el-button>
 				</div>
       <d2-crud
               title="学校管理列表"
               ref="d2Crud"
               :options="tableOptions"
               :loading="loading"
               :columns="columns"
               :data="data"
               :rowHandle="rowHandle"
               @delete="handleRowRemove"
							 @edit="handleRowEdit"
 							 selection-row
 							 @selection-change="handleSelectionChange">
       </d2-crud>
       </div>
       <div class="d2-table-view-footer">
       <el-pagination
               @current-change="handleCurrentChange"
               @size-change="handleSizeChange"
               :page-size="tableOptions.pageList[0]"
               :page-sizes="tableOptions.pageList"
               :current-page.sync="currentPage"
               layout="total,sizes, prev, pager, next,jumper"
               :total="pagination.total">
       </el-pagination>
       </div>
     </div>
     <el-dialog
             :title="diaLogName"
             :visible.sync="operVisible"
             @close="clearForm"
             width="60%"
 						:close-on-click-modal="false">
 			<el-form ref="form" :model="form" label-width="90px" labelPosition="right" :rules="rules">
 			  <el-row :gutter="20">
 			    <el-col :span="8">
 			      <el-form-item label="学生学号" prop="userNo">
 			        <el-input :disabled="form.userId === '' ? false:true" maxlength="12" v-model="form.userNo " placeholder="请输入学生学号"/>
 			      </el-form-item>
 			    </el-col>
 			    <el-col :span="8">
 			      <el-form-item label="学生姓名" prop="userNm">
 			        <el-input  maxlength="30" v-model.trim="form.userNm" placeholder="请输入学生姓名"/>
 			      </el-form-item>
 			    </el-col>
 					<el-col :span="8">
 					<el-form-item label="所属班级">
 						 <el-input v-model.trim="form.depNm " disabled placeholder="请输入所属班级"/>
 					</el-form-item>
 					</el-col>
 					<el-col :span="8">
 					  <el-form-item label="寄读/走读" prop="extPutTyp">
					<!-- 	<el-select v-model="form.extPutTyp" placeholder="请选择" style="width: 100%;">
							<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"/>
						</el-select> -->
						<custom-select :value="form.extPutTyp" typeName="住宿类型" v-model="form.extPutTyp" style="width: 100%;"></custom-select>
 					  </el-form-item>
 					</el-col>
 					<el-col :span="8">
 					  <el-form-item label="状态" prop="extState">
						<!-- 	<el-select v-model="form.extState" placeholder="请选择" style="width: 100%;">
								<el-option v-for="item in options_1" :key="item.value" :label="item.label" :value="item.value"/>
							</el-select> -->
							<custom-select :value="form.extState" typeName="学生状态" v-model="form.extState" style="width: 100%;"></custom-select>
 					  </el-form-item>
 					</el-col>
 					<el-col :span="8">
 					<el-form-item label="性别" prop="sex" >
 						 <!-- <el-select v-model="form.sex" placeholder="请选择" style="width: 100%;">
 						 	<el-option v-for="item in options_2" :key="item.value" :label="item.label" :value="item.value"/>
 						 </el-select> -->
						 <custom-select :value="form.sex" typeName="性别类型" v-model="form.sex" style="width: 100%;"></custom-select>
 					</el-form-item>
 					</el-col>
 					<el-col :span="8">
 					  <el-form-item label="证件类型" prop="extPapers">
 					    <!-- <el-select v-model="form.extPapers" placeholder="请选择" style="width: 100%;">
 					    	<el-option v-for="item in options_3" :key="item.value" :label="item.label" :value="item.value"/>
 					    </el-select> -->
							<custom-select :value="form.extPapers" typeName="证件类型" v-model="form.extPapers" style="width: 100%;"></custom-select>
 					  </el-form-item>
 					</el-col>
 					<el-col :span="8">
 					  <el-form-item label="证件号码" prop="extIdCard">
 					    <el-input   v-model.trim="form.extIdCard  " placeholder="请输入证件号码"/>
 					  </el-form-item>
 					</el-col>
 					<el-col :span="8">
 					<el-form-item label="家长姓名1" prop="extPatriarch" >
 						 <el-input v-model.trim="form.extPatriarch "  maxlength="30"  placeholder="请至少输入一位家长姓名"/>
 					</el-form-item>
 					</el-col>
 					<el-col :span="8">
 					<el-form-item label="联系方式1" prop="mblNo" >
 						 <el-input v-model.trim="form.mblNo"    placeholder="请至少输入一位家长联系方式"/>
 					</el-form-item>
 					</el-col>
					<el-col :span="8">
					<el-form-item label="家长姓名2" prop="extPatriarcht" >
						 <el-input v-model.trim="form.extPatriarcht " maxlength="30"   placeholder="请至少输入一位家长姓名"/>
					</el-form-item>
					</el-col>
					<el-col :span="8">
					<el-form-item label="联系方式2" prop="extMbl" >
						 <el-input v-model.trim="form.extMbl"    placeholder="请至少输入一位家长联系方式"/>
					</el-form-item>
					</el-col>
 						<el-col :span="8">
 					  <el-form-item label="出生日期"  prop="extBirth">
 					     <el-date-picker
 					     	v-model="form.extBirth"
 					     	type="datetime"
 					     	value-format="yyyy-MM-dd hh:mm:ss"
 					     	placeholder="出生日期"
								:picker-options="pickerOptions"
 								style="width: 100%;">
 					     </el-date-picker>
 					  </el-form-item>
 					</el-col>
					<el-col :span="8">
					<el-form-item label="年龄" prop="extAge" >
						 <el-input v-model.number="form.extAge"  maxlength="3"  placeholder="请输入年龄"/>
					</el-form-item>
					</el-col>
 					<el-col :span="24">
 					  <el-form-item label="联系住址" prop="extAddr">
 					    <el-input   maxlength="12" v-model.trim="form.extAddr" placeholder="请输入联系住址"/>
 					  </el-form-item>
 					</el-col>
					<el-col :span="24">
					  <el-form-item label="户籍地址" prop="extCensus">
					    <el-input   maxlength="12" v-model.trim="form.extCensus" placeholder="请输入户籍所在地"/>
					  </el-form-item>
					</el-col>
 					<el-col :span="24">
 						<el-form-item label="学生简介">
 							<el-input type="textarea" maxlength="100" v-model="form.extBrief"/>
 						</el-form-item>
 					</el-col>
 			  </el-row>
 			</el-form>
    <span slot="footer" class="dialog-footer">
     <zl-button :loading="staLoading" @click="operInstance()"/> 
   </span>
     </el-dialog>
   </d2-container>
 </template>
 <script>
   import { getSchoolList,addSchoolList,deleteSchool,editPartner} from '../../../api/sys/student'
   import {tableOptions} from '../../../assets/options'
 	import util from '../../../libs/util'
   export default {
     name: 'system-address',
    /* components:{
       ApartmentTree,
 			teamShift
     }, */
     data () {
			  let checkIdCode = (rule, value, callback) => {
			   if (this.form.extPapers !== '0') {
			     callback();
			     return;
			   }
			   let reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
			   if (!reg.test(value)) {
			     return callback(new Error("请输入正确的身份证格式"));
			   } else {
			     callback();
			   }
			 };
			   let checkPhone = (rule, value, callback) => {
			    let reg = /^1[345789]\d{9}$/;
			  	let reg_1 = /^(\(\d{3,4}\)|\d{3,4}-|\s)?\d{7,14}$/
			    if (reg.test(value) || reg_1.test(value)) {
			  					  callback();
			    } else {
			       return callback(new Error("请输入正确的联系方式"));
			    }
			  };
			  let checkUserNo = (rule, value, callback) => {
			   let reg = /^\w+$/;
			   if (!reg.test(value)) {
			     return callback(new Error("请输入由数字或字母组成的正确编号"));
			   } else {
			     callback();
			   }
			 };
       return {
 					func:{
 					add:false,
 					delete:false,
 					update:false,
 					select:false,
 				},
				 pickerOptions: {
				    disabledDate(time) {
							 return time.getTime() > Date.now()
							}
				},
				type:'student',
 				imageUrl:'',
 				falg:true,
 				staLoading:false,
 				isExpend:true,
 				selection:[],
         tableOptions,
         filterText:'',
         loading:false,
         operVisible:false,
         isEdit: false,
         diaLogName:'新增',
         form:{
					 depId:'',
					 depNm:'',
					 orgId:'',
 					  userId:'', 
						userNo:'',	 	
						userNm:'',	
						parentId:'',
						extPutTyp:'',
						extState:'',	 	
						sex:'',	
						extPapers:'',
						extIdCard:'',
						extPatriarch:'',	
						mblNo:'',
						extBirth:'',	
						extAge:'',	
						extAddr:'',
						extCensus:'',
						extBrief:'',
						depNm:'',
						extPatriarcht:'',
						extMbl:''
         },
         filter:{
           userNm:'',
           userNo:'',
					 depId:'',
           pageSize: 10,
           pageNum:1,
         },
         pagination:{
           total: 0
       },
         currentPage:1,
         columns: [
 					{
 						title: '序号',
 						key: 'index',
 						minWidth: '50',
 						formatter (row, column, cellValue, index) {
 							return index+1
 						}
 					},
           {
             title: '学生学号',
             key: 'userNo',
             minWidth: '100',
 						showOverflowTooltip: true
           },
           {
             title: '姓名',
             key: 'userNm',
             minWidth: '100',
 						showOverflowTooltip: true
           },
           {
             title: '所属班级',
             key: 'depNm',
             minWidth: '100',
             showOverflowTooltip: true
           },
 					{
 					  title: '寄宿/走读',
 					  key: 'extPutTyp',
 					  minWidth: '80',
 					  showOverflowTooltip: true,
 						formatter (row, column, cellValue, index) {
 							if(cellValue === '0'){
 								return '寄读'
 							}else if(cellValue === '1'){
 								return '走读'
 							} 
 						}
 					},
					{
					  title: '状态',
					  key: 'extState',
					  minWidth: '80',
					  showOverflowTooltip: true,
						formatter (row, column, cellValue, index) {
							if(cellValue === '0'){
								return '在读'
							}else if(cellValue === '1'){
								return '毕业'
							}else if(cellValue === '2'){
								return '肄业'
							}
						}
					},
					 {
					  title: '登记日期',
					  key: 'creTm',
					  minWidth: '150',
					  showOverflowTooltip: true
					}
         ],
         rowHandle: {
           columnHeader: '操作',
           minWidth: '200',
           align:'center',
          custom: [
 						{
 								text: '编辑',
 								type: 'primary',
 								size: 'small',
 								emit: 'edit'
 							},
 						{
 							 text: '删除',
 							 type: 'danger',
 							 size: 'small',
 							 emit: 'delete'
 						 }
            
           ],
 
         },
         data: [],
         	rules: {
           userNo: [{ required: true, validator: checkUserNo, trigger: "blur" }],
           userNm: [{ required: true, message: "请输入学生姓名", trigger: "blur" }],
           extPutTyp: [{ required: true, message: "请选择", trigger: "change" }],
           extState: [ { required: true, message: "请选择", trigger: "change" }],
         	sex: [ { required: true, message: "请选择", trigger: "change" }],
 					extPapers: [{ required: true, message: "请选择", trigger: "change" }],
 					extIdCard: [{ validator: checkIdCode, trigger: "blur" }],
 					extBirth	: [{ required: true, message: "请选择出生日期", trigger: "blur" }],
 					extAge: [ { required: true, message: "请输入年龄", trigger: "blur" },{ type: 'number', message: '年龄为数字'}],
 					extAddr: [ { required: true, message: "请输入联系地址", trigger: "blur" }],
 					extCensus: [ { required: true, message: "请输入所属地址", trigger: "blur" }],
					extPatriarch: [ { required: true, message: "请至少输入一位家长姓名", trigger: "blur" }],
					mblNo: [ { validator: checkPhone, required: true, trigger: "blur" }],
					//extMbl:[ {required: false, validator: checkPhone,  trigger: "blur" }]
         }
       }
     },
     methods: {
			 action(data){
				 if(data.alias === 'top'){
					 this.filter.depId = ''
				 }else{
					 if(data.alias === 'JG002'){
						 this.falg = false
						 this.form.depId = data.id
						 this.form.depNm = data.name
					 }else{
					 		this.falg = true
					 }
					 this.filter.depId = data.id
				 }
			  this.handleList()
			 },
			 getOrgId(val){
			 	this.form.orgId = val
			 },
 			handleSelectionChange (selection) {
 			  this.selection = selection
 			},
       handleList (val) {
         if(val){this.filter.pageNum=1
         this.currentPage = 1
         }
         this.loading = true
         getSchoolList(this.filter).then(res=>{
           this.loading = false
           this.data = res.userList.list
           this.pagination.total = res.userList.total
         }).catch(err=>{
           this.loading = false
         })
       },
       //导出
			 exportOperation(){
				  if (!this.data.length){
				   this.$message({
				     message: '页面无数据,无法导出',
				     type: 'error'
				   })
				   return false
				 }
				 const TOKENID = util.cookies.get('TOKENID')
				 //const TOKENID = '20190607000000ongaognaon'
				 const REQTM = '2019-06-14 18:00:00'
				 //const USERID = util.cookies.get('USERID')
				 window.open(`${process.env.VUE_APP_API}/student/downStaffExcel?userNo=${this.filter.userNo}&userNm=${this.filter.userNm}&REQTM=${REQTM}&TOKENID=${TOKENID}`)
			 },
       handleCurrentChange (val) {
         this.filter.pageNum = val
         this.handleList()
       },
       handleSizeChange (val) {
         this.filter.pageNum = 1
         this.filter.pageSize = val
         this.handleList()
       },
       operInstance () {
       this.$refs['form'].validate((valid) => {
           if (valid) {
 						this.staLoading=true
             addSchoolList (this.form).then(res=>{
 							this.staLoading=false
               this.operVisible = false
               this.$message({
                 message: this.form.userId?'编辑成功':'新增成功',
                 type: 'success'
               })
               this.handleList()
							 this.$nextTick(()=>{
							 	 this.$refs.Tree.handleTreeNode()
							 })
             }).catch(err=>{
 							this.staLoading=false
 						})
           }
         })
       },
      handleRowEdit ({index, row}) {
         this.isEdit = true
         this.diaLogName = '编辑'
 				let userId = row.userId
 				editPartner({userId}).then(res=>{
 				   this.form=res.user
 				})
 				this.form = row
         this.operVisible = true
       },
       handleRowRemove ({index, row}) {
        this.$confirm(`确定要删除吗?`, '确认操作', {
           confirmButtonText: '确定',
           cancelButtonText: '放弃',
           type: 'warning'
         }).then(() => {
           let userId = row.userId
           deleteSchool({
             userId
           }).then(res=>{
             this.$message({
               message: '删除成功',
               type: 'success'
             })
             this.handleList ()
						 this.$nextTick(()=>{
						 	 this.$refs.Tree.handleTreeNode()
						 })
           })
         })
       },
 			handleClick(){},
       clearForm () {
         this.form = {
 					 depId:this.form.depId,
 					 depNm:this.form.depNm,
 					 orgId:'',
					userId:'', 
					userNo:'',	 	
					userNm:'',	
					extPutTyp:'',
					extState:'',	 	
					sex:'',	
					extPapers:'',
					extIdCard:'',
					extPatriarch:'',	
					mblNo:'',
					extBirth:'',	
					extAge:'',	
					extAddr:'',
					extCensus:'',
					extBrief:'',
					extPatriarcht:'',
					extMbl:''
         }
         this.isEdit = false
         this.diaLogName = '新增'
       }
     },
     mounted () {
 			//this.getFunction()
 			//this.tableOptions.pageList = [20,50,100,200,500]
       this.filter.pageSize = this.tableOptions.pageList[0]
       this.tableOptions = this.$calcTableHeight(tableOptions,51)
 			this.handleList()
     }
   }
 </script>
  