Commit 530a37c89eff532bc5ae15effe1f7d1affbff50d
1 parent
bb778c90
上传组件
Showing
1 changed file
with
111 additions
and
7 deletions
src/components/upload.vue
| 1 | 1 | <template> |
| 2 | 2 | <div> |
| 3 | - <el-upload> | |
| 4 | - | |
| 5 | - </el-upload> | |
| 3 | + <div class="d1"> | |
| 4 | + 第一步：下载模板并编辑完成学生分数<el-link | |
| 5 | + type="primary" | |
| 6 | + icon="el-icon-download" | |
| 7 | + @click="()=>downExcel()" | |
| 8 | + >下载模版</el-link | |
| 9 | + > | |
| 10 | + </div> | |
| 11 | + <div class="d1"> | |
| 12 | + 第二步：上传完成编辑的模板文件并导入 | |
| 13 | + <el-upload | |
| 14 | + class="upload-demo" | |
| 15 | + ref="upload" | |
| 16 | + action="/api/web/report/importSubjectiveScore" | |
| 17 | + :multiple="false" | |
| 18 | + :data="{ id: id }" | |
| 19 | + :with-credentials="true" | |
| 20 | + :limit="1" | |
| 21 | + :on-change="change" | |
| 22 | + :on-success="upSuccess" | |
| 23 | + :on-error="upError" | |
| 24 | + > | |
| 25 | + <!-- accept="application/vnd.ms-excel" --> | |
| 26 | + <el-button class="btn" size="mini" type="primary" | |
| 27 | + >选择文件并上传</el-button | |
| 28 | + > | |
| 29 | + </el-upload> | |
| 30 | + </div> | |
| 6 | 31 | </div> |
| 7 | 32 | </template> |
| 8 | 33 | |
| 9 | 34 | <script> |
| 35 | +import { downloadTemplate } from "@/api/report"; | |
| 36 | +import { downloadFile } from "@/utils"; | |
| 10 | 37 | export default { |
| 38 | + name: "downUpData", | |
| 39 | + props: { | |
| 40 | + id: { | |
| 41 | + type: String, | |
| 42 | + default: "", | |
| 43 | + }, | |
| 44 | + classObject: { | |
| 45 | + type: Object, | |
| 46 | + default: ()=> { | |
| 47 | + return {} | |
| 48 | + }, | |
| 49 | + } | |
| 50 | + }, | |
| 51 | + data() { | |
| 52 | + return { | |
| 53 | + file: null, | |
| 54 | + }; | |
| 55 | + }, | |
| 56 | + methods: { | |
| 57 | + async submitUpload() { | |
| 58 | + this.$refs.upload.submit(); | |
| 11 | 59 | |
| 12 | -} | |
| 60 | + // const formData = new FormData() | |
| 61 | + // formData.append('id',this.componentId) | |
| 62 | + // formData.append('file',new File(this.file.raw)) | |
| 63 | + // let {status,info} = await uploadExcel(formData); | |
| 64 | + // if(status===0){ | |
| 65 | + // this.$message.success(info); | |
| 66 | + // this.$emit("upSuccess") | |
| 67 | + // } else { | |
| 68 | + // this.$message.error(info); | |
| 69 | + // } | |
| 70 | + }, | |
| 71 | + upSuccess(res) { | |
| 72 | + if (res && res.code == 0 && res.success) { | |
| 73 | + this.$message.success("上传成功"); | |
| 74 | + this.$emit("upSuccess"); | |
| 75 | + } else { | |
| 76 | + this.$message.error(res.message); | |
| 77 | + } | |
| 78 | + }, | |
| 79 | + upError(res) { | |
| 80 | + if (res && res.status == 0) { | |
| 81 | + this.$message.success("上传成功"); | |
| 82 | + this.$emit("upSuccess"); | |
| 83 | + } else { | |
| 84 | + this.$message.error(res.message); | |
| 85 | + } | |
| 86 | + }, | |
| 87 | + change(file) { | |
| 88 | + this.file = file; | |
| 89 | + }, | |
| 90 | + async downExcel() { | |
| 91 | + let data = await downloadTemplate({ | |
| 92 | + id: this.id, | |
| 93 | + }); | |
| 94 | + if (data && !data.code) { | |
| 95 | + let filename = "模板.xlsx"; | |
| 96 | + if (this.classObject) { | |
| 97 | + let className = this.classObject.classObject?.[0].label; | |
| 98 | + filename = className + "_" + this.classObject.subjectName + "_" + this.classObject.examinationName + "_主观题分数导入.xlsx"; | |
| 99 | + } | |
| 100 | + let blob = new Blob([data], { | |
| 101 | + type: "application/vnd.ms-excel;charset=utf-8", | |
| 102 | + }); | |
| 103 | + downloadFile(filename, blob); | |
| 104 | + } else { | |
| 105 | + this.$message.error(data.message); | |
| 106 | + } | |
| 107 | + }, | |
| 108 | + }, | |
| 109 | +}; | |
| 13 | 110 | </script> |
| 14 | 111 | |
| 15 | -<style> | |
| 16 | - | |
| 17 | -</style> | |
| 18 | 112 | \ No newline at end of file |
| 113 | +<style lang="scss" scoped> | |
| 114 | +.d1 { | |
| 115 | + padding: 10px; | |
| 116 | +} | |
| 117 | +.btn { | |
| 118 | + margin-top: 20px; | |
| 119 | + border-radius: 8px; | |
| 120 | + font-weight: normal; | |
| 121 | +} | |
| 122 | +</style> | ... | ... |