onlineofficeexcel

src/components/uploadOnlineOffice.vue

@@ -0,0 +1,251 @@
+<template>
+    <div v-loading="loading">
+        <el-upload class="upload-demo" :drag="fileInfo.type !== 'btn'" multiple :limit="fileInfo.limit" ref="upload"
+            action="string" :on-remove="handleRemove" :on-exceed="handleExceed" :file-list="attList" :auto-upload="true"
+            :show-file-list="fileInfo.type !== 'btn'" :before-upload="deforeUp" :http-request="signUpload"
+            :on-preview="defUp" :disabled="disabled">
+            <div v-if="fileInfo.type !== 'btn'">
+                <span class="iconfont icon-excel" style="font-size: 80px;color: dodgerblue;margin-top: 10px;"></span>
+                <div class="el-upload__text" style="margin-top: 10px;">{{ fileInfo.typename
+                }}</div>
+            </div>
+            <div v-if="fileInfo.type === 'btn'">
+                <el-button size="medium" :type="fileInfo.btntype" class="btn-check" type="primary" plain
+                    icon="el-icon-upload2">{{ fileInfo.typename
+                    }}</el-button>
+            </div>
+        </el-upload>
+    </div>
+</template>
+<script>
+export default {
+    // props: ["fileInfo", "fileList", "type"],
+    props: {
+        fileInfo: {
+            type: Object,
+            default: () => { }
+        },
+        filenowFolder: {
+            type: Object,
+            default: () => { }
+        },
+        fileList: {
+            type: Array,
+            default: () => []
+        },
+        type: {
+            type: Array,
+            default: () => []
+        },
+        disabled: {
+            type: Boolean,
+            default: () => { },
+        },
+    },
+    data() {
+        return {
+            fileLists: [],
+            attList: [
+                // {
+                //   attchFileId: "",
+                //   fileCode: "202209271105276441",
+                //   name: "1231233333333333.xlsx",
+                //   id: "202209271105276441",
+                //   opName: "范岩",
+                //   opNo: "fanyan",
+                //   opTime: "2022-09-27 11:05:27",
+                //   type: 'success',
+                // },
+            ],
+            loading: false,
+            num: 0,
+            s: false,
+        };
+    },
+    // props:{
+    //    disabled: {
+    //     type: Boolean,
+    //     default: () => {},
+    //   },
+    // },
+    methods: {
+        signUpload() { },
+        //删除
+        handleRemove(file) {
+            console.log(file);
+            console.log(this.attList);
+            for (let i = 0; i < this.attList.length; i++) {
+                if (this.attList[i].name === file.name) {
+                    this.attList.splice(i, 1);
+
+
+
+                    // this.$emit("clickDownload",this.attList);
+                }
+            }
+            console.log(this.attList)
+            this.$emit("uploadBack", this.attList);
+        },
+
+        //数量限制
+        handleExceed(files, fileList) {
+            this.$message.warning(
+                `当前限制选择 ${this.fileInfo.limit} 个文件，本次选择了 ${files.length
+                } 个文件，共选择了 ${files.length + fileList.length} 个文件`
+            );
+        },
+        defUp(file) {
+            this.$emit("clickDownload", this.attList);
+        },
+        deforeUp(file) {
+            console.log(file);
+            let query = new FormData();
+            query.append("file", file);
+            console.log(query);
+            // let docType = file.name.split('.')[1]
+            // if (docType == 'xlsx' || docType == 'xls') {
+            //     docType = 'cell'
+            // }
+            // if (docType == 'docx' || docType == 'doc') {
+            //     docType = 'word'
+            // }
+            // if (docType == 'ppt' || docType == 'pptx') {
+            //     docType = 'slide'
+            // }
+            const isLt2M = file.size / 1024 / 1024 < 100;
+            if (!isLt2M) {
+                this.$message.error("上传文件大小不能超过 20MB!");
+                return false;
+            }
+            this.loading = true;
+            if (this.fileInfo.urlType == "onlineExcel") {
+                query.append("folderId", this.filenowFolder.functionCode ? this.filenowFolder.functionCode : '');
+            }
+            this.num++;
+            let _this = this;
+            // this.$http({
+            //     url: '/market/cOnlineSyncExcel/addExcelForUpload',
+            //     method: "post",
+            //     headers: {
+            //         "Content-Type": "application/json",
+            //     },
+            //     data: {
+            //         fileName: file.name.split('.')[0],
+            //         docType: docType,
+            //         folderId: this.filenowFolder.functionCode ? this.filenowFolder.functionCode : ''
+            //     },
+
+            // }).then((res) => {
+            //     console.log(res.data.desc);
+            this.$http({
+                url: this.fileInfo.url,
+                method: "post",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                data: query,
+            }).then((res) => {
+                this.$refs["upload"].clearFiles();
+                if (res.data.result == 0) {
+                    _this.$message({
+                        message: res.data.desc,
+                        type: "success",
+                    });
+                } else if (res.data.result == 1) {
+                    _this.$message({
+                        message: res.data.desc,
+                        type: "error",
+                    });
+                } else if (res.data.result == 2) {
+                    _this.$message({
+                        message: res.data.desc,
+                        type: "warning",
+                    });
+                } else if (res.data.result == 3) {
+                    _this.$message({
+                        message: res.data.desc,
+                        type: "info",
+                    });
+                } else {
+                    _this.$message({
+                        message: res.data.desc,
+                        type: "success",
+                    });
+                }
+                this.num--;
+                if (this.num == 0) {
+                    this.loading = false;
+                }
+                this.$emit("uploadBack", this.attList);
+                return true;
+            }).catch((res) => {
+                this.$message({
+                    message: file.name + "上传失败",
+                    type: "error",
+                });
+                this.num--;
+                if (this.num == 0) {
+                    this.loading = false;
+                }
+                for (let i = 0; i < this.$refs["upload"].uploadFiles.length; i++) {
+                    if (file.name == this.$refs["upload"].uploadFiles[i].name) {
+                        this.$refs["upload"].uploadFiles.splice(i, 1);
+                    }
+                }
+                return false;
+            });
+            // })
+
+        },
+    },
+    mounted() { },
+    created() {
+        this.attList = [];
+        console.log(this.fileList);
+        if (this.fileList) {
+            for (let i = 0; i < this.fileList.length; i++) {
+                this.attList.push({
+                    id: this.fileList[i].id,
+                    name: this.fileList[i].fileName,
+                    fileCode: this.fileList[i].fileCode,
+                    opName: this.fileList[i].opName,
+                    opNo: this.fileList[i].opNo,
+                    opTime: this.fileList[i].opTime,
+                    attchFileId: this.fileList[i].attchFileId,
+                    type: this.fileList[i].type,
+                })
+            }
+        }
+
+        console.log(this.attList);
+    },
+    watch: {
+        fileList() {
+            this.attList = [];
+            for (let i = 0; i < this.fileList.length; i++) {
+                this.attList.push({
+                    id: this.fileList[i].id,
+                    name: this.fileList[i].fileName,
+                    fileCode: this.fileList[i].fileCode,
+                    opName: this.fileList[i].opName,
+                    opNo: this.fileList[i].opNo,
+                    opTime: this.fileList[i].opTime,
+                    attchFileId: this.fileList[i].attchFileId,
+                    type: this.fileList[i].type,
+                });
+            }
+        },
+    },
+};
+</script>
+<style lang="scss" scoped>
+::v-deep .el-upload-dragger {
+    height: 120px !important;
+    border: none;
+}
+
+::v-deep .el-upload {
+    padding: 0px;
+}
+</style>
+  

src/router/index.js

@@ -22,6 +22,12 @@ const routes = [{
             component: (resolve) => require( /* webpackChunkName: "system" */['../pages/main/onlineOffice/index.vue'], resolve)
         },
         {
+            meta: { name: '在线onlineOfficeExcel', keepAlive: false },
+            path: '/onlineOfficeExcel',
+            name: 'onlineOfficeExcel',
+            component: (resolve) => require( /* webpackChunkName: "system" */['../pages/main/onlineOfficeExcel/index.vue'], resolve)
+        },
+        {
             meta: { name: '绩效', keepAlive: false },
             path: '/performance',
             name: 'performance',