328 lines
9.0 KiB
Vue
Executable File
328 lines
9.0 KiB
Vue
Executable File
<template>
|
||
<div v-show="upShow">
|
||
<el-dialog title="上传测试文件" :visible.sync="upShow" width="30%" :before-close="upShowClose">
|
||
<div v-loading="Uploadloading">
|
||
<div style="margin: 0 auto;display: flex;justify-content: center;" :disabled="true">
|
||
<el-upload class="upload-demo" ref="upload" action="doUpload" :limit="1" :file-list="fileList" :before-upload="beforeUpload">
|
||
<el-button slot="trigger" size="small" type="primary" style="margin-top: 60px;">选取文件</el-button>
|
||
|
||
<div slot="tip" class="el-upload__tip">只能上传excel文件，且不超过5MB</div>
|
||
<div slot="tip" class="el-upload-list__item-name">{{fileName}}</div>
|
||
</el-upload>
|
||
</div>
|
||
|
||
<div slot="footer" class="dialog-footer" style="margin-left: 30%;margin-top: 30px;">
|
||
|
||
<el-button slot="trigger" size="mini" type="primary" @click="accessTemplate">下载模板</el-button>
|
||
<!-- getDownloadJsonField -->
|
||
<el-button slot="trigger" size="mini" type="primary" @click="JsonFieldOpen">查看JSON</el-button>
|
||
<el-button @click="$emit('upshowf')">取消</el-button>
|
||
<el-button type="primary" @click="submitUpload()" :disabled="fileName?false:'disabled'">确定</el-button>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</el-dialog>
|
||
|
||
<el-dialog title="查看JSON" :visible.sync="JsonField" width="50%" append-to-body >
|
||
<div v-loading="JsonFieldloading">
|
||
|
||
<el-input type="textarea" rows="20" id="tempJsonValue" :value="tempJson">
|
||
|
||
</el-input>
|
||
<div slot="footer" class="dialog-footer" style="margin-left: 50%;margin-top: 30px;">
|
||
<el-button type="primary" @click="copy">复制</el-button>
|
||
<el-button type="primary" @click="JsonField=false">确定</el-button>
|
||
</div>
|
||
</div>
|
||
|
||
</el-dialog>
|
||
|
||
<el-dialog title="批量测试结果" :visible.sync="resultShow" width="50%" append-to-body >
|
||
<div>
|
||
<el-row class="top-head">
|
||
<el-col :span="8"><div class="grid-content">执行状态</div></el-col>
|
||
<el-col :span="8"><div class="grid-content">执行结果</div></el-col>
|
||
<el-col :span="8"><div class="grid-content">条数</div></el-col>
|
||
</el-row>
|
||
<div class="result-box">
|
||
<el-row v-for="(item,key) in result.success">
|
||
<el-col :span="8"><div class="grid-content">成功</div></el-col>
|
||
<el-col :span="8"><div class="grid-content">{{key?key:key==0?'0':'-'}}</div></el-col>
|
||
<el-col :span="8"><div class="grid-content">{{item?item:'-'}}</div></el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :span="8"><div class="grid-content">失败</div></el-col>
|
||
<el-col :span="8"><div class="grid-content">-</div></el-col>
|
||
<el-col :span="8"><div class="grid-content">{{result.failNum}}</div></el-col>
|
||
</el-row>
|
||
</div>
|
||
<el-divider></el-divider>
|
||
<el-row>
|
||
<el-col :span="8"><div class="grid-content">总计</div></el-col>
|
||
<el-col :span="8"><div class="grid-content"> </div></el-col>
|
||
<el-col :span="8"><div class="grid-content">{{result.total}}</div></el-col>
|
||
</el-row>
|
||
</div>
|
||
|
||
</el-dialog>
|
||
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getDownloadJsonField,
|
||
batchTest
|
||
} from '@/api/index.js'
|
||
export default {
|
||
components: {
|
||
getDownloadJsonField
|
||
},
|
||
props: {
|
||
upShow: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
versionId: {
|
||
type: Number | String,
|
||
default: 0
|
||
},
|
||
engid:{
|
||
type:Number | String,
|
||
default:null
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
JsonField: false,
|
||
Uploadloading: false,
|
||
fileName: '',
|
||
fileList: [],
|
||
tempJson: '',
|
||
JsonFieldloading: false,
|
||
resultloading:false,
|
||
resultShow:false,
|
||
result:{}
|
||
}
|
||
},
|
||
methods: {
|
||
copy() {
|
||
var Url2 = document.getElementById("tempJsonValue");
|
||
Url2.select(); // 选择对象
|
||
document.execCommand("Copy")
|
||
this.$message({
|
||
message: '复制成功',
|
||
type: 'success'
|
||
});
|
||
},
|
||
JsonFieldOpen() {
|
||
this.tempJson = ""
|
||
this.JsonFieldloading = true
|
||
this.JsonField = true
|
||
getDownloadJsonField({
|
||
versionId: Number(this.versionId)
|
||
}).then(res => {
|
||
this.JsonFieldloading = false
|
||
if (res.status == 1) {
|
||
this.tempJson = JSON.stringify(JSON.parse(res.data), null, 4)
|
||
} else {
|
||
this.tempJson = '暂无数据'
|
||
}
|
||
}).catch(err => {
|
||
this.JsonFieldloading = false
|
||
})
|
||
},
|
||
accessTemplate() {
|
||
var that = this
|
||
let size = 0;
|
||
var data = {
|
||
versionId: Number(this.versionId),
|
||
}
|
||
this.Uploadloading = true
|
||
fetch('/Riskmanage/v2/engine/createSampleData', {
|
||
method: 'POST',
|
||
body: JSON.stringify(data),
|
||
headers: {
|
||
'token': localStorage.getItem("token"),
|
||
'content-type': 'application/json'
|
||
},
|
||
}).then(response => {
|
||
if (response.ok) {
|
||
// console.log(response)
|
||
return response;
|
||
} else {
|
||
// console.log("请求失败")
|
||
}
|
||
})
|
||
.then(response => response.body)
|
||
.then(body => {
|
||
const reader = body.getReader();
|
||
|
||
return new ReadableStream({
|
||
start(controller) {
|
||
return pump();
|
||
|
||
function pump() {
|
||
return reader.read().then(res => { //res ({ done, value })
|
||
// 读不到更多数据就关闭流
|
||
// console.log(res, "res");
|
||
const {
|
||
done,
|
||
value
|
||
} = res;
|
||
if (done) {
|
||
// console.log("end")
|
||
controller.close();
|
||
// return;
|
||
}
|
||
size += value.length || 0;
|
||
// console.log(size, "size")
|
||
// 将下一个数据块置入流中
|
||
controller.enqueue(value);
|
||
// this.Uploadloading = false
|
||
return pump();
|
||
});
|
||
}
|
||
}
|
||
})
|
||
})
|
||
.then(stream => new Response(stream))
|
||
.then(response => that.savingFile(response, '引擎入参.xlsx'))
|
||
.catch(err => console.error(err));
|
||
},
|
||
beforeUpload(file) {
|
||
// console.log(file, '文件');
|
||
this.files = file;
|
||
const extension = file.name.split('.')[1] === 'xls'
|
||
const extension2 = file.name.split('.')[1] === 'xlsx'
|
||
const isLt2M = file.size / 1024 / 1024 < 5
|
||
if (!extension && !extension2) {
|
||
this.$message.warning('上传模板只能是 xls、xlsx格式!')
|
||
return
|
||
}
|
||
if (!isLt2M) {
|
||
this.$message.warning('上传模板大小不能超过 5MB!')
|
||
return
|
||
}
|
||
this.fileName = file.name;
|
||
return false // 返回false不会自动上传
|
||
},
|
||
submitUpload() {
|
||
this.Uploadloading = true
|
||
// console.log('上传' + this.files.name)
|
||
if (this.fileName == "") {
|
||
this.$message.warning('请选择要上传的文件！')
|
||
this.Uploadloading = false
|
||
return false
|
||
}
|
||
let fileFormData = new FormData();
|
||
fileFormData.append('file', this.files); //filename是键，file是值，就是要传的文件，test.zip是要传的文件名
|
||
fileFormData.append('engineId',this.engid)
|
||
this.batchTest(fileFormData).then(res=>{
|
||
if (res.status === "1") {
|
||
this.upShowClose()
|
||
this.resultShow=true;
|
||
this.result = res.data;
|
||
}
|
||
this.Uploadloading = false
|
||
})
|
||
// console.log(this.getData)
|
||
// this.getData.fieldsubmit(fileFormData).then(res => {
|
||
// if (res.status === "1") {
|
||
|
||
// this.upShowClose()
|
||
// }
|
||
// this.Uploadloading = false
|
||
// })
|
||
|
||
|
||
|
||
|
||
|
||
},
|
||
upShowClose() {
|
||
this.$emit('upshowf')
|
||
},
|
||
savingFile(response, fileName) {
|
||
const that = this;
|
||
response.blob().then(blob => {
|
||
|
||
if (typeof FileReader === 'undefined') {
|
||
notification.open({
|
||
message: '您的浏览器不支持 FileReader，请升级浏览器',
|
||
})
|
||
}
|
||
const reader = new FileReader();
|
||
reader.addEventListener("loadend", function() {
|
||
let resu = '';
|
||
try {
|
||
resu = JSON.parse(reader.result);
|
||
// resu = eval('('+ reader.result + ')')
|
||
if (resu.code == 500) {
|
||
notification.open({
|
||
message: resu.msg,
|
||
})
|
||
} else if (resu.code == 401) {
|
||
notification.error({
|
||
message: resu.msg
|
||
})
|
||
}
|
||
} catch (e) {
|
||
that.Uploadloading = false
|
||
//捕获错误 说明是文本字符串
|
||
resu = reader.result;
|
||
downloadBlob(blob, fileName);
|
||
}
|
||
|
||
});
|
||
reader.readAsText(blob);
|
||
|
||
//下载
|
||
function downloadBlob(blob, fileName) {
|
||
let blobUrl = window.URL.createObjectURL(blob);
|
||
let a = document.createElement('a');
|
||
a.href = blobUrl;
|
||
a.target = '_blank';
|
||
a.style.display = 'none'
|
||
document.body.appendChild(a)
|
||
a.download = fileName;
|
||
a.click();
|
||
window.URL.revokeObjectURL(blobUrl);
|
||
document.body.removeChild(a)
|
||
that.Uploadloading = false
|
||
// that.setState({
|
||
// downloading: false
|
||
// })
|
||
}
|
||
}).catch(err => {
|
||
that.Uploadloading = false
|
||
// console.log(err)
|
||
if (err == 'TypeError: Failed to fetch') {
|
||
that.accessTemplate()
|
||
}
|
||
})
|
||
},
|
||
async batchTest(param) {
|
||
const data = await batchTest(param);
|
||
return data
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
.result-box{
|
||
min-height:100px;
|
||
max-height:300px;
|
||
overflow-y:scroll;
|
||
}
|
||
.top-head .grid-content{
|
||
background:#F2F6FC;
|
||
}
|
||
.grid-content{
|
||
line-height:35px;
|
||
text-align:center;
|
||
}
|
||
</style>
|