kknongchang_2506/app/Admin/Extensions

Admin 扩展功能

复制功能 (Copyable)

为 Dcat Admin 的 Show 和 Form 页面添加复制按钮功能，方便用户复制字段内容。

功能特点

1. Show 页面复制：在详情页面为字段添加复制按钮
2. Form 页面复制：在表单页面为只读字段添加复制按钮
3. 批量添加：支持批量为多个字段添加复制功能
4. 格式化支持：支持自定义格式化函数
5. 现代浏览器兼容：支持新旧浏览器的复制API

使用方法

1. Show 页面使用

use App\Admin\Extensions\CopyableHelper;

// 在 Controller 的 detail 方法中
protected function detail($id)
{
    $show = Show::make($id, new YourModel(), function (Show $show) {
        // 单个字段添加复制功能
        CopyableHelper::addToShow($show, 'id', 'ID');
        CopyableHelper::addToShow($show, 'name', '名称');
        
        // 批量添加复制功能
        CopyableHelper::addMultipleToShow($show, [
            'email' => '邮箱',
            'phone' => '电话',
            'address' => '地址'
        ]);
        
        // 带格式化的复制功能
        CopyableHelper::addFormattedToShow($show, 'created_at', '创建时间', function($value) {
            return $value ? $value->format('Y-m-d H:i:s') : '';
        });
    });

    return $show;
}

2. Form 页面使用

use App\Admin\Extensions\CopyableHelper;

// 在 Controller 的 form 方法中
protected function form()
{
    return Form::make(new YourModel(), function (Form $form) {
        // 普通表单字段
        $form->text('name', '名称');
        
        // 只读字段添加复制功能
        CopyableHelper::addToForm($form, 'id', 'ID');
        CopyableHelper::addToForm($form, 'created_at', '创建时间');
        
        // 批量添加复制功能
        CopyableHelper::addMultipleToForm($form, [
            'uuid' => 'UUID',
            'token' => 'Token'
        ]);
    });
}

3. 直接使用扩展类

use App\Admin\Extensions\Show\Copyable as ShowCopyable;
use App\Admin\Extensions\Form\Copyable as FormCopyable;

// Show 页面
$show->field('field_name', '字段标签')->as(function ($value) {
    return (new ShowCopyable())->setValue($value)->render();
});

// Form 页面
$copyableField = new FormCopyable('field_name', ['字段标签']);
$copyableField->setForm($form);

样式说明

• Show 页面：复制按钮显示在字段值的右侧，点击后显示成功提示
• Form 页面：复制按钮显示为独立的按钮，样式与表单保持一致
• Grid 页面：继续使用原有的 copyable() 方法

浏览器兼容性

• 支持现代浏览器的 navigator.clipboard API
• 兼容旧版浏览器的 document.execCommand 方法
• 自动降级处理，确保在各种环境下都能正常工作

注意事项

1. 复制功能需要在 HTTPS 环境下才能完全发挥作用
2. 某些浏览器可能需要用户交互才能触发复制功能
3. 建议在生产环境中测试复制功能的兼容性