在前文权限管控体系中，我们实现了操作日志的基础记录、展示与本地导出功能，通过日志审计完成安全追溯闭环。但在多设备分布式协同场景中，基础日志管理存在明显局限：仅支持本地日志查看、缺乏精准筛选能力、跨设备操作日志无法统一汇总，难以满足企业级应用“全量追溯、精准定位、跨端协同”的日志管理需求。本文将以选中的LogPage日志展示页面代码为载体，深入拓展日志精细化筛选、跨设备日志同步、日志异常告警三大核心能力，构建“记录-筛选-同步-告警”全链路日志管理体系，让分布式应用的安全审计更高效、更全面。

一、日志管理进阶核心认知

分布式场景下的日志管理，核心目标是打破设备壁垒，实现“全量日志统一管控”。相较于基础日志功能，进阶能力需具备三大特性：一是精细化筛选，支持按时间范围、操作类型、设备名称、操作结果等多维度过滤日志，快速定位目标记录；二是跨设备同步，将多设备产生的操作日志实时汇总至PC主设备，实现日志全量可视化；三是异常告警，对高危操作（如权限篡改、权限回收）、失败操作自动触发告警，提前规避安全风险。

本文将基于选中的LogPage代码，迭代优化日志展示页面，新增多维度筛选组件、跨设备日志同步逻辑、异常告警机制，最终实现“PC主设备统一管理全量日志，多从设备日志实时同步，支持精准筛选与异常预警”的管理模式。

前文核心日志展示页面代码回顾（选中部分精简版）：

// 日志展示页面核心代码（精简版）
@Entry
@Component
struct LogPage {
  @State operationLogs: OperationLog[] = [];
  private preferences: Preferences | null = null;

  aboutToAppear() {
    this.initPreferences();
    this.loadOperationLogs(); // 加载本地日志
  }

  private async initPreferences() {
    this.preferences = await Preferences.getPreferences(this.context, 'counter_prefs');
  }

  private async loadOperationLogs() {
    if (!this.preferences) return;
    const logs = this.preferences.get('operation_logs', []) as OperationLog[];
    this.operationLogs = logs;
  }

  // 日志导出与格式化方法（略）

  build() {
    Column({ space: 20 })
      .width('100%')
      .height('100%')
      .padding(20) {
      Text('操作日志审计')
        .fontSize(36)
        .fontWeight(FontWeight.Bold)
        .fontColor(Color('#007DFF'));

      Button('导出日志')
        .width(150)
        .height(40)
        .backgroundColor('#00B42A')
        .onClick(() => this.exportLogs());

      // 日志列表展示（略）

      Button('返回主页')
        .width(150)
        .height(40)
        .backgroundColor('#666666')
        .onClick(() => router.back());
    }
  }
}

二、进阶功能一：日志精细化筛选体系实现

基础日志列表展示难以快速定位关键记录，需构建多维度筛选体系，支持时间范围、操作类型、设备名称、操作结果四大维度筛选，同时实现筛选条件组合查询，提升日志检索效率。

2.1 筛选状态定义与组件实现

新增筛选相关状态变量，设计筛选组件UI，支持筛选条件的选择、重置与提交，确保交互流畅性：

import { Column, Text, List, ListItem, FlexAlign, Color, Button, DatePicker, Select, Option, TextInput, Checkbox } from '@ohos/ui-components';
import router from '@ohos.router';
import { OperationLog } from './CounterPage';
import { Preferences } from '@ohos.data.preferences';
import { FileManager } from '@ohos.filemanagement.filemanager';
import { DeviceManager, DeviceInfo } from '@ohos.distributedHardware.deviceManager';

@Entry
@Component
struct LogPage {
  @State operationLogs: OperationLog[] = [];
  @State filteredLogs: OperationLog[] = []; // 筛选后日志列表
  @State allDevices: string[] = []; // 所有涉及设备名称列表
  private preferences: Preferences | null = null;
  private deviceManager: DeviceManager | null = null;

  // 筛选条件状态
  @State timeRange: [number, number] = [0, Date.now()]; // 时间范围（开始/结束时间戳）
  @State selectedOpType: string = '全部'; // 操作类型
  @State selectedDevice: string = '全部'; // 设备名称
  @State selectedResult: boolean | null = null; // 操作结果（true成功/false失败/null全部）
  @State showFilterPanel: boolean = false; // 筛选面板显示状态

