function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Anonymous DeveloperAnonymous Developer 

Need Help making a controller

Hello everyone I'm seeking assistance in developing a controller for my Lightning Web Component (LWC). I aim to implement comprehensive control over file uploads, including the capability to manage both uploads and deletions of the uploaded files. Below, you'll find the relevant code for reference.Your guidance and expertise on this matter would be greatly appreciated. Thank you. 

HTML
<template>
    <div class="container">
        <p style="display:none">{recipientId}</p>
        <p style="display:none">{staticFileName}</p>
        <p style="display:none">{agreementLabel}</p>
        <p style="display:none">{documentUploadRequired}</p>

        <div class="buttons-section">
            <lightning-button 
                label={downloadButtonLabel} 
                onclick={handleDownload}
            ></lightning-button>
        </div>

        <div class="read-only-card">
            <object 
                data={pdfUrl} 
                title="Static Resource" 
                type="application/pdf" 
                width="100%" 
                height="100%"
            ></object>
        </div>

        <div class="file-upload-section">
            <lightning-file-upload
                accept=".pdf"
                onuploadfinished={handleUploadFinished}
                disabled={isDocumentUploaded}
                required
                record-id={recordId}
            ></lightning-file-upload>
        </div>

        <div class="checkbox-section">
            <lightning-input 
                type="checkbox" 
                label={agreementLabel}
                checked={isAgreementChecked}
                onchange={handleAgreementChange} 
                disabled={isDocumentUploaded}
            ></lightning-input>
        </div>

        <div class="buttons-section">
            <lightning-button 
                label={submitButtonLabel} 
                onclick={handleAcknowledge}
                disabled={isButtonDisabled} 
            ></lightning-button>
        </div>
    </div>
</template>

Javascript
import { LightningElement, api, track } from 'lwc';
import { FlowNavigationNextEvent, FlowNavigationBackEvent, FlowNavigationFinishEvent } from 'lightning/flowSupport';

export default class aS_AcknowledgeDocumentLWC extends LightningElement {

    @api recipientId;
    @api staticFileName;
    @api agreementLabel;
    @api documentUploadRequired;
    @api documentUploadLabel;
    @api loadingMessage;
    @api submitButtonLabel;
    @api downloadButtonLabel;
    @api fileName;

    

    @track selectedFile;
    @track isAgreementChecked = false;
    @track isDocumentUploaded = false;



    get pdfUrl() {
        const url = `/resource/${this.fileName}`;
        console.log('PDF URL:', url);
        return url;
    }

    get isButtonDisabled(){
        return !this.isAgreementChecked || this.isDocumentUploaded;
    }
    
    removeFile() {
        const fileUpload = this.template.querySelector('lightning-file-upload');
        fileUpload.clear();
        this.isDocumentUploaded = false;
    }

    handleAgreementChange(event) {
        this.isAgreementChecked = event.target.checked;//checkbox interaction
    }

    handleDocumentUpload() {    
        if (!this.selectedFile) { // check if file is selected
            this.showToast('Error', 'Please select a file.', 'error');
            return;
        }
    
        this.loadingMessage = 'Uploading document...'; // show loading message
    
        const formData = new FormData(); // create formData object to prepare for file upload
        formData.append('document', this.selectedFile);
    
        handleUpload({ formData })// send file to server for upload using apex
            .then(result => {
                this.isDocumentUploaded = true; // Set to true after successful upload
                this.loadingMessage = ''; // Clear loading message
                    if (result.startsWith('Error')) {
                        console.error(result);
                    } else {
                        console.log('File uploaded successfully:', result);
                    }
            })
            .catch(error => { // handle any errors that occur during the upload
                console.error('Error uploading document', error);
                this.loadingMessage = ''; // clear loading message
                this.showToast('Error', 'An error occurred while uploading the document.', 'error');
            });
    }
    

    handleAcknowledge() {
        this.dispatchEvent(new FlowNavigationNextEvent());
    }

    handleDownload() { // Construct the URL to download the PDF document
        const pdfFileName = this.fileName;
        const pdfUrl = `/resource/${pdfFileName}`;

        const anchor = document.createElement('a'); // craete an anchor element to trigger the download
        anchor.href = pdfUrl;
        anchor.download = pdfFileName;
    
        anchor.click(); // trigger the download
    }
    
    handleUploadFinished(event) {
        const uploadedFiles = event.detail.files;
        if (uploadedFiles.length > 0) {
            this.uploadedFileName = uploadedFiles[0].name;
            this.isDocumentUploaded = true;
        } 
    }
    
    
}

need help with the code. THanks in advance.
AshwiniAshwini (Salesforce Developers)