feat: 服务监控页面

buqiyuan · Dec 19, 2021 · b2bbfad · b2bbfad
1 parent 96489b1
commit b2bbfad
Show file tree

Hide file tree

Showing 25 changed files with 1,088 additions and 713 deletions.
diff --git a/README.md b/README.md
@@ -11,6 +11,7 @@
 - [react 版 coding](https://github.com/buqiyuan/react-antd-admin)
 - [vite 版](https://github.com/buqiyuan/vite-vue3-admin)
 - [gitee 地址](https://gitee.com/buqiyuan/vue3-antd-admin)
+- 根据 JSON 生成 typescript 的工具：[http://json2ts.com/](http://json2ts.com/)
 
 ## vscode 配置
 
@@ -30,23 +31,27 @@
 - [ ] 纯前端导出 PDF 自动分页
 - [ ] 其他...
 
-## Project setup
+### Project setup
 
 ```shell
 yarn install
 # 或
 yarn --frozen-lockfile
 ```
 
-## 赞赏
+### 赞赏
 
 如果你觉得这个项目对你有帮助，你可以帮作者买一杯咖啡表示支持!
 
 | 微信 | 支付宝 |
 | :-: | :-: |
 | ![donate](http://buqiyuan.gitee.io/images/weixin.jpg) | ![donate](http://buqiyuan.gitee.io/images/zhifubao.jpg) |
 
-## 感谢 JetBrains 免费的开源授权
+### 致谢
+
+- [sf-vue-admin](https://github.com/hackycy/sf-vue-admin)
+
+### 感谢 JetBrains 免费的开源授权
 
 <a href="https://www.jetbrains.com/?from=Mybatis-PageHelper" target="_blank">
 <img src="https://user-images.githubusercontent.com/1787798/69898077-4f4e3d00-138f-11ea-81f9-96fb7c49da89.png" height="200"/></a>
diff --git a/src/api/system/dept/model.d.ts b/src/api/system/dept/model.d.ts
@@ -7,7 +7,7 @@ declare namespace API {
     parentId: number;
     name: string;
     orderNum: number;
-    pIds?: number[];
+    keyPath?: number[];
   };
   /** 部门 */
   type MovedDeptItem = {

diff --git a/src/api/system/menu/model.d.ts b/src/api/system/menu/model.d.ts
@@ -13,7 +13,7 @@ declare namespace API {
     viewPath: string;
     keepalive: boolean;
     isShow: boolean;
-    pIds?: number[];
+    keyPath?: number[];
   };
 
   /** 获取菜单列表参数 */

diff --git a/src/api/system/serve/index.ts b/src/api/system/serve/index.ts
@@ -0,0 +1,9 @@
+import { request } from '@/utils/request';
+import ServeApi from '@/core/permission/modules/sys/serve';
+
+export function getServeStat() {
+  return request<API.SysServeStat>({
+    url: ServeApi.stat,
+    method: 'get',
+  });
+}
diff --git a/src/api/system/serve/model.d.ts b/src/api/system/serve/model.d.ts
@@ -0,0 +1,42 @@
+declare namespace API {
+  export interface Runtime {
+    os: string;
+    arch: string;
+    nodeVersion: string;
+    npmVersion: string;
+  }
+
+  export interface CoresLoad {
+    rawLoad: number;
+    rawLoadIdle: number;
+  }
+
+  export interface Cpu {
+    manufacturer: string;
+    brand: string;
+    physicalCores: number;
+    model: string;
+    speed: number;
+    rawCurrentLoad: number;
+    rawCurrentLoadIdle: number;
+    coresLoad: CoresLoad[];
+  }
+
+  export interface Disk {
+    size: number;
+    used: number;
+    available: number;
+  }
+
+  export interface Memory {
+    total: number;
+    available: number;
+  }
+
+  export interface SysServeStat {
+    runtime: Runtime;
+    cpu: Cpu;
+    disk: Disk;
+    memory: Memory;
+  }
+}
diff --git a/src/api/system/user/model.d.ts b/src/api/system/user/model.d.ts
@@ -14,6 +14,7 @@ declare namespace API {
     username: string;
     departmentName: string;
     roleNames: string[];
+    keyPath?: number[];
   };
 
   /** 获取用户列表结果 */

diff --git a/src/api/typings.d.ts b/src/api/typings.d.ts
@@ -3,102 +3,102 @@
 
 declare namespace API {
   type CurrentUser = {
-    name?: string
-    avatar?: string
-    userid?: string
-    email?: string
-    signature?: string
-    title?: string
-    group?: string
-    tags?: { key?: string; label?: string }[]
-    notifyCount?: number
-    unreadCount?: number
-    country?: string
-    access?: string
+    name?: string;
+    avatar?: string;
+    userid?: string;
+    email?: string;
+    signature?: string;
+    title?: string;
+    group?: string;
+    tags?: { key?: string; label?: string }[];
+    notifyCount?: number;
+    unreadCount?: number;
+    country?: string;
+    access?: string;
     geographic?: {
-      province?: { label?: string; key?: string }
-      city?: { label?: string; key?: string }
-    }
-    address?: string
-    phone?: string
-  }
+      province?: { label?: string; key?: string };
+      city?: { label?: string; key?: string };
+    };
+    address?: string;
+    phone?: string;
+  };
 
   /** 全局通过表格查询返回结果 */
   type TableListResult<T = any> = {
-    list: T
-    pagination: PaginationResult
-  }
+    list: T;
+    pagination?: PaginationResult;
+  };
 
   /** 全局通用表格分页返回数据结构 */
   type PaginationResult = {
-    page: number
-    size: number
-    total: number
-  }
+    page: number;
+    size: number;
+    total: number;
+  };
 
   /** 全局通用表格分页请求参数 */
   type PageParams<T = any> = {
-    limit?: number
-    page?: number
+    limit?: number;
+    page?: number;
   } & {
-    [P in keyof T]?: T[P]
-  }
+    [P in keyof T]?: T[P];
+  };
 
   type RuleListItem = {
-    key?: number
-    disabled?: boolean
-    href?: string
-    avatar?: string
-    name?: string
-    owner?: string
-    desc?: string
-    callNo?: number
-    status?: number
-    updatedAt?: string
-    createdAt?: string
-    progress?: number
-  }
+    key?: number;
+    disabled?: boolean;
+    href?: string;
+    avatar?: string;
+    name?: string;
+    owner?: string;
+    desc?: string;
+    callNo?: number;
+    status?: number;
+    updatedAt?: string;
+    createdAt?: string;
+    progress?: number;
+  };
 
   type RuleList = {
-    data?: RuleListItem[]
+    data?: RuleListItem[];
     /** 列表的内容总数 */
-    total?: number
-    success?: boolean
-  }
+    total?: number;
+    success?: boolean;
+  };
 
   type FakeCaptcha = {
-    code?: number
-    status?: string
-  }
+    code?: number;
+    status?: string;
+  };
 
   type ErrorResponse = {
     /** 业务约定的错误码 */
-    errorCode: string
+    errorCode: string;
     /** 业务上的错误信息 */
-    errorMessage?: string
+    errorMessage?: string;
     /** 业务上的请求是否成功 */
-    success?: boolean
-  }
+    success?: boolean;
+  };
 
   type NoticeIconList = {
-    data?: NoticeIconItem[]
+    data?: NoticeIconItem[];
     /** 列表的内容总数 */
-    total?: number
-    success?: boolean
-  }
+    total?: number;
+    success?: boolean;
+  };
 
