EnumSelectWidget.vue 1018 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. <template>
  2. <div class="form-group">
  3. <div>
  4. <select class="form-control"
  5. v-model="selectedValue">
  6. <option v-for="keyValue in keyValues"
  7. :value="keyValue.keyStr"
  8. :key="keyValue.keyStr">{{keyValue.value}}</option>
  9. </select>
  10. </div>
  11. </div>
  12. </template>
  13. <script>
  14. module.exports = {
  15. props: ["keyValues", "enumValue"],
  16. data: function () {
  17. return {
  18. selectedValue: (this.enumValue == undefined ? '' : this.enumValue),
  19. }
  20. },
  21. watch: {
  22. selectedValue: function (curVal, oldVal) {
  23. console.log("Enum Selected Value changed:" + curVal);
  24. if (curVal != oldVal) {
  25. this.$emit("valueChanged", curVal);
  26. }
  27. },
  28. enumValue: function (val) {
  29. this.selectedValue = val;
  30. }
  31. }
  32. }
  33. </script>
  34. <style scoped>
  35. .required-mark {
  36. color: red;
  37. margin-right: 10px;
  38. }
  39. </style>