增加差异日志详情

Admin.NET/Admin.NET.Core/Service/Logging/SysLogDiffService.cs

@@ -34,6 +34,17 @@ public class SysLogDiffService : IDynamicApiController, ITransient
             .ToPagedListAsync(input.Page, input.PageSize);
     }
 
+    /// <summary>
+    /// 获取差异日志详情 🔖
+    /// </summary>
+    /// <returns></returns>
+    [SuppressMonitor]
+    [DisplayName("获取差异日志详情")]
+    public async Task<SysLogDiff> GetDetail(long id)
+    {
+        return await _sysLogDiffRep.GetFirstAsync(u => u.Id == id);
+    }
+
     /// <summary>
     /// 清空差异日志 🔖
     /// </summary>

Web/src/api-services/apis/sys-log-diff-api.ts

@@ -18,6 +18,7 @@ import { Configuration } from '../configuration';
 // @ts-ignore
 import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
 import { AdminResultSqlSugarPagedListSysLogDiff } from '../models';
+import { AdminResultSysLogDiff } from '../models';
 import { PageLogInput } from '../models';
 /**
  * SysLogDiffApi - axios parameter creator
@@ -68,6 +69,55 @@ export const SysLogDiffApiAxiosParamCreator = function (configuration?: Configur
                 options: localVarRequestOptions,
             };
         },
+        /**
+         * 
+         * @summary 获取差异日志详情 🔖
+         * @param {number} id 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        apiSysLogDiffDetailIdGet: async (id: number, options: AxiosRequestConfig = {}): Promise<RequestArgs> => {
+            // verify required parameter 'id' is not null or undefined
+            if (id === null || id === undefined) {
+                throw new RequiredError('id','Required parameter id was null or undefined when calling apiSysLogDiffDetailIdGet.');
+            }
+            const localVarPath = `/api/sysLogDiff/detail/{id}`
+                .replace(`{${"id"}}`, encodeURIComponent(String(id)));
+            // use dummy base URL string because the URL constructor only accepts absolute URLs.
+            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
+            let baseOptions;
+            if (configuration) {
+                baseOptions = configuration.baseOptions;
+            }
+            const localVarRequestOptions :AxiosRequestConfig = { method: 'GET', ...baseOptions, ...options};
+            const localVarHeaderParameter = {} as any;
+            const localVarQueryParameter = {} as any;
+
+            // authentication Bearer required
+            // http bearer authentication required
+            if (configuration && configuration.accessToken) {
+                const accessToken = typeof configuration.accessToken === 'function'
+                    ? await configuration.accessToken()
+                    : await configuration.accessToken;
+                localVarHeaderParameter["Authorization"] = "Bearer " + accessToken;
+            }
+
+            const query = new URLSearchParams(localVarUrlObj.search);
+            for (const key in localVarQueryParameter) {
+                query.set(key, localVarQueryParameter[key]);
+            }
+            for (const key in options.params) {
+                query.set(key, options.params[key]);
+            }
+            localVarUrlObj.search = (new URLSearchParams(query)).toString();
+            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
+            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
+
+            return {
+                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
+                options: localVarRequestOptions,
+            };
+        },
         /**
          * 
          * @summary 获取差异日志分页列表 🔖
@@ -138,6 +188,20 @@ export const SysLogDiffApiFp = function(configuration?: Configuration) {
                 return axios.request(axiosRequestArgs);
             };
         },
+        /**
+         * 
+         * @summary 获取差异日志详情 🔖
+         * @param {number} id 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        async apiSysLogDiffDetailIdGet(id: number, options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => Promise<AxiosResponse<AdminResultSysLogDiff>>> {
+            const localVarAxiosArgs = await SysLogDiffApiAxiosParamCreator(configuration).apiSysLogDiffDetailIdGet(id, options);
+            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
+                const axiosRequestArgs :AxiosRequestConfig = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
+                return axios.request(axiosRequestArgs);
+            };
+        },
         /**
          * 
          * @summary 获取差异日志分页列表 🔖
@@ -170,6 +234,16 @@ export const SysLogDiffApiFactory = function (configuration?: Configuration, bas
         async apiSysLogDiffClearPost(options?: AxiosRequestConfig): Promise<AxiosResponse<void>> {
             return SysLogDiffApiFp(configuration).apiSysLogDiffClearPost(options).then((request) => request(axios, basePath));
         },
+        /**
+         * 
+         * @summary 获取差异日志详情 🔖
+         * @param {number} id 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        async apiSysLogDiffDetailIdGet(id: number, options?: AxiosRequestConfig): Promise<AxiosResponse<AdminResultSysLogDiff>> {
+            return SysLogDiffApiFp(configuration).apiSysLogDiffDetailIdGet(id, options).then((request) => request(axios, basePath));
+        },
         /**
          * 
          * @summary 获取差异日志分页列表 🔖
@@ -200,6 +274,17 @@ export class SysLogDiffApi extends BaseAPI {
     public async apiSysLogDiffClearPost(options?: AxiosRequestConfig) : Promise<AxiosResponse<void>> {
         return SysLogDiffApiFp(this.configuration).apiSysLogDiffClearPost(options).then((request) => request(this.axios, this.basePath));
     }
+    /**
+     * 
+     * @summary 获取差异日志详情 🔖
+     * @param {number} id 
+     * @param {*} [options] Override http request option.
+     * @throws {RequiredError}
+     * @memberof SysLogDiffApi
+     */
+    public async apiSysLogDiffDetailIdGet(id: number, options?: AxiosRequestConfig) : Promise<AxiosResponse<AdminResultSysLogDiff>> {
+        return SysLogDiffApiFp(this.configuration).apiSysLogDiffDetailIdGet(id, options).then((request) => request(this.axios, this.basePath));
+    }
     /**
      * 
      * @summary 获取差异日志分页列表 🔖

Web/src/api-services/models/admin-result-sys-log-diff.ts

@@ -0,0 +1,69 @@
+/* tslint:disable */
+/* eslint-disable */
+/**
+ * Admin.NET 通用权限开发平台
+ * 让 .NET 开发更简单、更通用、更流行。整合最新技术，模块插件式开发，前后端分离，开箱即用。<br/><u><b><font color='FF0000'> 👮不得利用本项目从事危害国家安全、扰乱社会秩序、侵犯他人合法权益等法律法规禁止的活动！任何基于本项目二次开发而产生的一切法律纠纷和责任，我们不承担任何责任！</font></b></u>
+ *
+ * OpenAPI spec version: 1.0.0
+ * 
+ *
+ * NOTE: This class is auto generated by the swagger code generator program.
+ * https://github.com/swagger-api/swagger-codegen.git
+ * Do not edit the class manually.
+ */
+
+import { SysLogDiff } from './sys-log-diff';
+ /**
+ * 全局返回结果
+ *
+ * @export
+ * @interface AdminResultSysLogDiff
+ */
+export interface AdminResultSysLogDiff {
+
+    /**
+     * 状态码
+     *
+     * @type {number}
+     * @memberof AdminResultSysLogDiff
+     */
+    code?: number;
+
+    /**
+     * 类型success、warning、error
+     *
+     * @type {string}
+     * @memberof AdminResultSysLogDiff
+     */
+    type?: string | null;
+
+    /**
+     * 错误信息
+     *
+     * @type {string}
+     * @memberof AdminResultSysLogDiff
+     */
+    message?: string | null;
+
+    /**
+     * @type {SysLogDiff}
+     * @memberof AdminResultSysLogDiff
+     */
+    result?: SysLogDiff;
+
+    /**
+     * 附加数据
+     *
+     * @type {any}
+     * @memberof AdminResultSysLogDiff
+     */
+    extras?: any | null;
+
+    /**
+     * 时间
+     *
+     * @type {Date}
+     * @memberof AdminResultSysLogDiff
+     */
+    time?: Date;
+}

