Blame view

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