| | |
| | | <template> |
| | | <span class="upload-content pr"> |
| | | <!-- <el-button |
| | | type="primary" |
| | | :loading="upLoadLoading" |
| | | :size="uploadBtnSize" |
| | | data-style="slide-down" |
| | | @click.native="uploadStart" |
| | | > |
| | | <i :class="uploadBtnIcon"></i> |
| | | {{uploadBtntext}} |
| | | </el-button> --> |
| | | <span |
| | | class="iconfont iconfont-wrap iconshangchuantupian-09" |
| | | @click="uploadStart" |
| | |
| | | @dragenter="dragenter($event)" |
| | | @dragleave="dragleave($event)" |
| | | > |
| | | <!-- <i |
| | | class="el-icon-upload text-primary" |
| | | style="color: rgb(61, 104, 225)" |
| | | ></i> --> |
| | | <div class="icon-wrap"> |
| | | <span class="iconfont iconshangchuantupian-11"></span> |
| | | </div> |
| | | <div |
| | | class="el-upload__text" |
| | | style="margin-top: 10px" |
| | | > |
| | | <div class="el-upload__text" style="margin-top: 10px"> |
| | | 将文件拖到此处或<span class="text-primary cursor-pointer" |
| | | >点击上传</span |
| | | > |
| | | </div> |
| | | <div |
| | | class="el-upload__tip text-light" |
| | | > |
| | | <div class="el-upload__tip text-light"> |
| | | {{ limitTypes ? `只能上传${limitTypes}文件` : "" |
| | | }}{{ limitSize ? ` 文件大小不超过${limitSize}` : "" }} |
| | | </div> |
| | |
| | | fileObj && fileObj.name ? "“" + fileObj.name + "”" : "" |
| | | }必须小于` + this.limitSize, |
| | | }; |
| | | // this.$notify(msg) |
| | | return msg; |
| | | } |
| | | return "success"; |
| | |
| | | // 上传附件 |
| | | handleUpLoad(files) { |
| | | // 判断是否选择底库 |
| | | // console.log(this.idJson, 'upload this.idJson') |
| | | if (this.idJson.tableId === undefined || this.idJson.tableId === "") { |
| | | this.$notify({ |
| | | type: "error", |
| | |
| | | // fd.append('files', this.suFileList) |
| | | /* 添加tableId start */ |
| | | if (this.idJson && this.idJson.tableId) { |
| | | console.log(this.idJson, "upload this.idJson"); |
| | | fd.append("tableId", this.idJson.tableId); |
| | | } |
| | | /* 添加orgId officeId end */ |
| | |
| | | }); |
| | | if (res && res.data) { |
| | | const result = res.data; |
| | | // this.$notify({ |
| | | // type: result && result.success ? 'success' : 'error', |
| | | // message: result.msg |
| | | // }) |
| | | this.progressValue = 0; |
| | | this.showProgress = false; |
| | | this.$emit("successFN", result); |
| | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .upload-img-icon { |
| | | width: 60px; |
| | | background-size: 100%; |
| | | background-repeat: no-repeat; |
| | | background-position: center; |
| | | } |
| | | |
| | | .upload-progress { |
| | | width: 96%; |
| | | position: absolute; |
| | |
| | | left: 0; |
| | | display: none; |
| | | } |
| | | .iconshangchuantupian-09:hover { |
| | | border: 1px solid var(--colorCard); |
| | | background: var(--colorCard); |
| | | color: #fff; |
| | | } |
| | | } |
| | | .drag-area { |
| | | position: absolute; |
| | |
| | | padding: 20px 20px 20px 20px; |
| | | right: 0; |
| | | top: 45px; |
| | | border-radius: 8px; box-sizing: border-box; |
| | | border-radius: 8px; |
| | | box-sizing: border-box; |
| | | |
| | | box-shadow: 0px 0px 10px rgb(0 0 0 / 12%); |
| | | .text-center { |
| | |
| | | color: #bbd2f9; |
| | | } |
| | | } |
| | | .el-upload__tip,.el-upload__text { |
| | | .el-upload__tip, |
| | | .el-upload__text { |
| | | font-size: 12px; |
| | | line-height: 17px; |
| | | color: #999999; |