riku
2024-10-14 92c3f21594836eaef5328130abe45e46d08a748e
src/components/search-option/FYOptionUserType.vue
@@ -1,16 +1,12 @@
<template>
  <el-form-item label="用户类型">
  <el-form-item label="用户类型" :prop="prop">
    <el-select
      v-model="selectedOptions"
      :model-value="value"
      @change="handleChange"
      placeholder="用户类型"
      style="width: 150px"
    >
      <el-option
        v-for="s in userTypes"
        :key="s.value"
        :label="s.label"
        :value="s"
      />
      <el-option v-for="s in userTypes" :key="s.value" :label="s.label" :value="s" />
    </el-select>
  </el-form-item>
</template>
@@ -23,45 +19,35 @@
    // 是否在首选项处添加“全部”选项
    allOption: {
      type: Boolean,
      default: true,
      default: true
    },
    // 返回结果
    value: Object,
    // 是否默认返回初始选项
    initValue: {
      type: Boolean,
      default: true,
      default: true
    },
    prop: {
      type: String,
      default: '_usertype'
    }
  },
  emits: ['update:value'],
  data() {
    return {
      userTypes: enumUser(this.allOption),
      selectedOptions: {},
      userTypes: enumUser(this.allOption)
    };
  },
  watch: {
    selectedOptions: {
      handler(nVal, oVal) {
        if (nVal != oVal) {
          this.$emit('update:value', nVal);
        }
      },
      deep: true,
    },
    value: {
      handler(nVal, oVal) {
        if (nVal != oVal) {
          this.selectedOptions = nVal;
        }
      },
      deep: true,
    },
  methods: {
    handleChange(value) {
      this.$emit('update:value', value);
    }
  },
  mounted() {
    if (this.initValue) {
      this.selectedOptions = this.userTypes[0];
      this.handleChange(this.userTypes[0]);
    }
  },
  }
};
</script>