-  type NoticeIconItemType = 'notification' | 'message' | 'event'
+  type NoticeIconItemType = 'notification' | 'message' | 'event';
 
   type NoticeIconItem = {
-    id?: string
-    extra?: string
-    key?: string
-    read?: boolean
-    avatar?: string
-    title?: string
-    status?: string
-    datetime?: string
-    description?: string
-    type?: NoticeIconItemType
-  }
+    id?: string;
+    extra?: string;
+    key?: string;
+    read?: boolean;
+    avatar?: string;
+    title?: string;
+    status?: string;
+    datetime?: string;
+    description?: string;
+    type?: NoticeIconItemType;
+  };
 }
diff --git a/src/components/JSON-schema-form/schema-form-item.vue b/src/components/JSON-schema-form/schema-form-item.vue
@@ -14,9 +14,9 @@
         :is="getComponent"
         :ref="setItemRef"
         :key="schemaItem.field"
-        v-model:[modelValueType]="modelValue[schemaItem.field]"
         v-bind="getComponentProps"
         v-on="componentEvents"
+        v-model:[modelValueType]="modelValue[schemaItem.field]"
       />
     </Form.Item>
   </Col>
@@ -29,7 +29,7 @@
   import type { ValidationRule } from 'ant-design-vue/lib/form/Form';
   import { componentMap, ComponentMapType } from './componentMap';
   import { FormItemSchema, FormSchema } from './types/form';
