<template>
|
<el-select
|
v-model="occupationJobId"
|
filterable
|
style="flex: 1"
|
class="pr-2"
|
placeholder="全部职业（工种）"
|
@change="changeOccupation()"
|
>
|
<el-option
|
v-for="(item,index) in newOccupationItems"
|
:key="`occupation${index}`"
|
:label="item.occupationJob"
|
:value="item.id"
|
/>
|
</el-select>
|
<el-select
|
v-model="level"
|
:disabled="!occupationJobId"
|
style="flex: 1" class="pr-2"
|
placeholder="全部等级"
|
multiple
|
>
|
<el-option
|
v-for="(item,index) in levelItems"
|
:key="`level${index}`"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
</template>
|
|
<script>
|
import { useOptionItemsStore } from '@/stores/optionItems.js'
|
|
export default {
|
setup() {
|
const { occupationItems } = useOptionItemsStore()
|
return { occupationItems }
|
},
|
data() {
|
return {
|
occupationJobId: '',
|
level: [],
|
levelItems: []
|
}
|
},
|
props: {
|
modelValue: {
|
type: Object,
|
default: () => {
|
return {}
|
}
|
},
|
},
|
computed: {
|
newOccupationItems() {
|
return [{ occupationJob: '全部职业（工种）', id: '' }, ...this.occupationItems]
|
}
|
},
|
watch: {
|
occupationJobId: function() {
|
this.$emit('update:modelValue', {...this.modelValue, occupationJobId: this.occupationJobId})
|
},
|
level: function() {
|
this.$emit('update:modelValue', {...this.modelValue, level: this.level } )
|
}
|
},
|
methods: {
|
changeOccupation() {
|
this.level = []
|
const id = this.occupationJobId
|
if (id) {
|
let list = []
|
const obj = this.occupationItems.find(ele => ele.id == id)
|
let levelStr = obj.levelStr
|
levelStr?.split(',').forEach(ele => {
|
list.push({
|
label: this.$getLevelName(ele),
|
value: ele
|
})
|
})
|
this.levelItems = list
|
}
|
}
|
}
|
}
|
|
</script>
|
