<template>
  <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="800px">
    <BasicTable @register="registerTable" :rowSelection="rowSelection">
      <template #tableTitle>
        <a-button v-if="selectedRowKeys.length>0" preIcon="ant-design:delete-outlined" type="primary" @click="handleLeaveBatch" style="margin-right: 5px">批量请离</a-button>
      </template>
      <template #action="{ record }">
        <TableAction :actions="getActions(record)" />
      </template>
    </BasicTable>
  </BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed, unref } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { BasicForm, useForm } from '/@/components/Form/index';
import { userColumns, userSearchFormSchema } from "../tenant.data";
import { getTenantUserList, leaveTenant } from "../tenant.api";
import { useListPage } from "/@/hooks/system/useListPage";
import { BasicTable, TableAction } from '/@/components/Table';

const tenantId = ref<number>(0);
// 列表页面公共参数、方法
const { prefixCls, tableContext } = useListPage({
  designScope: 'tenant-template',
  tableProps: {
    api: getTenantUserList,
    columns: userColumns,
    immediate:false,
    formConfig: {
      schemas: userSearchFormSchema,
      //update-begin---author:wangshuai ---date:20230704  for：【QQYUN-5698】样式问题------------
      labelWidth: 40,
      //update-end---author:wangshuai ---date:20230704  for：【QQYUN-5698】样式问题------------
      actionColOptions: {
        xs: 24,
        sm: 8,
        md: 8,
        lg: 8,
        xl: 8,
        xxl: 8,
      },
    },
    beforeFetch: (params) => {
      return Object.assign(params, { userTenantId: unref(tenantId) });
    },
  },
});
const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;

// Emits声明
const emit = defineEmits(['register', 'success']);
//表单赋值
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
  tenantId.value = data.id;
  success();
});
//设置标题
const title = '成员';
//表单提交事件
async function handleSubmit(v) {
  closeModal();
}

function getActions(record) {
  return [
    {
      label: '移除',
      onClick: handleLeave.bind(null, record.id),
    },
  ]
}

/**
 * 成功
 */
function success() {
  (selectedRowKeys.value = []) && reload();
}

/**
 * 请离
 * @param id
 */
async function handleLeave(id) {
  await leaveTenant({userIds:id,tenantId:unref(tenantId)},success)
}

/**
 * 批量请离
 */
async function  handleLeaveBatch(){
  await leaveTenant({userIds:selectedRowKeys.value.join(","),tenantId:unref(tenantId)},success)
}
</script>

<style scoped>
  /*update-begin---author:wangshuai ---date:20220705  for：查询组件input有后缀，隐藏掉------------*/
  :deep(.ant-input-suffix){
    display: none;
  }
  /*update-begin---author:wangshuai ---date:20220705  for：查询组件input有后缀，隐藏掉------------*/
</style>