<template>
  <div>
    <avue-form ref="form" v-model="form" :option="option" @submit="submit" @reset-change="test2">
      <template slot="personName" slot-scope="scope">
        <select-dialog-user :id="id" :ehr="ehr" :name="name" :callback="selectCallback"></select-dialog-user>
      </template>
    </avue-form>
  </div>
</template>

<script>
  import SelectDialogUser from "../select-dialog/select-dialog-user";
  export default {
    name: "flow-settings",
    components: {SelectDialogUser},
    data(){
      return {
        form: {},
        option: {
          column: [
            {
              label: "審批人",
              prop: "id",
              slot: true,
              display: false,
              rules: [{
                required: true,
                message: "請輸入銀行號",
                trigger: "change"
              }]
            },     {
              label: "審批人",
              prop: "personName",
              slot: true,
              rules: [{
                required: true,
                message: "請輸入審批人",
                trigger: "change"
              }]
            },
            {
              label: "審批人員工號",
              prop: "personNo",
              disabled: true,
              rules: [{
                required: false,
                message: "請輸入銀行號",
                trigger: "blur"
              }]
            },
          ]
        },
      }
    },
    props: {
      id: {
        type: String
      },
      ehr: {
        type: String
      },
      name: {
        type: String
      },
      callback: {
        type: Function
      },
    },
    mounted() {
      this.form.id = this.id;
      this.form.personNo = this.ehr;
      this.form.personName = this.name;
    },
    methods: {
      test1(){
      },
      test2(){
        this.name = ''
      },
      selectCallback(row){
        this.form.personId = row.id;
        this.form.personName = row.name;
        this.form.personNo = row.ehr;

      },
      submit(row, don){
        this.$emit('close')
        this.callback(row)
        don();
      }
    }
  }
</script>

<style scoped>

</style>
