UpdateOrCreateGrade.vue grade selector

aleksis/apps/maka/frontend/components/grades/UpdateOrCreateGrade.vue

+<script>
+import ChipSelectField from "aleksis.core/components/generic/forms/ChipSelectField.vue";
+export default {
+  name: "UpdateOrCreateGrade",
+  components: { ChipSelectField },
+  props: {
+    personId: {
+      type: [String, Number],
+      required: true,
+    },
+    effort: {
+      type: Object,
+      required: true,
+    },
+    /**
+     * The grade Object
+     */
+    value: {
+      type: Object,
+      required: false,
+      default: null,
+    },
+    allowDelete: {
+      type: Boolean,
+      default: true,
+    },
+  },
+  computed: {
+    items() {
+      return [{
+        disabled: true,
+        name: this.effort.gradeSet.name,
+      }].concat(this.effort.gradeSet.gradeChoices.sort((a, b) => a.order - b.order));
+    }
+  },
+}
+</script>
+
+<template>
+<v-select
+  :prepend-inner-icon="!value ? 'mdi-star-plus-outline' : undefined"
+  :label="!value ? $t('maka.grades.add') : undefined"
+  :color="value ? effort.effortType.color : 'secondary'"
+  :filled="false"
+  outlined
+  :items="items"
+  item-value="id"
+  item-text="name"
+  hide-details
+  dense
+/>
+</template>