<template>
  <el-select
    v-model="selectVal"
    style="width: 100%"
    v-bind="$attrs"
    v-on="$listeners"
    :disabled="disabled"
  >
    <el-option
      v-for="item in dictList"
      :key="item[valueName]"
      :value="item[valueName]"
      :label="item[labelName]"
    ></el-option>
  </el-select>
</template>

<script>
  import dictEnum from '@/enum/dict';
  import { mapActions, mapGetters } from 'vuex';
  export default {
    model: {
      prop: 'value',
      event: 'updateVal'
    },
    props: {
      value: {
        type: [String, Number],
        default: ''
      },
      dictName: {
        type: String,
        required: true
      },
      labelName: {
        type: String,
        default: 'dictValue'
      },
      valueName: {
        type: String,
        default: 'dictCode'
      },
      listFormatte: Function,
      disabled: {
        type: Boolean,
        default: false
      }
    },
    data() {
      return {};
    },
    computed: {
      ...mapGetters(['dict', 'getDict']),
      dictList() {
        return (
          (this.listFormatte &&
            this.listFormatte(this.dict[dictEnum[this.dictName]] || [])) ||
          this.dict[dictEnum[this.dictName]] ||
          []
        );
      },
      selectVal: {
        set(val) {
          this.$emit('updateVal', val);
          // change获取选中项所有数据

          this.$emit('itemChange', this.getDict(this.dictName, val));
        },
        get() {
          console.log(this.dictList,'3333333333333')
          return this.value;
        }
      }
    },
    created() {
      if (this.dictName) {
        this.requestDict(this.dictName);
      }
    },
    methods: {
      ...mapActions('dict', ['requestDict'])
    }
  };
</script>