Web/src/views/system/log/difflog/index.vue

@@ -39,8 +39,47 @@
 				<template #empty>
 					<el-empty :image-size="200" />
 				</template>
+				<template #row_buttons="{ row }">
+					<el-button icon="ele-InfoFilled" text type="primary" @click="handleView({ row })">详情</el-button>
+				</template>
 			</vxe-grid>
 		</el-card>
+
+		<el-dialog v-model="state.visible" draggable overflow destroy-on-close>
+			<template #header>
+				<div style="color: #fff">
+					<el-icon size="16" style="margin-right: 3px; display: inline; vertical-align: middle"> <ele-Document /> </el-icon>
+					<span> 日志详情 </span>
+				</div>
+			</template>
+			<el-tabs v-model="state.activeTab">
+				<el-tab-pane label="日志消息" name="message">
+					<el-scrollbar height="calc(100vh - 250px)">
+						<pre>{{ state.detail.message }}</pre>
+					</el-scrollbar>
+				</el-tab-pane>
+				<el-tab-pane label="SQL" name="sql" :lazy="true">
+					<el-scrollbar height="calc(100vh - 250px)">
+						<vue-json-pretty :data="state.detail.sql" showLength showIcon showLineNumber showSelectController />
+					</el-scrollbar>
+				</el-tab-pane>
+				<el-tab-pane label="参数" name="parameters" :lazy="true">
+					<el-scrollbar height="calc(100vh - 250px)">
+						<vue-json-pretty :data="state.detail.parameters" showLength showIcon showLineNumber showSelectController />
+					</el-scrollbar>
+				</el-tab-pane>
+				<el-tab-pane label="操作前记录" name="beforeData" :lazy="true">
+					<el-scrollbar height="calc(100vh - 250px)">
+						<vue-json-pretty :data="state.detail.beforeData" showLength showIcon showLineNumber showSelectController />
+					</el-scrollbar>
+				</el-tab-pane>
+				<el-tab-pane label="操作后记录" name="afterData" :lazy="true">
+					<el-scrollbar height="calc(100vh - 250px)">
+						<vue-json-pretty :data="state.detail.afterData" showLength showIcon showLineNumber showSelectController />
+					</el-scrollbar>
+				</el-tab-pane>
+			</el-tabs>
+		</el-dialog>	
 	</div>
 </template>
 
