Support dependent form field; fixes

dist/js/field.js.LICENSE.txt

@@ -0,0 +1,81 @@
+/*!
+ * Determine if an object is a Buffer
+ *
+ * @author   Feross Aboukhadijeh <https://feross.org>
+ * @license  MIT
+ */
+
+/*!
+ * The buffer module from node.js, for the browser.
+ *
+ * @author   Feross Aboukhadijeh <http://feross.org>
+ * @license  MIT
+ */
+
+/*!
+ * URI.js - Mutating URLs
+ *
+ * Version: 1.19.11
+ *
+ * Author: Rodney Rehm
+ * Web: http://medialize.github.io/URI.js/
+ *
+ * Licensed under
+ *   MIT License http://www.opensource.org/licenses/mit-license
+ *
+ */
+
+/*!
+ * URI.js - Mutating URLs
+ * IPv6 Support
+ *
+ * Version: 1.19.11
+ *
+ * Author: Rodney Rehm
+ * Web: http://medialize.github.io/URI.js/
+ *
+ * Licensed under
+ *   MIT License http://www.opensource.org/licenses/mit-license
+ *
+ */
+
+/*!
+ * URI.js - Mutating URLs
+ * Second Level Domain (SLD) Support
+ *
+ * Version: 1.19.11
+ *
+ * Author: Rodney Rehm
+ * Web: http://medialize.github.io/URI.js/
+ *
+ * Licensed under
+ *   MIT License http://www.opensource.org/licenses/mit-license
+ *
+ */
+
+/*!
+ * vuex v4.0.2
+ * (c) 2021 Evan You
+ * @license MIT
+ */
+
+/*! https://mths.be/punycode v1.4.0 by @mathias */
+
+/*! ieee754. BSD-3-Clause License. Feross Aboukhadijeh <https://feross.org/opensource> */
+
+/**
+ * @license
+ * Lodash <https://lodash.com/>
+ * Copyright OpenJS Foundation and other contributors <https://openjsf.org/>
+ * Released under MIT license <https://lodash.com/license>
+ * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
+ * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
+ */
+
+/**
+ * filesize
+ *
+ * @copyright 2018 Jason Mulligan <[email protected]>
+ * @license BSD-3-Clause
+ * @version 3.6.1
+ */

resources/js/field.js

@@ -1,6 +1,6 @@
 import IndexField from './field/IndexField'
