reactor：【system 系统管理】area、dept、dict、loginlog 进一步统一代码风格

apps/web-antd/src/views/system/area/index.vue

@@ -15,7 +15,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -60,7 +60,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
       <DocAlert title="地区 & IP" url="https://doc.iocoder.cn/area-and-ip/" />
     </template>
 
-    <FormModal @success="onRefresh" />
+    <FormModal @success="handleRefresh" />
     <Grid table-title="地区列表">
       <template #toolbar-tools>
         <TableAction

apps/web-antd/src/views/system/dept/index.vue

@@ -32,13 +32,13 @@ function getLeaderName(userId: number) {
 
 /** 切换树形展开/收缩状态 */
 const isExpanded = ref(true);
-function toggleExpand() {
+function handleExpand() {
   isExpanded.value = !isExpanded.value;
   gridApi.grid.setAllTreeExpand(isExpanded.value);
 }
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -66,7 +66,7 @@ async function handleDelete(row: SystemDeptApi.Dept) {
   try {
     await deleteDept(row.id as number);
     message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
-    onRefresh();
+    handleRefresh();
   } finally {
     hideLoading();
   }
@@ -83,7 +83,7 @@ async function handleDeleteBatch() {
     await deleteDeptList(checkedIds.value);
     checkedIds.value = [];
     message.success($t('ui.actionMessage.deleteSuccess'));
-    onRefresh();
+    handleRefresh();
   } finally {
     hideLoading();
   }
@@ -142,7 +142,7 @@ onMounted(async () => {
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="onRefresh" />
+    <FormModal @success="handleRefresh" />
     <Grid table-title="部门列表">
       <template #toolbar-tools>
         <TableAction
@@ -157,7 +157,7 @@ onMounted(async () => {
             {
               label: isExpanded ? '收缩' : '展开',
               type: 'primary',
-              onClick: toggleExpand,
+              onClick: handleExpand,
             },
             {
               label: '批量删除',

apps/web-antd/src/views/system/dict/modules/data-grid.vue

@@ -34,7 +34,7 @@ const [DataFormModal, dataFormModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -61,9 +61,9 @@ async function handleDelete(row: SystemDictDataApi.DictData) {
     duration: 0,
   });
   try {
-    await deleteDictData(row.id);
+    await deleteDictData(row.id!);
     message.success($t('ui.actionMessage.deleteSuccess', [row.label]));
-    onRefresh();
+    handleRefresh();
   } finally {
     hideLoading();
   }
@@ -80,7 +80,7 @@ async function handleDeleteBatch() {
     await deleteDictDataList(checkedIds.value);
     checkedIds.value = [];
     message.success($t('ui.actionMessage.deleteSuccess'));
-    onRefresh();
+    handleRefresh();
   } finally {
     hideLoading();
   }
@@ -135,7 +135,7 @@ watch(
   () => props.dictType,
   () => {
     if (props.dictType) {
-      onRefresh();
+      handleRefresh();
     }
   },
 );
@@ -143,7 +143,7 @@ watch(
 
 <template>
   <div class="flex h-full flex-col">
-    <DataFormModal @success="onRefresh" />
+    <DataFormModal @success="handleRefresh" />
 
     <Grid table-title="字典数据列表">
       <template #toolbar-tools>

apps/web-antd/src/views/system/dict/modules/type-grid.vue

@@ -32,7 +32,7 @@ const [TypeFormModal, typeFormModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -59,9 +59,9 @@ async function handleDelete(row: SystemDictTypeApi.DictType) {
     duration: 0,
   });
   try {
-    await deleteDictType(row.id);
+    await deleteDictType(row.id!);
     message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
-    onRefresh();
+    handleRefresh();
   } finally {
     hideLoading();
   }
@@ -78,7 +78,7 @@ async function handleDeleteBatch() {
     await deleteDictTypeList(checkedIds.value);
     checkedIds.value = [];
     message.success($t('ui.actionMessage.deleteSuccess'));
-    onRefresh();
+    handleRefresh();
   } finally {
     hideLoading();
   }
@@ -134,7 +134,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <div class="h-full">
-    <TypeFormModal @success="onRefresh" />
+    <TypeFormModal @success="handleRefresh" />
     <Grid table-title="字典类型列表">
       <template #toolbar-tools>
         <TableAction

apps/web-antd/src/views/system/loginlog/data.ts

@@ -49,10 +49,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'id',
       title: '日志编号',
+      minWidth: 100,
     },
     {
       field: 'logType',
       title: '操作类型',
+      minWidth: 120,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.SYSTEM_LOGIN_TYPE },
@@ -61,18 +63,22 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'username',
       title: '用户名称',
+      minWidth: 180,
     },
     {
       field: 'userIp',
       title: '登录地址',
+      minWidth: 180,
     },
     {
       field: 'userAgent',
       title: '浏览器',
+      minWidth: 200,
     },
     {
       field: 'result',
       title: '登录结果',
+      minWidth: 120,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.SYSTEM_LOGIN_RESULT },
@@ -81,11 +87,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'createTime',
       title: '登录日期',
+      minWidth: 180,
       formatter: 'formatDateTime',
     },
     {
       title: '操作',
-      width: 80,
+      width: 120,
       fixed: 'right',
       slots: { default: 'actions' },
     },

apps/web-antd/src/views/system/loginlog/index.vue

@@ -18,7 +18,7 @@ const [DetailModal, detailModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -54,6 +54,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,
@@ -69,7 +70,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
       <DocAlert title="系统日志" url="https://doc.iocoder.cn/system-log/" />
     </template>
 
-    <DetailModal @success="onRefresh" />
+    <DetailModal @success="handleRefresh" />
     <Grid table-title="登录日志列表">
       <template #toolbar-tools>
         <TableAction

apps/web-antd/src/views/system/notice/index.vue

@@ -27,7 +27,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function onRefresh() {
+function handleRefresh() {
   gridApi.query();
 }
 
@@ -50,7 +50,7 @@ async function handleDelete(row: SystemNoticeApi.Notice) {
   try {
     await deleteNotice(row.id as number);
     message.success($t('ui.actionMessage.deleteSuccess', [row.title]));
-    onRefresh();
+    handleRefresh();
   } finally {
     hideLoading();
   }
@@ -67,7 +67,7 @@ async function handleDeleteBatch() {
     await deleteNoticeList(checkedIds.value);
     checkedIds.value = [];
     message.success($t('ui.actionMessage.deleteSuccess'));
-    onRefresh();
+    handleRefresh();
   } finally {
     hideLoading();
   }
@@ -132,7 +132,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="onRefresh" />
+    <FormModal @success="handleRefresh" />
     <Grid table-title="公告列表">
       <template #toolbar-tools>
         <TableAction