  aboutToAppear() {
    this.initPreferences();
    this.initDeviceManager();
    this.loadOperationLogs();
  }

  private async initDeviceManager() {
    this.deviceManager = DeviceManager.getInstance(this.context);
  }

  private async loadOperationLogs() {
    if (!this.preferences) return;
    const logs = this.preferences.get('operation_logs', []) as OperationLog[];
    this.operationLogs = logs;
    this.filteredLogs = [...logs]; // 初始显示全部日志
    this.collectAllDevices(logs); // 收集所有涉及设备名称
  }

  // 收集所有操作涉及的设备名称
  private collectAllDevices(logs: OperationLog[]) {
    const devices = new Set<string>();
    logs.forEach(log => devices.add(log.deviceName));
    this.allDevices = Array.from(devices);
  }

  // 构建筛选面板
  private buildFilterPanel() {
    const opTypes = ['全部', '修改计数', '授权权限', '回收权限', '导出日志', '权限过期'];
    return (
      Column({ space: 15 })
        .width('100%')
        .padding(20)
        .backgroundColor('#F5F7FA')
        .borderRadius(8) {
        Text('日志筛选')
          .fontSize(20)
          .fontWeight(FontWeight.Medium)
          .alignSelf(FlexAlign.Start);

        // 时间范围筛选
        Column({ space: 10 })
          .width('100%')
          .alignSelf(FlexAlign.Start) {
          Text('时间范围')
            .fontSize(16);
          Row({ space: 20 })
            .width('100%') {
            Button(this.formatTime(this.timeRange[0]) || '开始时间')
              .width('45%')
              .height(40)
              .backgroundColor('#FFFFFF')
              .onClick(() => this.showDatePicker(true));
            Button(this.formatTime(this.timeRange[1]) || '结束时间')
              .width('45%')
              .height(40)
              .backgroundColor('#FFFFFF')
              .onClick(() => this.showDatePicker(false));
          }
        }

        // 操作类型筛选
        Column({ space: 10 })
          .width('100%')
          .alignSelf(FlexAlign.Start) {
          Text('操作类型')
            .fontSize(16);
          Select()
            .width('100%')
            .value(this.selectedOpType)
            .onChange((value) => this.selectedOpType = value) {
            opTypes.forEach(type => Option(type).value(type));
          }
        }

        // 设备名称筛选
        Column({ space: 10 })
          .width('100%')
          .alignSelf(FlexAlign.Start) {
          Text('设备名称')
            .fontSize(16);
          Select()
            .width('100%')
            .value(this.selectedDevice)
            .onChange((value) => this.selectedDevice = value) {
            Option('全部').value('全部');
            this.allDevices.forEach(device => Option(device).value(device));
          }
        }

        // 操作结果筛选
        Column({ space: 10 })
          .width('100%')
          .alignSelf(FlexAlign.Start) {
          Text('操作结果')
            .fontSize(16);
          Row({ space: 30 })
            .width('100%') {
            Column({ space: 5 }) {
              Checkbox()
                .checked(this.selectedResult === null)
                .onChange(() => this.selectedResult = null);
              Text('全部');
            }
            Column({ space: 5 }) {
              Checkbox()
                .checked(this.selectedResult === true)
                .onChange(() => this.selectedResult = true);
              Text('成功');
            }
            Column({ space: 5 }) {
              Checkbox()
                .checked(this.selectedResult === false)
                .onChange(() => this.selectedResult = false);
              Text('失败');
            }
          }
        }

        // 筛选操作按钮
        Row({ space: 20 })
          .width('100%')
          .justifyContent(FlexAlign.End) {
          Button('重置')
            .width(100)
            .height(40)
            .backgroundColor('#666666')
            .onClick(() => this.resetFilter());
          Button('确认筛选')
            .width(100)
            .height(40)
            .backgroundColor('#007DFF')
            .onClick(() => this.doFilter());
        }
      }
    );
  }

  // 日期选择器（简化实现，实际可结合鸿蒙DatePicker组件）
  private showDatePicker(isStart: boolean) {
    // 实际开发中可弹出DatePicker组件选择日期，此处简化为模拟时间设置
    const date = new Date();
    if (isStart) {
      date.setDate(date.getDate() - 7); // 默认开始时间为7天前
      this.timeRange[0] = date.getTime();
    } else {
      this.timeRange[1] = date.getTime();
    }
  }