-import DetailField from './field/IndexField'
-import FormField from './field/IndexField'
+import DetailField from './field/DetailField'
+import FormField from './field/FormField'
 
 Nova.booting((Vue, router, store) => {
     Vue.component('index-filemanager-field', IndexField);

resources/js/field/FormField.vue

@@ -1,31 +1,17 @@
 <template>
-    <DefaultField :field="field" :errors="errors" :show-help-text="showHelpText">
+    <DefaultField :field="currentField" :errors="errors" :show-help-text="showHelpText">
         <template #field>
-            <template v-if="field.value && field.display == 'image'">
-                <div
-                    class="card relative card relative border-lg border-50 overflow-hidden px-0 py-0 max-w-xs mb-2"
-                >
-                    <template v-if="field.type == 'image'">
-                        <ImageDetail class="block w-full" :file="field" :css="''"></ImageDetail>
-                    </template>
-
-                    <template v-else>
-                        <object class="no-preview" v-html="field.image"></object>
-                    </template>
-                </div>
-            </template>
-
             <FilemanagerModal
                 ref="filemanager"
                 :resource="resourceName"
-                :name="field.attribute"
-                :home="field.home"
+                :name="currentField.attribute"
+                :home="currentField.home"
                 :active="openModal"
                 :value="value"
                 :currentPath="currentPath"
                 :defaultFolder="defaultFolder"
-                :filter="field.filterBy"
-                :buttons="field.buttons"
+                :filter="currentField.filterBy"
+                :buttons="currentField.buttons"
                 @open-modal="openModalCreateFolder"
                 @close-modal="closeFilemanagerModal"
                 @update-current-path="updateCurrentPath"
@@ -38,10 +24,10 @@
                 :info="info"
                 :active="activeInfo"
                 :popup="true"
-                :buttons="field.buttons"
+                :buttons="currentField.buttons"
                 @closePreview="closePreview"
                 @refresh="refreshCurrent"
-                @selectFile="setValue"
+                @selectFile="setValue($event.path)"
                 @rename="fileRenamed"
             />
 
@@ -56,18 +42,18 @@
             <!-- <UploadProgress
                 ref="uploader"
                 :current="currentPath"
-                :visibility="field.visibility"
-                :rules="field.upload_rules"
+                :visibility="currentField.visibility"
+                :rules="currentField.upload_rules"
                 @removeFile="removeFileFromUpload"
             ></UploadProgress> -->
 
             <FileSelect
-                :id="field.name"
-                :field="field"
-                :is-readonly="field.readonly"
+                :id="currentField.name"
+                :field="currentField"
+                :is-readonly="currentField.readonly"
                 :css="errorClasses"
                 :value="value"
-                @update:value="value = $event"
+                @update:value="setValue($event)"
                 @open-modal="openFilemanagerModal"
             ></FileSelect>
 
@@ -96,7 +82,7 @@
 </template>
 
 <script>
-    import { FormField, HandlesValidationErrors } from 'laravel-nova';
+    import { DependentFormField, HandlesValidationErrors } from 'laravel-nova';
 
     import FilemanagerModal from '../modals/FilemanagerModal';
     import CreateFolderModal from '../modals/CreateFolderModal';
@@ -112,9 +98,7 @@
     import api from '../api';
 
     export default {
-        mixins: [FormField, HandlesValidationErrors],
-
-        props: ['resourceName', 'resourceId', 'field'],
+        mixins: [DependentFormField, HandlesValidationErrors],
 
         components: {
             FileSelect: FileSelect,
@@ -208,18 +192,17 @@
             },
 
             setCurrentPath() {
-                if (this.field.folder != null) {
-                    this.defaultFolder = this.field.folder;
-                    this.currentPath = this.field.folder;
+                if (this.currentField.folder != null) {
+                    this.defaultFolder = this.currentField.folder;
+                    this.currentPath = this.currentField.folder;
                 } else {
                     this.defaultFolder = '/';
                     this.currentPath = '/';
                 }
             },
 
             removeFile() {
-                this.field.value = null;
-                this.value = '';
+                this.setValue(null);
                 this.removeModalOpen = false;
             },
 
@@ -243,22 +226,29 @@
              * Set the initial, internal value for the field.
              */
             setInitialValue() {
-                this.value = this.field.value || '';
+                this.value = this.currentField.value || '';
             },
 
             /**
              * Fill the given FormData object with the field's internal value.
              */
             fill(formData) {
-                formData.append(this.field.attribute, this.value || '');
+                formData.append(this.currentField.attribute, this.value || '');
             },
 
             /**
              * Update the field's internal value.
              */
-            setValue(file) {
-                this.value = file.path;
+            setValue(value) {
+                this.value = value;
+                this.currentField.value = value;
+
                 this.closeFilemanagerModal();
+                this.handleChange({
+                    target: {
+                        value: value,
+                    },
+                });
             },
         },
 

resources/js/modules/ImageDetail.vue

@@ -6,7 +6,7 @@
             </div>
         </template>
 
-        {{ this.file.image }}
+        {{ file.image }}
 
         <div ref="imageDiv" class="image-block flex justify-center w-full h-full"></div>
 

src/FilemanagerField.php

@@ -8,10 +8,12 @@
 use Laravel\Nova\Contracts\Cover;
 use Laravel\Nova\Fields\Field;
 use Laravel\Nova\Http\Requests\NovaRequest;
+use Laravel\Nova\Fields\SupportsDependentFields;
 
 class FilemanagerField extends Field implements Cover
 {
-    use CoverHelpers;
+    use CoverHelpers,
+        SupportsDependentFields;
 
     /**
      * The field's component.

src/Http/Services/FileManagerService.php

@@ -297,7 +297,6 @@ public function duplicateFile($file)
                         $offset = $offset + 1;
                         $newName = $matchName . '(' . $offset . ').' . $ext;
                     }
-
                 } else {
                     $newName = $basename;
                 }