欢迎大家加入开源鸿蒙跨平台开发者社区，一起共建开源鸿蒙跨平台生态。

本文对应模块：Web 层的批量操作与快速编辑系统实现，包括任务多选、批量更新、快速编辑、与原生层的批量操作同步机制。

📌 概述

批量操作系统是任务管理应用的重要功能，允许用户同时对多个任务进行操作，大大提高工作效率。批量操作系统包括任务多选、批量更新状态、批量更新分类、批量更新优先级等功能。BatchOperationManager 类是批量操作的核心，负责管理选中的任务和执行批量操作。通过批量操作系统，用户可以快速处理大量任务，节省时间。

🔗 批量操作系统的完整流程

批量操作系统分为三层：Web 层的 BatchOperationManager（批量操作管理器）负责任务选择和批量操作，TaskManager（任务管理器）负责执行具体的更新操作，DatabaseModule（数据库模块）负责数据的持久化。当用户选择任务时，BatchOperationManager 将任务 ID 添加到选中集合中。当用户执行批量操作时，BatchOperationManager 获取所有选中的任务，然后调用 TaskManager 的更新方法对每个任务进行更新。当用户取消选择时，BatchOperationManager 从选中集合中删除任务 ID。

批量操作系统与单个任务编辑不同，它允许用户一次性修改多个任务的属性。这对于处理大量相似的任务非常有用。例如，用户可能需要将所有"工作"分类的任务的优先级改为"高"，或者将所有"待办"状态的任务改为"进行中"。通过批量操作，用户可以一次性完成这些操作，而不需要逐个编辑每个任务。

批量操作系统的实现需要考虑以下几个方面：首先是任务的选择管理，需要维护一个选中任务的集合。其次是批量操作的执行，需要对所有选中的任务执行相同的操作。第三是操作的反馈，需要显示操作的结果和进度。第四是性能优化，当选中的任务数量很多时，需要考虑批量操作的性能。最后是与原生层的集成，需要通过 Cordova 插件将批量操作事件通知给原生层。

批量操作在实际应用中非常重要。用户可能需要快速处理大量任务，例如在项目完成时，需要将所有相关的任务标记为完成。或者在重新分类时，需要将多个任务从一个分类移到另一个分类。通过批量操作，用户可以显著提高工作效率，减少重复操作的时间。

🔧 批量操作管理器实现

批量操作管理器的核心实现包括任务选择、批量更新、操作撤销等功能。任务选择时需要维护一个选中任务的集合。批量更新时需要对所有选中的任务执行相同的操作。操作完成后需要清空选中集合。

// 批量操作管理器的关键方法
class BatchOperationManager {
    constructor() {
        this.selectedTasks = new Set();
    }

    selectTask(taskId) {
        this.selectedTasks.add(taskId);
    }

    deselectTask(taskId) {
        this.selectedTasks.delete(taskId);
    }

    toggleTask(taskId) {
        if (this.selectedTasks.has(taskId)) {
            this.deselectTask(taskId);
        } else {
            this.selectTask(taskId);
        }
    }

    selectAll() {
        taskManager.getAllTasks().forEach(task => this.selectTask(task.id));
    }

    deselectAll() {
        this.selectedTasks.clear();
    }

    getSelectedTasks() {
        return Array.from(this.selectedTasks)
            .map(id => taskManager.getTask(id))
            .filter(task => task !== undefined);
    }

    async updateStatusBatch(status) {
        const ids = Array.from(this.selectedTasks);
        await taskManager.updateTasksStatus(ids, status);
        this.deselectAll();
        return true;
    }

    async updateCategoryBatch(category) {
        const tasks = this.getSelectedTasks();
        for (const task of tasks) {
            await taskManager.updateTask(task.id, { category });
        }
        this.deselectAll();
        return true;
    }

    async updatePriorityBatch(priority) {
        const tasks = this.getSelectedTasks();
        for (const task of tasks) {
            await taskManager.updateTask(task.id, { priority });
        }
        this.deselectAll();
        return true;
    }

    async deleteBatch() {
        const tasks = this.getSelectedTasks();
        for (const task of tasks) {
            await taskManager.deleteTask(task.id);
        }
        this.deselectAll();
        return true;
    }
}

const batchOperationManager = new BatchOperationManager();

代码解释：

BatchOperationManager 类提供了一个完整的批量操作接口。selectTask() 方法将任务 ID 添加到选中集合中。deselectTask() 方法从选中集合中删除任务 ID。toggleTask() 方法切换任务的选择状态，如果任务已选中则取消选择，否则选择。selectAll() 方法选择所有任务。deselectAll() 方法取消选择所有任务。getSelectedTasks() 方法获取所有选中的任务对象。updateStatusBatch() 方法批量更新所有选中任务的状态。updateCategoryBatch() 方法批量更新所有选中任务的分类。updatePriorityBatch() 方法批量更新所有选中任务的优先级。deleteBatch() 方法批量删除所有选中的任务。

🔌 原生层的批量操作同步

