Transformando la Gestión de Archivos en Business Central: ¡Arrastra y Suelta para la Eficiencia!

controladdin "Attachments Drag And Drop"
{
    Scripts = 'https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js',
        'AttachmentsDragAndDrop\src\controladdin\AttachmentsDragAndDrop\js\scripts.js';
    StartupScript = 'AttachmentsDragAndDrop\src\controladdin\AttachmentsDragAndDrop\js\startup.js';

    RequestedHeight = 1;
    MinimumHeight = 1;
    HorizontalStretch = true;

    event ControlAddinReady();
    event OnFileUpload(FileName: Text; FileAsText: Text; IsLastFile: Boolean)
    procedure InitializeFileDragAndDrop()
}

// Esta función se encarga de inicializar la funcionalidad de arrastrar y soltar archivos en el ControlAddin de Business Central.
function InitializeFileDragAndDrop() {
    // Busca el controlAddIn en el documento padre que tengan el atributo "controlname" igual a "AttachmentsDragAndDropFactbox". Es importante que tenga el mismo nombre que la page donde tendremos nuestro ControlAddIn.
    nodes = window.parent.document.querySelectorAll('div[controlname="AttachmentsDragAndDropFactbox"]');

    // Selecciona el último elemento encontrado, que será el control en el que queremos habilitar la funcionalidad.
    // Aquí es importante encontrar todos los nodos HTML posibles de esta página mediante querySelectorAll. Porque en Business Central puedes abrir varias páginas sin cerrar las anteriores.
    FactBox = nodes[nodes.length - 1];

    // Evita los comportamientos por defecto de arrastrar y soltar para los eventos especificados estándar.
    // Esto se hace para tener un control total sobre cómo se interactúa con los archivos arrastrados y soltados en el ControlAddin de Business Central.
    ["dragenter", "dragover", "dragleave", "drop"].forEach((eventName) => {
        FactBox.addEventListener(eventName, preventDefaults, false);
        // También se previenen los comportamientos por defecto a nivel de documento.
        document.body.addEventListener(eventName, preventDefaults, false);
    });

    // Cuando un elemento se arrastra sobre el área de soltar, resalta visualmente el área.
    ["dragenter", "dragover"].forEach((eventName) => {
        FactBox.addEventListener(eventName, highlight, false);
    });

    // Cuando el elemento arrastrado sale del área de soltar o se suelta en ella, se quita el resaltado.
    ["dragleave", "drop"].forEach((eventName) => {
        FactBox.addEventListener(eventName, unhighlight, false);
    });

    // Maneja el evento de soltar un archivo en el área de soltar.
    FactBox.addEventListener("drop", handleDrop, false);
}

// Esta función previene los comportamientos por defecto de los eventos de arrastrar y soltar.
function preventDefaults(e) {
    e.preventDefault(); // Previene la acción por defecto asociada al evento.
    e.stopPropagation(); // Detiene la propagación del evento en la jerarquía del DOM.
}

// Esta función se encarga de resaltar el área de soltar cuando un elemento se arrastra sobre ella.
function highlight(e) {
    FactBox.style.border = "thick dotted blue"; // Cambia el estilo de borde para indicar visualmente el área de soltar.
}

// Esta función se encarga de quitar el resaltado del área de soltar cuando un elemento sale o se suelta en ella.
function unhighlight(e) {
    FactBox.style.border = ""; // Restaura el estilo de borde a su valor por defecto.
}

// Esta función maneja el evento de soltar un archivo en el área de soltar.
function handleDrop(e) {
    var dt = e.dataTransfer; // Obtiene el objeto de transferencia de datos del evento.
    var files = dt.files; // Obtiene la lista de archivos que se soltaron en el área.

    // Llama a la función para manejar los archivos soltados.
    handleFiles(files);
}

// Variable para llevar el conteo de archivos soltados.
var filesCount = 0;

// Esta función maneja una lista de archivos.
function handleFiles(files) {
    // Convierte la lista de archivos en un arreglo para facilitar su manejo.
    files = [...files];
    // Actualiza el conteo de archivos con la cantidad de archivos soltados.
    filesCount = files.length;
    // Llama a la función de subida de archivo para cada archivo en la lista.
    files.forEach(uploadFile);
}

// Esta función se encarga de cargar un archivo al sistema.
function uploadFile(file, i) {
    var reader = new FileReader(); // Crea un nuevo lector de archivos.
    reader.addEventListener("loadend", function () {
        // Cuando se completa la lectura del archivo...
        // El resultado del lector contiene el contenido del archivo en formato base64.
        var base64data = reader.result;

        // Invoca un método de extensibilidad de Business Central para manejar la subida del archivo y enviar la información a la page de Business Central.
        Microsoft.Dynamics.NAV.InvokeExtensibilityMethod("OnFileUpload", [file.name, base64data, filesCount == i + 1]);
    });

    // Lee el contenido del archivo como una URL base64.
    reader.readAsDataURL(file);
}

