Files
JeecgBoot/jeecgboot-vue3/src/views/system/tenant/components/TenantUserList.vue

104 lines
3.0 KiB
Java
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<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>