Skip to content

Commit

Permalink
close #1414 Fixed: Re-sort select options.
Browse files Browse the repository at this point in the history
  • Loading branch information
@cuneytsenturk
cuneytsenturk committed Apr 18, 2020
1 parent ec07675 commit b6d4710
Showing 1 changed file with 105 additions and 31 deletions.
136 changes: 105 additions & 31 deletions resources/assets/js/components/AkauntingSelect.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,14 +51,15 @@
</span>
</template>

<el-option v-if="!group" v-for="(label, value) in selectOptions"
:key="value"
:label="label"
:value="value">
<span class="float-left">{{ label }}</span>
<span class="badge badge-pill badge-success float-right mt-2" v-if="new_options[value]">{{ new_text }}</span>
<el-option v-if="!group" v-for="(option, key) in selectOptions"
:key="key"
:label="option.value"
:value="option.key">
<span class="float-left">{{ option.value }}</span>
<span class="badge badge-pill badge-success float-right mt-2" v-if="new_options[option.key]">{{ new_text }}</span>
</el-option>

<!-- Todo sortable -->
<el-option-group
v-if="group"
v-for="(options, name) in selectOptions"
Expand Down Expand Up @@ -124,12 +125,12 @@
</span>
</template>

<el-option v-if="!group" v-for="(label, value) in selectOptions"
:key="value"
:label="label"
:value="value">
<span class="float-left">{{ label }}</span>
<span class="badge badge-pill badge-success float-right mt-2" v-if="new_options[value]">{{ new_text }}</span>
<el-option v-if="!group" v-for="(option, key) in selectOptions"
:key="key"
:label="option.value"
:value="option.key">
<span class="float-left">{{ option.value }}</span>
<span class="badge badge-pill badge-success float-right mt-2" v-if="new_options[option.key]">{{ new_text }}</span>
</el-option>

<el-option-group
Expand Down Expand Up @@ -197,14 +198,15 @@
</span>
</template>

<el-option v-if="!group" v-for="(label, value) in selectOptions"
:key="value"
:label="label"
:value="value">
<span class="float-left">{{ label }}</span>
<span class="badge badge-pill badge-success float-right mt-2" v-if="new_options[value]">{{ new_text }}</span>
<el-option v-if="!group" v-for="(option, key) in selectOptions"
:key="key"
:label="option.value"
:value="option.key">
<span class="float-left">{{ option.value }}</span>
<span class="badge badge-pill badge-success float-right mt-2" v-if="new_options[option.key]">{{ new_text }}</span>
</el-option>

<!-- Todo sortable -->
<el-option-group
v-if="group"
v-for="(options, name) in selectOptions"
Expand Down Expand Up @@ -270,14 +272,15 @@
</span>
</template>

<el-option v-if="!group" v-for="(label, value) in selectOptions"
:key="value"
:label="label"
:value="value">
<span class="float-left">{{ label }}</span>
<span class="badge badge-pill badge-success float-right mt-2" v-if="new_options[value]">{{ new_text }}</span>
<el-option v-if="!group" v-for="(option, key) in selectOptions"
:key="key"
:label="option.value"
:value="option.key">
<span class="float-left">{{ option.value }}</span>
<span class="badge badge-pill badge-success float-right mt-2" v-if="new_options[option.key]">{{ new_text }}</span>
</el-option>

<!-- Todo sortable -->
<el-option-group
v-if="group"
v-for="(options, name) in selectOptions"
Expand Down Expand Up @@ -343,14 +346,15 @@
</span>
</template>

<el-option v-if="!group" v-for="(label, value) in selectOptions"
:key="value"
:label="label"
:value="value">
<span class="float-left">{{ label }}</span>
<span class="badge badge-pill badge-success float-right mt-2" v-if="new_options[value]">{{ new_text }}</span>
<el-option v-if="!group" v-for="(option, key) in selectOptions"
:key="key"
:label="option.value"
:value="option.key">
<span class="float-left">{{ option.value }}</span>
<span class="badge badge-pill badge-success float-right mt-2" v-if="new_options[option.key]">{{ new_text }}</span>
</el-option>

<!-- Todo sortable -->
<el-option-group
v-if="group"
v-for="(options, name) in selectOptions"
Expand Down Expand Up @@ -451,6 +455,12 @@ export default {
},
options: null,
option_sortable: {
type: String,
default: 'value',
description: "Option Sortable type (key|value)"
},
model: {
type: [String, Number, Array, Object],
default: '',
Expand Down Expand Up @@ -478,7 +488,7 @@ export default {
description: "Selectbox Add New Item Feature"
},
group: {
group: {
type: Boolean,
default: false,
description: "Selectbox option group status"
Expand Down Expand Up @@ -537,6 +547,37 @@ export default {
},
created() {
if (this.group != true && Object.keys(this.options).length) {
let sortable = [];
let option_sortable = this.option_sortable;
for (var option_key in this.options) {
sortable.push({
'key' : option_key,
'value': this.options[option_key]
});
}
if (option_sortable == 'value') {
sortable.sort(function(a, b) {
var sortableA = a[option_sortable].toUpperCase();
var sortableB = b[option_sortable].toUpperCase();
let comparison = 0;
if (sortableA > sortableB) {
comparison = 1;
} else if (sortableA < sortableB) {
comparison = -1;
}
return comparison;
});
}
this.options = sortable;
}
this.new_options = {};
},
Expand Down Expand Up @@ -744,6 +785,39 @@ export default {
}
},
selectOptions: function (options) {
if (this.group != true && Object.keys(options).length) {
let sortable = [];
let option_sortable = this.option_sortable;
for (var option_key in options) {
sortable.push({
'key' : option_key,
'value': options[option_key]
});
}
if (this.option_sortable == 'value') {
sortable.sort(function(a, b) {
var sortableA = a[option_sortable].toUpperCase();
var sortableB = b[option_sortable].toUpperCase();
let comparison = 0;
if (sortableA > sortableB) {
comparison = 1;
} else if (sortableA < sortableB) {
comparison = -1;
}
return comparison;
});
}
this.selectOptions = sortable;
}
},
real_model: function (value) {
if (this.multiple) {
return;
Expand Down

0 comments on commit b6d4710

Please sign in to comment.