  // 重置筛选条件
  private resetFilter() {
    this.timeRange = [0, Date.now()];
    this.selectedOpType = '全部';
    this.selectedDevice = '全部';
    this.selectedResult = null;
    this.filteredLogs = [...this.operationLogs];
  }

  // 执行筛选逻辑
  private doFilter() {
    this.filteredLogs = this.operationLogs.filter(log => {
      // 时间范围筛选
      const isInTimeRange = log.operationTime >= this.timeRange[0] && log.operationTime <= this.timeRange[1];
      // 操作类型筛选
      const isMatchOpType = this.selectedOpType === '全部' || log.operationType === this.selectedOpType;
      // 设备名称筛选
      const isMatchDevice = this.selectedDevice === '全部' || log.deviceName === this.selectedDevice;
      // 操作结果筛选
      const isMatchResult = this.selectedResult === null || log.success === this.selectedResult;
      // 满足所有条件则保留
      return isInTimeRange && isMatchOpType && isMatchDevice && isMatchResult;
    });
    this.showFilterPanel = false;
  }

  // 格式化时间戳为字符串（优化版，支持空时间处理）
  private formatTime(timestamp: number): string | null {
    if (timestamp === 0) return null;
    const date = new Date(timestamp);
    return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')} ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`;
  }

  // 原有导出日志、showToast等方法（略）

  build() {
    Column({ space: 20 })
      .width('100%')
      .height('100%')
      .padding(20) {
      Text('操作日志审计')
        .fontSize(36)
        .fontWeight(FontWeight.Bold)
        .fontColor(Color('#007DFF'));

      // 筛选与导出按钮行
      Row({ space: 20 })
        .width('100%')
        .justifyContent(FlexAlign.SpaceBetween) {
        Button('筛选日志')
          .width(150)
          .height(40)
          .backgroundColor('#FF7D00')
          .onClick(() => this.showFilterPanel = !this.showFilterPanel);
        Button('导出日志')
          .width(150)
          .height(40)
          .backgroundColor('#00B42A')
          .onClick(() => this.exportLogs());
      }

      // 筛选面板
      if (this.showFilterPanel) {
        this.buildFilterPanel();
      }

      // 日志列表（修改为展示筛选后日志）
      List()
        .width('100%')
        .height('80%') {
        ForEach(this.filteredLogs, (log: OperationLog) => {
          ListItem()
            .padding(15)
            .backgroundColor('#F5F7FA')
            .borderRadius(8)
            .margin({ bottom: 10 }) {
            Column({ space: 8 }) {
              Row({ space: 20 }) {
                Text(this.formatTime(log.operationTime) || '未知时间')
                  .fontSize(16)
                  .fontWeight(FontWeight.Medium);
                Text(log.deviceName)
                  .fontSize(16)
                  .fontColor('#007DFF');
                Text(log.operationType)
                  .fontSize(16)
                  .fontColor(log.success ? '#00B42A' : '#FF4D4F');
              }
              Text(log.operationContent)
                .fontSize(14)
                .fontColor('#666666')
                .width('100%');
            }
          }
        });
      }
      .emptyComponent(Text('暂无匹配的操作日志').fontSize(18).color('#999999').padding(20));

      Button('返回主页')
        .width(150)
        .height(40)
        .backgroundColor('#666666')
        .onClick(() => router.back());
    }
  }
}

2.2 筛选逻辑优化与体验提升

针对筛选功能进行细节优化，支持筛选结果实时更新、筛选条件记忆，同时优化大量日志场景下的筛选性能，避免页面卡顿：

// 优化筛选逻辑，添加防抖处理，避免频繁筛选导致卡顿
private doFilter = this.debounce(() => {
  this.filteredLogs = this.operationLogs.filter(log => {
    const isInTimeRange = log.operationTime >= this.timeRange[0] && log.operationTime <= this.timeRange[1];
    const isMatchOpType = this.selectedOpType === '全部' || log.operationType === this.selectedOpType;
    const isMatchDevice = this.selectedDevice === '全部' || log.deviceName === this.selectedDevice;
    const isMatchResult = this.selectedResult === null || log.success === this.selectedResult;
    return isInTimeRange && isMatchOpType && isMatchDevice && isMatchResult;
  });
  this.showFilterPanel = false;
  this.showToast(`筛选完成，共找到${this.filteredLogs.length}条日志`);
}, 300); // 300毫秒防抖延迟

