<template>
  <div class="modals">
    <Modal
        v-model="modal1"
        title="修改"
        @on-ok="ok"
        @on-cancel="cancel">
        <Form :label-width="100" ref="formValidate" :model="formValidate">
          <FormItem label="姓名" prop="name">
              <Input placeholder="" :maxlength="30" v-model='dilogObj.name'></Input>
          </FormItem>
          <FormItem label="年龄" prop="age">
              <Select @on-change='change'>
                  <Option v-for="(item,index) in selectArray" :value="item.id" :key="index">{{ item.name }}</Option>
              </Select>
          </FormItem>
          <FormItem label="身高" prop="height">
              <Input placeholder="" :maxlength="30" v-model='dilogObj.height'></Input>
          </FormItem>
          <FormItem label="学校" prop="scho">
              <Input placeholder="" :maxlength="30" v-model='dilogObj.scho'></Input>
          </FormItem>
        </Form>
    </Modal>
  </div>
</template>

<script>
  export default {
    name:'VtableDilog',
    data(){
      return{
        modal1:false,
        formValidate:{},
        selectArray:[]
      }
    },
    props:{
      dilogObj:{
        type:Object
      }
    },
    methods:{
      change(val){

      },
      ok(){
        this.$refs['formValidate'].validate((valid) =>{
          if(valid){
            for(var i=0;i < this.$parent.tableData.length;i++){
              if(this.dilogObj.id === this.$parent.tableData[i].id){
                this.$parent.tableData[i].name = this.dilogObj.name;
                this.modal1 = false
              }
            }
          }
        })
      },
      cancel(){
        
      }
    }
  }
</script>

<style>
</style>
