92 lines
1.6 KiB
Vue
92 lines
1.6 KiB
Vue
|
<template>
|
||
|
|
<el-select
|
||
|
|
v-model="innerValue"
|
||
|
|
:placeholder="placeholder"
|
||
|
|
:clearable="clearable"
|
||
|
|
:disabled="disabled"
|
||
|
|
:filterable="filterable"
|
||
|
|
@change="onChange"
|
||
|
|
>
|
||
|
|
<el-option
|
||
|
|
v-for="item in categoryOptions"
|
||
|
|
:key="item.categoryId"
|
||
|
|
:label="item.categoryName"
|
||
|
|
:value="item.categoryId"
|
||
|
|
/>
|
||
|
|
</el-select>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { listCategory } from '@/api/wms/category';
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'CategorySelect',
|
||
|
|
props: {
|
||
|
|
value: {
|
||
|
|
type: [Number, String, null],
|
||
|
|
default: null
|
||
|
|
},
|
||
|
|
categoryType: {
|
||
|
|
type: String,
|
||
|
|
required: true,
|
||
|
|
validator: v => [
|
||
|
|
'base_material',
|
||
|
|
'surface_treatment',
|
||
|
|
'customer_req',
|
||
|
|
'spec_packaging'
|
||
|
|
].includes(v)
|
||
|
|
},
|
||
|
|
placeholder: {
|
||
|
|
type: String,
|
||
|
|
default: '请选择分类'
|
||
|
|
},
|
||
|
|
clearable: {
|
||
|
|
type: Boolean,
|
||
|
|
default: true
|
||
|
|
},
|
||
|
|
disabled: {
|
||
|
|
type: Boolean,
|
||
|
|
default: false
|
||
|
|
},
|
||
|
|
filterable: {
|
||
|
|
type: Boolean,
|
||
|
|
default: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
categoryOptions: [],
|
||
|
|
innerValue: this.value
|
||
|
|
};
|
||
|
|
},
|
||
|
|
watch: {
|
||
|
|
value(val) {
|
||
|
|
this.innerValue = val;
|
||
|
|
},
|
||
|
|
categoryType: {
|
||
|
|
handler() {
|
||
|
|
this.loadOptions();
|
||
|
|
},
|
||
|
|
immediate: true
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
this.loadOptions();
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
loadOptions() {
|
||
|
|
listCategory({ categoryType: this.categoryType, isEnabled: 1 }).then(res => {
|
||
|
|
this.categoryOptions = res.rows || [];
|
||
|
|
});
|
||
|
|
},
|
||
|
|
onChange(val) {
|
||
|
|
this.$emit('input', val);
|
||
|
|
this.$emit('change', val);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
</style>
|