Compare commits
No commits in common. "ce60c7194deafc00c628d31c8ac97dcfd26c68a9" and "250b319c8926bf5ed6cc9f3627fcabe0ce0171ed" have entirely different histories.
ce60c7194d
...
250b319c89
@ -40,10 +40,6 @@ export namespace UserApi {
|
||||
confirmPassword: string;
|
||||
}
|
||||
|
||||
export interface PasswordModel {
|
||||
password: string;
|
||||
}
|
||||
|
||||
export interface RoleCreateRecord {
|
||||
name: string;
|
||||
dataScope: string;
|
||||
@ -99,7 +95,7 @@ export namespace UserApi {
|
||||
}
|
||||
|
||||
export interface UserUpdateRecord {
|
||||
name?: string;
|
||||
username?: string;
|
||||
email?: string;
|
||||
phone?: string;
|
||||
address?: string;
|
||||
@ -119,17 +115,6 @@ export function resetPassword(data: UserApi.PasswordReSetModel) {
|
||||
return requestClient.patch('/rest/user/self/update-password', data);
|
||||
}
|
||||
|
||||
// 重置密码
|
||||
export function resetPasswordApi(id: any, data: UserApi.PasswordModel) {
|
||||
return requestClient.patch(
|
||||
`/rest/user/${id}/update-password`,
|
||||
{},
|
||||
{
|
||||
params: data,
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
// 注册用户
|
||||
export function register(data: UserApi.CreateRecord) {
|
||||
return requestClient.post('/rest/user/register', data);
|
||||
|
@ -11,7 +11,7 @@ const routes: RouteRecordRaw[] = [
|
||||
icon: MaterPerson,
|
||||
title: '个人',
|
||||
order: 5,
|
||||
authority: ['user'],
|
||||
authority: ['dashboard'],
|
||||
},
|
||||
},
|
||||
];
|
||||
|
@ -1,13 +1,6 @@
|
||||
import type { RouteRecordRaw } from 'vue-router';
|
||||
|
||||
import {
|
||||
EosRole,
|
||||
FluentWorkflow,
|
||||
IconLog,
|
||||
IconSystem,
|
||||
MdiUser,
|
||||
RiDept,
|
||||
} from '@vben/icons';
|
||||
import { EosRole, IconLog, IconSystem, MdiUser, RiDept } from '@vben/icons';
|
||||
|
||||
const routes: RouteRecordRaw[] = [
|
||||
{
|
||||
@ -57,17 +50,7 @@ const routes: RouteRecordRaw[] = [
|
||||
meta: {
|
||||
icon: IconLog,
|
||||
title: '系统日志',
|
||||
authority: ['system:operationLog'],
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'workflow',
|
||||
path: '/system/workflow',
|
||||
component: () => import('#/views/workflow/list.vue'),
|
||||
meta: {
|
||||
icon: FluentWorkflow,
|
||||
title: '工作流管理',
|
||||
authority: ['system:workflow'],
|
||||
authority: ['system'],
|
||||
},
|
||||
},
|
||||
],
|
||||
|
@ -65,43 +65,49 @@ export function useSchema(): VbenFormSchema[] {
|
||||
},
|
||||
{
|
||||
component: 'Textarea',
|
||||
componentProps: {
|
||||
maxLength: 50,
|
||||
rows: 3,
|
||||
showCount: true,
|
||||
},
|
||||
fieldName: 'remark',
|
||||
label: '备注',
|
||||
rules: z.string().optional(),
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
export function useGridFormSchema(): VbenFormSchema[] {
|
||||
return [
|
||||
{
|
||||
component: 'Input',
|
||||
fieldName: 'name',
|
||||
label: '部门名称',
|
||||
},
|
||||
// {
|
||||
// component: 'Select',
|
||||
// componentProps: {
|
||||
// allowClear: true,
|
||||
// options: [
|
||||
// { label: $t('common.enabled'), value: true },
|
||||
// { label: $t('common.disabled'), value: false },
|
||||
// ],
|
||||
// },
|
||||
// fieldName: 'enable',
|
||||
// label: '状态',
|
||||
// },
|
||||
// {
|
||||
// component: 'Input',
|
||||
// fieldName: 'remark',
|
||||
// label: '备注',
|
||||
// },
|
||||
// {
|
||||
// component: 'RangePicker',
|
||||
// fieldName: 'createTime',
|
||||
// label: '创建时间',
|
||||
// },
|
||||
];
|
||||
}
|
||||
// export function useGridFormSchema(): VbenFormSchema[] {
|
||||
// return [
|
||||
// {
|
||||
// component: 'Input',
|
||||
// fieldName: 'name',
|
||||
// label: '部门名称',
|
||||
// },
|
||||
// {
|
||||
// component: 'Select',
|
||||
// componentProps: {
|
||||
// allowClear: true,
|
||||
// options: [
|
||||
// { label: $t('common.enabled'), value: true },
|
||||
// { label: $t('common.disabled'), value: false },
|
||||
// ],
|
||||
// },
|
||||
// fieldName: 'enable',
|
||||
// label: '状态',
|
||||
// },
|
||||
// // {
|
||||
// // component: 'Input',
|
||||
// // fieldName: 'remark',
|
||||
// // label: '备注',
|
||||
// // },
|
||||
// // {
|
||||
// // component: 'RangePicker',
|
||||
// // fieldName: 'createTime',
|
||||
// // label: '创建时间',
|
||||
// // },
|
||||
// ];
|
||||
// }
|
||||
|
||||
/**
|
||||
* 获取表格列配置
|
||||
@ -151,20 +157,10 @@ export function useColumns(
|
||||
{
|
||||
code: 'append',
|
||||
text: '新增下级',
|
||||
permission: 'system:dept:create',
|
||||
},
|
||||
// {
|
||||
// code: 'auth',
|
||||
// text: '工作流',
|
||||
// },
|
||||
{
|
||||
code: 'edit',
|
||||
text: '修改',
|
||||
permission: 'system:dept:update',
|
||||
},
|
||||
'edit', // 默认的编辑按钮
|
||||
{
|
||||
code: 'delete', // 默认的删除按钮
|
||||
permission: 'system:dept:delete',
|
||||
disabled: (row: DeptApi.Dept) => {
|
||||
return !!(row.children && row.children.length > 0);
|
||||
},
|
||||
@ -180,23 +176,3 @@ export function useColumns(
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
// export function useAuthColumns(): VxeTableGridOptions['columns'] {
|
||||
// return [
|
||||
// {
|
||||
// field: 'id',
|
||||
// type: 'checkbox',
|
||||
// width: 100,
|
||||
// },
|
||||
// {
|
||||
// field: 'name',
|
||||
// title: '名称',
|
||||
// width: 200,
|
||||
// },
|
||||
// {
|
||||
// field: 'type',
|
||||
// minWidth: 100,
|
||||
// title: '类型',
|
||||
// },
|
||||
// ];
|
||||
// }
|
||||
|
@ -15,8 +15,7 @@ import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { getAllDeptTree, removeDept } from '#/api';
|
||||
import { $t } from '#/locales';
|
||||
|
||||
import { useColumns, useGridFormSchema } from './data';
|
||||
// import AuthForm from './modules/auth-form.vue';
|
||||
import { useColumns } from './data';
|
||||
import Form from './modules/form.vue';
|
||||
|
||||
const [FormModal, formModalApi] = useVbenModal({
|
||||
@ -24,11 +23,6 @@ const [FormModal, formModalApi] = useVbenModal({
|
||||
destroyOnClose: true,
|
||||
});
|
||||
|
||||
// const [AuthFormModal, authFormModalApi] = useVbenModal({
|
||||
// connectedComponent: AuthForm,
|
||||
// destroyOnClose: true,
|
||||
// });
|
||||
|
||||
/**
|
||||
* 编辑部门
|
||||
* @param row
|
||||
@ -84,10 +78,6 @@ function onActionClick({ code, row }: OnActionClickParams<DeptApi.Dept>) {
|
||||
onAppend(row);
|
||||
break;
|
||||
}
|
||||
// case 'auth': {
|
||||
// authFormModalApi.open();
|
||||
// break;
|
||||
// }
|
||||
case 'delete': {
|
||||
onDelete(row);
|
||||
break;
|
||||
@ -100,10 +90,10 @@ function onActionClick({ code, row }: OnActionClickParams<DeptApi.Dept>) {
|
||||
}
|
||||
|
||||
const [Grid, gridApi] = useVbenVxeGrid({
|
||||
formOptions: {
|
||||
// fieldMappingTime: [['createTime', ['startTime', 'endTime']]],
|
||||
schema: useGridFormSchema(),
|
||||
},
|
||||
// formOptions: {
|
||||
// fieldMappingTime: [['createTime', ['startTime', 'endTime']]],
|
||||
// schema: useGridFormSchema(),
|
||||
// },
|
||||
gridEvents: {},
|
||||
gridOptions: {
|
||||
columns: useColumns(onActionClick),
|
||||
@ -146,7 +136,6 @@ function refreshGrid() {
|
||||
<template>
|
||||
<Page auto-content-height>
|
||||
<FormModal @success="refreshGrid" />
|
||||
<!-- <AuthFormModal @success="refreshGrid" />-->
|
||||
<Grid table-title="部门列表">
|
||||
<template #toolbar-tools>
|
||||
<Button
|
||||
|
@ -1,63 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import type { VxeTableGridOptions } from '@vben/plugins/vxe-table';
|
||||
|
||||
import { ref } from 'vue';
|
||||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { useVbenVxeGrid } from '@vben/plugins/vxe-table';
|
||||
|
||||
import { getAllDeptTree } from '#/api';
|
||||
|
||||
import { useAuthColumns } from '../data';
|
||||
|
||||
const emits = defineEmits(['success']);
|
||||
const formData = ref();
|
||||
|
||||
const [Modal, modalApi] = useVbenModal({
|
||||
async onConfirm() {
|
||||
if (!formData.value) return;
|
||||
|
||||
modalApi.lock();
|
||||
try {
|
||||
formData.value = gridApi.grid.getCheckboxRecords();
|
||||
emits('success');
|
||||
modalApi.close();
|
||||
} finally {
|
||||
modalApi.lock(false);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
const [Grid, gridApi] = useVbenVxeGrid({
|
||||
gridEvents: {},
|
||||
gridOptions: {
|
||||
columns: useAuthColumns(),
|
||||
height: 'auto',
|
||||
keepSource: true,
|
||||
pagerConfig: {
|
||||
enabled: false,
|
||||
},
|
||||
proxyConfig: {
|
||||
ajax: {
|
||||
query: async (_params) => {
|
||||
const res = await getAllDeptTree(0);
|
||||
return {
|
||||
items: res,
|
||||
};
|
||||
},
|
||||
},
|
||||
},
|
||||
toolbarConfig: {
|
||||
export: false,
|
||||
},
|
||||
} as VxeTableGridOptions,
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Modal title="权限" class="flex flex-col">
|
||||
<Grid />
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
@ -80,14 +80,7 @@ async function onDelete() {
|
||||
<FormDrawer />
|
||||
<Grid table-title="用户列表">
|
||||
<template #toolbar-tools>
|
||||
<Button
|
||||
type="primary"
|
||||
@click="onDelete"
|
||||
danger
|
||||
v-access:code="'system:log:delete'"
|
||||
>
|
||||
批量删除
|
||||
</Button>
|
||||
<Button type="primary" @click="onDelete" danger> 批量删除 </Button>
|
||||
</template>
|
||||
<template #makeTime="{ row }">
|
||||
{{ dayjs(row.makeTime).format('YYYY-MM-DD HH:mm') }}
|
||||
|
@ -22,7 +22,7 @@ const { userInfo } = toRefs(props);
|
||||
// 表单提交方法
|
||||
const handleSubmit = async () => {
|
||||
const res = await selfUpdate({
|
||||
name: userInfo.value.name,
|
||||
username: userInfo.value.username,
|
||||
phone: userInfo.value.phone,
|
||||
email: userInfo.value.email,
|
||||
address: userInfo.value.address,
|
||||
@ -51,7 +51,7 @@ const handleSubmit = async () => {
|
||||
style="max-width: 500px; margin: 0 auto"
|
||||
>
|
||||
<Form.Item label="用户名">
|
||||
<Input v-model:value="userInfo.name" />
|
||||
<Input v-model:value="userInfo.username" />
|
||||
</Form.Item>
|
||||
<Form.Item label="邮箱" name="email">
|
||||
<Input v-model:value="userInfo.email" />
|
||||
|
@ -120,18 +120,6 @@ export function useColumns<T = RoleApi.Role>(
|
||||
nameField: 'name',
|
||||
nameTitle: '角色',
|
||||
onClick: onActionClick,
|
||||
options: [
|
||||
{
|
||||
code: 'edit',
|
||||
text: '编辑',
|
||||
permission: 'system:role:update',
|
||||
},
|
||||
{
|
||||
code: 'delete',
|
||||
text: '删除',
|
||||
permission: 'system:role:delete',
|
||||
},
|
||||
],
|
||||
},
|
||||
name: 'CellOperation',
|
||||
},
|
||||
|
@ -155,11 +155,7 @@ function onCreate() {
|
||||
<FormDrawer />
|
||||
<Grid table-title="角色列表">
|
||||
<template #toolbar-tools>
|
||||
<Button
|
||||
type="primary"
|
||||
@click="onCreate"
|
||||
v-access:code="'system:role:create'"
|
||||
>
|
||||
<Button type="primary" @click="onCreate">
|
||||
<Plus class="size-5" />
|
||||
{{ $t('ui.actionTitle.create', ['角色']) }}
|
||||
</Button>
|
||||
|
@ -68,27 +68,22 @@ const [Drawer, drawerApi] = useVbenDrawer({
|
||||
}
|
||||
|
||||
if (menuIds.value.length === 0) {
|
||||
await loadPermissions();
|
||||
loadPermissions();
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function convertToTreeNode(item: any) {
|
||||
return {
|
||||
key: item.id,
|
||||
title: item.name,
|
||||
pid: item.pid || '',
|
||||
children: item.children?.map(convertToTreeNode) ?? null,
|
||||
meta: item.meta,
|
||||
};
|
||||
}
|
||||
|
||||
async function loadPermissions() {
|
||||
loadingPermissions.value = true;
|
||||
try {
|
||||
const res = await queryMenuList('all');
|
||||
menuIds.value = res.map((item) => convertToTreeNode(item));
|
||||
menuIds.value = res.map((item) => ({
|
||||
key: item.id,
|
||||
title: item.name,
|
||||
children: item.children || null,
|
||||
meta: item.meta,
|
||||
}));
|
||||
} finally {
|
||||
loadingPermissions.value = false;
|
||||
}
|
||||
@ -124,7 +119,7 @@ function getNodeClass(node: Recordable<any>) {
|
||||
:default-expanded-level="2"
|
||||
:get-node-class="getNodeClass"
|
||||
v-bind="slotProps"
|
||||
value-field="key"
|
||||
value-field="id"
|
||||
label-field="meta.title"
|
||||
icon-field="meta.icon"
|
||||
>
|
||||
|
@ -188,20 +188,13 @@ export function useColumns<T = UserApi.User>(
|
||||
onClick: onActionClick,
|
||||
},
|
||||
options: [
|
||||
{
|
||||
code: 'resetPassword',
|
||||
text: '重置密码',
|
||||
permission: 'system:user:update',
|
||||
},
|
||||
{
|
||||
code: 'edit',
|
||||
text: '修改',
|
||||
permission: 'system:user:update',
|
||||
},
|
||||
{
|
||||
code: 'delete',
|
||||
text: '删除',
|
||||
permission: 'system:user:delete',
|
||||
},
|
||||
],
|
||||
name: 'CellOperation',
|
||||
@ -209,7 +202,7 @@ export function useColumns<T = UserApi.User>(
|
||||
field: 'operation',
|
||||
fixed: 'right',
|
||||
title: '操作',
|
||||
width: 200,
|
||||
width: 130,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
@ -7,7 +7,7 @@ import type {
|
||||
} from '#/adapter/vxe-table';
|
||||
import type { UserApi } from '#/api';
|
||||
|
||||
import { Page, useVbenDrawer, useVbenModal } from '@vben/common-ui';
|
||||
import { Page, useVbenDrawer } from '@vben/common-ui';
|
||||
import { Plus } from '@vben/icons';
|
||||
|
||||
import { Button, message, Modal } from 'ant-design-vue';
|
||||
@ -19,18 +19,12 @@ import { $t } from '#/locales';
|
||||
|
||||
import { useColumns, useGridFormSchema } from './data';
|
||||
import Form from './modules/form.vue';
|
||||
import ResetModal from './modules/reset-form.vue';
|
||||
|
||||
const [FormDrawer, formDrawerApi] = useVbenDrawer({
|
||||
connectedComponent: Form,
|
||||
destroyOnClose: true,
|
||||
});
|
||||
|
||||
const [ResetPasswordModal, modalApi] = useVbenModal({
|
||||
connectedComponent: ResetModal,
|
||||
destroyOnClose: true,
|
||||
});
|
||||
|
||||
const [Grid, gridApi] = useVbenVxeGrid({
|
||||
formOptions: {
|
||||
fieldMappingTime: [['createTime', ['startTime', 'endTime']]],
|
||||
@ -79,10 +73,6 @@ function onActionClick(e: OnActionClickParams<UserApi.User>) {
|
||||
onEdit(e.row);
|
||||
break;
|
||||
}
|
||||
case 'resetPassword': {
|
||||
onResetPassword(e.row);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -133,10 +123,6 @@ function onEdit(row: UserApi.User) {
|
||||
formDrawerApi.setData(row).open();
|
||||
}
|
||||
|
||||
function onResetPassword(row: UserApi.User) {
|
||||
modalApi.setData(row).open();
|
||||
}
|
||||
|
||||
function onDelete(row: UserApi.User) {
|
||||
const hideLoading = message.loading({
|
||||
content: $t('ui.actionMessage.deleting', [row.name]),
|
||||
@ -166,15 +152,10 @@ function onCreate() {
|
||||
</script>
|
||||
<template>
|
||||
<Page auto-content-height>
|
||||
<ResetPasswordModal @success="onRefresh" />
|
||||
<FormDrawer @success="onRefresh" />
|
||||
<FormDrawer />
|
||||
<Grid table-title="用户列表">
|
||||
<template #toolbar-tools>
|
||||
<Button
|
||||
type="primary"
|
||||
@click="onCreate"
|
||||
v-access:code="'system:user:create'"
|
||||
>
|
||||
<Button type="primary" @click="onCreate">
|
||||
<Plus class="size-5" />
|
||||
{{ $t('ui.actionTitle.create', ['用户']) }}
|
||||
</Button>
|
||||
|
@ -21,7 +21,7 @@ import { useFormSchema } from '../data';
|
||||
const emits = defineEmits(['success']);
|
||||
|
||||
const formData = ref<UserApi.User>();
|
||||
const id = ref();
|
||||
|
||||
const [Form, formApi] = useVbenForm({
|
||||
schema: useFormSchema(),
|
||||
showDefaultActions: false,
|
||||
@ -30,6 +30,7 @@ const [Form, formApi] = useVbenForm({
|
||||
const permissions = ref<DataNode[]>([]);
|
||||
const loadingPermissions = ref(false);
|
||||
|
||||
const id = ref();
|
||||
const [Drawer, drawerApi] = useVbenDrawer({
|
||||
async onConfirm() {
|
||||
const { valid } = await formApi.validate();
|
||||
|
@ -1,51 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import type { UserApi } from '#/api';
|
||||
|
||||
import { ref } from 'vue';
|
||||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { Input } from 'ant-design-vue';
|
||||
|
||||
import { resetPasswordApi } from '#/api';
|
||||
|
||||
const emits = defineEmits(['success']);
|
||||
const userId = ref();
|
||||
const resetpasswordData = ref();
|
||||
const formData = ref();
|
||||
|
||||
const [Modal, modalApi] = useVbenModal({
|
||||
async onConfirm() {
|
||||
if (!resetpasswordData.value) return;
|
||||
|
||||
modalApi.lock();
|
||||
try {
|
||||
await resetPasswordApi(userId.value, {
|
||||
password: resetpasswordData.value,
|
||||
});
|
||||
emits('success');
|
||||
modalApi.close();
|
||||
} finally {
|
||||
modalApi.lock(false);
|
||||
}
|
||||
},
|
||||
onOpenChange(isOpen) {
|
||||
if (isOpen) {
|
||||
formData.value = modalApi.getData<UserApi.User>();
|
||||
userId.value = formData.value.id;
|
||||
}
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Modal title="重置密码" class="flex flex-col">
|
||||
<Input.Password
|
||||
class="my-4"
|
||||
placeholder="请输入密码"
|
||||
v-model:value="resetpasswordData"
|
||||
/>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
@ -1,84 +0,0 @@
|
||||
import type { VbenFormSchema } from '#/adapter/form';
|
||||
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||
|
||||
export function useGridFormSchema(): VbenFormSchema[] {
|
||||
return [
|
||||
// {
|
||||
// component: 'Input',
|
||||
// fieldName: 'type',
|
||||
// label: '类型',
|
||||
// },
|
||||
{
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
options: [
|
||||
{ label: 'WORD', value: 1 },
|
||||
{ label: 'PPT', value: 2 },
|
||||
{ label: 'SPIDER', value: 3 },
|
||||
],
|
||||
},
|
||||
fieldName: 'type',
|
||||
label: '类型',
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
export function useFormSchema(): VbenFormSchema[] {
|
||||
return [
|
||||
{
|
||||
component: 'Input',
|
||||
fieldName: 'deptIds',
|
||||
formItemClass: 'items-start',
|
||||
label: '部门',
|
||||
modelPropName: 'modelValue',
|
||||
labelWidth: 40,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
export function useColumns(
|
||||
onActionClick?: OnActionClickFn<any>,
|
||||
): VxeTableGridOptions['columns'] {
|
||||
return [
|
||||
{
|
||||
field: 'id',
|
||||
title: 'ID',
|
||||
// type: 'checkbox',
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
field: 'mode',
|
||||
width: 200,
|
||||
title: '类型',
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
title: '名称',
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
align: 'center',
|
||||
cellRender: {
|
||||
name: 'CellOperation',
|
||||
attrs: {
|
||||
nameField: 'name',
|
||||
nameTitle: '工作流',
|
||||
onClick: onActionClick,
|
||||
},
|
||||
options: [
|
||||
{
|
||||
code: 'update',
|
||||
text: '关联部门',
|
||||
permission: 'workflow:update',
|
||||
},
|
||||
],
|
||||
},
|
||||
field: 'operation',
|
||||
headerAlign: 'center',
|
||||
showOverflow: false,
|
||||
title: '操作',
|
||||
width: 200,
|
||||
},
|
||||
];
|
||||
}
|
@ -1,102 +0,0 @@
|
||||
<script lang="ts" setup>
|
||||
import type {
|
||||
OnActionClickParams,
|
||||
VxeTableGridOptions,
|
||||
} from '#/adapter/vxe-table';
|
||||
import type { UserApi } from '#/api';
|
||||
|
||||
import { Page, useVbenDrawer, useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { getAppList } from '#/api';
|
||||
|
||||
import { useColumns, useGridFormSchema } from './data';
|
||||
import Form from './modules/form.vue';
|
||||
|
||||
const [FormDrawer] = useVbenDrawer({
|
||||
destroyOnClose: true,
|
||||
});
|
||||
|
||||
// const selectedRowIds = ref<number[]>([]);
|
||||
|
||||
const [FormModal, formModalApi] = useVbenModal({
|
||||
connectedComponent: Form,
|
||||
destroyOnClose: true,
|
||||
});
|
||||
|
||||
/**
|
||||
* 编辑工作流
|
||||
* @param row
|
||||
*/
|
||||
function onEdit(row: any) {
|
||||
formModalApi.setData(row).open();
|
||||
}
|
||||
|
||||
/**
|
||||
* 表格操作按钮的回调函数
|
||||
*/
|
||||
function onActionClick({ code, row }: OnActionClickParams<any>) {
|
||||
switch (code) {
|
||||
case 'edit': {
|
||||
onEdit(row);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const [Grid] = useVbenVxeGrid({
|
||||
formOptions: {
|
||||
schema: useGridFormSchema(),
|
||||
},
|
||||
gridOptions: {
|
||||
columns: useColumns(onActionClick),
|
||||
height: 'auto',
|
||||
keepSource: true,
|
||||
proxyConfig: {
|
||||
ajax: {
|
||||
query: async ({ page }, formValues) => {
|
||||
const res = await getAppList({
|
||||
page: page.currentPage,
|
||||
size: page.pageSize,
|
||||
current: page.currentPage,
|
||||
...formValues,
|
||||
});
|
||||
return {
|
||||
items: res,
|
||||
total: res.length,
|
||||
};
|
||||
},
|
||||
},
|
||||
},
|
||||
rowConfig: {
|
||||
keyField: 'id',
|
||||
},
|
||||
|
||||
toolbarConfig: {
|
||||
custom: true,
|
||||
export: false,
|
||||
refresh: { code: 'query' },
|
||||
search: true,
|
||||
zoom: true,
|
||||
},
|
||||
} as VxeTableGridOptions<UserApi.User>,
|
||||
});
|
||||
|
||||
// function onRefresh() {
|
||||
// gridApi.query();
|
||||
// }
|
||||
</script>
|
||||
<template>
|
||||
<Page auto-content-height>
|
||||
<FormDrawer />
|
||||
<FormModal />
|
||||
<Grid table-title="工作流列表">
|
||||
<!-- <template #toolbar-tools>-->
|
||||
<!-- <Button type="primary" @click="onDelete" danger> 批量删除 </Button>-->
|
||||
<!-- </template>-->
|
||||
<!-- <template #makeTime="{ row }">-->
|
||||
<!-- {{ dayjs(row.makeTime).format('YYYY-MM-DD HH:mm') }}-->
|
||||
<!-- </template>-->
|
||||
</Grid>
|
||||
</Page>
|
||||
</template>
|
@ -1,95 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import type { DataNode } from 'ant-design-vue/es/tree';
|
||||
|
||||
import type { Recordable } from '@vben/types';
|
||||
|
||||
import { ref } from 'vue';
|
||||
|
||||
import { useVbenModal, VbenTree } from '@vben/common-ui';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
import { getAllDeptTree } from '#/api';
|
||||
|
||||
import { useFormSchema } from '../data';
|
||||
|
||||
const emits = defineEmits(['success']);
|
||||
const formData = ref<string[]>([]);
|
||||
const deptData = ref<DataNode[]>([]);
|
||||
|
||||
function convertToTreeNode(item: any): DataNode {
|
||||
return {
|
||||
key: item.id,
|
||||
title: item.name,
|
||||
pid: item.pid || '',
|
||||
children: item.children?.map(convertToTreeNode) ?? null,
|
||||
};
|
||||
}
|
||||
|
||||
async function getDeptList() {
|
||||
const res = await getAllDeptTree(0);
|
||||
deptData.value = res.map((item) => convertToTreeNode(item));
|
||||
}
|
||||
|
||||
const [Form] = useVbenForm({
|
||||
schema: useFormSchema(),
|
||||
showDefaultActions: false,
|
||||
});
|
||||
|
||||
const [Modal, modalApi] = useVbenModal({
|
||||
async onConfirm() {
|
||||
// const values = await formApi.getValues();
|
||||
if (!formData.value) return;
|
||||
|
||||
modalApi.lock();
|
||||
try {
|
||||
emits('success');
|
||||
modalApi.close();
|
||||
} finally {
|
||||
modalApi.lock(false);
|
||||
}
|
||||
},
|
||||
async onOpenChange(isOpen) {
|
||||
if (isOpen) {
|
||||
await getDeptList();
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function getNodeClass(node: Recordable<any>) {
|
||||
const classes: string[] = [];
|
||||
if (node.value?.type === 'button') {
|
||||
classes.push('inline-flex');
|
||||
if (node.index % 3 >= 1) {
|
||||
classes.push('!pl-0');
|
||||
}
|
||||
}
|
||||
|
||||
return classes.join(' ');
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Modal title="修改工作流">
|
||||
<Form class="mx-4">
|
||||
<template #deptIds="slotProps">
|
||||
<VbenTree
|
||||
:tree-data="deptData"
|
||||
multiple
|
||||
bordered
|
||||
:default-expanded-level="2"
|
||||
:get-node-class="getNodeClass"
|
||||
v-bind="slotProps"
|
||||
value-field="key"
|
||||
label-field="title"
|
||||
>
|
||||
<template #node="{ value }">
|
||||
<!-- <IconifyIcon v-if="value.meta.icon" :icon="value.meta.icon" />-->
|
||||
{{ value.title }}
|
||||
</template>
|
||||
</VbenTree>
|
||||
</template>
|
||||
</Form>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
@ -6,7 +6,7 @@ export const LOGIN_PATH = '/auth/login';
|
||||
/**
|
||||
* @zh_CN 默认首页地址
|
||||
*/
|
||||
export const DEFAULT_HOME_PATH = '/home';
|
||||
export const DEFAULT_HOME_PATH = '/analytics';
|
||||
|
||||
export interface LanguageOption {
|
||||
label: string;
|
||||
|
@ -19,5 +19,4 @@ export const IconSystem = createIconifyIcon('icon-park-twotone:system');
|
||||
export const MaterPerson = createIconifyIcon('material-symbols:person');
|
||||
export const IconLog = createIconifyIcon('icon-park-outline:log');
|
||||
export const HugeAi = createIconifyIcon('hugeicons:ai-scan');
|
||||
export const FluentWorkflow = createIconifyIcon('fluent:cloud-flow-24-regular');
|
||||
// export const MdiUser = createIconifyIcon('mdi:user');
|
||||
|
Loading…
Reference in New Issue
Block a user