Laravel-Backpack / CRUD

Build custom admin panels. Fast!
https://backpackforlaravel.com
MIT License
3k stars 880 forks source link

New column clipboard #5453

Open adriallongarriu opened 4 months ago

adriallongarriu commented 4 months ago

WHY

I need a be able to copy the content of the column to the clipboard. Basically is a text column with an icon and on click the span copy the content to the clipboard. Maybe this can be and optional parameter on the basic column text buy for now i created a separated column. Using a column this can be used in lists and in show view. On click show a Noty to the user to report whether it was able to be copied or not image

HOW

How did you achieve that, in technical terms?

Use javascript to copy text to clipboard using await navigator.clipboard.writeText(text);

Is it a breaking change?

No

How can we test the before & after?

Note: on localhost only show the error message. To work need https otherwise the browser will block the action.

  [
        'name'  => 'name',
        'label' => trans('backpack.name'),
        'type' => 'clipboard',
  ],
o15a3d4l11s2 commented 4 months ago

It is much nicer than the workaround I have used 😅

CRUD::field('name')->type('text')->suffix('<button type="button" class="backpack-copy"><i class="lar la-clipboard"></i></button>')

and then created a clipboard.js file with

$(".backpack-copy").on("click", function () {
    const value = $(this).closest('.input-group').find('input').val();
    if (value) {
        navigator.clipboard.writeText(value);
    }
});

and added it to the CRUD with

Widget::add()->type('script')->content(basset(base_path('resources/js/admin/clipboard.js')));

Update Just realised you have created a column, not a field.

karandatwani92 commented 4 months ago

Hey @adriallongarriu Thanks for coming up with this cool little useful feature. I appreciate your effort & the idea.

Hey @tabacitu @pxpm How do find the implementation?

pxpm commented 3 months ago

Thanks @adriallongarriu for the PR 🙏

I like the copy feature. I've need it myself, and as @o15a3d4l11s2 showed, he also probably needed it in other contexts.

I am just not sure about the implementation. Should we add this as a new column, or add the copy ability to existing columns ?

I think the later is the most appropriate, as for example you can have a date column with a specific format, and when you copy you expect to copy the formatted date. Or in an upload copy the asset url, not only the displayed text.

I am postponing this decision to v7.

Cheers