xiaozhi/xiaozhi-admin-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update 优化 重构抽出一些常用hooks组件简化页面编码

Browse Source
This commit is contained in:
疯狂的狮子Li
2026-04-17 15:09:17 +08:00
parent 2ce3786ee0
commit 6a3394bdc5
33 changed files with 1062 additions and 968 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/hooks/async/useLoading.ts
+22
View File
@@ -0,0 +1,22 @@
export function useLoading(initialValue = false) {
const loading = ref(initialValue);
const setLoading = (value: boolean) => {
loading.value = value;
};
const withLoading = async <T>(task: () => Promise<T>) => {
loading.value = true;
try {
return await task();
} finally {
loading.value = false;
}
};
return {
loading,
setLoading,
withLoading
};
}
src/hooks/dialog/useDialogState.ts
+33
View File
@@ -0,0 +1,33 @@
export function useDialogState(initialTitle = '') {
const dialog = reactive<DialogOption>({
visible: false,
title: initialTitle
});
const openDialog = (title?: string) => {
if (title !== undefined) {
dialog.title = title;
}
dialog.visible = true;
};
const closeDialog = () => {
dialog.visible = false;
};
const toggleDialog = () => {
dialog.visible = !dialog.visible;
};
const setTitle = (title: string) => {
dialog.title = title;
};
return {
dialog,
openDialog,
closeDialog,
toggleDialog,
setTitle
};
}
src/hooks/dialog/useFormDialog.ts
+42
View File
@@ -0,0 +1,42 @@
import type { Ref } from 'vue';
import { useDialogState } from './useDialogState';
interface UseFormDialogOptions<T extends Record<string, any>> {
form: Ref<T>;
formRef?: Ref<ElFormInstance | undefined>;
initialFormData: T;
initialTitle?: string;
}
export function useFormDialog<T extends Record<string, any>>(options: UseFormDialogOptions<T>) {
const { form, formRef, initialFormData, initialTitle } = options;
const { dialog, openDialog, closeDialog, setTitle } = useDialogState(initialTitle);
const resetForm = () => {
form.value = { ...initialFormData };
formRef?.value?.resetFields();
formRef?.value?.clearValidate?.();
};
const openFormDialog = (title?: string) => {
resetForm();
openDialog(title);
};
const showDialog = (title?: string) => {
openDialog(title);
};
const closeFormDialog = () => {
closeDialog();
};
return {
dialog,
resetForm,
openDialog: openFormDialog,
showDialog,
closeDialog: closeFormDialog,
setTitle
};
}
src/hooks/form/useSearchReset.ts
+43
View File
@@ -0,0 +1,43 @@
import type { Ref } from 'vue';
interface UseSearchResetOptions<T extends Record<string, any>> {
queryFormRef: Ref<ElFormInstance | undefined>;
queryParams?: Ref<T>;
pageNumKey?: keyof T;
pageSizeKey?: keyof T;
initialPageNum?: number;
initialPageSize?: number;
resetExtras?: () => void;
afterReset?: () => void;
}
export function useSearchReset<T extends Record<string, any>>(options: UseSearchResetOptions<T>) {
const {
queryFormRef,
queryParams,
pageNumKey,
pageSizeKey,
initialPageNum = 1,
initialPageSize,
resetExtras,
afterReset
} = options;
const resetQuery = () => {
queryFormRef.value?.resetFields();
if (queryParams?.value) {
if (pageNumKey) {
queryParams.value[pageNumKey] = initialPageNum as T[keyof T];
}
if (pageSizeKey && initialPageSize !== undefined) {
queryParams.value[pageSizeKey] = initialPageSize as T[keyof T];
}
}
resetExtras?.();
afterReset?.();
};
return {
resetQuery
};
}
src/hooks/form/useSearchToggle.ts
+17
View File
@@ -0,0 +1,17 @@
export function useSearchToggle(initialValue = true) {
const showSearch = ref(initialValue);
const toggleSearch = () => {
showSearch.value = !showSearch.value;
};
const setShowSearch = (value: boolean) => {
showSearch.value = value;
};
return {
showSearch,
toggleSearch,
setShowSearch
};
}
src/hooks/table/useTableSelection.ts
+33
View File
@@ -0,0 +1,33 @@
const isSelectableId = (value: unknown): value is string | number => {
return typeof value === 'string' || typeof value === 'number';
};
export function useTableSelection<T, ID extends string | number = string | number>(getRowId: (row: T) => ID) {
const ids = ref<ID[]>([]);
const selectedRows = ref<T[]>([]);
const single = ref(true);
const multiple = ref(true);
const handleSelectionChange = (selection: T[]) => {
selectedRows.value = selection;
ids.value = selection.map(getRowId).filter(isSelectableId) as ID[];
single.value = selection.length !== 1;
multiple.value = selection.length === 0;
};
const clearSelection = () => {
selectedRows.value = [];
ids.value = [];
single.value = true;
multiple.value = true;
};
return {
ids,
selectedRows,
single,
multiple,
handleSelectionChange,
clearSelection
};
}
src/hooks/tree/useTreeCollapsed.ts
+17
View File
@@ -0,0 +1,17 @@
export function useTreeCollapsed(initialValue = false) {
const treeCollapsed = ref(initialValue);
const toggleCollapsed = () => {
treeCollapsed.value = !treeCollapsed.value;
};
const setCollapsed = (value: boolean) => {
treeCollapsed.value = value;
};
return {
treeCollapsed,
toggleCollapsed,
setCollapsed
};
}
src/views/demo/demo/index.vue
+31 -41
View File
@@ -138,26 +138,23 @@
<script setup name="Demo" lang="ts">
import { listDemo, getDemo, delDemo, addDemo, updateDemo } from '@/api/demo/demo';
import { DemoVO, DemoQuery, DemoForm } from '@/api/demo/demo/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import { download as requestDownload } from '@/utils/request';
const demoList = ref<DemoVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const demoFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: DemoForm = {
id: undefined,
deptId: undefined,
@@ -188,26 +185,26 @@ const data = reactive<PageData<DemoForm, DemoQuery>>({
});
const { queryParams, form, rules } = toRefs(data);
const { ids, single, multiple, handleSelectionChange } = useTableSelection<DemoVO>(item => item.id);
const { dialog, resetForm: reset, openDialog, showDialog, closeDialog } = useFormDialog({
form,
formRef: demoFormRef,
initialFormData: initFormData
});
/** 查询测试单列表 */
const getList = async () => {
loading.value = true;
const res = await listDemo(queryParams.value);
demoList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await listDemo(queryParams.value);
demoList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
demoFormRef.value?.resetFields();
closeDialog();
};
/** 搜索按钮操作 */
@@ -216,24 +213,18 @@ const handleQuery = () => {
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: DemoVO[]) => {
ids.value = selection.map(item => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
afterReset: () => {
handleQuery();
}
});
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加测试单';
openDialog('添加测试单');
};
/** 修改按钮操作 */
@@ -242,8 +233,7 @@ const handleUpdate = async (row?: DemoVO) => {
const _id = row?.id || ids.value[0];
const res = await getDemo(_id);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = '修改测试单';
showDialog('修改测试单');
};
/** 提交按钮 */
@@ -257,7 +247,7 @@ const submitForm = () => {
await addDemo(form.value).finally(() => (buttonLoading.value = false));
}
modal.msgSuccess('修改成功');
dialog.visible = false;
closeDialog();
await getList();
}
});
@@ -266,7 +256,7 @@ const submitForm = () => {
/** 删除按钮操作 */
const handleDelete = async (row?: DemoVO) => {
const _ids = row?.id || ids.value;
await modal.confirm('是否确认删除测试单编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
await modal.confirm('是否确认删除测试单编号为"' + _ids + '"的数据项？');
await delDemo(_ids);
modal.msgSuccess('删除成功');
await getList();
src/views/demo/tree/index.vue
+32 -35
View File
@@ -49,7 +49,7 @@
:default-expand-all="isExpandAll"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
>
<el-table-column label="父id" align="center" prop="parentId" />
<el-table-column label="父id" prop="parentId" />
<el-table-column label="部门id" align="center" prop="deptId" />
<el-table-column label="用户id" align="center" prop="userId" />
<el-table-column label="树节点名" align="center" prop="treeName" />
@@ -116,6 +116,10 @@
<script setup name="Tree" lang="ts">
import { listTree, getTree, delTree, addTree, updateTree } from '@/api/demo/tree';
import { TreeVO, TreeQuery, TreeForm } from '@/api/demo/tree/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import modal from '@/plugins/modal';
import { handleTree } from '@/utils/ruoyi';
@@ -128,19 +132,14 @@ type TreeOption = {
const treeList = ref<TreeVO[]>([]);
const treeOptions = ref<TreeOption[]>([]);
const buttonLoading = ref(false);
const showSearch = ref(true);
const { showSearch } = useSearchToggle();
const isExpandAll = ref(true);
const loading = ref(false);
const { loading, setLoading, withLoading } = useLoading();
const queryFormRef = ref<ElFormInstance>();
const treeFormRef = ref<ElFormInstance>();
const treeTableRef = ref<ElTableInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: TreeForm = {
id: undefined,
parentId: undefined,
@@ -167,16 +166,21 @@ const data = reactive<PageData<TreeForm, TreeQuery>>({
});
const { queryParams, form, rules } = toRefs(data);
const { dialog, resetForm: reset, openDialog, showDialog, closeDialog } = useFormDialog({
form,
formRef: treeFormRef,
initialFormData: initFormData
});
/** 查询测试树列表 */
const getList = async () => {
loading.value = true;
const res = await listTree(queryParams.value);
const data = handleTree<TreeVO>(res.data, 'id', 'parentId');
if (data) {
treeList.value = data;
loading.value = false;
}
await withLoading(async () => {
const res = await listTree(queryParams.value);
const data = handleTree<TreeVO>(res.data, 'id', 'parentId');
if (data) {
treeList.value = data;
}
});
};
/** 查询测试树下拉树结构 */
@@ -191,13 +195,7 @@ const getTreeselect = async () => {
// 取消按钮
const cancel = () => {
reset();
dialog.visible = false;
};
// 表单重置
const reset = () => {
form.value = { ...initFormData };
treeFormRef.value?.resetFields();
closeDialog();
};
/** 搜索按钮操作 */
@@ -205,23 +203,23 @@ const handleQuery = () => {
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
afterReset: () => {
handleQuery();
}
});
/** 新增按钮操作 */
const handleAdd = (row?: TreeVO) => {
reset();
openDialog('添加测试树');
getTreeselect();
if (row && row.id) {
form.value.parentId = row.id;
} else {
form.value.parentId = 0;
}
dialog.visible = true;
dialog.title = '添加测试树';
};
/** 展开/折叠操作 */
@@ -247,8 +245,7 @@ const handleUpdate = async (row: TreeVO) => {
}
const res = await getTree(row.id);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = '修改测试树';
showDialog('修改测试树');
};
/** 提交按钮 */
@@ -262,7 +259,7 @@ const submitForm = () => {
await addTree(form.value).finally(() => (buttonLoading.value = false));
}
modal.msgSuccess('操作成功');
dialog.visible = false;
closeDialog();
await getList();
}
});
@@ -271,8 +268,8 @@ const submitForm = () => {
/** 删除按钮操作 */
const handleDelete = async (row: TreeVO) => {
await modal.confirm('是否确认删除测试树编号为"' + row.id + '"的数据项？');
loading.value = true;
await delTree(row.id).finally(() => (loading.value = false));
setLoading(true);
await delTree(row.id).finally(() => setLoading(false));
await getList();
modal.msgSuccess('删除成功');
};
src/views/monitor/logininfo/index.vue
+31 -23
View File
@@ -156,6 +156,10 @@
<script setup name="LoginInfo" lang="ts">
import { list, delLoginInfo, cleanLoginInfo, unlockLoginInfo } from '@/api/monitor/logininfo';
import { LoginInfoQuery, LoginInfoVO } from '@/api/monitor/logininfo/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
import { download as requestDownload } from '@/utils/request';
@@ -165,12 +169,8 @@ const { sys_device_type } = toRefs<any>(useDict('sys_device_type'));
const { sys_common_status } = toRefs<any>(useDict('sys_common_status'));
const loginInfoList = ref<LoginInfoVO[]>([]);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<number | string>>([]);
const single = ref(true);
const multiple = ref(true);
const selectName = ref<Array<string>>([]);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const total = ref(0);
const dateRange = ref<any>(['', '']);
const defaultSort = ref<any>({ prop: 'loginTime', order: 'descending' });
@@ -187,33 +187,41 @@ const queryParams = ref<LoginInfoQuery>({
orderByColumn: defaultSort.value.prop,
isAsc: defaultSort.value.order
});
const {
ids,
selectedRows,
single,
multiple,
handleSelectionChange: handleTableSelectionChange
} = useTableSelection<LoginInfoVO>(item => item.infoId);
const selectName = computed(() => selectedRows.value.map(item => item.userName));
/** 查询登录日志列表 */
const getList = async () => {
loading.value = true;
const res = await list(addDateRange(queryParams.value, dateRange.value));
loginInfoList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await list(addDateRange(queryParams.value, dateRange.value));
loginInfoList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
dateRange.value = ['', ''];
queryFormRef.value?.resetFields();
queryParams.value.pageNum = 1;
loginInfoTableRef.value?.sort(defaultSort.value.prop, defaultSort.value.order);
};
/** 多选框选中数据 */
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
resetExtras: () => {
dateRange.value = ['', ''];
},
afterReset: () => {
loginInfoTableRef.value?.sort(defaultSort.value.prop, defaultSort.value.order);
}
});
const handleSelectionChange = (selection: LoginInfoVO[]) => {
ids.value = selection.map(item => item.infoId);
multiple.value = !selection.length;
single.value = selection.length != 1;
selectName.value = selection.map(item => item.userName);
handleTableSelectionChange(selection);
};
/** 排序触发事件 */
const handleSortChange = (column: any) => {
src/views/monitor/operlog/index.vue
+24 -19
View File
@@ -208,6 +208,10 @@
<script setup name="Operlog" lang="ts">
import { list, delOperlog, cleanOperlog } from '@/api/monitor/operlog';
import { OperLogForm, OperLogQuery, OperLogVO } from '@/api/monitor/operlog/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
import { download as requestDownload } from '@/utils/request';
@@ -219,10 +223,8 @@ const { sys_oper_type, sys_common_status, sys_device_type } = toRefs<any>(
);
const operlogList = ref<OperLogVO[]>([]);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<number | string>>([]);
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const total = ref(0);
const dateRange = ref<any>(['', '']);
const defaultSort = ref<any>({ prop: 'operTime', order: 'descending' });
@@ -279,14 +281,15 @@ const data = reactive<PageData<OperLogForm, OperLogQuery>>({
});
const { queryParams, form } = toRefs(data);
const { ids, multiple, handleSelectionChange: handleTableSelectionChange } = useTableSelection<OperLogVO>(item => item.operId);
/** 查询登录日志 */
const getList = async () => {
loading.value = true;
const res = await list(addDateRange(queryParams.value, dateRange.value));
operlogList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await list(addDateRange(queryParams.value, dateRange.value));
operlogList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 操作日志类型字典翻译 */
const typeFormat = (row: OperLogForm) => {
@@ -297,17 +300,19 @@ const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
dateRange.value = ['', ''];
queryFormRef.value?.resetFields();
queryParams.value.pageNum = 1;
operLogTableRef.value?.sort(defaultSort.value.prop, defaultSort.value.order);
};
/** 多选框选中数据 */
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
resetExtras: () => {
dateRange.value = ['', ''];
},
afterReset: () => {
operLogTableRef.value?.sort(defaultSort.value.prop, defaultSort.value.order);
}
});
const handleSelectionChange = (selection: OperLogVO[]) => {
ids.value = selection.map(item => item.operId);
multiple.value = !selection.length;
handleTableSelectionChange(selection);
};
/** 排序触发事件 */
const handleSortChange = (column: any) => {
src/views/system/client/index.vue
+41 -51
View File
@@ -280,6 +280,11 @@
<script setup name="Client" lang="ts">
import { listClient, getClient, delClient, addClient, updateClient, changeStatus } from '@/api/system/client';
import { ClientVO, ClientQuery, ClientForm } from '@/api/system/client/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
import { download as requestDownload } from '@/utils/request';
@@ -289,22 +294,15 @@ const { sys_grant_type } = toRefs<any>(useDict('sys_grant_type'));
const { sys_device_type } = toRefs<any>(useDict('sys_device_type'));
const clientList = ref<ClientVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { loading: buttonLoading, withLoading: withButtonLoading } = useLoading();
const { showSearch } = useSearchToggle();
const { ids, single, multiple, handleSelectionChange } = useTableSelection<ClientVO>(item => item.id);
const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const clientFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: ClientForm = {
id: undefined,
clientId: undefined,
@@ -347,6 +345,19 @@ const data = reactive<PageData<ClientForm, ClientQuery>>({
});
const { queryParams, form, rules } = toRefs(data);
const { dialog, resetForm, openDialog, showDialog, closeDialog } = useFormDialog({
form,
formRef: clientFormRef,
initialFormData: initFormData
});
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
afterReset: () => {
handleQuery();
}
});
const getRuleList = (ruleList?: string[], ruleValue?: string) => {
if (Array.isArray(ruleList) && ruleList.length) {
@@ -363,23 +374,17 @@ const getRuleList = (ruleList?: string[], ruleValue?: string) => {
/** 查询客户端管理列表 */
const getList = async () => {
loading.value = true;
const res = await listClient(queryParams.value);
clientList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await listClient(queryParams.value);
clientList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
clientFormRef.value?.resetFields();
closeDialog();
resetForm();
};
/** 搜索按钮操作 */
@@ -388,48 +393,33 @@ const handleQuery = () => {
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: ClientVO[]) => {
ids.value = selection.map(item => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加客户端管理';
openDialog('添加客户端管理');
};
/** 修改按钮操作 */
const handleUpdate = async (row?: ClientVO) => {
reset();
resetForm();
const _id = row?.id || ids.value[0];
const res = await getClient(_id);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = '修改客户端管理';
showDialog('修改客户端管理');
};
/** 提交按钮 */
const submitForm = () => {
clientFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
await updateClient(form.value).finally(() => (buttonLoading.value = false));
} else {
await addClient(form.value).finally(() => (buttonLoading.value = false));
}
await withButtonLoading(async () => {
if (form.value.id) {
await updateClient(form.value);
} else {
await addClient(form.value);
}
});
modal.msgSuccess('修改成功');
dialog.visible = false;
closeDialog();
await getList();
}
});
@@ -438,7 +428,7 @@ const submitForm = () => {
/** 删除按钮操作 */
const handleDelete = async (row?: ClientVO) => {
const _ids = row?.id || ids.value;
await modal.confirm('是否确认删除客户端管理编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
await modal.confirm('是否确认删除客户端管理编号为"' + _ids + '"的数据项？');
await delClient(_ids);
modal.msgSuccess('删除成功');
await getList();
src/views/system/config/index.vue
+35 -40
View File
@@ -189,6 +189,11 @@
<script setup name="Config" lang="ts">
import { listConfig, getConfig, delConfig, addConfig, updateConfig, refreshCache } from '@/api/system/config';
import { ConfigForm, ConfigQuery, ConfigVO } from '@/api/system/config/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
import { download as requestDownload } from '@/utils/request';
@@ -197,20 +202,14 @@ import { parseTime, addDateRange } from '@/utils/ruoyi';
const { sys_yes_no } = toRefs<any>(useDict('sys_yes_no'));
const configList = ref<ConfigVO[]>([]);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<number | string>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const { ids, single, multiple, handleSelectionChange } = useTableSelection<ConfigVO>(item => item.configId);
const total = ref(0);
const dateRange = ref<any>(['', '']);
const queryFormRef = ref<ElFormInstance>();
const configFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: ConfigForm = {
configId: undefined,
configName: '',
@@ -236,56 +235,52 @@ const data = reactive<PageData<ConfigForm, ConfigQuery>>({
});
const { queryParams, form, rules } = toRefs(data);
const { dialog, resetForm, openDialog, showDialog, closeDialog } = useFormDialog({
form,
formRef: configFormRef,
initialFormData: initFormData
});
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
resetExtras: () => {
dateRange.value = ['', ''];
},
afterReset: () => {
handleQuery();
}
});
/** 查询参数列表 */
const getList = async () => {
loading.value = true;
const res = await listConfig(addDateRange(queryParams.value, dateRange.value));
configList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await listConfig(addDateRange(queryParams.value, dateRange.value));
configList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
configFormRef.value?.resetFields();
closeDialog();
resetForm();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
dateRange.value = ['', ''];
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: ConfigVO[]) => {
ids.value = selection.map(item => item.configId);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加参数';
openDialog('添加参数');
};
/** 修改按钮操作 */
const handleUpdate = async (row?: ConfigVO) => {
reset();
resetForm();
const configId = row?.configId || ids.value[0];
const res = await getConfig(configId);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = '修改参数';
showDialog('修改参数');
};
/** 提交按钮 */
const submitForm = () => {
@@ -293,7 +288,7 @@ const submitForm = () => {
if (valid) {
form.value.configId ? await updateConfig(form.value) : await addConfig(form.value);
modal.msgSuccess('操作成功');
dialog.visible = false;
closeDialog();
await getList();
}
});
src/views/system/dept/index.vue
+32 -30
View File
@@ -194,6 +194,10 @@ import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild }
import { DeptForm, DeptQuery, DeptVO } from '@/api/system/dept/types';
import { listUserByDeptId } from '@/api/system/user';
import { UserVO } from '@/api/system/user/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useDialogState } from '@/hooks/dialog/useDialogState';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
import { handleTree, parseTime } from '@/utils/ruoyi';
@@ -207,17 +211,12 @@ interface DeptOptionsType {
const { sys_normal_disable } = toRefs<any>(useDict('sys_normal_disable'));
const deptList = ref<DeptVO[]>([]);
const loading = ref(true);
const showSearch = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const deptOptions = ref<DeptOptionsType[]>([]);
const isExpandAll = ref(true);
const deptUserList = ref<UserVO[]>([]);
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const deptTableRef = ref<ElTableInstance>();
const queryFormRef = ref<ElFormInstance>();
const deptFormRef = ref<ElFormInstance>();
@@ -265,16 +264,17 @@ const initData: PageData<DeptForm, DeptQuery> = {
const data = reactive<PageData<DeptForm, DeptQuery>>(initData);
const { queryParams, form, rules } = toRefs<PageData<DeptForm, DeptQuery>>(data);
const { dialog, openDialog, closeDialog, setTitle } = useDialogState();
/** 查询菜单列表 */
const getList = async () => {
loading.value = true;
const res = await listDept(queryParams.value);
const data = handleTree<DeptVO>(res.data, 'deptId');
if (data) {
deptList.value = data;
}
loading.value = false;
await withLoading(async () => {
const res = await listDept(queryParams.value);
const data = handleTree<DeptVO>(res.data, 'deptId');
if (data) {
deptList.value = data;
}
});
};
/** 查询当前部门的所有用户 */
@@ -288,7 +288,7 @@ async function getDeptAllUser(deptId: any) {
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
closeDialog();
};
/** 表单重置 */
const reset = () => {
@@ -300,11 +300,13 @@ const reset = () => {
const handleQuery = () => {
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
afterReset: () => {
handleQuery();
}
});
/** 展开/折叠操作 */
const handleToggleExpandAll = () => {
@@ -329,8 +331,8 @@ const handleAdd = async (row?: DeptVO) => {
if (row && row.deptId) {
form.value.parentId = row?.deptId;
}
dialog.visible = true;
dialog.title = '添加部门';
setTitle('添加部门');
openDialog();
}
};
@@ -354,18 +356,18 @@ const handleUpdate = async (row: DeptVO) => {
deptOptions.value.push(noResultsOptions);
}
}
dialog.visible = true;
dialog.title = '修改部门';
setTitle('修改部门');
openDialog();
};
/** 提交按钮 */
const submitForm = () => {
deptFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
form.value.deptId ? await updateDept(form.value) : await addDept(form.value);
modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
}
if (valid) {
form.value.deptId ? await updateDept(form.value) : await addDept(form.value);
modal.msgSuccess('操作成功');
closeDialog();
await getList();
}
});
};
/** 删除按钮操作 */
src/views/system/menu/index.vue
+52 -53
View File
@@ -369,6 +369,10 @@
import { addMenu, cascadeDelMenu, delMenu, getMenu, listMenu, updateMenu } from '@/api/system/menu';
import { MenuForm, MenuQuery, MenuVO } from '@/api/system/menu/types';
import { MenuTypeEnum } from '@/enums/MenuTypeEnum';
import { useLoading } from '@/hooks/async/useLoading';
import { useDialogState } from '@/hooks/dialog/useDialogState';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
import { handleTree } from '@/utils/ruoyi';
@@ -386,15 +390,10 @@ const { sys_show_hide, sys_normal_disable, sys_yes_no } = toRefs<any>(
const menuList = ref<MenuVO[]>([]);
const menuChildrenListMap = ref({});
const menuExpandMap = ref({});
const loading = ref(true);
const showSearch = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const menuOptions = ref<MenuOptionsType[]>([]);
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const queryFormRef = ref<ElFormInstance>();
const menuFormRef = ref<ElFormInstance>();
const initFormData = {
@@ -428,6 +427,7 @@ const data = reactive<PageData<MenuForm, MenuQuery>>({
const menuTableRef = ref<ElTableInstance>();
const { queryParams, form, rules } = toRefs<PageData<MenuForm, MenuQuery>>(data);
const { dialog, openDialog, closeDialog, setTitle } = useDialogState();
type MenuTagType = 'warning' | 'primary' | 'success' | 'danger';
@@ -486,31 +486,31 @@ const refreshAllExpandMenuData = () => {
/** 查询菜单列表 */
const getList = async () => {
loading.value = true;
const res = await listMenu(queryParams.value);
await withLoading(async () => {
const res = await listMenu(queryParams.value);
const tempMap = {};
// 存储 父菜单:子菜单列表
for (const menu of res.data) {
const parentId = menu.parentId;
if (!tempMap[parentId]) {
tempMap[parentId] = [];
const tempMap = {};
// 存储 父菜单:子菜单列表
for (const menu of res.data) {
const parentId = menu.parentId;
if (!tempMap[parentId]) {
tempMap[parentId] = [];
}
tempMap[parentId].push(menu);
}
tempMap[parentId].push(menu);
}
// 创建一个当前所有 menuId 的 Set，用于查找父菜单是否存在于当前数据中
const menuIdSet = new Set();
// 设置有没有子菜单
for (const menu of res.data) {
menu['hasChildren'] = tempMap[menu.menuId]?.length > 0;
menuIdSet.add(menu.menuId);
}
menuChildrenListMap.value = tempMap;
// 找出所有父ID不在当前菜单ID集合中的菜单项，作为新的顶层菜单
menuList.value = res.data.filter(menu => !menuIdSet.has(menu.parentId));
// 根据新数据重新加载子菜单数据
refreshAllExpandMenuData();
loading.value = false;
// 创建一个当前所有 menuId 的 Set，用于查找父菜单是否存在于当前数据中
const menuIdSet = new Set();
// 设置有没有子菜单
for (const menu of res.data) {
menu['hasChildren'] = tempMap[menu.menuId]?.length > 0;
menuIdSet.add(menu.menuId);
}
menuChildrenListMap.value = tempMap;
// 找出所有父ID不在当前菜单ID集合中的菜单项，作为新的顶层菜单
menuList.value = res.data.filter(menu => !menuIdSet.has(menu.parentId));
// 根据新数据重新加载子菜单数据
refreshAllExpandMenuData();
});
};
/** 查询菜单下拉树结构 */
const getTreeselect = async () => {
@@ -523,7 +523,7 @@ const getTreeselect = async () => {
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
closeDialog();
};
/** 表单重置 */
const reset = () => {
@@ -535,18 +535,20 @@ const reset = () => {
const handleQuery = () => {
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
afterReset: () => {
handleQuery();
}
});
/** 新增按钮操作 */
const handleAdd = (row?: MenuVO) => {
reset();
getTreeselect();
row && row.menuId ? (form.value.parentId = row.menuId) : (form.value.parentId = 0);
dialog.visible = true;
dialog.title = '添加菜单';
setTitle('添加菜单');
openDialog();
};
/** 修改按钮操作 */
const handleUpdate = async (row: MenuVO) => {
@@ -556,18 +558,18 @@ const handleUpdate = async (row: MenuVO) => {
const { data } = await getMenu(row.menuId);
form.value = data;
}
dialog.visible = true;
dialog.title = '修改菜单';
setTitle('修改菜单');
openDialog();
};
/** 提交按钮 */
const submitForm = () => {
menuFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
form.value.menuId ? await updateMenu(form.value) : await addMenu(form.value);
modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
}
if (valid) {
form.value.menuId ? await updateMenu(form.value) : await addMenu(form.value);
modal.msgSuccess('操作成功');
closeDialog();
await getList();
}
});
};
/** 删除按钮操作 */
@@ -581,22 +583,19 @@ const handleDelete = async (row: MenuVO) => {
const deleteLoading = ref<boolean>(false);
const menuTreeRef = ref<ElTreeInstance>();
const deleteDialog = reactive<DialogOption>({
visible: false,
title: '级联删除菜单'
});
const { dialog: deleteDialog, openDialog: openDeleteDialog, closeDialog: closeDeleteDialog } = useDialogState('级联删除菜单');
/** 级联删除按钮操作 */
const handleCascadeDelete = () => {
menuTreeRef.value?.setCheckedKeys([]);
getTreeselect();
deleteDialog.visible = true;
openDeleteDialog();
};
/** 取消按钮 */
const cancelCascade = () => {
menuTreeRef.value?.setCheckedKeys([]);
deleteDialog.visible = false;
closeDeleteDialog();
};
/** 删除提交按钮 */
@@ -611,7 +610,7 @@ const submitDeleteForm = async () => {
await cascadeDelMenu(menuIds).finally(() => (deleteLoading.value = false));
await getList();
modal.msgSuccess('删除成功');
deleteDialog.visible = false;
closeDeleteDialog();
};
onMounted(() => {
src/views/system/notice/index.vue
+33 -42
View File
@@ -230,6 +230,12 @@
import { useRoute, useRouter } from 'vue-router';
import { listNotice, getNotice, delNotice, addNotice, updateNotice } from '@/api/system/notice';
import { NoticeForm, NoticeQuery, NoticeVO } from '@/api/system/notice/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useDialogState } from '@/hooks/dialog/useDialogState';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
import { resolveOssContent } from '@/utils/ossContent';
@@ -241,23 +247,12 @@ const route = useRoute();
const router = useRouter();
const noticeList = ref<NoticeVO[]>([]);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const noticeFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const detailDialog = reactive({
visible: false
});
const routeDetailSyncing = ref(false);
const emptyNoticeContent = '<p>暂无公告内容</p>';
@@ -289,49 +284,46 @@ const data = reactive<PageData<NoticeForm, NoticeQuery>>({
});
const { queryParams, form, rules } = toRefs(data);
const { ids, single, multiple, handleSelectionChange } = useTableSelection<NoticeVO>(item => item.noticeId);
const { dialog, resetForm: reset, openDialog, showDialog, closeDialog } = useFormDialog({
form,
formRef: noticeFormRef,
initialFormData: initFormData
});
const { dialog: detailDialog, openDialog: openDetailDialog, closeDialog: closeDetailDialog } = useDialogState('公告详情');
/** 查询公告列表 */
const getList = async () => {
loading.value = true;
const res = await listNotice(queryParams.value);
noticeList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await listNotice(queryParams.value);
noticeList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 取消按钮 */
const cancel = () => {
dialog.visible = false;
closeDialog();
};
/** 对话框关闭后重置 */
const handleDialogClosed = () => {
reset();
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
noticeFormRef.value?.resetFields();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: NoticeVO[]) => {
ids.value = selection.map(item => item.noticeId);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
afterReset: () => {
handleQuery();
}
});
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加公告';
openDialog('添加公告');
};
/**修改按钮操作 */
const handleUpdate = async (row?: NoticeVO) => {
@@ -339,8 +331,7 @@ const handleUpdate = async (row?: NoticeVO) => {
const noticeId = row?.noticeId || ids.value[0];
const { data } = await getNotice(noticeId);
Object.assign(form.value, data);
dialog.visible = true;
dialog.title = '修改公告';
showDialog('修改公告');
};
/** 详情按钮操作 */
const handleDetail = async (row: NoticeVO) => {
@@ -351,7 +342,7 @@ const openDetail = async (noticeId: string | number) => {
const { data } = await getNotice(noticeId);
data.noticeContent = await resolveOssContent(data.noticeContent);
detailForm.value = data;
detailDialog.visible = true;
openDetailDialog();
};
/** 详情弹窗关闭后移除路由参数 */
const handleDetailDialogClosed = async () => {
@@ -374,7 +365,7 @@ const submitForm = () => {
if (valid) {
form.value.noticeId ? await updateNotice(form.value) : await addNotice(form.value);
modal.msgSuccess('操作成功');
dialog.visible = false;
closeDialog();
await getList();
}
});
src/views/system/oss/config.vue
+32 -41
View File
@@ -212,27 +212,24 @@ import {
changeOssConfigStatus
} from '@/api/system/ossConfig';
import { OssConfigForm, OssConfigQuery, OssConfigVO } from '@/api/system/ossConfig/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
const { sys_yes_no } = toRefs<any>(useDict('sys_yes_no'));
const ossConfigList = ref<OssConfigVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<number | string>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, setLoading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const ossConfigFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
// 列显隐信息
const columns = ref<FieldOption[]>([
{ key: 0, label: `主建`, visible: false },
@@ -314,48 +311,43 @@ const data = reactive<PageData<OssConfigForm, OssConfigQuery>>({
});
const { queryParams, form, rules } = toRefs(data);
const protocol = computed(() => (form.value.isHttps === 'Y' ? 'https://' : 'http://'));
const { ids, single, multiple, handleSelectionChange } = useTableSelection<OssConfigVO>(item => item.ossConfigId);
const { dialog, resetForm: reset, openDialog, showDialog, closeDialog } = useFormDialog({
form,
formRef: ossConfigFormRef,
initialFormData: initFormData
});
/** 查询对象存储配置列表 */
const getList = async () => {
loading.value = true;
const res = await listOssConfig(queryParams.value);
ossConfigList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await listOssConfig(queryParams.value);
ossConfigList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 取消按钮 */
const cancel = () => {
dialog.visible = false;
reset();
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
ossConfigFormRef.value?.resetFields();
closeDialog();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 选择条数 */
const handleSelectionChange = (selection: OssConfigVO[]) => {
ids.value = selection.map(item => item.ossConfigId);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
afterReset: () => {
handleQuery();
}
});
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加对象存储配置';
openDialog('添加对象存储配置');
};
/** 修改按钮操作 */
const handleUpdate = async (row?: OssConfigVO) => {
@@ -363,8 +355,7 @@ const handleUpdate = async (row?: OssConfigVO) => {
const ossConfigId = row?.ossConfigId || ids.value[0];
const res = await getOssConfig(ossConfigId);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = '修改对象存储配置';
showDialog('修改对象存储配置');
};
/** 提交按钮 */
const submitForm = () => {
@@ -377,7 +368,7 @@ const submitForm = () => {
await addOssConfig(form.value).finally(() => (buttonLoading.value = false));
}
modal.msgSuccess('新增成功');
dialog.visible = false;
closeDialog();
await getList();
}
});
@@ -398,8 +389,8 @@ const handleStatusChange = async (row: OssConfigVO) => {
const handleDelete = async (row?: OssConfigVO) => {
const ossConfigIds = row?.ossConfigId || ids.value;
await modal.confirm('是否确认删除OSS配置编号为"' + ossConfigIds + '"的数据项?');
loading.value = true;
await delOssConfig(ossConfigIds).finally(() => (loading.value = false));
setLoading(true);
await delOssConfig(ossConfigIds).finally(() => setLoading(false));
await getList();
modal.msgSuccess('删除成功');
};
src/views/system/oss/index.vue
+41 -48
View File
@@ -189,6 +189,11 @@ import { getConfigKey, updateConfigByKey } from '@/api/system/config';
import { listOss, delOss } from '@/api/system/oss';
import { OssForm, OssQuery, OssVO } from '@/api/system/oss/types';
import ImagePreview from '@/components/ImagePreview/index.vue';
import { useLoading } from '@/hooks/async/useLoading';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import download from '@/plugins/download';
import modal from '@/plugins/modal';
import { parseTime, addDateRange } from '@/utils/ruoyi';
@@ -198,21 +203,13 @@ const router = useRouter();
const ossList = ref<OssVO[]>([]);
const showTable = ref(true);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, setLoading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const total = ref(0);
const type = ref(0);
const previewListResource = ref(true);
const dateRangeCreateTime = ref<any>(['', '']);
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
// 默认排序
const defaultSort = ref({ prop: 'createTime', order: 'ascending' });
@@ -242,17 +239,23 @@ const data = reactive<PageData<OssForm, OssQuery>>({
});
const { queryParams, form, rules } = toRefs(data);
const { ids, single, multiple, handleSelectionChange } = useTableSelection<OssVO>(item => item.ossId);
const { dialog, resetForm: reset, openDialog, closeDialog } = useFormDialog({
form,
formRef: ossFormRef,
initialFormData: initFormData
});
/** 查询OSS对象存储列表 */
const getList = async () => {
loading.value = true;
const res = await getConfigKey('sys.oss.previewListResource');
previewListResource.value = res?.data === undefined ? true : res.data === 'true';
const response = await listOss(addDateRange(queryParams.value, dateRangeCreateTime.value, 'CreateTime'));
ossList.value = response.data?.rows;
total.value = response.data?.total;
loading.value = false;
showTable.value = true;
await withLoading(async () => {
const res = await getConfigKey('sys.oss.previewListResource');
previewListResource.value = res?.data === undefined ? true : res.data === 'true';
const response = await listOss(addDateRange(queryParams.value, dateRangeCreateTime.value, 'CreateTime'));
ossList.value = response.data?.rows;
total.value = response.data?.total;
showTable.value = true;
});
};
function checkFileSuffix(fileSuffix: string | string[]) {
const arr = ['.png', '.jpg', '.jpeg'];
@@ -261,34 +264,28 @@ function checkFileSuffix(fileSuffix: string | string[]) {
}
/** 取消按钮 */
function cancel() {
dialog.visible = false;
reset();
}
/** 表单重置 */
function reset() {
form.value = { ...initFormData };
ossFormRef.value?.resetFields();
closeDialog();
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
function resetQuery() {
showTable.value = false;
dateRangeCreateTime.value = ['', ''];
queryFormRef.value?.resetFields();
queryParams.value.orderByColumn = defaultSort.value.prop;
queryParams.value.isAsc = defaultSort.value.order;
handleQuery();
}
/** 选择条数 */
function handleSelectionChange(selection: OssVO[]) {
ids.value = selection.map(item => item.ossId);
single.value = selection.length != 1;
multiple.value = !selection.length;
}
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
resetExtras: () => {
showTable.value = false;
dateRangeCreateTime.value = ['', ''];
queryParams.value.orderByColumn = defaultSort.value.prop;
queryParams.value.isAsc = defaultSort.value.order;
},
afterReset: () => {
handleQuery();
}
});
/** 设置列的排序为我们自定义的排序 */
const handleHeaderClass = ({ column }: any): any => {
column.order = column.multiOrder;
@@ -340,21 +337,17 @@ const handleOssConfig = () => {
};
/** 文件按钮操作 */
const handleFile = () => {
reset();
type.value = 0;
dialog.visible = true;
dialog.title = '上传文件';
openDialog('上传文件');
};
/** 图片按钮操作 */
const handleImage = () => {
reset();
type.value = 1;
dialog.visible = true;
dialog.title = '上传图片';
openDialog('上传图片');
};
/** 提交按钮 */
const submitForm = () => {
dialog.visible = false;
closeDialog();
getList();
};
/** 下载按钮操作 */
@@ -375,8 +368,8 @@ const handlePreviewListResource = async (preview: boolean) => {
const handleDelete = async (row?: OssVO) => {
const ossIds = row?.ossId || ids.value;
await modal.confirm('是否确认删除OSS对象存储编号为"' + ossIds + '"的数据项?');
loading.value = true;
await delOss(ossIds).finally(() => (loading.value = false));
setLoading(true);
await delOss(ossIds).finally(() => setLoading(false));
await getList();
modal.msgSuccess('删除成功');
};
src/views/system/post/index.vue
+39 -49
View File
@@ -235,6 +235,12 @@ import { DeptTreeVO, DeptVO } from '@/api/system/dept/types';
import { listPost, addPost, delPost, getPost, updatePost, deptTreeSelect } from '@/api/system/post';
import { PostForm, PostQuery, PostVO } from '@/api/system/post/types';
import TreePanel from '@/components/TreePanel/index.vue';
import { useLoading } from '@/hooks/async/useLoading';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import { useTreeCollapsed } from '@/hooks/tree/useTreeCollapsed';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
import { download as requestDownload } from '@/utils/request';
@@ -243,23 +249,16 @@ import { parseTime } from '@/utils/ruoyi';
const { sys_normal_disable } = toRefs<any>(useDict('sys_normal_disable'));
const postList = ref<PostVO[]>([]);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<number | string>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const { ids, single, multiple, handleSelectionChange } = useTableSelection<PostVO>(item => item.postId);
const total = ref(0);
const treeCollapsed = ref(false);
const { treeCollapsed } = useTreeCollapsed();
const deptOptions = ref<DeptTreeVO[]>([]);
const treePanelRef = ref<InstanceType<typeof TreePanel>>();
const postFormRef = ref<ElFormInstance>();
const queryFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: PostForm = {
postId: undefined,
deptId: undefined,
@@ -292,6 +291,24 @@ const data = reactive<PageData<PostForm, PostQuery>>({
});
const { queryParams, form, rules } = toRefs<PageData<PostForm, PostQuery>>(data);
const { dialog, resetForm, openDialog, showDialog, closeDialog } = useFormDialog({
form,
formRef: postFormRef,
initialFormData: initFormData
});
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
resetExtras: () => {
queryParams.value.deptId = undefined;
treePanelRef.value?.setCurrentKey(undefined);
queryParams.value.belongDeptId = undefined;
},
afterReset: () => {
handleQuery();
}
});
/** 查询部门下拉树结构 */
const getTreeSelect = async () => {
@@ -308,23 +325,17 @@ const handleNodeClick = (data: DeptVO) => {
/** 查询岗位列表 */
const getList = async () => {
loading.value = true;
const res = await listPost(queryParams.value);
postList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await listPost(queryParams.value);
postList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
postFormRef.value?.resetFields();
closeDialog();
resetForm();
};
/** 搜索按钮操作 */
@@ -336,39 +347,18 @@ const handleQuery = () => {
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
queryParams.value.pageNum = 1;
queryParams.value.deptId = undefined;
treePanelRef.value?.setCurrentKey(undefined);
/** 清空左边部门树选中值 */
queryParams.value.belongDeptId = undefined;
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: PostVO[]) => {
ids.value = selection.map(item => item.postId);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加岗位';
openDialog('添加岗位');
};
/** 修改按钮操作 */
const handleUpdate = async (row?: PostVO) => {
reset();
resetForm();
const postId = row?.postId || ids.value[0];
const res = await getPost(postId);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = '修改岗位';
showDialog('修改岗位');
};
/** 提交按钮 */
@@ -377,7 +367,7 @@ const submitForm = () => {
if (valid) {
form.value.postId ? await updatePost(form.value) : await addPost(form.value);
modal.msgSuccess('操作成功');
dialog.visible = false;
closeDialog();
await getList();
}
});
src/views/system/role/authUser.vue
+18 -19
View File
@@ -110,6 +110,10 @@ import { RouteLocationNormalized } from 'vue-router';
import { allocatedUserList, authUserCancel, authUserCancelAll } from '@/api/system/role';
import { UserQuery } from '@/api/system/user/types';
import { UserVO } from '@/api/system/user/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import tab from '@/plugins/tab';
import { useDict } from '@/utils/dict';
@@ -119,11 +123,9 @@ const route = useRoute();
const { sys_normal_disable } = toRefs<any>(useDict('sys_normal_disable'));
const userList = ref<UserVO[]>([]);
const loading = ref(true);
const showSearch = ref(true);
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const total = ref(0);
const userIds = ref<Array<string | number>>([]);
const queryFormRef = ref<ElFormInstance>();
const selectRef = ref<InstanceType<typeof SelectUser>>();
@@ -135,14 +137,15 @@ const queryParams = reactive<UserQuery>({
userName: undefined,
phoneNumber: undefined
});
const { ids: userIds, multiple, handleSelectionChange } = useTableSelection<UserVO>(item => item.userId);
/** 查询授权用户列表 */
const getList = async () => {
loading.value = true;
const res = await allocatedUserList(queryParams);
userList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await allocatedUserList(queryParams);
userList.value = res.data?.rows;
total.value = res.data?.total;
});
};
// 返回按钮
const handleClose = () => {
@@ -164,16 +167,12 @@ const handleQuery = () => {
queryParams.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
// 多选框选中数据
const handleSelectionChange = (selection: UserVO[]) => {
userIds.value = selection.map(item => item.userId);
multiple.value = !selection.length;
};
const { resetQuery } = useSearchReset({
queryFormRef,
afterReset: () => {
handleQuery();
}
});
/** 打开授权用户表弹窗 */
const openSelectUser = () => {
selectRef.value?.show();
src/views/system/role/index.vue
+35 -37
View File
@@ -336,6 +336,11 @@ import {
deptTreeSelect
} from '@/api/system/role';
import { RoleVO, RoleForm, RoleQuery, DeptTreeOption } from '@/api/system/role/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useDialogState } from '@/hooks/dialog/useDialogState';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
import { download as requestDownload } from '@/utils/request';
@@ -360,10 +365,8 @@ interface RoleMenuPermissionMeta {
}
const roleList = ref<RoleVO[]>();
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const total = ref(0);
const dateRange = ref<any>(['', '']);
const menuPermissionMeta = ref<RoleMenuPermissionMeta>({
@@ -784,21 +787,17 @@ const data = reactive<PageData<RoleForm, RoleQuery>>({
}
});
const { form, queryParams, rules } = toRefs(data);
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const { ids, single, handleSelectionChange } = useTableSelection<RoleVO>(item => item.roleId);
const { dialog, openDialog, closeDialog, setTitle } = useDialogState();
/**
* 查询角色列表
*/
const getList = () => {
loading.value = true;
listRole(addDateRange(queryParams.value, dateRange.value)).then(res => {
withLoading(async () => {
const res = await listRole(addDateRange(queryParams.value, dateRange.value));
roleList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
});
};
@@ -810,12 +809,17 @@ const handleQuery = () => {
getList();
};
/** 重置 */
const resetQuery = () => {
dateRange.value = ['', ''];
queryFormRef.value?.resetFields();
handleQuery();
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
resetExtras: () => {
dateRange.value = ['', ''];
},
afterReset: () => {
handleQuery();
}
});
/**删除按钮操作 */
const handleDelete = async (row?: RoleVO) => {
const roleids = row?.roleId || ids.value;
@@ -835,12 +839,6 @@ const handleExport = () => {
`role_${new Date().getTime()}.xlsx`
);
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: RoleVO[]) => {
ids.value = selection.map((item: RoleVO) => item.roleId);
single.value = selection.length != 1;
};
/** 角色状态修改 */
const handleStatusChange = async (row: RoleVO) => {
const text = row.status === '0' ? '启用' : '停用';
@@ -888,8 +886,8 @@ const reset = () => {
/** 添加角色 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加角色';
setTitle('添加角色');
openDialog();
};
/** 修改角色 */
const handleUpdate = async (row?: RoleVO) => {
@@ -901,8 +899,8 @@ const handleUpdate = async (row?: RoleVO) => {
// 菜单分配已迁移到“分配权限”弹窗，这里预置已有菜单，避免基础信息保存时误清空菜单权限。
const { checkedKeys } = await getRoleMenuTreeselect(roleId);
form.value.menuIds = checkedKeys;
dialog.title = '修改角色';
dialog.visible = true;
setTitle('修改角色');
openDialog();
};
/** 根据角色ID查询菜单树结构 */
const getRoleMenuTreeselect = (roleId: string | number) => {
@@ -963,19 +961,19 @@ const getMenuAllCheckedKeys = (): any => {
/** 提交按钮 */
const submitForm = () => {
roleFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
syncFormMenuPermissionIds();
form.value.roleId ? await updateRole(form.value) : await addRole(form.value);
modal.msgSuccess('操作成功');
dialog.visible = false;
getList();
}
if (valid) {
syncFormMenuPermissionIds();
form.value.roleId ? await updateRole(form.value) : await addRole(form.value);
modal.msgSuccess('操作成功');
closeDialog();
getList();
}
});
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
closeDialog();
};
/** 选择角色权限范围触发 */
const dataScopeSelectChange = (value: string) => {
@@ -991,7 +989,7 @@ const handleDataScope = async (row: RoleVO) => {
const menuRes = await getRoleMenuTreeselect(row.roleId);
const res = await getRoleDeptTreeSelect(row.roleId);
openDataScope.value = true;
dialog.title = '分配权限';
setTitle('分配权限');
await nextTick(() => {
initPermissionState(menuRes.checkedKeys);
syncFormMenuPermissionIds();
src/views/system/user/index.vue
+36 -39
View File
@@ -461,6 +461,12 @@ import { RoleVO } from '@/api/system/role/types';
import api from '@/api/system/user';
import { UserForm, UserQuery, UserVO } from '@/api/system/user/types';
import TreePanel from '@/components/TreePanel/index.vue';
import { useLoading } from '@/hooks/async/useLoading';
import { useDialogState } from '@/hooks/dialog/useDialogState';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import { useTreeCollapsed } from '@/hooks/tree/useTreeCollapsed';
import modal from '@/plugins/modal';
import { useUserStore } from '@/store/modules/user';
import { useDict } from '@/utils/dict';
@@ -473,14 +479,11 @@ import UserViewDrawer from './view.vue';
const router = useRouter();
const { sys_normal_disable, sys_user_gender } = toRefs<any>(useDict('sys_normal_disable', 'sys_user_gender'));
const userList = ref<UserVO[]>();
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<number | string>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const total = ref(0);
const dateRange = ref<any>(['', '']);
const treeCollapsed = ref(false);
const { treeCollapsed } = useTreeCollapsed();
const deptOptions = ref<DeptTreeVO[]>([]);
const enabledDeptOptions = ref<DeptTreeVO[]>([]);
const initPassword = ref<string>('');
@@ -519,11 +522,6 @@ const uploadRef = ref<ElUploadInstance>();
const formDialogRef = ref<ElDialogInstance>();
const userViewRef = ref<InstanceType<typeof UserViewDrawer>>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: UserForm = {
userId: undefined,
deptId: undefined,
@@ -595,14 +593,16 @@ const initData: PageData<UserForm, UserQuery> = {
const data = reactive<PageData<UserForm, UserQuery>>(initData);
const { queryParams, form, rules } = toRefs<PageData<UserForm, UserQuery>>(data);
const { ids, single, multiple, handleSelectionChange } = useTableSelection<UserVO>(item => item.userId);
const { dialog, openDialog: openUserDialog, closeDialog: closeUserDialog, setTitle: setDialogTitle } = useDialogState();
/** 查询用户列表 */
const getList = async () => {
loading.value = true;
const res = await api.listUser(addDateRange(queryParams.value, dateRange.value));
loading.value = false;
userList.value = res.data?.rows;
total.value = res.data?.total;
await withLoading(async () => {
const res = await api.listUser(addDateRange(queryParams.value, dateRange.value));
userList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 查询部门下拉树结构 */
@@ -636,15 +636,19 @@ const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
dateRange.value = ['', ''];
queryFormRef.value?.resetFields();
queryParams.value.pageNum = 1;
queryParams.value.deptId = undefined;
treePanelRef.value?.setCurrentKey(undefined);
handleQuery();
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
resetExtras: () => {
dateRange.value = ['', ''];
queryParams.value.deptId = undefined;
treePanelRef.value?.setCurrentKey(undefined);
},
afterReset: () => {
handleQuery();
}
});
/** 删除按钮操作 */
const handleDelete = async (row?: UserVO) => {
@@ -706,13 +710,6 @@ const handleResetPwd = async (row: UserVO) => {
}
};
/** 选择条数 */
const handleSelectionChange = (selection: UserVO[]) => {
ids.value = selection.map(item => item.userId);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 详情按钮操作 */
const handleViewDetail = (row: UserVO) => {
userViewRef.value?.openDrawer(row.userId);
@@ -773,7 +770,7 @@ const reset = () => {
};
/** 取消按钮 */
const cancel = () => {
dialog.visible = false;
closeUserDialog();
reset();
};
@@ -781,8 +778,8 @@ const cancel = () => {
const handleAdd = async () => {
reset();
const { data } = await api.getUser();
dialog.visible = true;
dialog.title = '新增用户';
setDialogTitle('新增用户');
openUserDialog();
postOptions.value = data.posts;
roleOptions.value = data.roles;
form.value.password = initPassword.value.toString();
@@ -793,8 +790,8 @@ const handleUpdate = async (row?: UserForm) => {
reset();
const userId = row?.userId || ids.value[0];
const { data } = await api.getUser(userId);
dialog.visible = true;
dialog.title = '修改用户';
setDialogTitle('修改用户');
openUserDialog();
Object.assign(form.value, data.user);
postOptions.value = data.posts;
roleOptions.value = Array.from(
@@ -821,7 +818,7 @@ const submitForm = () => {
await api.addUser(form.value);
}
modal.msgSuccess('操作成功');
dialog.visible = false;
closeUserDialog();
await getList();
}
});
@@ -831,7 +828,7 @@ const submitForm = () => {
* 关闭用户弹窗
*/
const closeDialog = () => {
dialog.visible = false;
closeUserDialog();
resetForm();
};
src/views/tool/gen/index.vue
+26 -27
View File
@@ -194,6 +194,11 @@
import { useRoute } from 'vue-router';
import { delTable, genCode, getDataNames, listTable, previewTable, synchDb } from '@/api/tool/gen';
import { TableQuery, TableVO } from '@/api/tool/gen/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useDialogState } from '@/hooks/dialog/useDialogState';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import download from '@/plugins/download';
import modal from '@/plugins/modal';
import router from '@/router';
@@ -203,11 +208,8 @@ import ImportTable from './importTable.vue';
const route = useRoute();
const tableList = ref<TableVO[]>([]);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const total = ref(0);
const dateRange = ref<any>(['', '']);
const uniqueId = ref('');
@@ -231,10 +233,8 @@ const preview = ref<{
data: {},
activeName: 'domain.java'
});
const dialog = reactive<DialogOption>({
visible: false,
title: '代码预览'
});
const { ids, single, multiple, handleSelectionChange } = useTableSelection<TableVO>(item => item.tableId);
const { dialog, openDialog: openPreviewDialog } = useDialogState('代码预览');
/** 查询多数据源名称 */
const getDataNameList = async () => {
@@ -244,11 +244,11 @@ const getDataNameList = async () => {
/** 查询表集合 */
const getList = async () => {
loading.value = true;
const res = await listTable(addDateRange(queryParams.value, dateRange.value));
tableList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await listTable(addDateRange(queryParams.value, dateRange.value));
tableList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 搜索按钮操作 */
const handleQuery = () => {
@@ -280,29 +280,28 @@ const handleSynchDb = async (row: TableVO) => {
const openImportTable = () => {
importRef.value?.show(queryParams.value.dataName);
};
/** 重置按钮操作 */
const resetQuery = () => {
dateRange.value = ['', ''];
queryFormRef.value?.resetFields();
handleQuery();
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
resetExtras: () => {
dateRange.value = ['', ''];
},
afterReset: () => {
handleQuery();
}
});
/** 预览按钮 */
const handlePreview = async (row: TableVO) => {
const res = await previewTable(row.tableId);
preview.value.data = res.data;
dialog.visible = true;
openPreviewDialog();
preview.value.activeName = 'domain.java';
};
/** 复制代码成功 */
const copyTextSuccess = () => {
modal.msgSuccess('复制成功');
};
// 多选框选中数据
const handleSelectionChange = (selection: TableVO[]) => {
ids.value = selection.map(item => item.tableId);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 修改按钮操作 */
const handleEditTable = (row?: TableVO) => {
const tableId = row?.tableId || ids.value[0];
src/views/workflow/category/index.vue
+31 -34
View File
@@ -123,6 +123,10 @@
<script setup name="Category" lang="ts">
import { listCategory, getCategory, delCategory, addCategory, updateCategory } from '@/api/workflow/category';
import { CategoryVO, CategoryQuery, CategoryForm } from '@/api/workflow/category/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import modal from '@/plugins/modal';
import { handleTree } from '@/utils/ruoyi';
@@ -135,19 +139,14 @@ type CategoryOption = {
const categoryList = ref<CategoryVO[]>([]);
const categoryOptions = ref<CategoryOption[]>([]);
const buttonLoading = ref(false);
const showSearch = ref(true);
const { showSearch } = useSearchToggle();
const isExpandAll = ref(true);
const loading = ref(false);
const { loading, setLoading, withLoading } = useLoading();
const queryFormRef = ref<ElFormInstance>();
const categoryFormRef = ref<ElFormInstance>();
const categoryTableRef = ref<ElTableInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: CategoryForm = {
categoryId: undefined,
categoryName: '',
@@ -168,16 +167,21 @@ const data = reactive<PageData<CategoryForm, CategoryQuery>>({
});
const { queryParams, form, rules } = toRefs(data);
const { dialog, resetForm: reset, openDialog, showDialog, closeDialog } = useFormDialog({
form,
formRef: categoryFormRef,
initialFormData: initFormData
});
/** 查询流程分类列表 */
const getList = async () => {
loading.value = true;
const res = await listCategory(queryParams.value);
const data = handleTree<CategoryVO>(res.data, 'categoryId', 'parentId');
if (data) {
categoryList.value = data;
loading.value = false;
}
await withLoading(async () => {
const res = await listCategory(queryParams.value);
const data = handleTree<CategoryVO>(res.data, 'categoryId', 'parentId');
if (data) {
categoryList.value = data;
}
});
};
/** 查询流程分类下拉树结构 */
@@ -194,13 +198,7 @@ const getTreeselect = async () => {
// 取消按钮
const cancel = () => {
reset();
dialog.visible = false;
};
// 表单重置
const reset = () => {
form.value = { ...initFormData };
categoryFormRef.value?.resetFields();
closeDialog();
};
/** 搜索按钮操作 */
@@ -208,23 +206,23 @@ const handleQuery = () => {
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
afterReset: () => {
handleQuery();
}
});
/** 新增按钮操作 */
const handleAdd = (row?: CategoryVO) => {
reset();
openDialog('添加流程分类');
getTreeselect();
if (row?.categoryId) {
form.value.parentId = row.categoryId;
} else {
form.value.parentId = undefined;
}
dialog.visible = true;
dialog.title = '添加流程分类';
};
/** 展开/折叠操作 */
@@ -250,8 +248,7 @@ const handleUpdate = async (row: CategoryVO) => {
}
const res = await getCategory(row.categoryId);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = '修改流程分类';
showDialog('修改流程分类');
};
/** 提交按钮 */
@@ -265,7 +262,7 @@ const submitForm = () => {
await addCategory(form.value).finally(() => (buttonLoading.value = false));
}
modal.msgSuccess('操作成功');
dialog.visible = false;
closeDialog();
getList();
}
});
@@ -274,8 +271,8 @@ const submitForm = () => {
/** 删除按钮操作 */
const handleDelete = async (row: CategoryVO) => {
await modal.confirm('是否确认删除"' + row.categoryName + '"的分类？');
loading.value = true;
await delCategory(row.categoryId).finally(() => (loading.value = false));
setLoading(true);
await delCategory(row.categoryId).finally(() => setLoading(false));
await getList();
modal.msgSuccess('删除成功');
};
src/views/workflow/leave/index.vue
+23 -25
View File
@@ -155,6 +155,10 @@ import { useRoute } from 'vue-router';
import { cancelProcessApply } from '@/api/workflow/instance';
import { delLeave, listLeave } from '@/api/workflow/leave';
import { LeaveForm, LeaveQuery, LeaveVO } from '@/api/workflow/leave/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import tab from '@/plugins/tab';
import router from '@/router';
@@ -165,11 +169,9 @@ import { parseTime } from '@/utils/ruoyi';
const route = useRoute();
const { wf_business_status } = toRefs<any>(useDict('wf_business_status'));
const leaveList = ref<LeaveVO[]>([]);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, setLoading, withLoading } = useLoading(true);
const { showSearch } = useSearchToggle();
const { ids, single, multiple, handleSelectionChange } = useTableSelection<LeaveVO>(item => item.id);
const total = ref(0);
const options = [
{
@@ -207,11 +209,11 @@ const { queryParams } = toRefs(data);
/** 查询请假列表 */
const getList = async () => {
loading.value = true;
const res = await listLeave(queryParams.value);
leaveList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await listLeave(queryParams.value);
leaveList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 搜索按钮操作 */
@@ -220,18 +222,14 @@ const handleQuery = () => {
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: LeaveVO[]) => {
ids.value = selection.map(item => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
afterReset: () => {
handleQuery();
}
});
/** 新增按钮操作 */
const handleAdd = () => {
@@ -271,7 +269,7 @@ const handleView = (row?: LeaveVO) => {
/** 删除按钮操作 */
const handleDelete = async (row?: LeaveVO) => {
const _ids = row?.id || ids.value;
await modal.confirm('是否确认删除请假编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
await modal.confirm('是否确认删除请假编号为"' + _ids + '"的数据项？');
await delLeave(_ids);
modal.msgSuccess('删除成功');
await getList();
@@ -291,12 +289,12 @@ const handleExport = () => {
/** 撤销按钮操作 */
const handleCancelProcessApply = async (id: string) => {
await modal.confirm('是否确认撤销当前单据？');
loading.value = true;
setLoading(true);
const data = {
businessId: id,
message: '申请人撤销流程！'
};
await cancelProcessApply(data).finally(() => (loading.value = false));
await cancelProcessApply(data).finally(() => setLoading(false));
await getList();
modal.msgSuccess('撤销成功');
};
src/views/workflow/processDefinition/index.vue
+64 -65
View File
@@ -81,7 +81,7 @@
v-hasPermi="['workflow:definition:import']"
type="primary"
icon="UploadFilled"
@click="uploadDialog.visible = true"
@click="openUploadDialog()"
>
部署流程文件
</el-button>
@@ -315,7 +315,7 @@
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="modelDialog.visible = false">取消</el-button>
<el-button @click="closeModelDialog()">取消</el-button>
<el-button type="primary" @click="handleSubmit">保存</el-button>
</div>
</template>
@@ -342,6 +342,13 @@ import {
} from '@/api/workflow/definition';
import { FlowDefinitionQuery, FlowDefinitionVo, FlowDefinitionForm } from '@/api/workflow/definition/types';
import TreePanel from '@/components/TreePanel/index.vue';
import { useLoading } from '@/hooks/async/useLoading';
import { useDialogState } from '@/hooks/dialog/useDialogState';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import { useTreeCollapsed } from '@/hooks/tree/useTreeCollapsed';
import modal from '@/plugins/modal';
import { download as requestDownload } from '@/utils/request';
@@ -351,31 +358,18 @@ const router = useRouter();
const queryFormRef = ref<ElFormInstance>();
const treePanelRef = ref<InstanceType<typeof TreePanel>>();
const loading = ref(true);
const ids = ref<Array<any>>([]);
const flowCodeList = ref<Array<any>>([]);
const single = ref(true);
const multiple = ref(true);
const showSearch = ref(true);
const { loading, setLoading, withLoading } = useLoading(true);
const total = ref(0);
const uploadDialogLoading = ref(false);
const processDefinitionList = ref<FlowDefinitionVo[]>([]);
const categoryOptions = ref<CategoryTreeVO[]>([]);
const treeCollapsed = ref(false);
const { treeCollapsed } = useTreeCollapsed();
const { showSearch } = useSearchToggle();
const autoPass = ref(false);
/** 部署文件分类选择 */
const selectCategory = ref();
const defFormRef = ref<ElFormInstance>();
const activeName = ref('0');
const uploadDialog = reactive<DialogOption>({
visible: false,
title: '部署流程文件'
});
const modelDialog = reactive<DialogOption>({
visible: false,
title: ''
});
// 查询参数
const queryParams = ref<FlowDefinitionQuery>({
@@ -413,6 +407,20 @@ const form = ref<FlowDefinitionForm>({
formCustom: '',
modelValue: ''
});
const {
ids,
selectedRows,
single,
multiple,
handleSelectionChange
} = useTableSelection<FlowDefinitionVo, string>(item => String(item.id));
const flowCodeList = computed(() => selectedRows.value.map(item => item.flowCode));
const { dialog: uploadDialog, openDialog: openUploadDialog, closeDialog: closeUploadDialog } = useDialogState('部署流程文件');
const { dialog: modelDialog, resetForm: reset, showDialog: showModelDialog, closeDialog: closeModelDialog } = useFormDialog({
form,
formRef: defFormRef,
initialFormData: initFormData
});
onMounted(() => {
getPageList();
getTreeselect();
@@ -445,21 +453,19 @@ const handleQuery = () => {
getUnPublishList();
}
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
queryParams.value.category = '';
queryParams.value.pageNum = 1;
queryParams.value.pageSize = 10;
handleQuery();
};
// 多选框选中数据
const handleSelectionChange = (selection: any) => {
ids.value = selection.map((item: any) => item.id);
flowCodeList.value = selection.map((item: any) => item.flowCode);
single.value = selection.length !== 1;
multiple.value = !selection.length;
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
pageSizeKey: 'pageSize',
initialPageSize: 10,
resetExtras: () => {
queryParams.value.category = '';
},
afterReset: () => {
handleQuery();
}
});
//分页
const getPageList = async () => {
if (route.query.activeName) {
@@ -476,19 +482,19 @@ const getPageList = async () => {
};
//分页
const getList = async () => {
loading.value = true;
const resp = await listDefinition(queryParams.value);
processDefinitionList.value = resp.data?.rows;
total.value = resp.data?.total;
loading.value = false;
await withLoading(async () => {
const resp = await listDefinition(queryParams.value);
processDefinitionList.value = resp.data?.rows;
total.value = resp.data?.total;
});
};
//查询未发布的流程定义列表
const getUnPublishList = async () => {
loading.value = true;
const resp = await unPublishList(queryParams.value);
processDefinitionList.value = resp.data?.rows;
total.value = resp.data?.total;
loading.value = false;
await withLoading(async () => {
const resp = await unPublishList(queryParams.value);
processDefinitionList.value = resp.data?.rows;
total.value = resp.data?.total;
});
};
/** 删除按钮操作 */
@@ -496,8 +502,8 @@ const handleDelete = async (row?: FlowDefinitionVo) => {
const id = row?.id || ids.value;
const defList = processDefinitionList.value.filter(x => id.indexOf(x.id) != -1).map(x => x.flowCode);
await modal.confirm('是否确认删除流程定义编码为【' + defList + '】的数据项？');
loading.value = true;
await deleteDefinition(id).finally(() => (loading.value = false));
setLoading(true);
await deleteDefinition(id).finally(() => setLoading(false));
await handleQuery();
modal.msgSuccess('删除成功');
};
@@ -511,8 +517,8 @@ const handlePublish = async (row?: FlowDefinitionVo) => {
row.version +
'】的数据项？，发布后会将已发布流程定义改为失效！'
);
loading.value = true;
await publish(row.id).finally(() => (loading.value = false));
setLoading(true);
await publish(row.id).finally(() => setLoading(false));
activeName.value = '0';
await handleQuery();
modal.msgSuccess('发布成功');
@@ -526,7 +532,7 @@ const handleProcessDefState = async (row: FlowDefinitionVo, status: number | str
msg = `启动后，此流程下的所有任务都允许往后流转，您确定激活【${row.flowName || row.flowCode}】吗？`;
}
try {
loading.value = true;
setLoading(true);
await modal.confirm(msg);
await active(row.id, !!status);
await handleQuery();
@@ -535,7 +541,7 @@ const handleProcessDefState = async (row: FlowDefinitionVo, status: number | str
row.activityStatus = status === 0 ? 1 : 0;
console.error(error);
} finally {
loading.value = false;
setLoading(false);
}
};
@@ -558,7 +564,7 @@ const handlerImportDefinition = (data: UploadRequestOptions): XMLHttpRequest =>
formData.append('category', selectCategory.value);
importDef(formData)
.then(() => {
uploadDialog.visible = false;
closeUploadDialog();
modal.msgSuccess('部署成功');
activeName.value = '1';
handleQuery();
@@ -597,11 +603,6 @@ const designView = async (row: FlowDefinitionVo) => {
}
});
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
defFormRef.value?.resetFields();
};
/**
* 新增
*/
@@ -612,8 +613,7 @@ const handleAdd = async () => {
}
form.value.modelValue = 'CLASSICS';
form.value.formCustom = 'N';
modelDialog.visible = true;
modelDialog.title = '新增流程';
showModelDialog('新增流程');
};
/** 修改按钮操作 */
const handleUpdate = async (row?: FlowDefinitionVo) => {
@@ -628,26 +628,25 @@ const handleUpdate = async (row?: FlowDefinitionVo) => {
autoPass.value = extJson.autoPass;
}
}
modelDialog.visible = true;
modelDialog.title = '修改流程';
showModelDialog('修改流程');
};
const handleSubmit = async () => {
defFormRef.value.validate(async (valid: boolean) => {
if (valid) {
loading.value = true;
setLoading(true);
const ext: { autoPass: boolean } = {
autoPass: autoPass.value
};
form.value.ext = JSON.stringify(ext);
if (form.value.id) {
await edit(form.value).finally(() => (loading.value = false));
await edit(form.value).finally(() => setLoading(false));
} else {
await add(form.value).finally(() => (loading.value = false));
await add(form.value).finally(() => setLoading(false));
activeName.value = '1';
}
modal.msgSuccess('操作成功');
modelDialog.visible = false;
closeModelDialog();
handleQuery();
}
});
@@ -659,7 +658,7 @@ const handleCopyDef = async (row: FlowDefinitionVo) => {
cancelButtonText: '取消',
type: 'warning'
} as ElMessageBoxOptions).then(() => {
loading.value = true;
setLoading(true);
copy(row.id)
.then(resp => {
if (resp.code === 200) {
@@ -668,7 +667,7 @@ const handleCopyDef = async (row: FlowDefinitionVo) => {
handleQuery();
}
})
.finally(() => (loading.value = false));
.finally(() => setLoading(false));
});
};
src/views/workflow/processInstance/index.vue
+36 -45
View File
@@ -321,6 +321,12 @@ import workflowCommon from '@/api/workflow/workflowCommon';
import { RouterJumpVo } from '@/api/workflow/workflowCommon/types';
import TreePanel from '@/components/TreePanel/index.vue';
import UserSelect from '@/components/UserSelect/index.vue';
import { useLoading } from '@/hooks/async/useLoading';
import { useDialogState } from '@/hooks/dialog/useDialogState';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import { useTreeCollapsed } from '@/hooks/tree/useTreeCollapsed';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
@@ -340,18 +346,9 @@ const form = ref<Record<string, any>>({
});
const ruleFormRef = ref<FormInstance>();
const userSelectRef = ref<InstanceType<typeof UserSelect>>();
// 遮罩层
const loading = ref(true);
// 选中数组
const ids = ref<Array<any>>([]);
// 选中实例id数组
const instanceIds = ref<Array<number | string>>([]);
// 非单个禁用
const single = ref(true);
// 非多个禁用
const multiple = ref(true);
// 显示搜索条件
const showSearch = ref(true);
const { loading, setLoading, withLoading } = useLoading(true);
const { ids: instanceIds, single, multiple, handleSelectionChange } = useTableSelection<FlowInstanceVO>(item => item.id);
const { showSearch } = useSearchToggle();
// 总条数
const total = ref(0);
// 实例id
@@ -367,12 +364,9 @@ const processDefinitionName = ref();
const processInstanceList = ref<FlowInstanceVO[]>([]);
const processDefinitionHistoryList = ref<Array<any>>([]);
const categoryOptions = ref<CategoryTreeVO[]>([]);
const treeCollapsed = ref(false);
const { treeCollapsed } = useTreeCollapsed();
const processDefinitionDialog = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
const { dialog: processDefinitionDialog } = useDialogState('流程定义');
const tab = ref('running');
// 作废原因
@@ -415,39 +409,36 @@ const handleQuery = () => {
getProcessInstanceFinishList();
}
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
queryParams.value.category = '';
queryParams.value.pageNum = 1;
queryParams.value.pageSize = 10;
queryParams.value.createByIds = [];
userSelectCount.value = 0;
handleQuery();
};
// 多选框选中数据
const handleSelectionChange = (selection: FlowInstanceVO[]) => {
ids.value = selection.map((item: any) => item.id);
instanceIds.value = selection.map((item: FlowInstanceVO) => item.id);
single.value = selection.length !== 1;
multiple.value = !selection.length;
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
pageSizeKey: 'pageSize',
initialPageSize: 10,
resetExtras: () => {
queryParams.value.category = '';
queryParams.value.createByIds = [];
userSelectCount.value = 0;
selectUserIds.value = [];
},
afterReset: () => {
handleQuery();
}
});
//分页
const getProcessInstanceRunningList = () => {
loading.value = true;
pageByRunning(queryParams.value).then(resp => {
withLoading(async () => {
const resp = await pageByRunning(queryParams.value);
processInstanceList.value = resp.data?.rows;
total.value = resp.data?.total;
loading.value = false;
});
};
//分页
const getProcessInstanceFinishList = () => {
loading.value = true;
pageByFinish(queryParams.value).then(resp => {
withLoading(async () => {
const resp = await pageByFinish(queryParams.value);
processInstanceList.value = resp.data?.rows;
total.value = resp.data?.total;
loading.value = false;
});
};
@@ -455,12 +446,12 @@ const getProcessInstanceFinishList = () => {
const handleDelete = async (row?: FlowInstanceVO) => {
const instanceIdList = row?.id ?? instanceIds.value;
await modal.confirm('是否确认删除？');
loading.value = true;
setLoading(true);
if ('running' === tab.value) {
await deleteByInstanceIds(instanceIdList).finally(() => (loading.value = false));
await deleteByInstanceIds(instanceIdList).finally(() => setLoading(false));
getProcessInstanceRunningList();
} else {
await deleteHisByInstanceIds(instanceIdList).finally(() => (loading.value = false));
await deleteHisByInstanceIds(instanceIdList).finally(() => setLoading(false));
getProcessInstanceFinishList();
}
modal.msgSuccess('删除成功');
@@ -477,13 +468,13 @@ const changeTab = async (pane: TabsPaneContext) => {
/** 作废按钮操作 */
const handleInvalid = async (row: FlowInstanceVO) => {
await modal.confirm('是否确认作废？');
loading.value = true;
setLoading(true);
if ('running' === tab.value) {
const param = {
id: row.id,
comment: deleteReason.value
};
await invalid(param).finally(() => (loading.value = false));
await invalid(param).finally(() => setLoading(false));
getProcessInstanceRunningList();
modal.msgSuccess('操作成功');
}
src/views/workflow/spel/index.vue
+41 -53
View File
@@ -210,28 +210,26 @@
<script setup name="Spel" lang="ts">
import { listSpel, getSpel, delSpel, addSpel, updateSpel } from '@/api/workflow/spel';
import { SpelVO, SpelQuery, SpelForm } from '@/api/workflow/spel/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useFormDialog } from '@/hooks/dialog/useFormDialog';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
const { sys_show_hide, sys_normal_disable } = toRefs<any>(useDict('sys_show_hide', 'sys_normal_disable'));
const spelList = ref<SpelVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { loading: buttonLoading, withLoading: withButtonLoading } = useLoading();
const { showSearch } = useSearchToggle();
const { ids, single, multiple, handleSelectionChange } = useTableSelection<SpelVO>(item => item.id);
const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const spelFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: SpelForm = {
id: undefined,
componentName: undefined,
@@ -259,26 +257,33 @@ const data = reactive<PageData<SpelForm, SpelQuery>>({
});
const { queryParams, form, rules } = toRefs(data);
const { dialog, resetForm, openDialog, showDialog, closeDialog } = useFormDialog({
form,
formRef: spelFormRef,
initialFormData: initFormData
});
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
afterReset: () => {
handleQuery();
}
});
/** 查询流程spel表达式定义列表 */
const getList = async () => {
loading.value = true;
const res = await listSpel(queryParams.value);
spelList.value = res.data?.rows;
total.value = res.data?.total;
loading.value = false;
await withLoading(async () => {
const res = await listSpel(queryParams.value);
spelList.value = res.data?.rows;
total.value = res.data?.total;
});
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
spelFormRef.value?.resetFields();
closeDialog();
resetForm();
};
/** 搜索按钮操作 */
@@ -287,48 +292,33 @@ const handleQuery = () => {
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: SpelVO[]) => {
ids.value = selection.map(item => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加流程spel表达式定义';
openDialog('添加流程spel表达式定义');
};
/** 修改按钮操作 */
const handleUpdate = async (row?: SpelVO) => {
reset();
resetForm();
const _id = row?.id || ids.value[0];
const res = await getSpel(_id);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = '修改流程spel表达式定义';
showDialog('修改流程spel表达式定义');
};
/** 提交按钮 */
const submitForm = () => {
spelFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
await updateSpel(form.value).finally(() => (buttonLoading.value = false));
} else {
await addSpel(form.value).finally(() => (buttonLoading.value = false));
}
await withButtonLoading(async () => {
if (form.value.id) {
await updateSpel(form.value);
} else {
await addSpel(form.value);
}
});
modal.msgSuccess('操作成功');
dialog.visible = false;
closeDialog();
await getList();
}
});
@@ -337,9 +327,7 @@ const submitForm = () => {
/** 删除按钮操作 */
const handleDelete = async (row?: SpelVO) => {
const _ids = row?.id || ids.value;
await modal
.confirm('是否确认删除流程spel表达式定义编号为"' + _ids + '"的数据项？')
.finally(() => (loading.value = false));
await modal.confirm('是否确认删除流程spel表达式定义编号为"' + _ids + '"的数据项？');
await delSpel(_ids);
modal.msgSuccess('删除成功');
await getList();
src/views/workflow/task/allTaskWaiting.vue
+27 -34
View File
@@ -172,13 +172,17 @@
import { TabsPaneContext } from 'element-plus';
import { UserVO } from '@/api/system/user/types';
import { pageByAllTaskWait, pageByAllTaskFinish, updateAssignee, urgeTask } from '@/api/workflow/task';
import { TaskQuery } from '@/api/workflow/task/types';
import { TaskQuery, FlowTaskVO } from '@/api/workflow/task/types';
import workflowCommon from '@/api/workflow/workflowCommon';
import { RouterJumpVo } from '@/api/workflow/workflowCommon/types';
import messageType from '@/components/Process/MessageType.vue';
import processMeddle from '@/components/Process/processMeddle.vue';
import UserNameDisplay from '@/components/Process/UserNameDisplay.vue';
import UserSelect from '@/components/UserSelect/index.vue';
import { useLoading } from '@/hooks/async/useLoading';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
@@ -193,17 +197,10 @@ const messageTypeRef = ref<InstanceType<typeof messageType>>();
const queryFormRef = ref<ElFormInstance>();
const { wf_business_status } = toRefs<any>(useDict('wf_business_status'));
const { wf_task_status } = toRefs<any>(useDict('wf_task_status'));
// 遮罩层
const loading = ref(true);
// 选中数组
const ids = ref<Array<any>>([]);
// 非单个禁用
const single = ref(true);
// 非多个禁用
const multiple = ref(true);
const { loading, withLoading } = useLoading(true);
const { ids, single, multiple, handleSelectionChange } = useTableSelection<FlowTaskVO, string>(item => String(item.id));
const userMultiple = ref(false);
// 显示搜索条件
const showSearch = ref(true);
const { showSearch } = useSearchToggle();
// 总条数
const total = ref(0);
// 模型定义表格数据
@@ -223,6 +220,21 @@ const queryParams = ref<TaskQuery>({
createByIds: []
});
const tab = ref('waiting');
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
pageSizeKey: 'pageSize',
initialPageSize: 10,
resetExtras: () => {
queryParams.value.createByIds = [];
userSelectCount.value = 0;
selectUserIds.value = [];
},
afterReset: () => {
handleQuery();
}
});
/** 搜索按钮操作 */
const handleQuery = () => {
@@ -232,22 +244,6 @@ const handleQuery = () => {
getFinishList();
}
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
queryParams.value.pageNum = 1;
queryParams.value.pageSize = 10;
queryParams.value.createByIds = [];
userSelectCount.value = 0;
selectUserIds.value = [];
handleQuery();
};
// 多选框选中数据
const handleSelectionChange = (selection: any) => {
ids.value = selection.map((item: any) => item.id);
single.value = selection.length !== 1;
multiple.value = !selection.length;
};
const changeTab = async (data: TabsPaneContext) => {
taskList.value = [];
queryParams.value.pageNum = 1;
@@ -259,19 +255,17 @@ const changeTab = async (data: TabsPaneContext) => {
};
//分页
const getWaitingList = () => {
loading.value = true;
pageByAllTaskWait(queryParams.value).then(resp => {
withLoading(async () => {
const resp = await pageByAllTaskWait(queryParams.value);
taskList.value = resp.data?.rows;
total.value = resp.data?.total;
loading.value = false;
});
};
const getFinishList = () => {
loading.value = true;
pageByAllTaskFinish(queryParams.value).then(resp => {
withLoading(async () => {
const resp = await pageByAllTaskFinish(queryParams.value);
taskList.value = resp.data?.rows;
total.value = resp.data?.total;
loading.value = false;
});
};
// 打开催办
@@ -296,7 +290,6 @@ const handleUserTask = async data => {
const submitCallback = async data => {
if (data && data.length > 0) {
await modal.confirm('是否确认提交？');
loading.value = true;
await updateAssignee(ids.value, data[0].userId);
handleQuery();
modal.msgSuccess('操作成功');
src/views/workflow/task/myDocument.vue
+28 -34
View File
@@ -156,30 +156,27 @@ import { FlowInstanceQuery, FlowInstanceVO } from '@/api/workflow/instance/types
import workflowCommon from '@/api/workflow/workflowCommon';
import { RouterJumpVo } from '@/api/workflow/workflowCommon/types';
import TreePanel from '@/components/TreePanel/index.vue';
import { useLoading } from '@/hooks/async/useLoading';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import { useTreeCollapsed } from '@/hooks/tree/useTreeCollapsed';
import modal from '@/plugins/modal';
import { useDict } from '@/utils/dict';
const { wf_business_status } = toRefs<any>(useDict('wf_business_status'));
const queryFormRef = ref<ElFormInstance>();
// 遮罩层
const loading = ref(true);
// 选中数组
const businessIds = ref<Array<number | string>>([]);
const instanceIds = ref<Array<number | string>>([]);
// 非单个禁用
const single = ref(true);
// 非多个禁用
const multiple = ref(true);
// 显示搜索条件
const showSearch = ref(true);
const { loading, setLoading, withLoading } = useLoading(true);
const { ids: instanceIds, single, multiple, handleSelectionChange } = useTableSelection<FlowInstanceVO>(item => item.id);
const { showSearch } = useSearchToggle();
// 总条数
const total = ref(0);
// 模型定义表格数据
const processInstanceList = ref<FlowInstanceVO[]>([]);
const categoryOptions = ref<CategoryTreeVO[]>([]);
const treeCollapsed = ref(false);
const { treeCollapsed } = useTreeCollapsed();
const tab = ref('running');
// 查询参数
@@ -213,28 +210,25 @@ const getTreeselect = async () => {
const handleQuery = () => {
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
queryParams.value.category = '';
queryParams.value.pageNum = 1;
queryParams.value.pageSize = 10;
handleQuery();
};
// 多选框选中数据
const handleSelectionChange = (selection: FlowInstanceVO[]) => {
businessIds.value = selection.map((item: any) => item.businessId);
instanceIds.value = selection.map((item: FlowInstanceVO) => item.id);
single.value = selection.length !== 1;
multiple.value = !selection.length;
};
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
pageSizeKey: 'pageSize',
initialPageSize: 10,
resetExtras: () => {
queryParams.value.category = '';
},
afterReset: () => {
handleQuery();
}
});
//分页
const getList = () => {
loading.value = true;
pageByCurrent(queryParams.value).then(resp => {
withLoading(async () => {
const resp = await pageByCurrent(queryParams.value);
processInstanceList.value = resp.data?.rows;
total.value = resp.data?.total;
loading.value = false;
});
};
@@ -242,9 +236,9 @@ const getList = () => {
const handleDelete = async (row: FlowInstanceVO) => {
const instanceIdList = row.id || instanceIds.value;
await modal.confirm('是否确认删除？');
loading.value = true;
setLoading(true);
if ('running' === tab.value) {
await deleteByInstanceIds(instanceIdList).finally(() => (loading.value = false));
await deleteByInstanceIds(instanceIdList).finally(() => setLoading(false));
getList();
}
modal.msgSuccess('删除成功');
@@ -253,13 +247,13 @@ const handleDelete = async (row: FlowInstanceVO) => {
/** 撤销按钮操作 */
const handleCancelProcessApply = async (businessId: string) => {
await modal.confirm('是否确认撤销当前单据？');
loading.value = true;
setLoading(true);
if ('running' === tab.value) {
const data = {
businessId: businessId,
message: '申请人撤销流程！'
};
await cancelProcessApply(data).finally(() => (loading.value = false));
await cancelProcessApply(data).finally(() => setLoading(false));
getList();
}
modal.msgSuccess('撤销成功');
src/views/workflow/task/taskCopyList.vue
+19 -26
View File
@@ -97,20 +97,17 @@ import { pageByTaskCopy } from '@/api/workflow/task';
import { TaskQuery } from '@/api/workflow/task/types';
import workflowCommon from '@/api/workflow/workflowCommon';
import { RouterJumpVo } from '@/api/workflow/workflowCommon/types';
import { useLoading } from '@/hooks/async/useLoading';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import { useDict } from '@/utils/dict';
const queryFormRef = ref<ElFormInstance>();
const { wf_business_status } = toRefs<any>(useDict('wf_business_status'));
// 遮罩层
const loading = ref(true);
// 选中数组
const ids = ref<Array<any>>([]);
// 非单个禁用
const single = ref(true);
// 非多个禁用
const multiple = ref(true);
// 显示搜索条件
const showSearch = ref(true);
const { loading, withLoading } = useLoading(true);
const { ids, single, multiple, handleSelectionChange } = useTableSelection<any>(item => item.id);
const { showSearch } = useSearchToggle();
// 总条数
const total = ref(0);
// 模型定义表格数据
@@ -123,30 +120,26 @@ const queryParams = ref<TaskQuery>({
flowName: undefined,
flowCode: undefined
});
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
pageSizeKey: 'pageSize',
initialPageSize: 10,
afterReset: () => {
handleQuery();
}
});
/** 搜索按钮操作 */
const handleQuery = () => {
getTaskCopyList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
queryParams.value.pageNum = 1;
queryParams.value.pageSize = 10;
handleQuery();
};
// 多选框选中数据
const handleSelectionChange = (selection: any) => {
ids.value = selection.map((item: any) => item.id);
single.value = selection.length !== 1;
multiple.value = !selection.length;
};
//分页
const getTaskCopyList = () => {
loading.value = true;
pageByTaskCopy(queryParams.value).then(resp => {
withLoading(async () => {
const resp = await pageByTaskCopy(queryParams.value);
taskList.value = resp.data?.rows;
total.value = resp.data?.total;
loading.value = false;
});
};
src/views/workflow/task/taskFinish.vue
+24 -29
View File
@@ -135,6 +135,10 @@ import workflowCommon from '@/api/workflow/workflowCommon';
import { RouterJumpVo } from '@/api/workflow/workflowCommon/types';
import UserNameDisplay from '@/components/Process/UserNameDisplay.vue';
import UserSelect from '@/components/UserSelect/index.vue';
import { useLoading } from '@/hooks/async/useLoading';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import { useDict } from '@/utils/dict';
const { wf_business_status } = toRefs<any>(useDict('wf_business_status'));
@@ -143,16 +147,9 @@ const { wf_task_status } = toRefs<any>(useDict('wf_task_status'));
const queryFormRef = ref<ElFormInstance>();
const userSelectRef = ref<InstanceType<typeof UserSelect>>();
// 遮罩层
const loading = ref(true);
// 选中数组
const ids = ref<Array<any>>([]);
// 非单个禁用
const single = ref(true);
// 非多个禁用
const multiple = ref(true);
// 显示搜索条件
const showSearch = ref(true);
const { loading, withLoading } = useLoading(true);
const { ids, single, multiple, handleSelectionChange } = useTableSelection<any>(item => item.id);
const { showSearch } = useSearchToggle();
// 总条数
const total = ref(0);
// 模型定义表格数据
@@ -170,32 +167,30 @@ const queryParams = ref<TaskQuery>({
const selectUserIds = ref<Array<number | string>>([]);
//申请人选择数量
const userSelectCount = ref(0);
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
pageSizeKey: 'pageSize',
initialPageSize: 10,
resetExtras: () => {
queryParams.value.createByIds = [];
userSelectCount.value = 0;
selectUserIds.value = [];
},
afterReset: () => {
handleQuery();
}
});
/** 搜索按钮操作 */
const handleQuery = () => {
getFinishList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
queryParams.value.pageNum = 1;
queryParams.value.pageSize = 10;
queryParams.value.createByIds = [];
userSelectCount.value = 0;
selectUserIds.value = [];
handleQuery();
};
// 多选框选中数据
const handleSelectionChange = (selection: any) => {
ids.value = selection.map((item: any) => item.id);
single.value = selection.length !== 1;
multiple.value = !selection.length;
};
const getFinishList = () => {
loading.value = true;
pageByTaskFinish(queryParams.value).then(resp => {
withLoading(async () => {
const resp = await pageByTaskFinish(queryParams.value);
taskList.value = resp.data?.rows;
total.value = resp.data?.total;
loading.value = false;
});
};
/** 查看按钮操作 */
src/views/workflow/task/taskWaiting.vue
+24 -29
View File
@@ -116,6 +116,10 @@ import workflowCommon from '@/api/workflow/workflowCommon';
import { RouterJumpVo } from '@/api/workflow/workflowCommon/types';
import UserNameDisplay from '@/components/Process/UserNameDisplay.vue';
import UserSelect from '@/components/UserSelect/index.vue';
import { useLoading } from '@/hooks/async/useLoading';
import { useSearchReset } from '@/hooks/form/useSearchReset';
import { useSearchToggle } from '@/hooks/form/useSearchToggle';
import { useTableSelection } from '@/hooks/table/useTableSelection';
import { useDict } from '@/utils/dict';
const { wf_business_status } = toRefs<any>(useDict('wf_business_status'));
@@ -123,16 +127,9 @@ const { wf_business_status } = toRefs<any>(useDict('wf_business_status'));
const userSelectRef = ref<InstanceType<typeof UserSelect>>();
//提交组件
const queryFormRef = ref<ElFormInstance>();
// 遮罩层
const loading = ref(true);
// 选中数组
const ids = ref<Array<any>>([]);
// 非单个禁用
const single = ref(true);
// 非多个禁用
const multiple = ref(true);
// 显示搜索条件
const showSearch = ref(true);
const { loading, withLoading } = useLoading(true);
const { ids, single, multiple, handleSelectionChange } = useTableSelection<any>(item => item.id);
const { showSearch } = useSearchToggle();
// 总条数
const total = ref(0);
// 模型定义表格数据
@@ -151,6 +148,21 @@ const queryParams = ref<TaskQuery>({
flowCode: undefined,
createByIds: []
});
const { resetQuery } = useSearchReset({
queryFormRef,
queryParams,
pageNumKey: 'pageNum',
pageSizeKey: 'pageSize',
initialPageSize: 10,
resetExtras: () => {
queryParams.value.createByIds = [];
userSelectCount.value = 0;
selectUserIds.value = [];
},
afterReset: () => {
handleQuery();
}
});
onMounted(() => {
getWaitingList();
});
@@ -158,29 +170,12 @@ onMounted(() => {
const handleQuery = () => {
getWaitingList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
queryParams.value.pageNum = 1;
queryParams.value.pageSize = 10;
queryParams.value.createByIds = [];
userSelectCount.value = 0;
selectUserIds.value = [];
handleQuery();
};
// 多选框选中数据
const handleSelectionChange = (selection: any) => {
ids.value = selection.map((item: any) => item.id);
single.value = selection.length !== 1;
multiple.value = !selection.length;
};
//分页
const getWaitingList = () => {
loading.value = true;
pageByTaskWait(queryParams.value).then(resp => {
withLoading(async () => {
const resp = await pageByTaskWait(queryParams.value);
taskList.value = resp.data?.rows;
total.value = resp.data?.total;
loading.value = false;
});
};
//办理