pc-component-v5/packages/process/src/EnumSelectWidget.vue

<template>
  <div class="form-group">
    <div>
      <select
        v-model="selectedValue"
        class="form-control"
      >
        <option
          v-for="keyValue in keyValues"
          :key="keyValue.keyStr"
          :value="keyValue.keyStr"
        >
          {{ keyValue.value }}
        </option>
      </select>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    'keyValues':{
      type: Array,
      default: function(){
        return [];
      },
    }, 
    'enumValue':{
      type: String,
      default: '',
    },
  },

  emits: ['valueChanged'],
  data: function () {
    return {
      selectedValue: (this.enumValue == undefined ? '' : this.enumValue),
    };
  },

  watch: {
    selectedValue: function (curVal, oldVal) {
      console.log('Enum Selected Value changed：' + curVal);
      if (curVal != oldVal) {
        this.$emit('valueChanged', curVal);
      }
    },

    enumValue: function (val) {
      this.selectedValue = val;
    },
  },
};

</script>

<style scoped>
.required-mark {
    color: red;
    margin-right: 10px;
}
</style>