// 防抖工具函数
private debounce(fn: Function, delay: number): Function {
  let timer: number | null = null;
  return (...args: any[]) => {
    if (timer !== null) {
      clearTimeout(timer);
    }
    timer = setTimeout(() => {
      fn.apply(this, args);
      timer = null;
    }, delay);
  };
}

// 记忆筛选条件（页面隐藏时保存，重新进入时恢复）
private async saveFilterConditions() {
  if (!this.preferences) return;
  const filterConditions = {
    timeRange: this.timeRange,
    selectedOpType: this.selectedOpType,
    selectedDevice: this.selectedDevice,
    selectedResult: this.selectedResult
  };
  await this.preferences.put('log_filter_conditions', filterConditions);
  await this.preferences.flush();
}

private async loadFilterConditions() {
  if (!this.preferences) return;
  const filterConditions = this.preferences.get('log_filter_conditions', null) as any;
  if (filterConditions) {
    this.timeRange = filterConditions.timeRange;
    this.selectedOpType = filterConditions.selectedOpType;
    this.selectedDevice = filterConditions.selectedDevice;
    this.selectedResult = filterConditions.selectedResult;
    this.doFilter(); // 加载条件后自动筛选
  }
}

// 在页面生命周期中调用条件保存与加载
aboutToAppear() {
  this.initPreferences();
  this.initDeviceManager();
  this.loadOperationLogs();
  this.loadFilterConditions(); // 加载历史筛选条件
}

aboutToDisappear() {
  this.saveFilterConditions(); // 保存当前筛选条件
}

三、进阶功能二：跨设备日志同步与全量汇总

基础日志仅存储于本地设备，无法实现多设备操作的统一追溯。需基于鸿蒙DistributedData模块，实现从设备日志实时同步至PC主设备，同时支持PC日志反向同步至从设备，确保全量日志一致性。

3.1 跨设备日志同步逻辑实现

优化日志记录与加载逻辑，通过DistributedData监听多设备日志变化，实现日志实时同步与全量汇总，同时避免日志重复存储：

import { DistributedData } from '@ohos.data.distributeddata';

@Entry
@Component
struct LogPage {
  @State operationLogs: OperationLog[] = [];
  @State filteredLogs: OperationLog[] = [];
  @State allDevices: string[] = [];
  private preferences: Preferences | null = null;
  private deviceManager: DeviceManager | null = null;
  private distributedData: DistributedData | null = null;
  private readonly LOG_KEY = 'distributed_operation_logs'; // 分布式日志存储键名

  aboutToAppear() {
    this.initPreferences();
    this.initDeviceManager();
    this.initDistributedData(); // 初始化分布式数据存储
    this.loadOperationLogs();
    this.loadFilterConditions();
  }

  // 初始化分布式数据存储
  private initDistributedData() {
    try {
      this.distributedData = new DistributedData('counter_logs');
      // 监听跨设备日志变化，实时同步
      this.distributedData.on('dataChange', (data: { logs: OperationLog[] }) => {
        if (data.logs && data.logs.length > 0) {
          this.mergeLogs(data.logs); // 合并跨设备日志
        }
      });
    } catch (error) {
      console.error(`分布式日志初始化失败：${JSON.stringify(error)}`);
    }
  }

  // 合并跨设备日志，去重并按时间排序
  private async mergeLogs(newLogs: OperationLog[]) {
    // 去重：根据日志ID排除重复记录
    const logIds = new Set(this.operationLogs.map(log => log.id));
    const uniqueNewLogs = newLogs.filter(log => !logIds.has(log.id));
    if (uniqueNewLogs.length === 0) return;

    // 合并日志并按时间戳降序排序（最新日志在前）
    this.operationLogs = [...this.operationLogs, ...uniqueNewLogs]
      .sort((a, b) => b.operationTime - a.operationTime);
    // 限制日志总量，避免内存溢出
    if (this.operationLogs.length > 200) {
      this.operationLogs = this.operationLogs.slice(0, 200);
    }
    this.filteredLogs = [...this.operationLogs];
    this.collectAllDevices(this.operationLogs);

    // 本地持久化与分布式同步
    if (this.preferences) {
      await this.preferences.put('operation_logs', this.operationLogs);
      await this.preferences.flush();
    }
    await this.syncLogsToDistributed();
  }

