128 lines
2.8 KiB
Vue
128 lines
2.8 KiB
Vue
<template>
|
|
<v-row class="search-box" align="center" no-gutters>
|
|
<v-col
|
|
v-if="item.label"
|
|
cols="4"
|
|
:style="item.padding ? 'padding-left:10px' : ''"
|
|
>
|
|
<label for="" class="search-box-label">
|
|
<v-icon
|
|
x-small
|
|
:color="item.required ? '#fb8200' : 'primary'"
|
|
class="mr-1"
|
|
>mdi-record-circle</v-icon
|
|
>
|
|
{{ item.label }}
|
|
</label>
|
|
</v-col>
|
|
<v-col :cols="item.label ? (item.textCols ? item.textCols : 7) : ''">
|
|
<v-select
|
|
v-model="selectValue"
|
|
:items="typeof item.list != 'string' ? item.list : myListData"
|
|
:item-text="typeof item.list != 'string' ? 'text' : item.itemText"
|
|
:item-value="typeof item.list != 'string' ? 'value' : item.itemValue"
|
|
outlined
|
|
:hide-details="true"
|
|
append-icon="mdi-chevron-down"
|
|
class="v-select__custom"
|
|
:disabled="item.disabled || false"
|
|
:readonly="item.readonly || false"
|
|
:required="item.required || false"
|
|
@change="modifyValue($event, item.valueNm)"
|
|
></v-select>
|
|
</v-col>
|
|
</v-row>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState, mapMutations } from 'vuex';
|
|
export default {
|
|
props: {
|
|
parentPrgmId: {
|
|
type: String,
|
|
require: true,
|
|
},
|
|
bindingData: {
|
|
type: String,
|
|
require: false,
|
|
},
|
|
item: {
|
|
type: Object,
|
|
require: true,
|
|
},
|
|
// myGrid: {
|
|
// require: true
|
|
// }
|
|
},
|
|
data() {
|
|
return {};
|
|
},
|
|
computed: {
|
|
...mapState({
|
|
myListData(state) {
|
|
let list = [...state.pageData[this.parentPrgmId][this.item.list]];
|
|
list.forEach((item, idx) => {
|
|
if (item.commCdNm && item.commCdNm == '전체') {
|
|
list.splice(idx, 1);
|
|
}
|
|
if (this.item.addNull && idx == 0) {
|
|
list.unshift({
|
|
commCd: '',
|
|
commCdNm: '',
|
|
commCdAbbrnm: '',
|
|
commGrpCd: 'EM_ECC_KIND',
|
|
});
|
|
}
|
|
});
|
|
return list;
|
|
},
|
|
myBindingData(state) {
|
|
if (!this.bindingData) {
|
|
return state.pageData[this.parentPrgmId]['rowGridSelectData'];
|
|
} else {
|
|
return state.pageData[this.parentPrgmId][this.bindingData][
|
|
'rowGridSelectData'
|
|
];
|
|
}
|
|
},
|
|
selectRow(state) {
|
|
return state.pageData[this.parentPrgmId][
|
|
this.bindingData + 'SelectKey'
|
|
];
|
|
},
|
|
}),
|
|
selectValue: {
|
|
get() {
|
|
return this.myBindingData ? this.myBindingData[this.item.valueNm] : '';
|
|
},
|
|
set(value) {
|
|
this.$emit('getValue', {
|
|
key: this.item.valueNm,
|
|
value: value,
|
|
});
|
|
return value;
|
|
// return this.setGridDataEdit({
|
|
// gridKey: this.bindingData,
|
|
// selectRow: this.selectRow,
|
|
// objKey: this.item.valueNm,
|
|
// value
|
|
// });
|
|
},
|
|
},
|
|
},
|
|
created() {},
|
|
methods: {
|
|
...mapMutations({ setGridDataEdit: 'setGridDataEdit' }),
|
|
modifyValue(v, n) {
|
|
const dt = {
|
|
columnName: n,
|
|
value: v,
|
|
};
|
|
this.$emit('gridEditingFinish', dt);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style></style>
|