refs #1147 Invoice item selectbox style.
This commit is contained in:
Cüneyt Şentürk
parent
1ae0c19b76
commit
f0a9c18ccb
@ -278,7 +278,13 @@ class Items extends Controller
|
||||
}
|
||||
}
|
||||
|
||||
return response()->json($items);
|
||||
return response()->json([
|
||||
'success' => true,
|
||||
'message' => 'Get all items.',
|
||||
'errors' => [],
|
||||
'count' => $items->count(),
|
||||
'data' => ($items->count()) ? $items : null,
|
||||
]);
|
||||
}
|
||||
|
||||
public function total(TotalRequest $request)
|
||||
|
||||
@ -15,10 +15,6 @@ class Form extends Provider
|
||||
public function boot()
|
||||
{
|
||||
// Form components
|
||||
Facade::component('aliasGroup', 'partials.form.alias_group', [
|
||||
'original', 'name', 'text', 'icon', 'attributes' => ['required' => 'required'], 'value' => null, 'col' => 'col-md-6', 'group_class' => null
|
||||
]);
|
||||
|
||||
Facade::component('moneyGroup', 'partials.form.money_group', [
|
||||
'name', 'text', 'icon', 'attributes' => ['required' => 'required'], 'value' => null, 'col' => 'col-md-6', 'group_class' => null
|
||||
]);
|
||||
@ -67,6 +63,10 @@ class Form extends Provider
|
||||
'name', 'text', 'icon', 'values', 'selected' => null, 'attributes' => ['required' => 'required'], 'col' => 'col-md-6', 'group_class' => null
|
||||
]);
|
||||
|
||||
Facade::component('selectRemoteGroup', 'partials.form.select_remote_group', [
|
||||
'name', 'text', 'icon', 'values', 'selected' => null, 'attributes' => ['required' => 'required'], 'col' => 'col-md-6', 'group_class' => null
|
||||
]);
|
||||
|
||||
Facade::component('textareaGroup', 'partials.form.textarea_group', [
|
||||
'name', 'text', 'icon', 'value' => null, 'attributes' => ['rows' => '3'], 'col' => 'col-md-12', 'group_class' => null
|
||||
]);
|
||||
|
||||
680
resources/assets/js/components/AkauntingSelectRemote.vue
Normal file
680
resources/assets/js/components/AkauntingSelectRemote.vue
Normal file
@ -0,0 +1,680 @@
|
||||
<template>
|
||||
<base-input v-if="title" :label="title" :name="name" :class="formClasses" :error="formError">
|
||||
<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">
|
||||
<p class="el-select-dropdown__empty">
|
||||
{{ noMatchingDataText }}
|
||||
</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">
|
||||
{{ noDataText }}
|
||||
</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>
|
||||
|
||||
<template slot="prefix">
|
||||
<span class="el-input__suffix-inner el-select-icon">
|
||||
<i :class="'select-icon-position el-input__icon fa fa-' + icon"></i>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<el-option v-if="!group" v-for="(label, value) in selectOptions"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value">
|
||||
</el-option>
|
||||
|
||||
<el-option-group
|
||||
v-if="group"
|
||||
v-for="(options, name) in selectOptions"
|
||||
:key="name"
|
||||
:label="name">
|
||||
<el-option
|
||||
v-for="(label, value) in options"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value">
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
|
||||
<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">
|
||||
<p class="el-select-dropdown__empty">
|
||||
{{ noMatchingDataText }}
|
||||
</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">
|
||||
{{ noDataText }}
|
||||
</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>
|
||||
|
||||
<template slot="prefix">
|
||||
<span class="el-input__suffix-inner el-select-icon">
|
||||
<i :class="'select-icon-position el-input__icon fa fa-' + icon"></i>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<el-option v-if="!group" v-for="(label, value) in selectOptions"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value">
|
||||
</el-option>
|
||||
|
||||
<el-option-group
|
||||
v-if="group"
|
||||
v-for="(options, name) in selectOptions"
|
||||
:key="name"
|
||||
:label="name">
|
||||
<el-option
|
||||
v-for="(label, value) in options"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value">
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
|
||||
<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">
|
||||
<p class="el-select-dropdown__empty">
|
||||
{{ noMatchingDataText }}
|
||||
</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">
|
||||
{{ noDataText }}
|
||||
</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>
|
||||
|
||||
<template slot="prefix">
|
||||
<span class="el-input__suffix-inner el-select-icon">
|
||||
<i :class="'select-icon-position el-input__icon fa fa-' + icon"></i>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<el-option v-if="!group" v-for="(label, value) in selectOptions"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value">
|
||||
</el-option>
|
||||
|
||||
<el-option-group
|
||||
v-if="group"
|
||||
v-for="(options, name) in selectOptions"
|
||||
:key="name"
|
||||
:label="name">
|
||||
<el-option
|
||||
v-for="(label, value) in options"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value">
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
|
||||
<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">
|
||||
<p class="el-select-dropdown__empty">
|
||||
{{ noMatchingDataText }}
|
||||
</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">
|
||||
{{ noDataText }}
|
||||
</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>
|
||||
|
||||
<template slot="prefix">
|
||||
<span class="el-input__suffix-inner el-select-icon">
|
||||
<i :class="'select-icon-position el-input__icon fa fa-' + icon"></i>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<el-option v-if="!group" v-for="(label, value) in selectOptions"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value">
|
||||
</el-option>
|
||||
|
||||
<el-option-group
|
||||
v-if="group"
|
||||
v-for="(options, name) in selectOptions"
|
||||
:key="name"
|
||||
:label="name">
|
||||
<el-option
|
||||
v-for="(label, value) in options"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value">
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
|
||||
<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>
|
||||
|
||||
<select :name="name" class="d-none" v-model="real_model">
|
||||
<option v-for="(label, value) in selectOptions" :value="value">{{ label }}</option>
|
||||
</select>
|
||||
</base-input>
|
||||
|
||||
<el-select v-else
|
||||
v-model="real_model"
|
||||
@input="change"
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
:placeholder="placeholder"
|
||||
:remote-method="remoteMethod"
|
||||
:loading="loading">
|
||||
<div v-if="addNew.status && options.length != 0" class="el-select-dropdown__wrap" slot="empty">
|
||||
<p class="el-select-dropdown__empty">
|
||||
{{ noMatchingDataText }}
|
||||
</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">
|
||||
{{ noDataText }}
|
||||
</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>
|
||||
|
||||
<template slot="prefix">
|
||||
<span class="el-input__suffix-inner el-select-icon">
|
||||
<i :class="'select-icon-position el-input__icon fa fa-' + icon"></i>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<el-option v-if="!group" v-for="(label, value) in selectOptions"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value">
|
||||
</el-option>
|
||||
|
||||
<el-option-group
|
||||
v-if="group"
|
||||
v-for="(options, name) in selectOptions"
|
||||
:key="name"
|
||||
:label="name">
|
||||
<el-option
|
||||
v-for="(label, value) in options"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value">
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
|
||||
<el-option v-if="addNew.status && selectOptions.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>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Select, Option, OptionGroup, ColorPicker } from 'element-ui';
|
||||
|
||||
import AkauntingModalAddNew from './AkauntingModalAddNew';
|
||||
import AkauntingModal from './AkauntingModal';
|
||||
import AkauntingRadioGroup from './forms/AkauntingRadioGroup';
|
||||
import AkauntingSelect from './AkauntingSelect';
|
||||
import AkauntingDate from './AkauntingDate';
|
||||
import AkauntingRecurring from './AkauntingRecurring';
|
||||
|
||||
import Form from './../plugins/form';
|
||||
|
||||
export default {
|
||||
name: "akaunting-select-remote",
|
||||
|
||||
components: {
|
||||
[Select.name]: Select,
|
||||
[Option.name]: Option,
|
||||
[OptionGroup.name]: OptionGroup,
|
||||
[ColorPicker.name]: ColorPicker,
|
||||
AkauntingModalAddNew,
|
||||
AkauntingRadioGroup,
|
||||
AkauntingSelect,
|
||||
AkauntingModal,
|
||||
AkauntingDate,
|
||||
AkauntingRecurring,
|
||||
},
|
||||
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
default: null,
|
||||
description: "Selectbox label text"
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: '',
|
||||
description: "Selectbox input placeholder text"
|
||||
},
|
||||
formClasses: {
|
||||
type: Array,
|
||||
default: null,
|
||||
description: "Selectbox input class name"
|
||||
},
|
||||
formError: {
|
||||
type: String,
|
||||
default: null,
|
||||
description: "Selectbox input error message"
|
||||
},
|
||||
name: {
|
||||
type: String,
|
||||
default: null,
|
||||
description: "Selectbox attribute name"
|
||||
},
|
||||
value: {
|
||||
type: String,
|
||||
default: null,
|
||||
description: "Selectbox selected value"
|
||||
},
|
||||
options: null,
|
||||
|
||||
model: null,
|
||||
|
||||
icon: {
|
||||
type: String,
|
||||
description: "Prepend icon (left)"
|
||||
},
|
||||
|
||||
addNew: {
|
||||
type: Object,
|
||||
default: function () {
|
||||
return {
|
||||
text: 'Add New Item',
|
||||
status: false,
|
||||
path: null,
|
||||
type: 'modal', // modal, inline
|
||||
field: 'name',
|
||||
buttons: {}
|
||||
};
|
||||
},
|
||||
description: "Selectbox Add New Item Feature"
|
||||
},
|
||||
|
||||
group: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
description: "Selectbox option group status"
|
||||
},
|
||||
multiple: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
description: "Multible feature status"
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
description: "Selectbox disabled status"
|
||||
},
|
||||
collapse: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
description: "Selectbox collapse status"
|
||||
},
|
||||
|
||||
noDataText: {
|
||||
type: String,
|
||||
default: 'No Data',
|
||||
description: "Selectbox empty options message"
|
||||
},
|
||||
noMatchingDataText: {
|
||||
type: String,
|
||||
default: 'No Matchign Data',
|
||||
description: "Selectbox search option not found item message"
|
||||
},
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
add_new: this.addNew,
|
||||
add_new_text: this.addNew.text,
|
||||
selectOptions: this.options,
|
||||
real_model: this.model,
|
||||
add_new_html: '',
|
||||
form: {},
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.real_model = this.value;
|
||||
|
||||
this.$emit('interface', this.real_model);
|
||||
},
|
||||
|
||||
methods: {
|
||||
remoteMethod(query) {
|
||||
if (query !== '') {
|
||||
this.loading = true;
|
||||
/*
|
||||
this.list = [];
|
||||
this.selectOptions = this.options;
|
||||
|
||||
Object.keys(this.selectOptions).forEach(key => {
|
||||
const item = this.selectOptions[key];
|
||||
|
||||
if (item.toLowerCase().indexOf(query.toLowerCase()) > -1) {
|
||||
this.list.push(this.selectOptions[key]);
|
||||
}
|
||||
});
|
||||
|
||||
this.selectOptions = this.list;
|
||||
*/
|
||||
|
||||
axios.get(url + '/common/items/autocomplete', {
|
||||
params: {
|
||||
type: 'email',
|
||||
query: query,
|
||||
currency_code: 'USD',
|
||||
}
|
||||
})
|
||||
.then(response => {
|
||||
this.loading = false;
|
||||
|
||||
this.selectOptions = response.data.data;
|
||||
})
|
||||
.catch(e => {
|
||||
})
|
||||
.finally(function () {
|
||||
// always executed
|
||||
});
|
||||
} else {
|
||||
this.selectOptions = this.options;
|
||||
}
|
||||
},
|
||||
|
||||
change() {
|
||||
this.$emit('change', this.real_model);
|
||||
this.$emit('interface', this.real_model);
|
||||
this.$emit('label', this.selectOptions[this.real_model]);
|
||||
|
||||
alert(this.selectOptions[this.real_model]);
|
||||
},
|
||||
|
||||
onAddItem() {
|
||||
// Get Select Input value
|
||||
var value = this.$children[0].$children[0].$children[0].$refs.input.value;
|
||||
|
||||
if (this.add_new.type == 'inline') {
|
||||
this.addInline(value);
|
||||
} else {
|
||||
this.onModal(value);
|
||||
}
|
||||
},
|
||||
|
||||
addInline(value) {
|
||||
|
||||
},
|
||||
|
||||
onModal(value) {
|
||||
let add_new = this.add_new;
|
||||
|
||||
axios.get(this.add_new.path)
|
||||
.then(response => {
|
||||
add_new.status = true;
|
||||
add_new.html = response.data.html;
|
||||
|
||||
this.$children[0].$children[0].visible = false;
|
||||
|
||||
this.add_new_html = Vue.component('add-new-component', function (resolve, reject) {
|
||||
resolve({
|
||||
template: '<div><akaunting-modal-add-new :show="add_new.status" @submit="onSubmit" @cancel="add_new.status = false" :buttons="add_new.buttons" :title="add_new.text" :is_component=true :message="add_new.html"></akaunting-modal-add-new></div>',
|
||||
|
||||
components: {
|
||||
AkauntingModalAddNew,
|
||||
AkauntingRadioGroup,
|
||||
AkauntingSelect,
|
||||
AkauntingModal,
|
||||
AkauntingDate,
|
||||
AkauntingRecurring,
|
||||
[ColorPicker.name]: ColorPicker,
|
||||
},
|
||||
|
||||
data: function () {
|
||||
return {
|
||||
add_new: add_new,
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
onSubmit(event) {
|
||||
this.$emit('submit', event);
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
})
|
||||
.catch(e => {
|
||||
this.errors.push(e);
|
||||
})
|
||||
.finally(function () {
|
||||
// always executed
|
||||
});
|
||||
},
|
||||
|
||||
onSubmit(event) {
|
||||
this.form = event;
|
||||
|
||||
axios.post(this.form.action, this.form.data())
|
||||
.then(response => {
|
||||
this.form.loading = false;
|
||||
|
||||
if (response.data.success) {
|
||||
this.selectOptions[response.data.data.id] = response.data.data['name'];
|
||||
this.real_model = response.data.data.id.toString();
|
||||
|
||||
this.change();
|
||||
|
||||
this.add_new.status = false;
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
this.form.loading = false;
|
||||
|
||||
this.form.onFail(error);
|
||||
|
||||
this.method_show_html = error.message;
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
options: function (options) {
|
||||
// update options
|
||||
//this.selectOptions = options;
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.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>
|
||||
2
resources/assets/js/mixins/global.js
vendored
2
resources/assets/js/mixins/global.js
vendored
@ -4,6 +4,7 @@ import AkauntingSearch from './../components/AkauntingSearch';
|
||||
import AkauntingModal from './../components/AkauntingModal';
|
||||
import AkauntingRadioGroup from './../components/forms/AkauntingRadioGroup';
|
||||
import AkauntingSelect from './../components/AkauntingSelect';
|
||||
import AkauntingSelectRemote from './../components/AkauntingSelectRemote';
|
||||
import AkauntingDate from './../components/AkauntingDate';
|
||||
import AkauntingRecurring from './../components/AkauntingRecurring';
|
||||
|
||||
@ -19,6 +20,7 @@ export default {
|
||||
AkauntingSearch,
|
||||
AkauntingRadioGroup,
|
||||
AkauntingSelect,
|
||||
AkauntingSelectRemote,
|
||||
AkauntingModal,
|
||||
AkauntingDate,
|
||||
AkauntingRecurring,
|
||||
|
||||
@ -149,6 +149,7 @@ return [
|
||||
'month' => 'Month',
|
||||
'year' => 'Year',
|
||||
|
||||
'type_item_name' => 'Type an item name',
|
||||
'no_data' => 'No data',
|
||||
'no_matching_data' => 'No matching data',
|
||||
|
||||
|
||||
@ -1,30 +0,0 @@
|
||||
@stack($name . '_input_start')
|
||||
|
||||
<div
|
||||
class="form-group visible-field {{ $col }} {{ isset($attributes['required']) ? 'required' : '' }}"
|
||||
:class="[{'has-error': {{ isset($attributes['v-error']) ? $attributes['v-error'] : 'form.errors.get("' . $name . '")' }} }]">
|
||||
{!! Form::label($name, $text, ['class' => 'form-control-label'])!!}
|
||||
|
||||
<div class="input-group input-group-merge {{ $group_class }}">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text">
|
||||
<i class="fa fa-{{ $icon }}"></i>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<vue-suglify :slugify="form.{{ $original }}" :slug.sync="form.{{ $name }}" :disabled="true">
|
||||
{!! Form::text($name, $value, array_merge([
|
||||
'class' => 'form-control',
|
||||
"slot-scope" => "{inputBidding}",
|
||||
"v-bind" => "inputBidding"
|
||||
], $attributes)) !!}
|
||||
</vue-suglify>
|
||||
</div>
|
||||
|
||||
<div class="invalid-feedback d-block"
|
||||
v-if="{{ isset($attributes['v-error']) ? $attributes['v-error'] : 'form.errors.has("' . $name . '")' }}"
|
||||
v-html="{{ isset($attributes['v-error-message']) ? $attributes['v-error-message'] : 'form.errors.get("' . $name . '")' }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@stack($name . '_input_end')
|
||||
@ -2,25 +2,42 @@
|
||||
|
||||
<akaunting-select
|
||||
class="{{ $col }} {{ isset($attributes['required']) ? 'required' : '' }}"
|
||||
:form-classes="[{'has-error': {{ isset($attributes['v-error']) ? $attributes['v-error'] : 'form.errors.get("' . $name . '")' }} }]"
|
||||
|
||||
@if (!empty($attributes['v-error']))
|
||||
:form-classes="[{'has-error': {{ $attributes['v-error'] }} }]"
|
||||
@else
|
||||
:form-classes="[{'has-error': form.errors.get('{{ $name }}') }]"
|
||||
@endif
|
||||
|
||||
:icon="'{{ $icon }}'"
|
||||
:title="'{{ $text }}'"
|
||||
:placeholder="'{{ trans('general.form.select.field', ['field' => $text]) }}'"
|
||||
:name="'{{ $name }}'"
|
||||
:options="{{ json_encode($values) }}"
|
||||
:value="'{{ old($name, $selected) }}'"
|
||||
:icon="'{{ $icon }}'"
|
||||
@interface="{{ !empty($attributes['v-model']) ? $attributes['v-model'] . ' = $event' : (!empty($attributes['data-field']) ? 'form.' . $attributes['data-field'] . '.' . $name . ' = $event' : 'form.' . $name . ' = $event') }}"
|
||||
|
||||
@if (!empty($attributes['v-model']))
|
||||
@interface="{{ $attributes['v-model'] . ' = $event' }}"
|
||||
@elseif (!empty($attributes['data-field']))
|
||||
@interface="{{ 'form.' . $attributes['data-field'] . '.' . $name . ' = $event' }}"
|
||||
@else
|
||||
@interface="form.{{ $name }} = $event"
|
||||
@endif
|
||||
|
||||
@if (!empty($attributes['change']))
|
||||
@change="{{ $attributes['change'] }}($event)"
|
||||
@endif
|
||||
|
||||
@if (isset($attributes['disabled']))
|
||||
:disabled="{{ $attributes['disabled'] }}"
|
||||
@endif
|
||||
|
||||
@if(isset($attributes['v-error-message']))
|
||||
:form-error="{{ $attributes['v-error-message'] }}"
|
||||
@else
|
||||
:form-error="form.errors.get('{{ $name }}')"
|
||||
@endif
|
||||
|
||||
:no-data-text="'{{ trans('general.no_data') }}'"
|
||||
:no-matching-data-text="'{{ trans('general.no_matching_data') }}'"
|
||||
></akaunting-select>
|
||||
|
||||
45
resources/views/partials/form/select_remote_group.blade.php
Normal file
45
resources/views/partials/form/select_remote_group.blade.php
Normal file
@ -0,0 +1,45 @@
|
||||
@stack($name . '_input_start')
|
||||
|
||||
<akaunting-select-remote
|
||||
class="{{ $col }} {{ isset($attributes['required']) ? 'required' : '' }}"
|
||||
|
||||
@if (!empty($attributes['v-error']))
|
||||
:form-classes="[{'has-error': {{ $attributes['v-error'] }} }]"
|
||||
@else
|
||||
:form-classes="[{'has-error': form.errors.get('{{ $name }}') }]"
|
||||
@endif
|
||||
|
||||
:icon="'{{ $icon }}'"
|
||||
:title="'{{ $text }}'"
|
||||
:placeholder="'{{ trans('general.form.select.field', ['field' => $text]) }}'"
|
||||
:name="'{{ $name }}'"
|
||||
:options="{{ json_encode($values) }}"
|
||||
:value="'{{ old($name, $selected) }}'"
|
||||
|
||||
@if (!empty($attributes['v-model']))
|
||||
@interface="{{ $attributes['v-model'] . ' = $event' }}"
|
||||
@elseif (!empty($attributes['data-field']))
|
||||
@interface="{{ 'form.' . $attributes['data-field'] . '.' . $name . ' = $event' }}"
|
||||
@else
|
||||
@interface="form.{{ $name }} = $event"
|
||||
@endif
|
||||
|
||||
@if (!empty($attributes['change']))
|
||||
@change="{{ $attributes['change'] }}($event)"
|
||||
@endif
|
||||
|
||||
@if (isset($attributes['disabled']))
|
||||
:disabled="{{ $attributes['disabled'] }}"
|
||||
@endif
|
||||
|
||||
@if(isset($attributes['v-error-message']))
|
||||
:form-error="{{ $attributes['v-error-message'] }}"
|
||||
@else
|
||||
:form-error="form.errors.get('{{ $name }}')"
|
||||
@endif
|
||||
|
||||
:no-data-text="'{{ trans('general.no_data') }}'"
|
||||
:no-matching-data-text="'{{ trans('general.no_matching_data') }}'"
|
||||
></akaunting-select-remote>
|
||||
|
||||
@stack($name . '_input_end')
|
||||
@ -16,15 +16,43 @@
|
||||
@stack('name_td_start')
|
||||
<td class="col-md-3 border-right-0 border-bottom-0">
|
||||
@stack('name_input_start')
|
||||
<input class="form-control text-center"
|
||||
autocomplete="off"
|
||||
required="required"
|
||||
<akaunting-select-remote
|
||||
:form-classes="[{'has-error': form.errors.get('name') }]"
|
||||
:placeholder="'{{ trans('general.type_item_name') }}'"
|
||||
:name="'item_id'"
|
||||
:options="{{ json_encode($items) }}"
|
||||
:value="'{{ old('item_id', '') }}'"
|
||||
:add-new="{{ json_encode([
|
||||
'status' => true,
|
||||
'text' => trans('general.form.add_new', ['field' => trans_choice('general.items', 1)]),
|
||||
'path' => isset($attributes['path']) ? $attributes['path']: false,
|
||||
'type' => isset($attributes['type']) ? $attributes['type'] : 'modal',
|
||||
'field' => isset($attributes['field']) ? $attributes['field'] : 'name',
|
||||
'buttons' => [
|
||||
'cancel' => [
|
||||
'text' => trans('general.cancel'),
|
||||
'icon' => 'fas fa-times',
|
||||
'class' => 'btn-outline-secondary'
|
||||
],
|
||||
'confirm' => [
|
||||
'text' => trans('general.save'),
|
||||
'icon' => 'fas fa-save',
|
||||
'class' => 'btn-success'
|
||||
]
|
||||
]
|
||||
])}}"
|
||||
@interface="row.item_id = $event"
|
||||
@label="row.name = $event"
|
||||
:form-error="form.errors.get('name')"
|
||||
:no-data-text="'{{ trans('general.no_data') }}'"
|
||||
:no-matching-data-text="'{{ trans('general.no_matching_data') }}'"
|
||||
></akaunting-select-remote>
|
||||
<input type="hidden"
|
||||
data-item="name"
|
||||
v-model="row.name"
|
||||
@input="onCalculateTotal"
|
||||
name="item[][name]"
|
||||
type="text">
|
||||
{!! $errors->first('item.name', '<p class="help-block">:message</p>') !!}
|
||||
name="item[][name]">
|
||||
{!! $errors->first('item.name', '<p class="help-block">:message</p>') !!}
|
||||
@stack('name_input_end')
|
||||
</td>
|
||||
@stack('name_td_end')
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user