电子签名

@@ -6,7 +6,7 @@
 
 let SERVER = window.config ? window.config : JSON.parse(localStorage.getItem('ApiUrl'))
 export function uploadUrl () {
-    return process.env.VUE_APP_BASE_API + SERVER.SERVERAPI + '/file/upload'
+    return process.env.VUE_APP_BASE_API + SERVER.SERVERAPI + '/system/dzqm/upload'
 }
 
 

@@ -20,78 +20,78 @@
 
       <di>
         <el-upload
-          action="#"
-          list-type="picture-card"
-          
-          :auto-upload="false">
-            <i slot="default" class="el-icon-plus"></i>
-            <div slot="file" slot-scope="{file}">
-              <img
-                class="el-upload-list__item-thumbnail"
-                :src="file.url" alt=""
-              >
-              <span class="el-upload-list__item-actions">
-                <span
-                  class="el-upload-list__item-preview"
-                  @click="handlePictureCardPreview(file)"
-                >
-                  <i class="el-icon-zoom-in"></i>
-                </span>
-                <span
-                  v-if="!disabled"
-                  class="el-upload-list__item-delete"
-                  @click="handleDownload(file)"
-                >
-                  <i class="el-icon-download"></i>
-                </span>
-                <span
-                  v-if="!disabled"
-                  class="el-upload-list__item-delete"
-                  @click="handleRemove(file)"
-                >
-                  <i class="el-icon-delete"></i>
-                </span>
-              </span>
-            </div>
+          class="upload-demo"
+          :action="requestUrl"
+          :on-success="handleSuccess"
+          :on-error="handleError"
+          :before-upload="beforeUpload"
+          :file-list="fileList"
+          :limit="limitCount"
+          :on-exceed="handleExceed"
+          list-type="picture"
+          drag
+        >
+          <i class="el-icon-upload"></i>
+          <div class="el-upload__text">将图片拖到此处，或<em>点击上传</em></div>
+          <div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过2MB</div>
         </el-upload>
-        <el-dialog :visible.sync="dialogVisible">
-          <img width="100%" :src="dialogImageUrl" alt="">
-        </el-dialog>
 
       </di>
       <!-- 表格 -->
     </div>
   </template>
     <script>
-    import table from "@/utils/mixin/table";
     import { upload } from "@/api/file.js";
+    import { uploadUrl } from '@/api/dzqm'
 
     export default {
       name: "dzqm",
       components: {},
-      mixins: [table],
       mounted () {
       },
       data () {
         return {
           dialogImageUrl: '',
           dialogVisible: false,
-          disabled: false
+          disabled: false,
+
+          yourHeaders: { /* 你的请求头信息 */ },
+          fileList: [], // 已上传文件列表
+          limitCount: 3, // 限制上传文件的个数
+
+
+          requestUrl: uploadUrl(),
 
         }
       },
       methods: {
-
-        handleRemove(file) {
-          console.log(file);
+        handleSuccess(response, file, fileList) {
+          // 文件上传成功后的回调
+          console.log('上传成功:', response);
+          this.fileList = fileList; // 更新已上传文件列表
         },
-        handlePictureCardPreview(file) {
-          this.dialogImageUrl = file.url;
-          this.dialogVisible = true;
+        handleError(error, file, fileList) {
+          // 文件上传失败后的回调
+          console.error('上传失败:', error);
+        },
+        beforeUpload(file) {
+          // 上传文件之前的钩子，返回false则停止上传
+          const isJPGorPNG = file.type === 'image/jpeg' || file.type === 'image/png';
+          const isLt2M = file.size / 1024 / 1024 < 2;
+          if (!isJPGorPNG) {
+            this.$message.error('上传图片只能是 JPG/PNG 格式!');
+            return false;
+          }
+          if (!isLt2M) {
+            this.$message.error('上传图片大小不能超过 2MB!');
+            return false;
+          }
+          return true;
+        },
+        handleExceed(files, fileList) {
+          // 文件超出个数限制时的回调
+          this.$message.warning(`当前限制选择 ${this.limitCount} 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
         },
-        handleDownload(file) {
-          console.log(file);
-        }
 
       },
     };