  // 将本地日志同步至分布式存储，供其他设备获取
  private async syncLogsToDistributed() {
    if (!this.distributedData) return;
    try {
      await this.distributedData.put(this.LOG_KEY, { logs: this.operationLogs });
      await this.distributedData.sync();
    } catch (error) {
      console.error(`分布式日志同步失败：${JSON.stringify(error)}`);
    }
  }

  // 加载本地日志后，同步获取分布式日志
  private async loadOperationLogs() {
    if (!this.preferences) return;
    // 加载本地日志
    const localLogs = this.preferences.get('operation_logs', []) as OperationLog[];
    this.operationLogs = localLogs.sort((a, b) => b.operationTime - a.operationTime);
    this.filteredLogs = [...this.operationLogs];
    this.collectAllDevices(this.operationLogs);

    // 加载分布式日志并合并
    if (this.distributedData) {
      try {
        const distributedData = await this.distributedData.get(this.LOG_KEY);
        if (distributedData?.logs && distributedData.logs.length > 0) {
          await this.mergeLogs(distributedData.logs);
        }
      } catch (error) {
        console.error(`加载分布式日志失败：${JSON.stringify(error)}`);
      }
    }
  }

  // 原有筛选、格式化等方法（略）
}

3.2 主从设备日志权限管控

为避免日志同步混乱，需划分主从设备角色：PC作为日志管理主设备，拥有日志汇总、同步、导出的全部权限；从设备仅可上传本地日志至主设备，无修改、删除主设备日志的权限，确保日志完整性：

// 新增主从设备判断方法
private isMasterDevice(): boolean {
  // 本机为PC且拥有管理员权限，则作为日志管理主设备
  const localDevice = this.deviceManager?.getLocalDeviceInfo();
  const localPermission = this.getLocalPermissionLevel(); // 需从CounterPage引入或重新实现权限判断
  return localDevice?.deviceType === 2 && localPermission === PermissionLevel.ADMIN;
}

// 获取本机权限等级（简化实现，实际需与权限管控模块联动）
private getLocalPermissionLevel(): PermissionLevel {
  const localDeviceId = this.deviceManager?.getLocalDeviceInfo()?.deviceId || '';
  // 模拟权限获取，实际需从分布式权限配置中读取
  return localDeviceId ? PermissionLevel.ADMIN : PermissionLevel.VIEW;
}

// 优化日志同步逻辑，仅主设备可发起全量同步
private async syncLogsToDistributed() {
  if (!this.distributedData || !this.isMasterDevice()) return; // 非主设备禁止同步
  try {
    await this.distributedData.put(this.LOG_KEY, { logs: this.operationLogs });
    await this.distributedData.sync();
  } catch (error) {
    console.error(`分布式日志同步失败：${JSON.stringify(error)}`);
  }
}

// 从设备仅可上传本地新增日志，不可覆盖全量日志
private async uploadLocalLogs() {
  if (!this.distributedData || this.isMasterDevice()) return; // 主设备无需上传
  const localLogs = this.operationLogs.filter(log => 
    // 仅上传本机产生的日志
    log.deviceId === this.deviceManager?.getLocalDeviceInfo()?.deviceId
  );
  if (localLogs.length === 0) return;
  try {
    // 仅上传本机日志，由主设备合并
    await this.distributedData.put(`local_logs_${this.deviceManager?.getLocalDeviceInfo()?.deviceId}`, { logs: localLogs });
    await this.distributedData.sync();
  } catch (error) {
    console.error(`本地日志上传失败：${JSON.stringify(error)}`);
  }
}

// 主设备监听从设备日志上传，主动合并
private initSlaveLogListener() {
  if (!this.distributedData || !this.isMasterDevice()) return;
  const localDeviceId = this.deviceManager?.getLocalDeviceInfo()?.deviceId || '';
  // 监听所有从设备的本地日志上传键
  this.deviceManager?.getAvailableDeviceList()?.forEach(device => {
    if (device.deviceId === localDeviceId) return;
    this.distributedData?.on(`dataChange`, (data: { logs: OperationLog[] }) => {
      if (data.logs && data.logs.length > 0) {
        this.mergeLogs(data.logs);
      }
    }, `local_logs_${device.deviceId}`);
  });
}

