登记收款附件上传该拖动

bms-front/src/views/customersuppliermanagement/customerinfo/customermoney/index.vue

@@ -667,19 +667,20 @@
           </el-col>
           <el-col :span="24">
             <el-form-item label="收款凭证">
-              <div style="margin-bottom: 8px;">
-                <el-upload
-                  :show-file-list="false"
-                  :action="uploadFileUrl"
-                  :headers="uploadHeaders"
-                  :before-upload="handleBeforeUpload"
-                  :on-success="handleUploadSuccess"
-                  :on-error="handleUploadError"
-                  multiple
-                >
-                  <el-button type="primary" icon="Upload">上传附件</el-button>
-                </el-upload>
-              </div>
+              <el-upload
+                drag
+                class="receipt-upload"
+                :show-file-list="false"
+                :action="uploadFileUrl"
+                :headers="uploadHeaders"
+                :before-upload="handleBeforeUpload"
+                :on-success="handleUploadSuccess"
+                :on-error="handleUploadError"
+                multiple
+              >
+                <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+                <div class="el-upload__text">将文件拖到此处，或<em>点击选择</em>（支持一次拖入多个文件）</div>
+              </el-upload>
               <el-table :data="receiptDialog.form.attachmentList" border size="small" max-height="220">
                 <el-table-column label="序号" type="index" width="55" align="center" />
                 <el-table-column label="文件名称" prop="fileName" align="center" show-overflow-tooltip min-width="180" />
@@ -2200,6 +2201,15 @@ watch(() => route.query.customerId, (newId, oldId) => {
   color: var(--el-color-danger);
   font-weight: 600;
 }
+.receipt-upload {
+  width: 100%;
+  margin-bottom: 8px;
+
+  :deep(.el-upload),
+  :deep(.el-upload-dragger) {
+    width: 100%;
+  }
+}
 .upload-tip {
   color: #909399;
   font-size: 12px;