-  import { isFunction, isNull, isString, isObject } from '@/utils/is';
+  import { isFunction, isNull, isString } from '@/utils/is';
   import { useVModel } from '@vueuse/core';
   import { useItemLabelWidth } from './hooks/useLabelWidth';
   import cloneDeep from 'lodash/cloneDeep';
@@ -61,9 +61,11 @@
     },
   });
 
+  const emit = defineEmits(['update:formModel']);
+
   // const currentInstance = getCurrentInstance();
 
-  const modelValue = useVModel(props, 'formModel');
+  const modelValue = useVModel(props, 'formModel', emit);
 
   const { schemaItem, schema } = toRefs(props) as {
     schemaItem: Ref<FormItemSchema>;
@@ -79,8 +81,8 @@
 
   const modelValueType = computed(() => {
     const { component, componentProps } = schemaItem.value;
-    if (isObject(componentProps) && isString(componentProps?.vModelKey)) {
-      return componentProps?.vModelKey;
+    if (typeof componentProps !== 'function' && componentProps?.vModelKey) {
+      return componentProps.vModelKey;
     }
     const isCheck = isString(component) && ['Switch', 'Checkbox'].includes(component);
     return isCheck ? 'checked' : 'value';
@@ -170,10 +172,10 @@
   });
 
   const getComponentsProps = computed(() => {
-    const { schemaItem, tableAction, formModel, formActionType } = props;
+    const { schemaItem, formModel } = props;
     let { componentProps = {} } = schemaItem;
     if (isFunction(componentProps)) {
-      componentProps = componentProps({ schemaItem, tableAction, formModel, formActionType }) ?? {};
+      componentProps = componentProps({ schemaItem, formModel }) ?? {};
     }
     return componentProps as Recordable;
   });

diff --git a/src/components/dynamic-table/components/query-form/index.vue b/src/components/dynamic-table/components/query-form/index.vue
@@ -112,8 +112,9 @@
         return 24 - remainder;
       };
 
-      const reset = () => {
+      const reset = async () => {
         dynamicFormRef.value?.resetFields();
+        await query();
       };
       const query = async () => {
         const formModel = await dynamicFormRef.value?.validate();

diff --git a/src/components/dynamic-table/components/table-settings/column-setting.vue b/src/components/dynamic-table/components/table-settings/column-setting.vue
@@ -85,7 +85,7 @@
   const defaultShowIndex = !!table.showIndex;
   const defaultBordered = table.bordered;
 
-  const tableColumns = ref<TableColumn[]>([]);
+  const tableColumns = ref<TableColumn<any>[]>([]);
 
   const checkAll = computed<boolean>({
     get() {
@@ -129,7 +129,7 @@
     table.setProps({ bordered: e.target.checked });
   };
 
-  const handleColumnFixed = (columItem: TableColumn, direction: 'left' | 'right') => {
+  const handleColumnFixed = (columItem: TableColumn<any>, direction: 'left' | 'right') => {
     columItem.fixed = columItem.fixed === direction ? false : direction;
   };
 

diff --git a/src/components/dynamic-table/hooks/usePagination.ts b/src/components/dynamic-table/hooks/usePagination.ts
@@ -13,7 +13,7 @@ export function usePagination(pageOption: Pagination) {
       current: 1,
       pageSize: 10,
       total: 0,
-      pageSizeOptions: ['10', '20', '30', '40', '50'],
+      pageSizeOptions: ['10', '20', '50', '100'],
       showQuickJumper: true,
       showSizeChanger: true, // 显示可改变每页数量
       showTotal: (total) => `共 ${total} 条`, // 显示总数

diff --git a/src/components/dynamic-table/hooks/useTableContext.ts b/src/components/dynamic-table/hooks/useTableContext.ts
@@ -6,6 +6,7 @@ type DynamicTableInstance = {
 } & {
   setProps(props: Partial<TableProps>): () => any;
   getProps: TableProps;
+  refreshTable: (...rest: any[]) => any;
 };
 
 const key = Symbol('dynamic-table');