In a Salesforce LWC app how can I add checkbox values to an object's field and show it in a data-table?

Question

I have made my research, but couldn't find the answer.

I have a Lightning App in Salesforce, I used LWC Js and Apex. In one part of the app the user can add a 'desk item' (by typing its name) and select from a checkbox 1-2 items to add them to the 'desk'.

I used Apex to transfer the value of the 'desk item' to an Object and I can show it in a list (in the app).

How can I add the checkbox value(s) to the submitDesk(){...} so it sends its value(s) along with the 'desk item' value?
I don' know where/how exactly to add and to get it back?

The JS Code

import { LightningElement, track } from 'lwc';
import createDesk from '@salesforce/apex/FlexOfficeController.createDesk';
import getDesks from '@salesforce/apex/FlexOfficeController.getDesks';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';

export default class DeskList extends LightningElement {

// Desk

    @track data_desks = [];
   
    //table to show the desks's Id + Name, and the checkbox
    columns = [
        { label: 'Id', fieldName: 'Id', type: 'text' },
        { label: 'Name', fieldName: 'Name', type: 'text' },
        { label: 'Accessories', fieldName: **the checkbox value**, type: 'text' }
    ];

    // value to the picklist
    connectedCallback(){
            this.retreiveDesk();
    }


    retreiveDesk(){
        getDesks({})
        .then(d => {
            this.data_desks = JSON.parse(d);
        })
    }
    
    desk = {};
    changeValue(event){
        this.desk[event.target.name] = event.target.value
    }

    submitDesk(){

        console.log(this.desk, this.value + 'Hi there');
        createDesk({desk:JSON.stringify(this.desk)})
        .then(data=> {
            console.log(data + 'hello');
            this.retreiveDesk();
            // toaster
            const evt = new ShowToastEvent({
                title: "New desk",
                message: `succefully created. Check out your reservation.`,
                variant: "success"
            })
            this.dispatchEvent(evt);
        })
    }


// Checkbox

    value = [];

    get options() {
        return [
            { label: 'Mouse', value: 'mouse' },
            { label: 'Screen', value: 'screen' },
        ];
    }

    // put the checkbox values into a string ('join')
    get checkboxValues() {
        console.log(this.value);
        return this.value.join(',');
    }

    handleCheckboxChange(event) {
        this.value = event.detail.value;
    }
}

Apex Controller

public class FlexOfficeController {
   
    @AuraEnabled
    public static string createDesk(String desk){
        try {
            Desk__c d  = (Desk__c)JSON.deserialize(desk, Desk__c.class);
            insert d;
            return d.id;
        } catch (Exception e) {
            throw new AuraHandledException(e.getMessage());
        }
    }

    @AuraEnabled
    public static string getDesks(){
        try {
            List<Desk__c> desks = new List<Desk__c> ();
            desks = [SELECT Id, Name FROM Desk__c];
            return JSON.serialize(desks);
        } catch (Exception e) {
            throw new AuraHandledException(e.getMessage());
        }
    }
}

HTML

<template>
    <lightning-card>
        <div class="slds-m-around_medium slds-theme_alert-texture">
            <lightning-input name="Name" label="Name your desk" onchange={changeValue}></lightning-input>
            <lightning-checkbox-group name="Accessories" label="Checkbox Group" options={options} value={value}
                onchange={handleCheckboxChange}></lightning-checkbox-group>
            <p>{checkboxValues}</p>
            <lightning-button onclick={submitDesk} label="Submit"></lightning-button>
            <lightning-datatable key-field="id" data={data_desks} columns={columns} hide-checkbox-column></lightning-datatable> 
        </div>
    </lightning-card>
</template>