Как добавить палитру цветов в приложение laravel 5? - PullRequest
Новая
       19

Как добавить палитру цветов в приложение laravel 5?

0 голосов
/ 10 марта 2020

В моем laravel 5.7 / jquery 3.4.1 я хочу добавить палитру цветов из https://github.com/narsenico/a-color-picker, а в моем файле edit.blade. php я добавляю ссылку на цвет- файлы палитры и js файл, связанный с этим редактором после файлов палитры цветов: 

@section('scripts')

    <link rel="stylesheet" href="{{ asset('/css/acolorpicker.css') }}" type="text/css">
    <script src="{{ asset('/js/acolorpicker.js') }}"></script>

    <script src="{{ asset('js/'.$current_admin_template.'/color.js') }}{{  "?dt=".time()  }}"></script>

    <script src="{{ asset('vendor/jsvalidation/js/jsvalidation.js')}}"></script>
    {!! JsValidator::formRequest('App\Http\Requests\ColorRequest', '#form_color_edit'); !!}


    <script>
        /*<![CDATA[*/

        var backendColor = new backendColor('edit',  // must be called before jQuery(document).ready(function ($) {
            <?php echo $appParamsForJSArray ?>
        );
        jQuery(document).ready(function ($) {
            backendColor.onBackendPageInit('edit')
        });

        /*]]>*/
    </script>

@endsection

и в цвете. js Я пытаюсь запустить палитру цветов как: 

var this_backend_home_url
var this_id
var this_csrf_token

function backendColor(page, paramsArray) {  // constructor of backend Color's editor - set all from referring page and from server
    // alert( "backendColor  paramsArray::"+var_dump(paramsArray) )
    this_backend_home_url = paramsArray.backend_home_url;
    this_backendLengthMenuArray = paramsArray.backendLengthMenuArray;
    this_csrf_token = paramsArray.csrf_token;

    if (page == "edit") {
        this_id = paramsArray.id;
    }
    if (page == "list") {
        this.ColorsLoad()
        $(".dataTables_filter").css("display", "none")
        $(".dataTables_info").css("display", "none")
    }
} // function backendColor(Params) {  constructor of backend Color's editor - set all from referring page and from server


backendColor.prototype.onBackendPageInit = function (page) {  // all vars/objects init
    backendInit()
    const AColorPicker = require('a-color-picker'); // I GOT JS errors (Below) !
    AColorPicker.from('color-picker');

} // backendColor.prototype.onBackendPageInit= function(page) {
...

Но я получил JS ошибок: 

Uncaught SyntaxError: Cannot use import statement outside a module
DevTools failed to parse SourceMap: http://local-boxbooking2.com/css/bootstrap.min.css.map
jquery-3.3.1.min.js:2 jQuery.Deferred exception: require is not defined ReferenceError: require is not defined
    at backendColor.onBackendPageInit (http://local-boxbooking2.com/js/Backend/color.js?dt=1583830130:24:26)
    at HTMLDocument.<anonymous> (http://local-boxbooking2.com/admin/colors/3/edit:385:26)
    at l (http://local-boxbooking2.com/js/jquery-3.3.1.min.js:2:29375)
    at c (http://local-boxbooking2.com/js/jquery-3.3.1.min.js:2:29677) undefined
w.Deferred.exceptionHook @ jquery-3.3.1.min.js:2
c @ jquery-3.3.1.min.js:2
setTimeout (async)
(anonymous) @ jquery-3.3.1.min.js:2
u @ jquery-3.3.1.min.js:2
fireWith @ jquery-3.3.1.min.js:2
fire @ jquery-3.3.1.min.js:2
u @ jquery-3.3.1.min.js:2
fireWith @ jquery-3.3.1.min.js:2
ready @ jquery-3.3.1.min.js:2
_ @ jquery-3.3.1.min.js:2
jquery-3.3.1.min.js:2 Uncaught ReferenceError: require is not defined
    at backendColor.onBackendPageInit (color.js?dt=1583830130:24)
    at HTMLDocument.<anonymous> (edit:385)
    at l (jquery-3.3.1.min.js:2)
    at c (jquery-3.3.1.min.js:2)

Какой правильный способ добавить палитру цветов в проект?

Спасибо!

...