HarmonyOS 原生层也需要与 Web 层的批量操作系统进行集成。原生层可以通过 Cordova 插件来接收来自 Web 层的批量操作事件。

// ArkTS 代码示例 - 批量操作插件
import { CordovaPlugin, CallbackContext } from '@magongshou/harmony-cordova/Index';
import { PluginResult, MessageStatus } from '@magongshou/harmony-cordova/Index';

export class BatchOperationSyncPlugin extends CordovaPlugin {
    // 监听 Web 层的批量更新事件
    async onBatchUpdate(callbackContext: CallbackContext, args: string[]): Promise<void> {
        try {
            const updateData = JSON.parse(args[0]);
            const taskIds = JSON.parse(args[1]);
            console.log('[BatchOperationSyncPlugin] 批量更新:', updateData.field, '=', updateData.value);
            console.log('[BatchOperationSyncPlugin] 影响任务数:', taskIds.length);
            
            const result = PluginResult.createByString(MessageStatus.OK, '批量更新已同步');
            callbackContext.sendPluginResult(result);
        } catch (error) {
            const result = PluginResult.createByString(MessageStatus.ERROR, (error as Error).message);
            callbackContext.sendPluginResult(result);
        }
    }

    // 监听 Web 层的批量删除事件
    async onBatchDelete(callbackContext: CallbackContext, args: string[]): Promise<void> {
        try {
            const taskIds = JSON.parse(args[0]);
            console.log('[BatchOperationSyncPlugin] 批量删除:', taskIds.length, '个任务');
            
            const result = PluginResult.createByString(MessageStatus.OK, '批量删除已同步');
            callbackContext.sendPluginResult(result);
        } catch (error) {
            const result = PluginResult.createByString(MessageStatus.ERROR, (error as Error).message);
            callbackContext.sendPluginResult(result);
        }
    }

    // 监听 Web 层的选择状态变化
    async onSelectionChanged(callbackContext: CallbackContext, args: string[]): Promise<void> {
        try {
            const selectionData = JSON.parse(args[0]);
            console.log('[BatchOperationSyncPlugin] 选择状态已更新:', selectionData.selectedCount);
            
            const result = PluginResult.createByString(MessageStatus.OK, '选择状态已同步');
            callbackContext.sendPluginResult(result);
        } catch (error) {
            const result = PluginResult.createByString(MessageStatus.ERROR, (error as Error).message);
            callbackContext.sendPluginResult(result);
        }
    }
}

原生代码解释：

BatchOperationSyncPlugin 是一个 Cordova 插件，提供了原生层与 Web 层批量操作系统的交互接口。onBatchUpdate 方法监听 Web 层的批量更新事件，接收更新数据和受影响的任务 ID 列表。原生层可以根据这个事件在原生层也执行相应的批量更新。onBatchDelete 方法监听 Web 层的批量删除事件，接收要删除的任务 ID 列表。原生层可以根据这个事件在原生层也删除相应的任务。onSelectionChanged 方法监听 Web 层的选择状态变化，接收选择数据。原生层可以根据这个事件更新原生层的 UI 显示。

Web 层通知原生批量操作事件

Web 层可以调用原生插件来通知原生层批量操作已执行：

// JavaScript 代码 - 通知原生批量操作
function notifyBatchUpdate(updateData, taskIds) {
    cordova.exec(
        function() { console.log('原生层已收到批量更新通知'); },
        function(error) { console.error('通知失败:', error); },
        'BatchOperationSyncPlugin',
        'onBatchUpdate',
        [JSON.stringify(updateData), JSON.stringify(taskIds)]
    );
}

function notifyBatchDelete(taskIds) {
    cordova.exec(
        function() { console.log('原生层已收到批量删除通知'); },
        function(error) { console.error('通知失败:', error); },
        'BatchOperationSyncPlugin',
        'onBatchDelete',
        [JSON.stringify(taskIds)]
    );
}

function notifySelectionChanged(selectedCount, totalCount) {
    cordova.exec(
        function() { console.log('原生层已收到选择状态通知'); },
        function(error) { console.error('通知失败:', error); },
        'BatchOperationSyncPlugin',
        'onSelectionChanged',
        [JSON.stringify({ selectedCount, totalCount })]
    );
}

Web 层代码解释：

notifyBatchUpdate 函数使用 cordova.exec() 调用原生插件的 onBatchUpdate 方法，传递更新数据和任务 ID 列表。这样可以从 Web 层通知原生层批量更新已执行。notifyBatchDelete 函数调用原生插件的 onBatchDelete 方法，传递要删除的任务 ID 列表。这样可以从 Web 层通知原生层批量删除已执行。notifySelectionChanged 函数调用原生插件的 onSelectionChanged 方法，传递选择数据。这样可以从 Web 层通知原生层选择状态已变化。通过这些函数，Web 层可以将批量操作事件同步给原生层，使原生层能够保持与 Web 层的数据一致。

📝 总结

批量操作系统是应用的重要功能，通过多选和批量更新，用户可以快速处理大量任务。通过与原生层的集成，可以实现批量操作数据的完整同步，使用户在不同层级都能看到最新的操作结果。