You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
281 lines
8.0 KiB
281 lines
8.0 KiB
<template>
|
|
<div class="">
|
|
<div class="content_box">
|
|
<div class="left">
|
|
<img class="rotate" src="@/assets/images/index/loading.png" alt="" />
|
|
<p>请您耐心等待！如果您发现导入数据问题较多，可以取消导入</p>
|
|
<div>
|
|
<el-button
|
|
style="margin-left: 10px"
|
|
size="small"
|
|
type="primary"
|
|
@click="handelClickBackList"
|
|
>返回任务列表</el-button
|
|
>
|
|
<el-button
|
|
style="margin-left: 10px"
|
|
size="small"
|
|
class="diy-button--white"
|
|
plain
|
|
@click="handelClickBack"
|
|
>取消导入</el-button
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="right">
|
|
<h4>
|
|
<el-icon
|
|
class="el-icon-warning-outline"
|
|
style="color: #0056d6; font-size: 18px; font-weight: 600"
|
|
></el-icon>
|
|
操作说明
|
|
</h4>
|
|
<p>1、导入数据过大，系统需要一定事件处理。</p>
|
|
<p>
|
|
2、导入过程中可查看导入明细，如果发现导入数据问题较多，可以取消本次导入，重新整理数据后，重新创建任务导入。
|
|
</p>
|
|
<p>3、导入失败的数据，您可以下载失败文件，修改后重新创建任务导入</p>
|
|
</div>
|
|
</div>
|
|
<h3 class="title-small">数据导入明细</h3>
|
|
<el-row type="flex" justify="">
|
|
<el-col :span="24">
|
|
<i class="el-icon-circle-check" style="color: #1cc58c; font-size: 15px;font-weight: 600;"></i> {{ this.importSuccessNum || "--" }}条数据已导入。<el-button
|
|
type="text"
|
|
@click="handelClickLook('success')"
|
|
>查看</el-button
|
|
>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row type="flex" justify="">
|
|
<el-col :span="24">
|
|
<i class="el-icon-circle-close" style="color: #ff5b5d;font-size: 15px;font-weight: 600;"></i> {{ this.importFailNum || "--" }}条问题数据导入失败。<el-button
|
|
type="text"
|
|
@click="handelClickLook('fail')"
|
|
>查看</el-button
|
|
>
|
|
</el-col>
|
|
</el-row>
|
|
<el-dialog
|
|
title="导入结果明细"
|
|
:visible.sync="showTable"
|
|
width="50%"
|
|
v-if="showTable"
|
|
>
|
|
<el-table
|
|
:data="tableData"
|
|
row-key="fileCode"
|
|
border
|
|
style="width: 100%"
|
|
>
|
|
<el-table-column
|
|
v-for="item in tableHeader"
|
|
:key="item.columnName"
|
|
:prop="item.columnName"
|
|
:label="item.label"
|
|
:align="item.align"
|
|
show-overflow-tooltip
|
|
>
|
|
<template slot-scope="scope">
|
|
<span>{{ handleFilterSpan(scope.row, item) }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-pagination
|
|
:current-page="pageNo"
|
|
:page-size="pageSize"
|
|
:total="total"
|
|
layout=" prev, pager, next"
|
|
@current-change="pageCurrentChangeHandle"
|
|
>
|
|
</el-pagination>
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button @click="showTable = false">取 消</el-button>
|
|
<el-button type="primary" @click="showTable = false"
|
|
>确 定</el-button
|
|
>
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { requestPost, requestGet } from "@/js/dai/request";
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
rules: {
|
|
importCategory: [
|
|
{ required: true, message: "请选择任务类型", trigger: "change" },
|
|
],
|
|
taskName: [
|
|
{ required: true, message: "请输入任务名称", trigger: "change" },
|
|
],
|
|
},
|
|
resident_category_import_list: [],
|
|
taskId: null,
|
|
timerId: null,
|
|
importSuccessNum: null,
|
|
importFailNum: null,
|
|
importCategory: null,
|
|
showTable: false,
|
|
tableHeader: [],
|
|
tableData:[],
|
|
pageNo:1,
|
|
pageSize:20,
|
|
total:0,
|
|
tableType:null,
|
|
};
|
|
},
|
|
props: {
|
|
fileCodeRow: {
|
|
type: String,
|
|
default: "",
|
|
},
|
|
fileCode:{
|
|
type:String,
|
|
default:""
|
|
}
|
|
},
|
|
async created() {
|
|
await this.getTaskInfo();
|
|
await this.startTimer();
|
|
},
|
|
methods: {
|
|
handleFilterSpan(row, item) {
|
|
let _val = "";
|
|
if (item.options && item.options.length > 0) {
|
|
item.options.forEach((n) => {
|
|
if (n.value === row[item.columnName]) _val = n.label;
|
|
});
|
|
}
|
|
return _val || row[item.columnName];
|
|
},
|
|
startTimer() {
|
|
if (!this.timerId) {
|
|
this.timerId = setInterval(this.getProcessRate, 500);
|
|
}
|
|
},
|
|
// 停止定时器
|
|
stopTimer() {
|
|
clearInterval(this.timerId);
|
|
this.timerId = null;
|
|
},
|
|
async getProcessRate() {
|
|
let url = "/actual/base/intelligentImportData/processRate";
|
|
let parm = {
|
|
fileCode: this.fileCodeRow|| this.fileCode,
|
|
};
|
|
let res = await requestPost(url, parm);
|
|
if (res.code == 0) {
|
|
if (res.data === 100) {
|
|
this.stopTimer();
|
|
this.$emit('successImport')
|
|
}else{
|
|
this.$emit('updateProgress',res.data)
|
|
}
|
|
} else if (code >= 8000) {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
async getTaskInfo() {
|
|
let url = "/actual/base/intelligentImportData/getTaskInfo";
|
|
let parm = {
|
|
fileCode: this.fileCodeRow || this.fileCode,
|
|
};
|
|
let { data, code, msg } = await requestPost(url, parm);
|
|
if (code == 0) {
|
|
this.taskId = data.taskId;
|
|
this.importFailNum = data.importFailNum.toString();
|
|
this.importSuccessNum = data.importSuccessNum.toString();
|
|
this.importCategory = data.importCategory;
|
|
this.$emit('updateoperatorName',{operatorName:data.operatorName,createdTime:data.createdTime})
|
|
if (data.processStatus != "processing") {
|
|
this.stopTimer();
|
|
}
|
|
} else if (code >= 8000) {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
async handelClickLook(type) {
|
|
this.showTable = true;
|
|
this.tableType = type;
|
|
this.pageNo = 1;
|
|
this.getTable()
|
|
},
|
|
async getTable(){
|
|
let url = "/actual/base/excelDataShow/quaryExcelDataList";
|
|
const {pageNo,pageSize,importCategory,tableType} = this;
|
|
let parm = {
|
|
taskId: this.taskId,
|
|
boolranFlag: tableType == "success" ? "1" : "0",
|
|
pageNo,
|
|
pageSize,
|
|
fileCategory:importCategory,
|
|
};
|
|
let { data, code, msg } = await requestPost(url, parm);
|
|
if (code == 0) {
|
|
this.showTable = true;
|
|
this.tableHeader = Object.entries(data.columnsDict).map((item) => ({
|
|
label: item[0],
|
|
columnName: item[1],
|
|
})); //属性名和属性值
|
|
this.tableData = data.excelDataShowDTOList.list;
|
|
this.total = data.excelDataShowDTOList.total;
|
|
} else if (code >= 8000) {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
async cancelTask() {
|
|
let url = "/actual/base/intelligentImportData/cancelTask";
|
|
let parm = {
|
|
fileCode: this.fileCode||this.fileCodeRow ,
|
|
taskId: this.taskId,
|
|
};
|
|
let { data, code, msg } = await requestPost(url, parm);
|
|
if (code == 0) {
|
|
console.log(data);
|
|
this.$message.info("任务已取消");
|
|
this.$emit("handelClickBack");
|
|
} else if (code >= 8000) {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
handelClickBack() {
|
|
this.$confirm(`您确定要取消本次数据导入任务吗`, {
|
|
confirmButtonText: "确定",
|
|
cancelButtonText: "再想想",
|
|
type: "warning",
|
|
})
|
|
.then(() => {
|
|
this.cancelTask();
|
|
})
|
|
.catch(() => {});
|
|
},
|
|
|
|
handelClickBackList() {
|
|
this.$emit("handelClickBack");
|
|
},
|
|
},
|
|
destroyed() {
|
|
this.stopTimer();
|
|
},
|
|
components: {},
|
|
computed: {},
|
|
watch: {},
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
@import "@/assets/scss/buttonstyle.scss";
|
|
@import "@/assets/scss/modules/management/detail-main.scss";
|
|
@import "@/assets/scss/pages/smartImport.scss";
|
|
.left {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
color: #838383;
|
|
}
|
|
</style>
|
|
|