页面整合

2023-09-18 21:55:43 +08:00
parent 2ad5d40134
commit 5a01836bbf
15 changed files with 2219 additions and 4 deletions
@@ -0,0 +1,159 @@
+<template>
+  <div>
+    <!-- 立案申请弹框 -->
+    <el-dialog
+      title="批量立案"
+      :visible="openbatch"
+      width="600px"
+      append-to-body
+      @close="cancel"
+    >
+      <el-form ref="form" :model="form" :rules="rules" label-width="150px">
+        <el-row>
+          <!-- <el-col :span="16">
+            <el-form-item label="申请人姓名：" prop="applyName">
+              <el-input v-model="form.jobName" placeholder="请输入姓名" />
+            </el-form-item>
+          </el-col>-->
+          <el-col :span="8">
+            <div class="download" style="margin-bottom: 20px">
+              <span> 下载： </span>
+              <a href="#">
+                <el-button class="uploadlink" @click="downloadTemplate">批量导入模板</el-button>
+              </a>
+            </div>
+          </el-col>
+          <!-- <el-col :span="12">
+            <el-form-item label="立案申请书：" prop="applybook"> </el-form-item>
+          </el-col>
+          <el-col :span="12"> </el-col> -->
+        </el-row>
+        <el-row>
+          <el-form-item :span="24" label="批量立案信息上传：" prop="upload">
+            <el-upload
+              class="upload-demo"
+              ref="uploadbatch"
+              :limit="1"
+              accept=".xlsx, .xls"
+              :headers="upload.headers"
+              :action="upload.url + '?updateSupport=' + upload.updateSupport"
+              :disabled="upload.isUploading"
+              :on-progress="handleFileUploadProgress"
+              :on-success="handleFileSuccess"
+              :auto-upload="false"
+              drag
+            >
+            <i class="el-icon-upload"></i>
+            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+              <!-- <el-button size="small" type="primary">点击上传</el-button> -->
+              <div slot="tip" class="el-upload__tip">
+                只接收.xlsx, .xls格式文件
+              </div>
+            </el-upload>
+          </el-form-item>
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { importTemplate } from "@/api/caseAccess/caseEntry";
+import { getToken } from "@/utils/auth";
+export default {
+  props: ["openbatch","getcaseApply"],
+  data() {
+    return {
+      //   key: value,
+      form: {},
+      fileList: [],
+      rules: {
+        upload: [
+          { required: true, message: "批量立案文件不能为空", trigger: "blur" },
+        ],
+      },
+      // 案件批量导入
+      upload: {
+        // 是否显示弹出层（用户导入）
+        open: false,
+        // 弹出层标题（用户导入）
+        title: "",
+        // 是否禁用上传
+        isUploading: false,
+        // 是否更新已经存在的用户数据
+        updateSupport: 0,
+        // 设置上传的请求头部
+        headers: { Authorization: "Bearer " + getToken() },
+        // 上传的地址
+        url: process.env.VUE_APP_BASE_API + "/caseApplication/importData",
+      },
+    };
+  },
+  methods: {
+    // 批量提交立案申请
+    submitForm() {
+        this.$refs.uploadbatch.submit();
+    },
+    // 取消
+    cancel() {
+      //   this.openbatch = false;
+      this.$emit("cancelBatch");
+    },
+    handleRemove(file, fileList) {},
+    handlePreview(file) {},
+    handleExceed(files, fileList) {
+      this.$message.warning(
+        `当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
+          files.length + fileList.length
+        } 个文件`
+      );
+    },
+    beforeRemove(file, fileList) {
+      return this.$confirm(`确定移除 ${file.name}？`);
+    },
+    // 下载模板 importTemplate
+    downloadTemplate() {
+    //   console.log("下载模板");
+      this.download(
+        "caseApplication/importTemplate",
+        {},
+        `case_batch_${new Date().getTime()}.xlsx`
+      );
+    },
+    // 文件上传中处理
+    handleFileUploadProgress(event, file, fileList) {
+      this.upload.isUploading = true;
+    },
+    // 文件上传成功处理
+    handleFileSuccess(response, file, fileList) {
+    //   this.upload.open = false;
+      this.$emit("cancelBatch");
+      this.upload.isUploading = false;
+      this.$refs.uploadbatch.clearFiles();
+      this.$alert(
+        "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
+          response.msg +
+          "</div>",
+        "导入结果",
+        { dangerouslyUseHTMLString: true }
+      );
+      this.getcaseApply();
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.download {
+  a {
+    .uploadlink{
+        border: none;
+        color: #2092c7;
+    }
+  }
+}
+</style>