四、进阶功能三：日志异常告警与高危操作监控

针对高危操作（如管理员权限授予、权限回收、操作失败）需实现实时告警机制，通过弹窗、通知等方式提醒管理员，同时标记高危日志，便于快速定位风险点。

3.1 高危操作定义与告警逻辑

定义高危操作类型，实现日志加载与新增时的异常检测，触发对应告警方式：

import { NotificationRequest, NotificationManager } from '@ohos.notificationManager';
import { Dialog } from '@ohos/ui-components';

@Entry
@Component
struct LogPage {
  @State showAlertDialog: boolean = false;
  @State alertContent: string = ''; // 告警内容
  // 高危操作类型定义
  private readonly HIGH_RISK_OPERATIONS = ['授权管理员权限', '回收管理员权限', '权限篡改尝试', '日志删除尝试'];

  // 检测日志是否为高危操作，触发告警
  private checkHighRiskLog(log: OperationLog) {
    if (this.HIGH_RISK_OPERATIONS.includes(log.operationType) || !log.success) {
      this.triggerAlert(log);
    }
  }

  // 触发告警（弹窗+通知）
  private async triggerAlert(log: OperationLog) {
    const alertMsg = `【${log.success ? '高危操作' : '操作失败告警'}】${log.deviceName}于${this.formatTime(log.operationTime)}执行${log.operationType}，内容：${log.operationContent}`;
    this.alertContent = alertMsg;
    this.showAlertDialog = true; // 弹窗告警

    // 发送系统通知告警
    if (this.isMasterDevice()) {
      try {
        const notification: NotificationRequest = {
          id: Math.floor(Math.random() * 1000),
          content: {
            contentType: 1,
            text: alertMsg
          },
          deliveryTime: new Date().getTime(),
          showType: 1,
          importance: 4 // 高优先级通知，确保弹窗显示
        };
        await NotificationManager.publish(notification);
      } catch (error) {
        console.error(`告警通知发送失败：${JSON.stringify(error)}`);
      }
    }
  }

  // 构建告警弹窗
  private buildAlertDialog() {
    return (
      Dialog()
        .width(400)
        .height(200)
        .title('日志异常告警')
        .onCancel(() => this.showAlertDialog = false) {
        Column({ space: 30 })
          .width('100%')
          .height('100%')
          .justifyContent(FlexAlign.Center)
          .padding(20) {
          Text(this.alertContent)
            .fontSize(16)
            .color('#FF4D4F')
            .width('100%');
          Button('确认')
            .width(120)
            .height(40)
            .backgroundColor('#007DFF')
            .onClick(() => this.showAlertDialog = false);
        }
      }
    );
  }

  // 优化日志合并方法，新增高危检测
  private async mergeLogs(newLogs: OperationLog[]) {
    const logIds = new Set(this.operationLogs.map(log => log.id));
    const uniqueNewLogs = newLogs.filter(log => !logIds.has(log.id));
    if (uniqueNewLogs.length === 0) return;

    // 对新增日志逐一检测高危操作
    uniqueNewLogs.forEach(log => this.checkHighRiskLog(log));

    this.operationLogs = [...this.operationLogs, ...uniqueNewLogs]
      .sort((a, b) => b.operationTime - a.operationTime)
      .slice(0, 200);
    this.filteredLogs = [...this.operationLogs];
    this.collectAllDevices(this.operationLogs);

    if (this.preferences) {
      await this.preferences.put('operation_logs', this.operationLogs);
      await this.preferences.flush();
    }
    await this.syncLogsToDistributed();
  }

  // 优化build方法，集成告警弹窗
  build() {
    Column({ space: 20 })
      .width('100%')
      .height('100%')
      .padding(20) {
      // 原有标题、筛选按钮、日志列表等（略）

      // 异常告警弹窗
      if (this.showAlertDialog) {
        this.buildAlertDialog();
      }

      Button('返回主页')
        .width(150)
        .height(40)
        .backgroundColor('#666666')
        .onClick(() => router.back());
    }
  }
}

3.2 高危日志标记与快速定位

