add nova

nova/resources/js/mixins/FormField.js

@@ -0,0 +1,152 @@
+import get from 'lodash/get'
+import { mapProps } from './propTypes'
+import FormEvents from './FormEvents'
+
+export default {
+  extends: FormEvents,
+
+  props: {
+    ...mapProps([
+      'nested',
+      'shownViaNewRelationModal',
+      'field',
+      'viaResource',
+      'viaResourceId',
+      'viaRelationship',
+      'resourceName',
+      'resourceId',
+      'showHelpText',
+      'mode',
+    ]),
+  },
+
+  emits: ['field-changed'],
+
+  data() {
+    return {
+      value: this.fieldDefaultValue(),
+    }
+  },
+
+  created() {
+    this.setInitialValue()
+  },
+
+  mounted() {
+    // Add a default fill method for the field
+    this.field.fill = this.fill
+
+    // Register a global event for setting the field's value
+    Nova.$on(this.fieldAttributeValueEventName, this.listenToValueChanges)
+  },
+
+  beforeUnmount() {
+    Nova.$off(this.fieldAttributeValueEventName, this.listenToValueChanges)
+  },
+
+  methods: {
+    /*
+     * Set the initial value for the field
+     */
+    setInitialValue() {
+      this.value = !(
+        this.field.value === undefined || this.field.value === null
+      )
+        ? this.field.value
+        : this.fieldDefaultValue()
+    },
+
+    /**
+     * Return the field default value.
+     */
+    fieldDefaultValue() {
+      return ''
+    },
+
+    /**
+     * Provide a function that fills a passed FormData object with the
+     * field's internal value attribute
+     */
+    fill(formData) {
+      this.fillIfVisible(formData, this.fieldAttribute, String(this.value))
+    },
+
+    /**
+     * Provide a function to fills FormData when field is visible.
+     */
+    fillIfVisible(formData, attribute, value) {
+      if (this.isVisible) {
+        formData.append(attribute, value)
+      }
+    },
+
+    /**
+     * Update the field's internal value
+     */
+    handleChange(event) {
+      this.value = event.target.value
+
+      if (this.field) {
+        this.emitFieldValueChange(this.fieldAttribute, this.value)
+        this.$emit('field-changed')
+      }
+    },
+
+    /**
+     * Clean up any side-effects when removing this field dynamically (Repeater).
+     */
+    beforeRemove() {
+      //
+    },
+
+    listenToValueChanges(value) {
+      this.value = value
+    },
+  },
+
+  computed: {
+    /**
+     * Determine the current field.
+     */
+    currentField() {
+      return this.field
+    },
+
+    /**
+     * Determine if the field should use all the available white-space.
+     */
+    fullWidthContent() {
+      return this.currentField.fullWidth || this.field.fullWidth
+    },
+
+    /**
+     * Return the placeholder text for the field.
+     */
+    placeholder() {
+      return this.currentField.placeholder || this.field.name
+    },
+
+    /**
+     * Determine if the field is in visible mode
+     */
+    isVisible() {
+      return this.field.visible
+    },
+
+    /**
+     * Determine if the field is in readonly mode
+     */
+    isReadonly() {
+      return Boolean(
+        this.field.readonly || get(this.field, 'extraAttributes.readonly')
+      )
+    },
+
+    /**
+     * Determine if the field is accessed from Action
+     */
+    isActionRequest() {
+      return ['action-fullscreen', 'action-modal'].includes(this.mode)
+    },
+  },
+}