refs #2867 Disabled drag&drop input for Attach field

Author: tabuna

public/css/orchid.rtl.css

@@ -56,6 +56,9 @@ export default class extends ApplicationController {
         this.togglePlaceholderShow();
 
         new Sortable(this.element.querySelector('.sortable-dropzone'), {
+            disabled: this.filesTarget.disabled === true || this.filesTarget.readonly === true,
+            filter: ".attach-file-uploader",
+            draggable:'.pip',
             animation: 150,
             onEnd: () => {
                 this.reorderElements();
@@ -155,7 +158,7 @@ export default class extends ApplicationController {
      */
     togglePlaceholderShow() {
         this.containerTarget.classList.toggle('d-none', this.attachmentValue.length >= this.countValue);
-        this.filesTarget.disabled = this.attachmentValue.length > 0;
+        this.filesTarget.disabled = this.attachmentValue.length >= this.countValue;
 
 
         // Disable the nullable field if there is at least one valid value and the count equals 1.

public/css/orchid.rtl.css.map

@@ -24,7 +24,7 @@ class="attach"
          "
     >
         <div data-target="attach.preview" class="row row-cols-4 row-cols-lg-6 gy-3 sortable-dropzone">
-            <div class="col order-last" data-attach-target="container">
+            <div class="col order-last attach-file-uploader" data-attach-target="container">
                 <label for="{{$id}}" class="border rounded bg-light attach-image-placeholder pointer-event h-100">
                     <input class="form-control d-none"
                            type="file"
@@ -50,7 +50,7 @@ class="attach"
         </div>
 
 
-        <template data-target="attach.template">
+        <template data-attach-target="template">
             <div class="pip col position-relative">
                 <input type="hidden" name="{name}" value="{id}">