@@ -68,6 +107,15 @@ const state = reactive({
 		pageSize: 50 as number,
 		defaultSort: { field: 'id', order: 'desc', descStr: 'desc' },
 	},
+	visible: false,
+	detail: {
+		message: '' as string | null | undefined,
+		sql: undefined,
+		parameters: undefined,
+		afterData: undefined,
+		beforeData: undefined,
+	},
+	activeTab: 'message',
 });
 
 // 本地存储参数
@@ -89,6 +137,7 @@ const options = useVxeTable<SysLogDiff>(
 			{ field: 'afterData', title: '操作后记录', minWidth: 150, showOverflow: 'tooltip' },
 			{ field: 'businessData', title: '业务对象', minWidth: 150, showOverflow: 'tooltip' },
 			{ field: 'createTime', title: '操作时间', minWidth: 100, showOverflow: 'tooltip' },
+			{ title: '操作', fixed: 'right', width: 100, showOverflow: true, slots: { default: 'row_buttons' } },
 		],
 	},
 	// vxeGrid配置参数(此处可覆写任何参数)，参考vxe-table官方文档
@@ -152,4 +201,17 @@ const handleClear = async () => {
 	ElMessage.success('清空成功');
 	handleQuery();
 };
+
+// 查看详情
+const handleView = async ({ row }: any) => {
+	const { data } = await getAPI(SysLogDiffApi).apiSysLogDiffDetailIdGet(row.id);
+	state.activeTab = 'message';
+	state.detail.message = data?.result?.diffType;
+	// 如果请求参数是JSON字符串，则尝试转为JSON对象
+	state.detail.sql = StringToObj(data?.result?.sql);
+	state.detail.parameters = StringToObj(data?.result?.parameters);
+	state.detail.afterData = StringToObj(data?.result?.afterData);
+	state.detail.beforeData = StringToObj(data?.result?.beforeData);
+	state.visible = true;
+};
 </script>