|
|
@@ -13,9 +13,6 @@ class Select extends Field
|
|
|
{
|
|
|
use CanCascadeFields;
|
|
|
|
|
|
- public static $js = '@select2';
|
|
|
- public static $css = '@select2';
|
|
|
-
|
|
|
protected $cascadeEvent = 'change';
|
|
|
|
|
|
/**
|
|
|
@@ -106,33 +103,9 @@ class Select extends Field
|
|
|
$class = static::FIELD_CLASS_PREFIX.$field;
|
|
|
}
|
|
|
|
|
|
- $sourceUrl = admin_url($sourceUrl);
|
|
|
-
|
|
|
- $script = <<<JS
|
|
|
-$(document).off('change', "{$this->getElementClassSelector()}");
|
|
|
-$(document).on('change', "{$this->getElementClassSelector()}", function () {
|
|
|
- var target = $(this).closest('.fields-group').find(".$class");
|
|
|
-
|
|
|
- if (String(this.value) !== '0' && ! this.value) {
|
|
|
- return;
|
|
|
- }
|
|
|
- $.ajax("$sourceUrl?q="+this.value).then(function (data) {
|
|
|
- target.find("option").remove();
|
|
|
- $(target).select2({
|
|
|
- data: $.map(data, function (d) {
|
|
|
- d.id = d.$idField;
|
|
|
- d.text = d.$textField;
|
|
|
- return d;
|
|
|
- })
|
|
|
- }).val(target.attr('data-value').split(',')).trigger('change');
|
|
|
- });
|
|
|
-});
|
|
|
-$("{$this->getElementClassSelector()}").trigger('change');
|
|
|
-JS;
|
|
|
-
|
|
|
- Admin::script($script);
|
|
|
+ $url = admin_url($sourceUrl);
|
|
|
|
|
|
- return $this;
|
|
|
+ return $this->addVariables(['load' => compact('url', 'class', 'idField', 'textField')]);
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
@@ -158,47 +131,12 @@ JS;
|
|
|
return admin_url($url);
|
|
|
}, (array) $sourceUrls));
|
|
|
|
|
|
- $script = <<<JS
|
|
|
-(function () {
|
|
|
- var fields = '$fieldsStr'.split('^');
|
|
|
- var urls = '$urlsStr'.split('^');
|
|
|
-
|
|
|
- var refreshOptions = function(url, target) {
|
|
|
- $.ajax(url).then(function(data) {
|
|
|
- target.find("option").remove();
|
|
|
- $(target).select2({
|
|
|
- data: $.map(data, function (d) {
|
|
|
- d.id = d.$idField;
|
|
|
- d.text = d.$textField;
|
|
|
- return d;
|
|
|
- })
|
|
|
- }).val(target.data('value').split(',')).trigger('change');
|
|
|
- });
|
|
|
- };
|
|
|
-
|
|
|
- $(document).off('change', "{$this->getElementClassSelector()}");
|
|
|
- $(document).on('change', "{$this->getElementClassSelector()}", function () {
|
|
|
- var _this = this;
|
|
|
- var promises = [];
|
|
|
-
|
|
|
- fields.forEach(function(field, index){
|
|
|
- var target = $(_this).closest('.fields-group').find('.' + fields[index]);
|
|
|
-
|
|
|
- if (_this.value !== '0' && ! _this.value) {
|
|
|
- return;
|
|
|
- }
|
|
|
- promises.push(refreshOptions(urls[index] + "?q="+ _this.value, target));
|
|
|
- });
|
|
|
-
|
|
|
- $.when(promises).then(function() {});
|
|
|
- });
|
|
|
- $("{$this->getElementClassSelector()}").trigger('change');
|
|
|
-})()
|
|
|
-JS;
|
|
|
-
|
|
|
- Admin::script($script);
|
|
|
-
|
|
|
- return $this;
|
|
|
+ return $this->addVariables(['loads' => [
|
|
|
+ 'fields' => $fieldsStr,
|
|
|
+ 'urls' => $urlsStr,
|
|
|
+ 'idField' => $idField,
|
|
|
+ 'textField' => $textField,
|
|
|
+ ]]);
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
@@ -255,39 +193,31 @@ JS;
|
|
|
$ajaxOptions = [
|
|
|
'url' => admin_url($url.'?'.http_build_query($parameters)),
|
|
|
];
|
|
|
- $configs = array_merge([
|
|
|
- 'allowClear' => true,
|
|
|
- 'placeholder' => [
|
|
|
- 'id' => '',
|
|
|
- 'text' => $this->placeholder(),
|
|
|
- ],
|
|
|
- ], $this->config);
|
|
|
-
|
|
|
- $configs = json_encode($configs);
|
|
|
- $configs = substr($configs, 1, strlen($configs) - 2);
|
|
|
|
|
|
- $ajaxOptions = json_encode(array_merge($ajaxOptions, $options));
|
|
|
+ $ajaxOptions = array_merge($ajaxOptions, $options);
|
|
|
|
|
|
- $this->script = <<<JS
|
|
|
-$.ajax({$ajaxOptions}).done(function(data) {
|
|
|
+ return $this->addVariables(['remoteOptions' => $ajaxOptions]);
|
|
|
+ }
|
|
|
|
|
|
- $("{$this->getElementClassSelector()}").each(function (_, select) {
|
|
|
- select = $(select);
|
|
|
+ /**
|
|
|
+ * @param string|array $key
|
|
|
+ * @param mixed $value
|
|
|
+ *
|
|
|
+ * @return $this
|
|
|
+ */
|
|
|
+ public function addDefaultConfig($key, $value = null)
|
|
|
+ {
|
|
|
+ if (is_array($key)) {
|
|
|
+ foreach ($key as $k => $v) {
|
|
|
+ $this->addDefaultConfig($k, $v);
|
|
|
+ }
|
|
|
|
|
|
- select.select2({
|
|
|
- data: data,
|
|
|
- $configs
|
|
|
- });
|
|
|
-
|
|
|
- var value = select.data('value') + '';
|
|
|
-
|
|
|
- if (value) {
|
|
|
- select.val(value.split(',')).trigger("change")
|
|
|
- }
|
|
|
- });
|
|
|
-});
|
|
|
+ return $this;
|
|
|
+ }
|
|
|
|
|
|
-JS;
|
|
|
+ if (! isset($this->config[$key])) {
|
|
|
+ $this->config[$key] = $value;
|
|
|
+ }
|
|
|
|
|
|
return $this;
|
|
|
}
|
|
|
@@ -303,55 +233,13 @@ JS;
|
|
|
*/
|
|
|
public function ajax(string $url, string $idField = 'id', string $textField = 'text')
|
|
|
{
|
|
|
- $configs = array_merge([
|
|
|
- 'allowClear' => true,
|
|
|
- 'placeholder' => $this->placeholder(),
|
|
|
+ $this->addDefaultConfig([
|
|
|
'minimumInputLength' => 1,
|
|
|
- ], $this->config);
|
|
|
-
|
|
|
- $configs = json_encode($configs);
|
|
|
- $configs = substr($configs, 1, strlen($configs) - 2);
|
|
|
+ ]);
|
|
|
|
|
|
$url = admin_url($url);
|
|
|
|
|
|
- $this->script = <<<JS
|
|
|
-
|
|
|
-$("{$this->getElementClassSelector()}").select2({
|
|
|
- ajax: {
|
|
|
- url: "$url",
|
|
|
- dataType: 'json',
|
|
|
- delay: 250,
|
|
|
- data: function (params) {
|
|
|
- return {
|
|
|
- q: params.term,
|
|
|
- page: params.page
|
|
|
- };
|
|
|
- },
|
|
|
- processResults: function (data, params) {
|
|
|
- params.page = params.page || 1;
|
|
|
-
|
|
|
- return {
|
|
|
- results: $.map(data.data, function (d) {
|
|
|
- d.id = d.$idField;
|
|
|
- d.text = d.$textField;
|
|
|
- return d;
|
|
|
- }),
|
|
|
- pagination: {
|
|
|
- more: data.next_page_url
|
|
|
- }
|
|
|
- };
|
|
|
- },
|
|
|
- cache: true
|
|
|
- },
|
|
|
- $configs,
|
|
|
- escapeMarkup: function (markup) {
|
|
|
- return markup;
|
|
|
- }
|
|
|
-});
|
|
|
-
|
|
|
-JS;
|
|
|
-
|
|
|
- return $this;
|
|
|
+ return $this->addVariables(['ajax' => compact('url', 'idField', 'textField')]);
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
@@ -386,35 +274,22 @@ JS;
|
|
|
*/
|
|
|
public function render()
|
|
|
{
|
|
|
- static::defineLang();
|
|
|
-
|
|
|
- $configs = array_merge([
|
|
|
+ $this->addDefaultConfig([
|
|
|
'allowClear' => true,
|
|
|
'placeholder' => [
|
|
|
'id' => '',
|
|
|
'text' => $this->placeholder(),
|
|
|
],
|
|
|
- ], $this->config);
|
|
|
-
|
|
|
- $configs = json_encode($configs);
|
|
|
-
|
|
|
- if (empty($this->script)) {
|
|
|
- $this->script = "$(\"{$this->getElementClassSelector()}\").select2($configs);";
|
|
|
- }
|
|
|
+ ]);
|
|
|
|
|
|
$this->addCascadeScript();
|
|
|
|
|
|
- if ($this->options instanceof \Closure) {
|
|
|
- $this->options = $this->options->bindTo($this->values());
|
|
|
-
|
|
|
- $this->options(call_user_func($this->options, $this->value(), $this));
|
|
|
- }
|
|
|
-
|
|
|
- $this->options = array_filter($this->options, 'strlen');
|
|
|
+ $this->formatOptions();
|
|
|
|
|
|
$this->addVariables([
|
|
|
'options' => $this->options,
|
|
|
'groups' => $this->groups,
|
|
|
+ 'configs' => $this->config,
|
|
|
]);
|
|
|
|
|
|
$this->attribute('data-value', implode(',', Helper::array($this->value())));
|
|
|
@@ -422,6 +297,17 @@ JS;
|
|
|
return parent::render();
|
|
|
}
|
|
|
|
|
|
+ protected function formatOptions()
|
|
|
+ {
|
|
|
+ if ($this->options instanceof \Closure) {
|
|
|
+ $this->options = $this->options->bindTo($this->values());
|
|
|
+
|
|
|
+ $this->options(call_user_func($this->options, $this->value(), $this));
|
|
|
+ }
|
|
|
+
|
|
|
+ $this->options = array_filter($this->options, 'strlen');
|
|
|
+ }
|
|
|
+
|
|
|
/**
|
|
|
* {@inheritdoc}
|
|
|
*/
|
|
|
@@ -435,48 +321,4 @@ JS;
|
|
|
|
|
|
return $this;
|
|
|
}
|
|
|
-
|
|
|
- /**
|
|
|
- * @return void
|
|
|
- */
|
|
|
- public static function defineLang()
|
|
|
- {
|
|
|
- $lang = trans('select2');
|
|
|
- if (! is_array($lang) || empty($lang)) {
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
- $locale = config('app.locale');
|
|
|
-
|
|
|
- Admin::script(
|
|
|
- <<<JS
|
|
|
-(function () {
|
|
|
- if (! $.fn.select2) {
|
|
|
- return;
|
|
|
- }
|
|
|
- var e = $.fn.select2.amd;
|
|
|
-
|
|
|
- return e.define("select2/i18n/{$locale}", [], function () {
|
|
|
- return {
|
|
|
- errorLoading: function () {
|
|
|
- return "{$lang['error_loading']}"
|
|
|
- }, inputTooLong: function (e) {
|
|
|
- return "{$lang['input_too_long']}".replace(':num', e.input.length - e.maximum)
|
|
|
- }, inputTooShort: function (e) {
|
|
|
- return "{$lang['input_too_short']}".replace(':num', e.minimum - e.input.length)
|
|
|
- }, loadingMore: function () {
|
|
|
- return "{$lang['loading_more']}"
|
|
|
- }, maximumSelected: function (e) {
|
|
|
- return "{$lang['maximum_selected']}".replace(':num', e.maximum)
|
|
|
- }, noResults: function () {
|
|
|
- return "{$lang['no_results']}"
|
|
|
- }, searching: function () {
|
|
|
- return "{$lang['searching']}"
|
|
|
- }
|
|
|
- }
|
|
|
- }), {define: e.define, require: e.require}
|
|
|
-})()
|
|
|
-JS
|
|
|
- );
|
|
|
- }
|
|
|
}
|