将图片选中改为复制粘贴

resources/views/order/index/_work_order_modal.blade.php

@@ -61,12 +61,19 @@
 
                 <hr v-if="'破损' === workOrder.orderIssueType">
                 <div class="form-group " v-if="'破损' === workOrder.orderIssueType">
-                    <div class="pl-1 custom-file col-10 offset-2">
-                        <input type="file" id="package-images" name="package-images" multiple class="custom-file-input"
-                               accept="image/*" @change="pushImagesAndShow($event,workOrder.packageImages)">
-                        <label class="custom-file-label" for="package-images">点击添加外包装破损图片</label>
+
+                    <div class="pl-1 col-10 offset-2">
+                        <div class="container border border-info h-auto" contenteditable="true" id="package-images">
+                        </div>
+                        <span></span>
+                    </div >
+                    <div class="pl-1 col-10 offset-2">
+                        复制粘贴图片并确认
+                        <button
+                            class="btn btn-sm btn-outline-primary"
+                            @click="addImages(workOrder.packageImages,'package-images')">确认图片</button>
                     </div>
-                    <div class="border-dark mt-1 col-10 offset-2">
+                    <div class="border border-dark mt-1 col-10 offset-2" >
                         <div v-for="(image,i) in  workOrder.packageImages"
                              class="d-inline-block col-4 position-relative card">
                             <div class="card-body">
@@ -83,13 +90,24 @@
 
                 <hr v-if="'破损' === workOrder.orderIssueType">
                 <div class="form-group " v-if="'破损' === workOrder.orderIssueType">
-                    <div class="pl-1 custom-file col-10 offset-2">
-                        <input type="file" id="commodity-images" name="package-images" multiple
-                               class="custom-file-input" accept="image/*"
-                               @change="pushImagesAndShow($event,workOrder.commodityImages)">
-                        <label class="custom-file-label" for="commodity-images">点击添加内物破损图片</label>
+                    <div class="pl-1 col-10 offset-2">
+                        <div class="container border border-info h-auto" contenteditable="true" id="commodity-images">
+                        </div>
+                        <span></span>
+                    </div >
+                    <div class="pl-1 col-10 offset-2">
+                        复制粘贴图片并确认
+                        <button
+                            class="btn btn-sm btn-outline-primary"
+                            @click="addImages(workOrder.commodityImages,'commodity-images')">确认图片</button>
                     </div>
-                    <div class="border-dark mt-1 col-10 offset-2">
+{{--                    <div class="pl-1 custom-file col-10 offset-2">--}}
+{{--                        <input type="file" id="commodity-images" name="package-images" multiple--}}
+{{--                               class="custom-file-input" accept="image/*"--}}
+{{--                               @change="pushImagesAndShow($event,workOrder.commodityImages)">--}}
+{{--                        <label class="custom-file-label" for="commodity-images">点击添加内物破损图片</label>--}}
+{{--                    </div>--}}
+                    <div class="border-dark mt-1 col-10 offset-2 border">
                         <div v-for="(image,i) in  workOrder.commodityImages"
                              class="d-inline-block col-4 position-relative card">
                             <div class="card-body">
@@ -106,12 +124,23 @@
 
                 <hr v-if="'破损' === workOrder.orderIssueType">
                 <div class="form-group " v-if="'破损' === workOrder.orderIssueType">
-                    <div class="pl-1 custom-file col-10 offset-2">
-                        <input type="file" id="deal-images" name="package-images" multiple class="custom-file-input"
-                               accept="image/*" @change="pushImagesAndShow($event,workOrder.dealImages)">
-                        <label class="custom-file-label" for="deal-images">点击添加外交易截图</label>
+                    <div class="pl-1 col-10 offset-2">
+                        <div class="container border border-info h-auto" contenteditable="true" id="deal-images">
+                        </div>
+                        <span></span>
+                    </div >
+                    <div class="pl-1 col-10 offset-2">
+                        复制粘贴图片并确认
+                        <button
+                            class="btn btn-sm btn-outline-primary"
+                            @click="addImages(workOrder.dealImages,'deal-images')">确认图片</button>
                     </div>
-                    <div class="border-dark mt-1 col-10 offset-2">
+{{--                    <div class="pl-1 custom-file col-10 offset-2">--}}
+{{--                        <input type="file" id="deal-images" name="package-images" multiple class="custom-file-input"--}}
+{{--                               accept="image/*" @change="pushImagesAndShow($event,workOrder.dealImages)">--}}
+{{--                        <label class="custom-file-label" for="deal-images">点击添加外交易截图</label>--}}
+{{--                    </div>--}}
+                    <div class="border border-dark mt-1 col-10 offset-2">
                         <div v-for="(image,i) in  workOrder.dealImages"
                              class="d-inline-block col-4 position-relative card">
                             <div class="card-body">

resources/views/order/index/delivering.blade.php

@@ -1553,6 +1553,18 @@
                         });
                     });
                 },
+                addImages(imageArray,id){
+                    let div = document.getElementById(id);
+                    let images = div.getElementsByTagName('img');
+                    let imageList = Array.from(images);
+                    for (let i = 0; i < imageList.length; i++) {
+                        let image = imageList[i];
+                        let src = image.src;
+                        imageArray.push({src:src,file:image});
+                    }
+                    div.innerText = '';
+                    div.innerHTML = '';
+                }
             },
         });
     </script>