<template>
	<el-card>
      <el-form :inline="true" :model="state.queryForm" @keyup.enter="getDataList()">
          <el-form-item>
              <el-input v-model="state.queryForm.tanantCode" placeholder="租户编码" clearable></el-input>
          </el-form-item>
          <el-form-item>
              <el-input v-model="state.queryForm.tenantName" placeholder="租户名称" clearable></el-input>
          </el-form-item>
          <el-form-item>
              <el-button @click="getDataList()">查询</el-button>
          </el-form-item>
          <el-form-item>
              <el-button v-auth="'ebo:sys:user:save'" type="primary" @click="addOrUpdateHandle()">新增</el-button>
          </el-form-item>
      </el-form>
      <el-table
              v-loading="state.dataListLoading"
              show-overflow-tooltip
              :data="state.dataList"
              border
              style="width: 100%"
              @selection-change="selectionChangeHandle"
      >
          <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
          <el-table-column prop="tenantCode" label="租户编码" header-align="center" align="center"></el-table-column>
          <el-table-column prop="tenantName" label="租户名称" header-align="center" align="center"></el-table-column>
          <el-table-column prop="tenantAdmin" label="租户超管账号" header-align="center"
                           align="center"></el-table-column>
          <fast-table-column prop="usabled" label="状态" dict-type="user_status"></fast-table-column>
          <el-table-column prop="createTime" label="创建时间" header-align="center" align="center"
                           width="170"></el-table-column>
          <el-table-column label="操作" fixed="right" header-align="center" align="center" width="150">
              <template #default="scope">
                  <el-button v-auth="'ebo:sys:tenant:update'" type="primary" link
                             @click="addOrUpdateHandle(scope.row.id)"> 修改
                  </el-button>
                  <el-button v-auth="'ebo:sys:tenant:delete'" type="primary" link
                             @click="deleteBatchHandle(scope.row.id)"> 删除
                  </el-button>
              </template>
          </el-table-column>
      </el-table>
      <el-pagination
              :current-page="state.page"
              :page-sizes="state.pageSizes"
              :page-size="state.limit"
              :total="state.total"
              layout="total, sizes, prev, pager, next, jumper"
              @size-change="sizeChangeHandle"
              @current-change="currentChangeHandle"
      >
      </el-pagination>

      <!-- 弹窗, 新增 / 修改 -->
      <add-or-update ref="addOrUpdateRef" @refresh-data-list="getDataList"></add-or-update>
  </el-card>
</template>

<script setup lang="ts" name="SysUserIndex">
import {useCrud} from '@/hooks'
import {reactive, ref} from 'vue'
import AddOrUpdate from './add-or-update.vue'
import {IHooksOptions} from '@/hooks/interface'

const state: IHooksOptions = reactive({
    dataListUrl: '/sys/tenant/page',
    deleteUrl: '/sys/tenant',
    queryForm: {
        tanantCode: '',
        tanantName: ''
    }
})

const addOrUpdateRef = ref()
const addOrUpdateHandle = (id?: number) => {
	addOrUpdateRef.value.init(id)
}

const {getDataList, selectionChangeHandle, sizeChangeHandle, currentChangeHandle, deleteBatchHandle} = useCrud(state)
</script>
