refs #1075 : Selectbox change style and added language text

This commit is contained in:
Cüneyt Şentürk 2020-01-18 11:45:03 +03:00
parent 072de6b7e2
commit 981cad8cb6
9 changed files with 185 additions and 34 deletions

View File

@ -7,13 +7,33 @@
<el-select v-model="real_model" @input="change" disabled filterable v-if="disabled"
:placeholder="placeholder">
<div v-if="addNew.status && options.length != 0" class="el-select-dropdown__wrap" slot="empty">
<span></span>
<p class="el-select-dropdown__empty">
{{ noMatchingData }}
</p>
<ul class="el-scrollbar__view el-select-dropdown__list">
<li class="el-select-dropdown__item el-select__footer">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</li>
</ul>
</div>
<div v-else-if="addNew.status && options.length == 0" slot="empty">
<p class="el-select-dropdown__empty">
{{ noData }}
</p>
<ul class="el-scrollbar__view el-select-dropdown__list">
<li class="el-select-dropdown__item hover" @click="onAddItem">
<span>{{ add_new_text }}</span>
<li class="el-select-dropdown__item el-select__footer">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</li>
</ul>
</div>
@ -43,21 +63,46 @@
</el-option>
</el-option-group>
<li v-if="addNew.status" class="el-select-dropdown__item hover" @click="onAddItem">
<span>{{ add_new_text }}</span>
</li>
<el-option v-if="addNew.status && options.length != 0" class="el-select__footer" :value="add_new">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</el-option>
</el-select>
<el-select v-model="real_model" @input="change" filterable v-if="!disabled && !multiple"
:placeholder="placeholder">
<div v-if="addNew.status && options.length != 0" class="el-select-dropdown__wrap" slot="empty">
<span></span>
<p class="el-select-dropdown__empty">
{{ noMatchingData }}
</p>
<ul class="el-scrollbar__view el-select-dropdown__list">
<li class="el-select-dropdown__item el-select__footer">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</li>
</ul>
</div>
<div v-else-if="addNew.status && options.length == 0" slot="empty">
<p class="el-select-dropdown__empty">
{{ noData }}
</p>
<ul class="el-scrollbar__view el-select-dropdown__list">
<li class="el-select-dropdown__item hover" @click="onAddItem">
<span>{{ add_new_text }}</span>
<li class="el-select-dropdown__item el-select__footer">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</li>
</ul>
</div>
@ -87,21 +132,46 @@
</el-option>
</el-option-group>
<li v-if="addNew.status" class="el-select-dropdown__item hover" @click="onAddItem">
<span>{{ add_new_text }}</span>
</li>
<el-option v-if="addNew.status && options.length != 0" class="el-select__footer" :value="add_new">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</el-option>
</el-select>
<el-select v-model="real_model" @input="change" filterable v-if="!disabled && multiple && !collapse" multiple
:placeholder="placeholder">
<div v-if="addNew.status && options.length != 0" class="el-select-dropdown__wrap" slot="empty">
<span></span>
<p class="el-select-dropdown__empty">
{{ noMatchingData }}
</p>
<ul class="el-scrollbar__view el-select-dropdown__list">
<li class="el-select-dropdown__item el-select__footer">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</li>
</ul>
</div>
<div v-else-if="addNew.status && options.length == 0" slot="empty">
<p class="el-select-dropdown__empty">
{{ noData }}
</p>
<ul class="el-scrollbar__view el-select-dropdown__list">
<li class="el-select-dropdown__item hover" @click="onAddItem">
<span>{{ add_new_text }}</span>
<li class="el-select-dropdown__item el-select__footer">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</li>
</ul>
</div>
@ -131,21 +201,46 @@
</el-option>
</el-option-group>
<li v-if="addNew.status" class="el-select-dropdown__item hover" @click="onAddItem">
<span>{{ add_new_text }}</span>
</li>
<el-option v-if="addNew.status && options.length != 0" class="el-select__footer" :value="add_new">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</el-option>
</el-select>
<el-select v-model="real_model" @input="change" filterable v-if="!disabled && multiple && collapse" multiple collapse-tags
:placeholder="placeholder">
<div v-if="addNew.status && options.length != 0" class="el-select-dropdown__wrap" slot="empty">
<span></span>
<p class="el-select-dropdown__empty">
{{ noMatchingData }}
</p>
<ul class="el-scrollbar__view el-select-dropdown__list">
<li class="el-select-dropdown__item el-select__footer">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</li>
</ul>
</div>
<div v-else-if="addNew.status && options.length == 0" slot="empty">
<p class="el-select-dropdown__empty">
{{ noData }}
</p>
<ul class="el-scrollbar__view el-select-dropdown__list">
<li class="el-select-dropdown__item hover" @click="onAddItem">
<span>{{ add_new_text }}</span>
<li class="el-select-dropdown__item el-select__footer">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</li>
</ul>
</div>
@ -175,9 +270,14 @@
</el-option>
</el-option-group>
<li v-if="addNew.status" class="el-select-dropdown__item hover" @click="onAddItem">
<span>{{ add_new_text }}</span>
</li>
<el-option v-if="addNew.status && options.length != 0" class="el-select__footer" :value="add_new">
<div @click="onAddItem">
<i class="fas fa-plus"></i>
<span>
{{ add_new_text }}
</span>
</div>
</el-option>
</el-select>
<component v-bind:is="add_new_html" @submit="onSubmit"></component>
@ -216,12 +316,12 @@ export default {
title: {
type: String,
default: '',
description: "Modal header title"
description: "Selectbox label"
},
placeholder: {
type: String,
default: '',
description: "Modal header title"
description: "Selectbox input placeholder"
},
formClasses: null,
formError: null,
@ -252,7 +352,10 @@ export default {
group: false,
multiple:false,
disabled:false,
collapse: false
collapse: false,
noData: '',
noMatchingData: ''
},
data() {
@ -382,4 +485,37 @@ export default {
.form-group .modal {
z-index: 3050;
}
.el-select-dropdown__empty {
padding: 10px 0 0 !important;
}
.el-select__footer {
text-align: center;
border-top: 1px solid #dee2e6;
padding: 0px;
cursor: pointer;
color: #3c3f72;
font-weight: bold;
height: 38px;
line-height: 38px;
margin-top: 5px;
margin-bottom: -6px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}
.el-select__footer.el-select-dropdown__item.hover {
background-color: inherit !important;
}
.el-select__footer.el-select-dropdown__item:hover, .el-select__footer.el-select-dropdown__item:focus {
background-color: #3c3f72 !important;
color: white !important;
border-top-color: #3c3f72;
}
.el-select__footer div span {
margin-left: 5px;
}
</style>

View File

@ -147,6 +147,9 @@ return [
'month' => 'Month',
'year' => 'Year',
'no_data' => 'No data',
'no_matching_data' => 'No matching data',
'card' => [
'name' => 'Name on Card',
'number' => 'Card Number',

View File

@ -4,12 +4,12 @@
<div class="mr-6">
<span class="text-white d-none d-sm-block">
<b v-text="bulk_action.count"></b>
<span v-if="bulk_action.count === 1">
{{ strtolower(trans_choice($text, 1)) }}
</span>
<span v-else-if="bulk_action.count > 1">
{{ strtolower(trans_choice($text, 2)) }}
</span>
<span v-if="bulk_action.count === 1">
{{ strtolower(trans_choice($text, 1)) }}
</span>
<span v-else-if="bulk_action.count > 1">
{{ strtolower(trans_choice($text, 2)) }}
</span>
{{ trans('bulk_actions.selected') }}
</span>
</div>
@ -17,7 +17,7 @@
<div class="w-25 mr-4" v-if="bulk_action.count">
<div class="form-group mb-0">
<select class="form-control form-control-sm" v-model="{{ !empty($attributes['v-model']) ? $attributes['v-model'] : 'bulk_action.value' }}" @change="onChange">
<option value="*">{{ trans_choice('bulk_actions.bulk_actions',2) }}</option>
<option value="*">{{ trans_choice('bulk_actions.bulk_actions', 2) }}</option>
@foreach($actions as $key => $action)
<option
value="{{ $key }}"

View File

@ -41,6 +41,8 @@
@else
:form-error="form.errors.get('{{ $name }}')"
@endif
:no-data="'{{ trans('general.no_data') }}'"
:no-matching-data="'{{ trans('general.no_matching_data') }}'"
></akaunting-select>
@stack($name . '_input_end')

View File

@ -21,6 +21,8 @@
:form-error="{{ $attributes['v-error-message'] }}"
@else
:form-error="form.errors.get('{{ $name }}')"
:no-data="'{{ trans('general.no_data') }}'"
:no-matching-data="'{{ trans('general.no_matching_data') }}'"
@endif
></akaunting-select>

View File

@ -32,5 +32,7 @@
@change="{{ $attributes['change'] }}($event)"
@endif
:form-error="{{ isset($attributes['v-error-message']) ? $attributes['v-error-message'] : 'form.errors.get("' . $name . '")' }}"
:no-data="'{{ trans('general.no_data') }}'"
:no-matching-data="'{{ trans('general.no_matching_data') }}'"
></akaunting-select>
@stack($name . '_input_end')

View File

@ -20,5 +20,7 @@
@else
:form-error="form.errors.get('{{ $name }}')"
@endif
:no-data="'{{ trans('general.no_data') }}'"
:no-matching-data="'{{ trans('general.no_matching_data') }}'"
></akaunting-select>
@stack($name . '_input_end')

View File

@ -33,5 +33,7 @@
@change="{{ $attributes['change'] }}($event)"
@endif
:form-error="{{ isset($attributes['v-error-message']) ? $attributes['v-error-message'] : 'form.errors.get("' . $name . '")' }}"
:no-data="'{{ trans('general.no_data') }}'"
:no-matching-data="'{{ trans('general.no_matching_data') }}'"
></akaunting-select>
@stack($name . '_input_end')

View File

@ -14,5 +14,7 @@
@change="{{ $attributes['change'] }}($event)"
@endif
:form-error="{{ isset($attributes['v-error-message']) ? $attributes['v-error-message'] : 'form.errors.get("' . $name . '")' }}"
:no-data="'{{ trans('general.no_data') }}'"
:no-matching-data="'{{ trans('general.no_matching_data') }}'"
></akaunting-select>
@stack($name . '_input_end')