12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091 |
- <template>
- <div>
- <el-select
- v-model="value"
- ref="select"
- placeholder="请选择"
- filterable
- remote
- :remote-method="remoteMethod"
- @change = "onChange">
- <el-option
- v-for="item in options"
- :key="item.value"
- :label="item.label"
- :value="item.value">
- </el-option>
- </el-select>
- </div>
- </template>
- <script>
- export default {
- name: 'dict-select',
- props: ['dictId', 'dictType'],
- model: {
- prop: 'dictId',
- event: 'select'
- },
- watch: {
- dictId (newVal) {
- this.init(newVal, this.dictType)
- }
- },
- data () {
- return {
- value: '',
- name: '',
- options: [],
- loading: false
- }
- },
- mounted () {
- this.init(this.dictId, this.dictType)
- },
- methods: {
- async init (dictId, dictType) {
- this.options = []
- this.current = 1
- this.getList(dictId, dictType)
- },
- remoteMethod (query) {
- this.options = []
- this.name = query
- this.getList(this.dictId, this.dictType)
- },
- getList (dictId, dictType) {
- this.$http({
- url: this.$http.adornUrl(`/user-service/dict/queryByType`),
- method: 'get',
- params: this.$http.adornParams({
- 'type': dictType
- })
- }).then(({data}) => {
- if (data && data.code === '200') {
- data.data.forEach(item => {
- this.options.push({
- label: item.value,
- value: item.id
- })
- })
- if (dictId) {
- this.value = dictId
- }
- } else {
- this.options = []
- }
- })
- },
- onChange (item) {
- if (item === 'undefined') {
- this.value = null
- }
- this.$emit('select', item)
- }
- }
- }
- </script>
- <style scoped>
- </style>
|