10 changed files with 25 additions and 787 deletions
@ -1,62 +0,0 @@ |
|||||
import { defHttp } from '@/utils/http/axios' |
|
||||
|
|
||||
export interface TenantVO { |
|
||||
id: number |
|
||||
name: string |
|
||||
contactName: string |
|
||||
contactMobile: string |
|
||||
status: number |
|
||||
domain: string |
|
||||
packageId: number |
|
||||
username: string |
|
||||
password: string |
|
||||
expireTime: Date |
|
||||
accountCount: number |
|
||||
createTime: Date |
|
||||
} |
|
||||
|
|
||||
export interface TenantPageReqVO extends PageParam { |
|
||||
name?: string |
|
||||
contactName?: string |
|
||||
contactMobile?: string |
|
||||
status?: number |
|
||||
createTime?: Date[] |
|
||||
} |
|
||||
|
|
||||
export interface TenantExportReqVO { |
|
||||
name?: string |
|
||||
contactName?: string |
|
||||
contactMobile?: string |
|
||||
status?: number |
|
||||
createTime?: Date[] |
|
||||
} |
|
||||
|
|
||||
// 查询租户列表
|
|
||||
export function getTenantPage(params: TenantPageReqVO) { |
|
||||
return defHttp.get({ url: '/system/tenant/page', params }) |
|
||||
} |
|
||||
|
|
||||
// 查询租户详情
|
|
||||
export function getTenant(id: number) { |
|
||||
return defHttp.get({ url: `/system/tenant/get?id=${id}` }) |
|
||||
} |
|
||||
|
|
||||
// 新增租户
|
|
||||
export function createTenant(data: TenantVO) { |
|
||||
return defHttp.post({ url: '/system/tenant/create', data }) |
|
||||
} |
|
||||
|
|
||||
// 修改租户
|
|
||||
export function updateTenant(data: TenantVO) { |
|
||||
return defHttp.put({ url: '/system/tenant/update', data }) |
|
||||
} |
|
||||
|
|
||||
// 删除租户
|
|
||||
export function deleteTenant(id: number) { |
|
||||
return defHttp.delete({ url: `/system/tenant/delete?id=${id}` }) |
|
||||
} |
|
||||
|
|
||||
// 导出租户
|
|
||||
export function exportTenant(params: TenantExportReqVO) { |
|
||||
return defHttp.download({ url: '/system/tenant/export-excel', params }, '租户.xls') |
|
||||
} |
|
||||
@ -1,49 +0,0 @@ |
|||||
import { defHttp } from '@/utils/http/axios' |
|
||||
|
|
||||
export interface TenantPackageVO { |
|
||||
id: number |
|
||||
name: string |
|
||||
status: number |
|
||||
remark: string |
|
||||
creator: string |
|
||||
updater: string |
|
||||
updateTime: string |
|
||||
menuIds: number[] |
|
||||
createTime: Date |
|
||||
} |
|
||||
|
|
||||
export interface TenantPackagePageReqVO extends PageParam { |
|
||||
name?: string |
|
||||
status?: number |
|
||||
remark?: string |
|
||||
createTime?: Date[] |
|
||||
} |
|
||||
|
|
||||
// 查询租户套餐列表
|
|
||||
export function getTenantPackagePage(params: TenantPackagePageReqVO) { |
|
||||
return defHttp.get({ url: '/system/tenant-package/page', params }) |
|
||||
} |
|
||||
|
|
||||
// 获得租户
|
|
||||
export function getTenantPackage(id: number) { |
|
||||
return defHttp.get({ url: `/system/tenant-package/get?id=${id}` }) |
|
||||
} |
|
||||
|
|
||||
// 新增租户套餐
|
|
||||
export function createTenantPackage(data: TenantPackageVO) { |
|
||||
return defHttp.post({ url: '/system/tenant-package/create', data }) |
|
||||
} |
|
||||
|
|
||||
// 修改租户套餐
|
|
||||
export function updateTenantPackage(data: TenantPackageVO) { |
|
||||
return defHttp.put({ url: '/system/tenant-package/update', data }) |
|
||||
} |
|
||||
|
|
||||
// 删除租户套餐
|
|
||||
export function deleteTenantPackage(id: number) { |
|
||||
return defHttp.delete({ url: `/system/tenant-package/delete?id=${id}` }) |
|
||||
} |
|
||||
// 获取租户套餐精简信息列表
|
|
||||
export function getTenantPackageList() { |
|
||||
return defHttp.get({ url: '/system/tenant-package/get-simple-list' }) |
|
||||
} |
|
||||
@ -1,58 +0,0 @@ |
|||||
<script lang="ts" setup> |
|
||||
import { ref, unref } from 'vue' |
|
||||
import { formSchema } from './tenant.data' |
|
||||
import { useI18n } from '@/hooks/web/useI18n' |
|
||||
import { useMessage } from '@/hooks/web/useMessage' |
|
||||
import { BasicForm, useForm } from '@/components/Form' |
|
||||
import { BasicModal, useModalInner } from '@/components/Modal' |
|
||||
import { createTenant, getTenant, updateTenant } from '@/api/system/tenant' |
|
||||
|
|
||||
defineOptions({ name: 'SystemTenantModal' }) |
|
||||
|
|
||||
const emit = defineEmits(['success', 'register']) |
|
||||
const { t } = useI18n() |
|
||||
const { createMessage } = useMessage() |
|
||||
const isUpdate = ref(true) |
|
||||
|
|
||||
const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({ |
|
||||
labelWidth: 120, |
|
||||
baseColProps: { span: 24 }, |
|
||||
schemas: formSchema, |
|
||||
showActionButtonGroup: false, |
|
||||
actionColOptions: { span: 23 }, |
|
||||
}) |
|
||||
|
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => { |
|
||||
resetFields() |
|
||||
setModalProps({ confirmLoading: false }) |
|
||||
isUpdate.value = !!data?.isUpdate |
|
||||
if (unref(isUpdate)) { |
|
||||
const res = await getTenant(data.record.id) |
|
||||
setFieldsValue({ ...res }) |
|
||||
} |
|
||||
}) |
|
||||
|
|
||||
async function handleSubmit() { |
|
||||
try { |
|
||||
const values = await validate() |
|
||||
setModalProps({ confirmLoading: true }) |
|
||||
if (unref(isUpdate)) |
|
||||
await updateTenant(values) |
|
||||
else |
|
||||
await createTenant(values) |
|
||||
|
|
||||
closeModal() |
|
||||
emit('success') |
|
||||
createMessage.success(t('common.saveSuccessText')) |
|
||||
} |
|
||||
finally { |
|
||||
setModalProps({ confirmLoading: false }) |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<template> |
|
||||
<BasicModal v-bind="$attrs" :title="isUpdate ? t('action.edit') : t('action.create')" @register="registerModal" @ok="handleSubmit"> |
|
||||
<BasicForm @register="registerForm" /> |
|
||||
</BasicModal> |
|
||||
</template> |
|
||||
@ -1,97 +0,0 @@ |
|||||
<script lang="ts" setup> |
|
||||
import TenantModal from './TenantModal.vue' |
|
||||
import { columns, searchFormSchema } from './tenant.data' |
|
||||
import { BasicTable, TableAction, useTable } from '@/components/Table' |
|
||||
import type { TenantExportReqVO } from '@/api/system/tenant' |
|
||||
import { deleteTenant, exportTenant, getTenantPage } from '@/api/system/tenant' |
|
||||
import { useModal } from '@/components/Modal' |
|
||||
import { IconEnum } from '@/enums/appEnum' |
|
||||
import { useI18n } from '@/hooks/web/useI18n' |
|
||||
import { useMessage } from '@/hooks/web/useMessage' |
|
||||
import { DocAlert } from '@/components/DocAlert' |
|
||||
|
|
||||
defineOptions({ name: 'SystemTenant' }) |
|
||||
|
|
||||
const { t } = useI18n() |
|
||||
const { createConfirm, createMessage } = useMessage() |
|
||||
const [registerModal, { openModal }] = useModal() |
|
||||
const [registerTable, { getForm, reload }] = useTable({ |
|
||||
title: '租户列表', |
|
||||
api: getTenantPage, |
|
||||
columns, |
|
||||
formConfig: { labelWidth: 120, schemas: searchFormSchema }, |
|
||||
useSearchForm: true, |
|
||||
showTableSetting: true, |
|
||||
showIndexColumn: false, |
|
||||
actionColumn: { |
|
||||
width: 140, |
|
||||
title: t('common.action'), |
|
||||
dataIndex: 'action', |
|
||||
fixed: 'right', |
|
||||
}, |
|
||||
}) |
|
||||
|
|
||||
function handleCreate() { |
|
||||
openModal(true, { isUpdate: false }) |
|
||||
} |
|
||||
|
|
||||
function handleEdit(record: Recordable) { |
|
||||
openModal(true, { record, isUpdate: true }) |
|
||||
} |
|
||||
|
|
||||
async function handleExport() { |
|
||||
createConfirm({ |
|
||||
title: t('common.exportTitle'), |
|
||||
iconType: 'warning', |
|
||||
content: t('common.exportMessage'), |
|
||||
async onOk() { |
|
||||
await exportTenant(getForm().getFieldsValue() as TenantExportReqVO) |
|
||||
createMessage.success(t('common.exportSuccessText')) |
|
||||
}, |
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
async function handleDelete(record: Recordable) { |
|
||||
await deleteTenant(record.id) |
|
||||
createMessage.success(t('common.delSuccessText')) |
|
||||
reload() |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<template> |
|
||||
<div> |
|
||||
<DocAlert title="SaaS 多租户" url="https://doc.iocoder.cn/saas-tenant/" /> |
|
||||
|
|
||||
<BasicTable @register="registerTable"> |
|
||||
<template #toolbar> |
|
||||
<a-button v-auth="['system:tenant:create']" type="primary" :pre-icon="IconEnum.ADD" @click="handleCreate"> |
|
||||
{{ t('action.create') }} |
|
||||
</a-button> |
|
||||
<a-button v-auth="['system:tenant:export']" :pre-icon="IconEnum.EXPORT" @click="handleExport"> |
|
||||
{{ t('action.export') }} |
|
||||
</a-button> |
|
||||
</template> |
|
||||
<template #bodyCell="{ column, record }"> |
|
||||
<template v-if="column.key === 'action'"> |
|
||||
<TableAction |
|
||||
:actions="[ |
|
||||
{ icon: IconEnum.EDIT, label: t('action.edit'), auth: 'system:tenant:update', onClick: handleEdit.bind(null, record) }, |
|
||||
{ |
|
||||
icon: IconEnum.DELETE, |
|
||||
danger: true, |
|
||||
label: t('action.delete'), |
|
||||
auth: 'system:tenant:delete', |
|
||||
popConfirm: { |
|
||||
title: t('common.delMessage'), |
|
||||
placement: 'left', |
|
||||
confirm: handleDelete.bind(null, record), |
|
||||
}, |
|
||||
}, |
|
||||
]" |
|
||||
/> |
|
||||
</template> |
|
||||
</template> |
|
||||
</BasicTable> |
|
||||
<TenantModal @register="registerModal" @success="reload()" /> |
|
||||
</div> |
|
||||
</template> |
|
||||
@ -1,191 +0,0 @@ |
|||||
import { getTenantPackageList } from '@/api/system/tenantPackage' |
|
||||
import type { BasicColumn, FormSchema } from '@/components/Table' |
|
||||
import { useRender } from '@/components/Table' |
|
||||
import { DICT_TYPE, getDictOptions } from '@/utils/dict' |
|
||||
|
|
||||
export const columns: BasicColumn[] = [ |
|
||||
{ |
|
||||
title: '租户编号', |
|
||||
dataIndex: 'id', |
|
||||
width: 100, |
|
||||
}, |
|
||||
{ |
|
||||
title: '租户名', |
|
||||
dataIndex: 'name', |
|
||||
width: 180, |
|
||||
}, |
|
||||
{ |
|
||||
title: '租户套餐', |
|
||||
dataIndex: 'packageId', |
|
||||
width: 100, |
|
||||
}, |
|
||||
{ |
|
||||
title: '联系人', |
|
||||
dataIndex: 'contactName', |
|
||||
width: 120, |
|
||||
}, |
|
||||
{ |
|
||||
title: '联系手机', |
|
||||
dataIndex: 'contactMobile', |
|
||||
width: 120, |
|
||||
}, |
|
||||
{ |
|
||||
title: '账号额度', |
|
||||
dataIndex: 'accountCount', |
|
||||
width: 120, |
|
||||
customRender: ({ text }) => { |
|
||||
return useRender.renderTag(text) |
|
||||
}, |
|
||||
}, |
|
||||
{ |
|
||||
title: '过期时间', |
|
||||
dataIndex: 'expireTime', |
|
||||
width: 180, |
|
||||
customRender: ({ text }) => { |
|
||||
return useRender.renderDate(text) |
|
||||
}, |
|
||||
}, |
|
||||
{ |
|
||||
title: '绑定域名', |
|
||||
dataIndex: 'website', |
|
||||
width: 200, |
|
||||
}, |
|
||||
{ |
|
||||
title: '租户状态', |
|
||||
dataIndex: 'status', |
|
||||
width: 180, |
|
||||
customRender: ({ text }) => { |
|
||||
return useRender.renderDict(text, DICT_TYPE.COMMON_STATUS) |
|
||||
}, |
|
||||
}, |
|
||||
{ |
|
||||
title: '备注', |
|
||||
dataIndex: 'remark', |
|
||||
width: 180, |
|
||||
}, |
|
||||
{ |
|
||||
title: '创建时间', |
|
||||
dataIndex: 'createTime', |
|
||||
width: 180, |
|
||||
customRender: ({ text }) => { |
|
||||
return useRender.renderDate(text) |
|
||||
}, |
|
||||
}, |
|
||||
] |
|
||||
|
|
||||
export const searchFormSchema: FormSchema[] = [ |
|
||||
{ |
|
||||
label: '租户名', |
|
||||
field: 'name', |
|
||||
component: 'Input', |
|
||||
colProps: { span: 8 }, |
|
||||
}, |
|
||||
{ |
|
||||
label: '联系人', |
|
||||
field: 'contactName', |
|
||||
component: 'Input', |
|
||||
colProps: { span: 8 }, |
|
||||
}, |
|
||||
{ |
|
||||
label: '联系手机', |
|
||||
field: 'contactMobile', |
|
||||
component: 'Input', |
|
||||
colProps: { span: 8 }, |
|
||||
}, |
|
||||
{ |
|
||||
label: '状态', |
|
||||
field: 'status', |
|
||||
component: 'Select', |
|
||||
componentProps: { |
|
||||
options: getDictOptions(DICT_TYPE.COMMON_STATUS), |
|
||||
}, |
|
||||
colProps: { span: 8 }, |
|
||||
}, |
|
||||
{ |
|
||||
label: '创建时间', |
|
||||
field: 'createTime', |
|
||||
component: 'RangePicker', |
|
||||
colProps: { span: 8 }, |
|
||||
}, |
|
||||
] |
|
||||
|
|
||||
export const formSchema: FormSchema[] = [ |
|
||||
{ |
|
||||
label: '编号', |
|
||||
field: 'id', |
|
||||
show: false, |
|
||||
component: 'Input', |
|
||||
}, |
|
||||
{ |
|
||||
label: '租户名', |
|
||||
field: 'name', |
|
||||
required: true, |
|
||||
component: 'Input', |
|
||||
}, |
|
||||
{ |
|
||||
label: '租户套餐', |
|
||||
field: 'packageId', |
|
||||
required: true, |
|
||||
component: 'ApiSelect', |
|
||||
componentProps: { |
|
||||
api: () => getTenantPackageList(), |
|
||||
labelField: 'name', |
|
||||
valueField: 'id', |
|
||||
}, |
|
||||
}, |
|
||||
{ |
|
||||
label: '联系人', |
|
||||
field: 'contactName', |
|
||||
required: true, |
|
||||
component: 'Input', |
|
||||
}, |
|
||||
{ |
|
||||
label: '联系手机', |
|
||||
field: 'contactMobile', |
|
||||
component: 'Input', |
|
||||
}, |
|
||||
{ |
|
||||
label: '用户名称', |
|
||||
field: 'username', |
|
||||
component: 'Input', |
|
||||
ifShow: ({ values }) => !values.id, |
|
||||
}, |
|
||||
{ |
|
||||
label: '用户密码', |
|
||||
field: 'password', |
|
||||
component: 'InputPassword', |
|
||||
ifShow: ({ values }) => !values.id, |
|
||||
}, |
|
||||
{ |
|
||||
label: '账号额度', |
|
||||
field: 'accountCount', |
|
||||
required: true, |
|
||||
defaultValue: 0, |
|
||||
component: 'InputNumber', |
|
||||
}, |
|
||||
{ |
|
||||
label: '过期时间', |
|
||||
field: 'expireTime', |
|
||||
required: true, |
|
||||
component: 'DatePicker', |
|
||||
componentProps: { |
|
||||
showTime: true, |
|
||||
format: 'YYYY-MM-DD HH:mm:ss', |
|
||||
valueFormat: 'x', |
|
||||
}, |
|
||||
}, |
|
||||
{ |
|
||||
label: '绑定域名', |
|
||||
field: 'website', |
|
||||
required: true, |
|
||||
component: 'Input', |
|
||||
}, |
|
||||
{ |
|
||||
label: '租户状态', |
|
||||
field: 'status', |
|
||||
component: 'Select', |
|
||||
componentProps: { |
|
||||
options: getDictOptions(DICT_TYPE.COMMON_STATUS), |
|
||||
}, |
|
||||
}, |
|
||||
] |
|
||||
@ -1,127 +0,0 @@ |
|||||
<script lang="ts" setup> |
|
||||
import { ref, unref } from 'vue' |
|
||||
import { without } from 'lodash-es' |
|
||||
import { formSchema } from './tenantPackage.data' |
|
||||
import { useI18n } from '@/hooks/web/useI18n' |
|
||||
import { useMessage } from '@/hooks/web/useMessage' |
|
||||
import { BasicForm, useForm } from '@/components/Form' |
|
||||
import type { CheckedEvent, CheckedKeys, TreeItem } from '@/components/Tree' |
|
||||
import { BasicTree } from '@/components/Tree' |
|
||||
import { BasicModal, useModalInner } from '@/components/Modal' |
|
||||
import { createTenantPackage, getTenantPackage, updateTenantPackage } from '@/api/system/tenantPackage' |
|
||||
import { listSimpleMenus } from '@/api/system/menu' |
|
||||
import { handleTree } from '@/utils/tree' |
|
||||
|
|
||||
defineOptions({ name: 'SystemTenantPackageModal' }) |
|
||||
|
|
||||
const emit = defineEmits(['success', 'register']) |
|
||||
const { t } = useI18n() |
|
||||
const { createMessage } = useMessage() |
|
||||
const isUpdate = ref(true) |
|
||||
const treeData = ref<TreeItem[]>([]) |
|
||||
const menuKeys = ref<number[]>([]) |
|
||||
const menuHalfKeys = ref<number[]>([]) |
|
||||
// 默认展开的层级 |
|
||||
const defaultExpandLevel = ref<number>(1) |
|
||||
// 祖先节点list |
|
||||
const parentIdSets = ref<Set<number>>(new Set()) |
|
||||
const treeRef = ref() |
|
||||
|
|
||||
const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({ |
|
||||
labelWidth: 120, |
|
||||
baseColProps: { span: 24 }, |
|
||||
schemas: formSchema, |
|
||||
showActionButtonGroup: false, |
|
||||
actionColOptions: { span: 23 }, |
|
||||
}) |
|
||||
|
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => { |
|
||||
resetFields() |
|
||||
menuReset() |
|
||||
setModalProps({ confirmLoading: false }) |
|
||||
if (unref(treeData).length === 0) { |
|
||||
const res = await listSimpleMenus() |
|
||||
treeData.value = handleTree(res, 'id') |
|
||||
// 去重 拿到所有的祖先节点 |
|
||||
parentIdSets.value = new Set<number>(res.map(item => item.parentId)) |
|
||||
} |
|
||||
isUpdate.value = !!data?.isUpdate |
|
||||
|
|
||||
if (unref(isUpdate)) { |
|
||||
const res = await getTenantPackage(data.record.id) |
|
||||
// 默认关联节点 需要排除所有的祖先节点 否则会全部勾选 |
|
||||
// 只保留子节点 关联情况下会自己选中父节点 |
|
||||
// 排除祖先节点后的子节点 达到"独立"的效果 但可以进行关联选择 |
|
||||
const excludeParentIds: number[] = without(res.menuIds, ...Array.from(parentIdSets.value)) |
|
||||
// 这里的checkedKeys为包含所有节点的数组 用作判断数组是否修改过 |
|
||||
menuKeys.value = res.menuIds |
|
||||
// 这里只控制页面显示 不包含祖先节点 |
|
||||
res.menuIds = excludeParentIds |
|
||||
await setFieldsValue({ ...res }) |
|
||||
} |
|
||||
|
|
||||
// 默认展开的层级 |
|
||||
if (unref(treeRef)) |
|
||||
unref(treeRef).filterByLevel(defaultExpandLevel.value) |
|
||||
}) |
|
||||
|
|
||||
async function handleSubmit() { |
|
||||
try { |
|
||||
const values = await validate() |
|
||||
values.menuIds = [...menuKeys.value, ...menuHalfKeys.value] |
|
||||
setModalProps({ confirmLoading: true }) |
|
||||
if (unref(isUpdate)) |
|
||||
await updateTenantPackage(values) |
|
||||
else |
|
||||
await createTenantPackage(values) |
|
||||
|
|
||||
closeModal() |
|
||||
emit('success') |
|
||||
createMessage.success(t('common.saveSuccessText')) |
|
||||
} |
|
||||
finally { |
|
||||
setModalProps({ confirmLoading: false }) |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
function menuReset() { |
|
||||
menuKeys.value = [] |
|
||||
menuHalfKeys.value = [] |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* 父子节点关联情况下 checkedKeys为选中的菜单 e.halfCheckedKeys为父节点数组 |
|
||||
* 父子节点独立情况下 checkedKeys为{checked: number[], halfChecked: number[]} e.halfCheckedKeys为null |
|
||||
* @param checkedKeys 选中的菜单 |
|
||||
* @param event event |
|
||||
*/ |
|
||||
function menuCheck(checkedKeys: CheckedKeys, event: CheckedEvent) { |
|
||||
if (Array.isArray(checkedKeys)) { |
|
||||
menuKeys.value = checkedKeys |
|
||||
menuHalfKeys.value = event.halfCheckedKeys! |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<template> |
|
||||
<BasicModal v-bind="$attrs" :title="isUpdate ? t('action.edit') : t('action.create')" @register="registerModal" @ok="handleSubmit"> |
|
||||
<BasicForm @register="registerForm"> |
|
||||
<template #menuIds="{ model, field }"> |
|
||||
<BasicTree |
|
||||
v-if="treeData.length" |
|
||||
ref="treeRef" |
|
||||
v-model:checkedKeys="model[field]" |
|
||||
:tree-data="treeData" |
|
||||
:field-names="{ title: 'name', key: 'id' }" |
|
||||
checkable |
|
||||
toolbar |
|
||||
search |
|
||||
:show-strictly-button="false" |
|
||||
:selectable="false" |
|
||||
title="菜单分配" |
|
||||
@check="menuCheck" |
|
||||
/> |
|
||||
</template> |
|
||||
</BasicForm> |
|
||||
</BasicModal> |
|
||||
</template> |
|
||||
@ -1,86 +0,0 @@ |
|||||
<script lang="ts" setup> |
|
||||
import TenantPackageModal from './TenantPackageModal.vue' |
|
||||
import { columns, searchFormSchema } from './tenantPackage.data' |
|
||||
import { useI18n } from '@/hooks/web/useI18n' |
|
||||
import { useMessage } from '@/hooks/web/useMessage' |
|
||||
import { useModal } from '@/components/Modal' |
|
||||
import { IconEnum } from '@/enums/appEnum' |
|
||||
import { BasicTable, TableAction, useTable } from '@/components/Table' |
|
||||
import { deleteTenantPackage, getTenantPackagePage } from '@/api/system/tenantPackage' |
|
||||
import { DocAlert } from '@/components/DocAlert' |
|
||||
|
|
||||
defineOptions({ name: 'SystemTenantPackage' }) |
|
||||
|
|
||||
const { t } = useI18n() |
|
||||
const { createMessage } = useMessage() |
|
||||
const [registerModal, { openModal }] = useModal() |
|
||||
const [registerTable, { reload }] = useTable({ |
|
||||
title: '租户套餐列表', |
|
||||
api: getTenantPackagePage, |
|
||||
columns, |
|
||||
formConfig: { labelWidth: 120, schemas: searchFormSchema }, |
|
||||
useSearchForm: true, |
|
||||
showTableSetting: true, |
|
||||
showIndexColumn: false, |
|
||||
actionColumn: { |
|
||||
width: 140, |
|
||||
title: t('common.action'), |
|
||||
dataIndex: 'action', |
|
||||
fixed: 'right', |
|
||||
}, |
|
||||
}) |
|
||||
|
|
||||
function handleCreate() { |
|
||||
openModal(true, { isUpdate: false }) |
|
||||
} |
|
||||
|
|
||||
function handleEdit(record: Recordable) { |
|
||||
openModal(true, { record, isUpdate: true }) |
|
||||
} |
|
||||
|
|
||||
async function handleDelete(record: Recordable) { |
|
||||
await deleteTenantPackage(record.id) |
|
||||
createMessage.success(t('common.delSuccessText')) |
|
||||
reload() |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<template> |
|
||||
<div> |
|
||||
<DocAlert title="SaaS 多租户" url="https://doc.iocoder.cn/saas-tenant/" /> |
|
||||
|
|
||||
<BasicTable @register="registerTable"> |
|
||||
<template #toolbar> |
|
||||
<a-button v-auth="['system:tenant-package:create']" type="primary" :pre-icon="IconEnum.ADD" @click="handleCreate"> |
|
||||
{{ t('action.create') }} |
|
||||
</a-button> |
|
||||
</template> |
|
||||
<template #bodyCell="{ column, record }"> |
|
||||
<template v-if="column.key === 'action'"> |
|
||||
<TableAction |
|
||||
:actions="[ |
|
||||
{ |
|
||||
icon: IconEnum.EDIT, |
|
||||
label: t('action.edit'), |
|
||||
auth: 'system:tenant-package:update', |
|
||||
onClick: handleEdit.bind(null, record), |
|
||||
}, |
|
||||
{ |
|
||||
icon: IconEnum.DELETE, |
|
||||
danger: true, |
|
||||
label: t('action.delete'), |
|
||||
auth: 'system:tenant-package:delete', |
|
||||
popConfirm: { |
|
||||
title: t('common.delMessage'), |
|
||||
placement: 'left', |
|
||||
confirm: handleDelete.bind(null, record), |
|
||||
}, |
|
||||
}, |
|
||||
]" |
|
||||
/> |
|
||||
</template> |
|
||||
</template> |
|
||||
</BasicTable> |
|
||||
<TenantPackageModal @register="registerModal" @success="reload()" /> |
|
||||
</div> |
|
||||
</template> |
|
||||
@ -1,90 +0,0 @@ |
|||||
import type { BasicColumn, FormSchema } from '@/components/Table' |
|
||||
import { useRender } from '@/components/Table' |
|
||||
import { DICT_TYPE, getDictOptions } from '@/utils/dict' |
|
||||
|
|
||||
export const columns: BasicColumn[] = [ |
|
||||
{ |
|
||||
title: '套餐编号', |
|
||||
dataIndex: 'id', |
|
||||
width: 100, |
|
||||
}, |
|
||||
{ |
|
||||
title: '套餐名', |
|
||||
dataIndex: 'name', |
|
||||
width: 180, |
|
||||
}, |
|
||||
{ |
|
||||
title: '状态', |
|
||||
dataIndex: 'status', |
|
||||
width: 180, |
|
||||
customRender: ({ text }) => { |
|
||||
return useRender.renderDict(text, DICT_TYPE.COMMON_STATUS) |
|
||||
}, |
|
||||
}, |
|
||||
{ |
|
||||
title: '备注', |
|
||||
dataIndex: 'remark', |
|
||||
width: 180, |
|
||||
}, |
|
||||
{ |
|
||||
title: '创建时间', |
|
||||
dataIndex: 'createTime', |
|
||||
width: 180, |
|
||||
customRender: ({ text }) => { |
|
||||
return useRender.renderDate(text) |
|
||||
}, |
|
||||
}, |
|
||||
] |
|
||||
|
|
||||
export const searchFormSchema: FormSchema[] = [ |
|
||||
{ |
|
||||
label: '套餐名', |
|
||||
field: 'name', |
|
||||
component: 'Input', |
|
||||
colProps: { span: 8 }, |
|
||||
}, |
|
||||
{ |
|
||||
label: '状态', |
|
||||
field: 'status', |
|
||||
component: 'Select', |
|
||||
componentProps: { |
|
||||
options: getDictOptions(DICT_TYPE.COMMON_STATUS), |
|
||||
}, |
|
||||
colProps: { span: 8 }, |
|
||||
}, |
|
||||
{ |
|
||||
label: '创建时间', |
|
||||
field: 'createTime', |
|
||||
component: 'RangePicker', |
|
||||
colProps: { span: 8 }, |
|
||||
}, |
|
||||
] |
|
||||
|
|
||||
export const formSchema: FormSchema[] = [ |
|
||||
{ |
|
||||
label: '编号', |
|
||||
field: 'id', |
|
||||
show: false, |
|
||||
component: 'Input', |
|
||||
}, |
|
||||
{ |
|
||||
label: '套餐名', |
|
||||
field: 'name', |
|
||||
required: true, |
|
||||
component: 'Input', |
|
||||
}, |
|
||||
{ |
|
||||
label: '菜单权限', |
|
||||
field: 'menuIds', |
|
||||
slot: 'menuIds', |
|
||||
component: 'Input', |
|
||||
}, |
|
||||
{ |
|
||||
label: '状态', |
|
||||
field: 'status', |
|
||||
component: 'Select', |
|
||||
componentProps: { |
|
||||
options: getDictOptions(DICT_TYPE.COMMON_STATUS), |
|
||||
}, |
|
||||
}, |
|
||||
] |
|
||||
Loading…
Reference in new issue