codeunit 60001 "Variables SingleInstance"
{
    SingleInstance = true;

    #region CELAR
    procedure ClearRecordRefe()
    begin
        Clear(RecordRefe);
    end;
    #endregion

    #region SET
    procedure SetRecordRefe(l_RecordRefe: RecordRef)
    begin
        RecordRefe := l_RecordRefe;
    end;
    #endregion

    #region GET
    procedure GetRecordRefe(): RecordRef
    begin
        exit(RecordRefe);
    end;
    #endregion
    var
        RecordRefe: RecordRef;
}

codeunit 60000 "Events"
{
    #region EVENTOS
    [EventSubscriber(ObjectType::Table, Database::"Document Attachment", OnAfterInitFieldsFromRecRef, '', true, true)]
    local procedure T1173_OnAfterInitFieldsFromRecRef(var DocumentAttachment: Record "Document Attachment"; var RecRef: RecordRef)
    var
        VariablesSingleInstance: Codeunit "Variables SingleInstance";
    begin
        VariablesSingleInstance.SetRecordRefe(RecRef);
    end;
    #endregion
}

page 60015 "AttachmentsDragAndDropFactbox"
{
    Caption = 'Attachments Drag And Drop', Comment = 'ESP="Documentos Adjuntos Drag And Drop"';
    PageType = ListPart;
    UsageCategory = None;
    SourceTable = "Document Attachment";
    InsertAllowed = false;
    ModifyAllowed = false;
    RefreshOnActivate = true;

    layout
    {
        area(content)
        {
            usercontrol(AttachmentsDragAndDrop; "Attachments Drag And Drop")
            {
                ApplicationArea = All;

                trigger ControlAddinReady()
                begin
                    CurrPage.AttachmentsDragAndDrop.InitializeFileDragAndDrop();
                end;

                trigger OnFileUpload(FileName: Text; FileAsText: Text; IsLastFile: Boolean)
                var
                    Base64Convert: Codeunit "Base64 Convert";
                    TempBlob: Codeunit "Temp Blob";
                    RecordRefe: RecordRef;
                    FileInStream: InStream;
                    FileOutStream: OutStream;
                begin
                    TempBlob.CreateOutStream(FileOutStream, TextEncoding::UTF8);
                    Base64Convert.FromBase64(FileAsText.Substring(FileAsText.IndexOf(',') + 1), FileOutStream);
                    TempBlob.CreateInStream(FileInStream, TextEncoding::UTF8);

                    RecordRefe := VariablesSingleInstance.GetRecordRefe();

                    Rec.ID := 0;
                    Rec.SaveAttachmentFromStream(FileInStream, RecordRefe, FileName);

                    if IsLastFile then
                        CurrPage.Update(false);
                end;
            }
            repeater(Control1)
            {
                ShowCaption = false;
                field("File Name"; Rec."File Name")
                {
                    ApplicationArea = All;
                    ToolTip = 'Specifies the value of the File Name field.';
                }
                field("File Extension"; Rec."File Extension")
                {
                    ApplicationArea = All;
                    ToolTip = 'Specifies the value of the File Extensions field.';
                }
            }
        }
    }
    actions
    {
        area(Processing)
        {
            action(DownloadFile)
            {
                ApplicationArea = All;
                Caption = 'Download File';
                ToolTip = 'Download File';
                Image = Download;
                Enabled = Rec."File Name" <> '';
                trigger OnAction()
                begin
                    ExportFile(true);
                end;
            }
        }
    }

    trigger OnOpenPage()
    begin
        VariablesSingleInstance.ClearRecordRefe();
    end;

    trigger OnQueryClosePage(CloseAction: Action): Boolean
    begin
        VariablesSingleInstance.ClearRecordRefe();
    end;

    procedure SetParams(RecVariant: Variant)
    var
        RecordRefe: RecordRef;
    begin
        VariablesSingleInstance.ClearRecordRefe();

        CLEAR(RecordRefe);
        RecordRefe.GETTABLE(RecVariant);
        Rec.InitFieldsFromRecRef(RecordRefe);
    end;

    procedure ExportFile(ShowFileDialog: Boolean): Text
    var
        TempBlob: Codeunit "Temp Blob";
        FileManagement: Codeunit "File Management";
        OutStream: OutStream;
        FullFileName: Text;
    begin
        if Rec.ID = 0 then
            exit;

        if not Rec."Document Reference ID".HasValue then
            exit;

        FullFileName := Rec."File Name" + '.' + Rec."File Extension";
        TempBlob.CreateOutStream(OutStream);
        Rec."Document Reference ID".ExportStream(OutStream);
        exit(FileManagement.BLOBExport(TempBlob, FullFileName, ShowFileDialog));
    end;

    var
        VariablesSingleInstance: Codeunit "Variables SingleInstance";
}

pageextension 81700 "Customer List" extends "Customer List"
{
    layout
    {
        addfirst(factboxes)
        {
            part(DragAndDropFactbox; "AttachmentsDragAndDropFactbox")
            {
                ApplicationArea = All;
                SubPageLink = "Table ID" = const(Database::Customer), "No." = field("No.");
            }
        }
    }
}