Your IP : 216.73.216.43

Current Path : /var/www/surf/TYPO3/vendor/mask/mask/Build/Sources/js/components/
Upload File :
Current File : /var/www/surf/TYPO3/vendor/mask/mask/Build/Sources/js/components/element-color-picker.js

import Vue from 'vue';
import ColorPicker from '@typo3/backend/color-picker.js';
import $ from 'jquery';

export default Vue.component(
          'element-color-picker',
          {
            props: {
              element: Object,
              label: String,
              property: String,
            },
            mounted: function () {
              ColorPicker.initialize();
              $(this.$refs['colorpicker-' + this.property]).minicolors('settings', {
                changeDelay: 200,
                change: function () {
                  this.element[this.property] = $(this.$refs['colorpicker-' + this.property]).data('minicolorsLastChange')['value'];
                }.bind(this)
              });
            },
            template: `
    <div class="col-xs-6 col-6">
        <label class="t3js-formengine-label form-label" for="meta_color">
            {{ label }}
        </label>
        <div class="t3js-formengine-field-item">
            <div class="form-control-wrap">
                <input
                    class="form-control t3js-color-picker"
                    :value="element[property]"
                    :ref="'colorpicker-' + property"
                />
            </div>
            <input type="hidden" ref="colorvalue"/>
        </div>
    </div>
        `
          }
      );