<template>
  <div v-if="visible">
    <avue-input-table :disabled="disabled" :props="props" :column="column" :formatter="formatter" :on-load="loadData" v-model="value" placeholder="請選擇"></avue-input-table>
  </div>
</template>

<script>

  import {getPage} from "@/api/system/user";
  import {getRoleTree} from "@/api/system/role";

  export default {
    name: "select-dialog-user",
    data(){
      return {
        visible: true,
        column:{
          children:{
            border: true,
            column: [
              {
                label: "登錄帳號",
                prop: "account",
                search: true,
                display: false
              },
              {
                label: "EHR號",
                prop: "ehr",
                slot: true,
                display: false
              },
              {
                label: "用戶姓名",
                prop: "name",
                search: true,
                display: false
              },
              {
                label: "所屬角色",
                prop: "roleName",
                slot: true,
                display: false
              },
              {
                label: "所屬角色",
                prop: "roleId",
                search: true,
                multiple: true,
                hide: true,
                type: "tree",
                dicData: [],
                props: {
                  label: "title"
                },
                checkStrictly: true,
                slot: true,
                rules: [{
                  required: true,
                  message: "請選擇所屬角色",
                  trigger: "click"
                }]
              },
              {
                label: "所屬部門",
                prop: "deptName",
                slot: true,
                display: false
              },
              /*{
                label: "用戶平臺",
                prop: "userTypeName",
                slot: true,
                display: false
              },
              {
                label: "用戶平臺",
                type: "select",
                dicUrl: "/api/blade-system/dict/dictionary?code=user_type",
                props: {
                  label: "dictValue",
                  value: "dictKey"
                },
                dataType: "number",
                search: true,
                hide: true,
                display: false,
                prop: "userType",
                rules: [{
                  required: true,
                  message: "請選擇用戶平臺",
                  trigger: "blur"
                }]
              },*/
            ],
          },
        },
        props: {
          label: 'name',
          value: 'id'
        },
        value: '0'
      }
    },
    props: {
      callback: {
        type: Function
      },
      id: {
        type: String
      },
      ehr: {
        type: String
      },
      name: {
        type: String
      },
      disabled: {
        type: Boolean,
        default: false
      },
      hasOrgNo: {
        type: String,
      }
    },
    watch: {
      name(newVal, oldVal){
        // if (!newVal) return;
        this.visible = false;
        let _this = this;
        setTimeout(function(){
          _this.visible = true;
        },100)
      },
      hasOrgNo(newVal, oldVal){
        // if (!newVal) return;
        this.visible = false;
        let _this = this;
        setTimeout(function(){
          _this.visible = true;
        },100)
      }
    },
    created() {
      getRoleTree("000000").then(res => {
        const column = this.findObject(this.column.children.column, "roleId");
        column.dicData = res.data.data;
      });
    },
    methods: {
      formatter(row){
        if(!row.name) return '';
        if (row.name && this.callback){
          this.callback(row)
        }
        return row.name;
        // return row.name + '-' + row.ehr;
      },
      loadData({ page, value, data }, callback){
        if (value) {
          callback({
            id: this.id,
            ehr: this.ehr,
            name: this.name,
          })
          return
        }
        //分頁查詢信息
        getPage(page.currentPage, page.pageSize, data, this.hasOrgNo).then(res => {
          var data = res.data.data;
          callback({total: data.total, data: data.records});
        })
      },
    }
  }
</script>

<style scoped>

</style>
