<template>
  <avue-input-table :disabled="disabled" :props="props" :column="column" :formatter="formatter" :on-load="loadResidential" v-model="value" placeholder="请选择"></avue-input-table>
</template>

<script>

  import {getList} from "@/api/community/residential";

  export default {
    name: "select-dialog-residential",
    data(){
      return {
        column:{
          children:{
            border: true,
            column: [{
              label: '小区名称',
              search:true,
              prop: 'name'
            }, {
              label: '所属社区',
              search:true,
              prop: 'agencyName'
            }, {
              label: '详细地址',
              search:true,
              prop: 'address'
            }],
          },
        },
        props: {
          label: 'name',
          value: 'id'
        },
        value: '0'
      }
    },
    props: {
      callback: {
        type: Function
      },
      id: {
        type: String
      },
      name: {
        type: String
      },
      disabled: {
        type: Boolean,
        default: false
      },
    },
    created() {
      const tenantType = localStorage.getItem("tenantType");
      if (tenantType == 0){
        this.column.children.column[0].label = "所属社区"
        this.column.children.column[1].label = "所属小区"
      }else if (tenantType == 1){
        this.column.children.column[0].label = "所属园区"
        this.column.children.column[1].label = "所属区域"
      }
    },
    methods: {
      formatter(row){
        if(!row.name) return '';
        if (row.name && this.callback){
          this.callback(row)
        }
        return row.name
      },
      loadResidential({ page, value, data }, callback){
        if (value) {
          callback({
            id: this.id,
            name: this.name,
          })
          return
        }
        //分页查询信息
        getList(page.currentPage, page.pageSize, data).then(res => {
          var data = res.data.data;
          callback({total: data.total, data: data.records});
        })
      },
    }
  }
</script>

<style scoped>

</style>
