From dc7de04cfaa135344071803f5af14c40a5ea53f3 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期二, 19 十一月 2024 12:14:00 +0800
Subject: [PATCH] 导入优化
---
src/views/student/components/upload-student.vue | 334 ++++++++++++++++++++++++++++---------------------------
1 files changed, 171 insertions(+), 163 deletions(-)
diff --git a/src/views/student/components/upload-student.vue b/src/views/student/components/upload-student.vue
index cbc7afc..aa42e4d 100644
--- a/src/views/student/components/upload-student.vue
+++ b/src/views/student/components/upload-student.vue
@@ -1,194 +1,202 @@
<template>
- <el-form class="demo-ruleForm">
- <el-form-item label="" style="display: inline-block">
- <div class="uploading-center">
- <div class="uploading">
- <dragUpload
- :limit="1"
- :orgId="parseInt(orgId)"
- :staffId="parseInt(staffId)"
- @fileSuccess="fatherMethod"
- @file-uploading="showUploadProcess"
- :type="'AUDIENCE'"
- :action="'/dream_dev/player/importPlayer'"
- >
- <div class="uploading-btn-to">
- <i class="iconfont iconAdd"></i> 涓婁紶
- </div>
- <div class="el-upload__tip" slot="tip">
- 鍙兘涓婁紶.xls,.xlsx鏂囦欢
- </div>
- </dragUpload>
- </div>
- <div class="download-file">
- <i class="iconfont iconFile"></i>
- <a href="/static/瀛﹀憳瀵煎叆妯℃澘.xlsx" download
- >涓嬭浇瀛﹀憳妯℃澘</a
- >
- </div>
+ <el-form class="demo-ruleForm">
+ <el-form-item label="" style="display: inline-block">
+ <div class="uploading-center">
+ <div class="uploading">
+ <dragUpload
+ :limit="1"
+ :orgId="parseInt(orgId)"
+ :staffId="parseInt(staffId)"
+ @fileSuccess="fatherMethod"
+ @file-uploading="showUploadProcess"
+ :type="'AUDIENCE'"
+ :action="'/dream_dev/player/importPlayer'"
+ >
+ <div class="uploading-btn-to">
+ <i class="iconfont iconAdd"></i> 涓婁紶
</div>
- <div style="font-size: 12px; color: #6993ff" v-if="hasAudience">
- 宸蹭笂浼�,濡傞渶淇敼鐩存帴鐐瑰嚮涓婁紶
- <i
- class="el-icon-close"
- title="鍒犻櫎"
- @click="clearaudience"
- ></i>
- </div>
- </el-form-item>
+ <div class="el-upload__tip" slot="tip">鍙兘涓婁紶.xls,.xlsx鏂囦欢</div>
+ </dragUpload>
+ </div>
+ <div class="download-file">
+ <i class="iconfont iconFile"></i>
+ <a href="/static/瀛﹀憳瀵煎叆妯℃澘.xlsx" download>涓嬭浇瀛﹀憳妯℃澘</a>
+ </div>
+ </div>
+ <div style="font-size: 12px; color: #6993ff" v-if="hasAudience">
+ 宸蹭笂浼�,濡傞渶淇敼鐩存帴鐐瑰嚮涓婁紶
+ <i class="el-icon-close" title="鍒犻櫎" @click="clearaudience"></i>
+ </div>
+ </el-form-item>
- <el-progress
- v-show="progress"
- type="circle"
- :percentage="percentage"
- :status="progressStatus"
- ></el-progress>
- </el-form>
+ <el-progress
+ v-show="progress"
+ type="circle"
+ :percentage="percentage"
+ :status="progressStatus"
+ ></el-progress>
+ </el-form>
</template>
<script>
import dragUpload from "@/components/drag-upload";
var self = null;
export default {
- inject: ["reload"],
- name: "Creation",
- data() {
- return {
- orgId: 0,
- staffId: 0,
- hasAudience: false,
- progress: false,
- percentage: 0,
- progressStatus: ""
+ inject: ["reload"],
+ name: "Creation",
+ data() {
+ return {
+ orgId: 0,
+ staffId: 0,
+ hasAudience: false,
+ progress: false,
+ percentage: 0,
+ progressStatus: "",
+ };
+ },
+ components: { dragUpload },
+ methods: {
+ downloadlist() {
+ window.open("../../../assets/瀛﹀憳瀵煎叆妯℃澘.xlsx", "_blank");
+ // this.download('downPlayerTemplate', '瀛﹀憳瀵煎叆妯℃澘.xlsx')
+ },
+ clearaudience() {
+ this.hasAudience = false;
+ },
+ fatherMethod(res, type) {
+ // if (res.falseLst === null) {
+ // this.$message.success("涓婁紶鏁版嵁鎴愬姛");
+ // this.$emit("load-success");
+ // } else if (res.falseLst.length >= 1) {
+ // let errortips = "";
+ // res.falseLst.map((item) => {
+ // errortips += (`${item.playerRoll}` + `${item.cause} \r\n`).replace('[]', '');
+ // });
+ // this.$message({
+ // message: `瀵煎叆鏁版嵁鎴愬姛瀵煎叆${res.successNum}鏉�,閿欒淇℃伅:${errortips}`,
+ // type: "error",
+ // duration: 6000,
+ // });
+ // }
+ },
+ showUploadProcess() {
+ self.progress = true;
+ self.percentage = 0.1;
+ self.progressStatus = "";
+ setTimeout(function () {
+ const eventSource = new EventSource(
+ "/dream_dev/sse-stream/" +
+ JSON.parse(localStorage.getItem("selectStaff")).id
+ );
+
+ eventSource.onmessage = function (event) {
+ const res = JSON.parse(event.data);
+ self.percentage = Math.floor((res.current / res.total) * 10000) / 100;
+
+ if (res.current == res.total) {
+ self.progressStatus = "success";
+ if (res.falseLst === null || res.falseLst.length === 0) {
+ self.$message.success("涓婁紶鏁版嵁鎴愬姛");
+ self.$emit("load-success");x
+ } else if (res.falseLst.length >= 1) {
+ let errortips = "";
+ res.falseLst.map((item) => {
+ errortips += (
+ `${item.playerRoll}` +
+ `${item.cause} </div><div style='line-height: 1.5;'>`
+ ).replace("[]", "");
+ });
+ self.$message({
+ dangerouslyUseHTMLString: true,
+ message: `<div style='line-height: 1.5;'>瀵煎叆鏁版嵁鎴愬姛瀵煎叆${
+ res.successNum || 0
+ }鏉�,閿欒淇℃伅:</div><div style='line-height: 1.5;'>${errortips}</div>`,
+ type: "error",
+ duration: 6000,
+ showClose: true,
+ });
+ }
+
+ self.progress = false;
+ }
};
- },
- components: { dragUpload },
- methods: {
- downloadlist() {
- window.open("../../../assets/瀛﹀憳瀵煎叆妯℃澘.xlsx", "_blank");
- // this.download('downPlayerTemplate', '瀛﹀憳瀵煎叆妯℃澘.xlsx')
- },
- clearaudience() {
- this.hasAudience = false;
- },
- fatherMethod(res, type) {
- // if (res.falseLst === null) {
- // this.$message.success("涓婁紶鏁版嵁鎴愬姛");
- // this.$emit("load-success");
- // } else if (res.falseLst.length >= 1) {
- // let errortips = "";
- // res.falseLst.map((item) => {
- // errortips += (`${item.playerRoll}` + `${item.cause} \r\n`).replace('[]', '');
- // });
- // this.$message({
- // message: `瀵煎叆鏁版嵁鎴愬姛瀵煎叆${res.successNum}鏉�,閿欒淇℃伅:${errortips}`,
- // type: "error",
- // duration: 6000,
- // });
- // }
- },
- showUploadProcess() {
- self.progress = true
- setTimeout(function () {
- const eventSource = new EventSource('/dream_dev/sse-stream/' + JSON.parse(localStorage.getItem("selectStaff")).id);
- eventSource.onmessage = function (event) {
- const res = JSON.parse(event.data)
- self.percentage = parseInt(res.current * 100 / res.total)
- if (res.current == res.total) {
- self.progressStatus = 'success'
- if (res.falseLst === null) {
- self.$message.success("涓婁紶鏁版嵁鎴愬姛");
- self.$emit("load-success");
- } else if (res.falseLst.length >= 1) {
- let errortips = "";
- res.falseLst.map((item) => {
- errortips += (`${item.playerRoll}` + `${item.cause} \r\n`).replace('[]', '');
- });
- self.$message({
- message: `瀵煎叆鏁版嵁鎴愬姛瀵煎叆${res.successNum}鏉�,閿欒淇℃伅:${errortips}`,
- type: "error",
- duration: 6000,
- });
- }
- }
- };
-
- eventSource.onerror = function (err) {
- console.error("EventSource failed:", err);
- eventSource.close();
- };
- }, 3 * 1000);
- }
+ eventSource.onerror = function (err) {
+ console.error("EventSource failed:", err);
+ eventSource.close();
+ self.showUploadProcess()
+ };
+ }, 3 * 1000);
},
- created() {
- self = this
- const selectStaff = JSON.parse(localStorage.getItem("selectStaff"));
- this.orgId = selectStaff.org.id;
- this.staffId = selectStaff.id;
- },
+ },
+ created() {
+ self = this;
+ const selectStaff = JSON.parse(localStorage.getItem("selectStaff"));
+ this.orgId = selectStaff.org.id;
+ this.staffId = selectStaff.id;
+ },
};
</script>
<style lang="scss" scoped>
.demo-ruleForm {
- text-align: center;
+ text-align: center;
}
.creation-center {
- padding: 40px 40px 40px 40px;
+ padding: 40px 40px 40px 40px;
}
.uploading-center {
+ display: flex;
+ flex-direction: row;
+ > .uploading {
+ min-height: 40px;
+ line-height: 40px;
+ box-sizing: border-box;
+ border-radius: 4px;
+ }
+ .uploading-btn-to {
+ width: 100px;
+ line-height: 38px;
+ height: 38px;
+ border-radius: 3px;
+ text-align: center;
+ padding: 0 0px;
+ cursor: pointer;
+ user-select: none;
+ margin-left: 0;
+ color: #ffa800;
+ font-size: 14px;
+ border: 1px solid #ffbe41;
+ > i {
+ color: #ffbe41;
+ font-size: 12px;
+ margin-right: 5px;
+ }
+ }
+ > .download-file {
+ float: left;
display: flex;
flex-direction: row;
- > .uploading {
- min-height: 40px;
- line-height: 40px;
- box-sizing: border-box;
- border-radius: 4px;
+ margin-left: 20px;
+ color: #6993ff;
+ font-size: 14px;
+ cursor: pointer;
+ user-select: none;
+ height: 40px;
+ > div {
+ width: 117px;
+ margin-left: 5px;
}
- .uploading-btn-to {
- width: 100px;
- line-height: 38px;
- height: 38px;
- border-radius: 3px;
- text-align: center;
- padding: 0 0px;
- cursor: pointer;
- user-select: none;
- margin-left: 0;
- color: #ffa800;
- font-size: 14px;
- border: 1px solid #ffbe41;
- > i {
- color: #ffbe41;
- font-size: 12px;
- margin-right: 5px;
- }
- }
- > .download-file {
- float: left;
- display: flex;
- flex-direction: row;
- margin-left: 20px;
- color: #6993ff;
- font-size: 14px;
- cursor: pointer;
- user-select: none;
- height: 40px;
- > div {
- width: 117px;
- margin-left: 5px;
- }
- }
+ }
}
.uploading-center-style {
- ::v-deep .upload-demo {
- ::v-deep .el-upload {
- line-height: 38px;
- }
+ ::v-deep .upload-demo {
+ ::v-deep .el-upload {
+ line-height: 38px;
}
+ }
}
::v-deep .uploading-center > .uploading {
- line-height: 37px;
+ line-height: 37px;
}
</style>
\ No newline at end of file
--
Gitblit v1.8.0