Files
sk_fems_ui/components/common/select/SelectUseFg.vue
2025-07-22 09:58:38 +07:00

127 lines
2.3 KiB
Vue

<template>
<v-row class="search-box" align="center" no-gutters>
<v-col :cols="labelCols">
<label for="" class="search-box-label">
<v-icon
v-if="iconShow"
small
:class="['mr-1', required ? 'icon-orange' : 'icon-blue']"
>$icoBulletPoint</v-icon
>
{{ label }}
</label>
</v-col>
<v-col :cols="textCols">
<v-select
v-model="selectValue"
:items="selectList"
item-text="commCdNm"
item-value="commCd"
solo
outlined
:hide-details="true"
append-icon=""
:class="['v-select__custom', customClass]"
><template v-slot:append>
<v-icon>$icoChevronDown</v-icon>
</template></v-select>
</v-col>
</v-row>
</template>
<script>
import { mapState, mapMutations, mapActions } from 'vuex';
export default {
props: {
parentPrgmId: {
type: String,
require: true,
},
diffModel: {
type: String,
require: false,
},
label: {
type: String,
require: false,
default: '사용여부',
},
isAll: {
type: Boolean,
require: false,
default: false,
},
textCols: {
type: Number,
require: false,
default: 7,
},
labelCols: {
type: Number,
require: false,
default: 4,
},
iconShow: {
type: Boolean,
require: false,
default: true,
},
customClass: {
type: String,
require: false,
default: null,
}
},
data() {
return {};
},
computed: {
...mapState({
searchParam: state => state.pageData,
menuData: 'menuData',
}),
selectValue: {
get() {
if (!this.diffModel) {
return this.searchParam[this.parentPrgmId].useFg;
} else {
return this.searchParam[this.parentPrgmId][this.diffModel];
}
},
set(value) {
if (!this.diffModel) {
return this.setPageData({ useFg: value });
} else {
return this.setPageData({ [this.diffModel]: value });
}
},
},
selectList() {
let list = this.searchParam[this.parentPrgmId].useFgList;
if (this.isAll) {
list.unshift({
commCd: '',
commCdNm: '전체',
});
}
return list;
},
},
created() {
const params = {
commGrpCd: 'CO_USEFG',
useFg: '1',
};
this.getUseFgList(params);
},
methods: {
...mapMutations({ setPageData: 'setPageData' }),
...mapActions({
getUseFgList: 'modules/search/getUseFgList',
}),
},
};
</script>
<style></style>