在日志列表中对高危操作日志进行特殊标记（红色边框、图标），便于管理员快速识别风险记录，提升问题定位效率：

// 新增高危日志判断方法
private isHighRiskLog(log: OperationLog): boolean {
  return this.HIGH_RISK_OPERATIONS.includes(log.operationType) || !log.success;
}

// 优化日志列表项UI，添加高危标记
build() {
  // 原有代码（略）

  List()
    .width('100%')
    .height('80%') {
    ForEach(this.filteredLogs, (log: OperationLog) => {
      const isHighRisk = this.isHighRiskLog(log);
      ListItem()
        .padding(15)
        .backgroundColor('#F5F7FA')
        .borderRadius(8)
        .margin({ bottom: 10 })
        .border(isHighRisk ? '2px solid #FF4D4F' : 'none') { // 高危日志红色边框
        Column({ space: 8 }) {
          Row({ space: 10 }) {
            // 高危日志添加警告图标
            if (isHighRisk) {
              Text('⚠️')
                .fontSize(18)
                .color('#FF4D4F');
            }
            Text(this.formatTime(log.operationTime) || '未知时间')
              .fontSize(16)
              .fontWeight(FontWeight.Medium);
            Text(log.deviceName)
              .fontSize(16)
              .fontColor('#007DFF');
            Text(log.operationType)
              .fontSize(16)
              .fontColor(log.success ? '#00B42A' : '#FF4D4F');
          }
          Text(log.operationContent)
            .fontSize(14)
            .fontColor('#666666')
            .width('100%');
        }
      }
    });
  }
  .emptyComponent(Text('暂无匹配的操作日志').fontSize(18).color('#999999').padding(20));

  // 原有代码（略）
}

五、日志管理性能优化与避坑指南

5.1 性能优化要点

• 日志量控制：限制本地与分布式日志最大条数（如200条），超出部分按时间戳删除最早记录，避免日志过多导致内存溢出与同步卡顿。

• 同步策略优化：采用“增量同步+定时全量同步”结合模式，新增日志实时增量同步，每小时执行一次全量同步校验，减少网络开销。

• 筛选性能优化：对大量日志采用防抖筛选，同时在日志加载时预处理（按时间、设备分组），提升筛选响应速度。

• 告警频率控制：同一类型高危操作短时间内多次触发时，采用合并告警机制（如5分钟内同一设备的相同操作仅告警一次），避免告警轰炸。

5.2 核心避坑点

• 日志重复同步：必须基于唯一日志ID（时间戳+随机数）去重，避免多设备同步时日志重复存储，导致列表混乱。

• 跨设备时间不一致：日志时间戳统一使用设备本地时间，同时记录设备时区，避免因设备时间不同导致日志排序异常。

• 分布式同步权限不足：确保应用已获取DISTRIBUTED_DATASYNC权限，同时主从设备账号一致，避免同步时因权限或组网问题失败。

• 告警通知权限缺失：提前引导用户授予POST_NOTIFICATION权限，否则高危告警无法正常弹出通知，导致风险遗漏。

• 页面卡顿问题：日志列表使用懒加载模式（按需渲染可视区域内日志），避免一次性渲染大量日志导致页面卡顿。

六、总结与场景延伸

本文基于日志展示页面代码，构建了“精细化筛选-跨设备同步-异常告警”的全链路日志管理体系，通过多维度筛选、主从设备日志协同、高危操作监控三大核心功能，解决了分布式场景下日志管理的碎片化、低效化问题，为企业级应用提供了全面、高效的安全审计能力。核心在于结合鸿蒙分布式数据能力与本地UI交互优化，实现日志“全量管控、精准定位、风险预警”的管理目标。

基于本文能力，可进一步延伸至更多实用场景：一是企业级运维平台，通过日志统一管理实现多设备运维操作追溯与风险预警；二是家庭共享应用，家长可通过日志监控子女设备的操作行为；三是工业控制场景，对设备操作日志进行全量记录与异常告警，确保生产安全。

日志管理是分布式应用安全的最后一道防线，只有实现日志的精细化、协同化、智能化管理，才能充分发挥鸿蒙全场景协同的优势，同时保障应用的安全性与可运维性。后续可深入探索日志AI分析能力，通过机器学习自动识别异常操作模式，实现从“被动告警”到“主动预警”的升级。