优化上传文件

main
fanluyan 4 months ago
parent 9cd3d98d5e
commit 1678ca805a

@ -2,12 +2,19 @@
<div class="transformer"> <div class="transformer">
<div class="choose chooseInputColor"> <div class="choose chooseInputColor">
<div class="button" style="margin-bottom: 10px"> <div class="button" style="margin-bottom: 10px">
<el-button icon="el-icon-upload2" @click="onImportClick"></el-button> <el-button icon="el-icon-upload2" @click="onImportClick"
>导入</el-button
>
<!-- <el-button <!-- <el-button
icon="el-icon-download" icon="el-icon-download"
@click="onDownloadClick" @click="onDownloadClick"
>下载模板</el-button>--> >下载模板</el-button>-->
<el-button v-show="buttonShow" icon="el-icon-delete" @click="deleteReport"></el-button> <el-button
v-show="buttonShow"
icon="el-icon-delete"
@click="deleteReport"
>删除</el-button
>
<!-- 删除弹出框 --> <!-- 删除弹出框 -->
<el-dialog <el-dialog
title="删除" title="删除"
@ -16,7 +23,9 @@
width="36.5%" width="36.5%"
center center
> >
<el-button type="primary" size="small" @click="handleDelete"></el-button> <el-button type="primary" size="small" @click="handleDelete"
>删除</el-button
>
<el-table <el-table
:data="reportData.data" :data="reportData.data"
border border
@ -24,25 +33,62 @@
@selection-change="reportSelectionChange" @selection-change="reportSelectionChange"
> >
<el-table-column type="selection" align="center" /> <el-table-column type="selection" align="center" />
<el-table-column label="序号" type="index" align="center" width="50" /> <el-table-column
<el-table-column prop="fileName" label="报告名称" align="center" width="350" /> label="序号"
<el-table-column prop="createTime" label="创建时间" align="center" width="200" /> type="index"
align="center"
width="50"
/>
<el-table-column
prop="fileName"
label="报告名称"
align="center"
width="350"
/>
<el-table-column
prop="createTime"
label="创建时间"
align="center"
width="200"
/>
</el-table> </el-table>
</el-dialog> </el-dialog>
<!--导入弹出框 --> <!--导入弹出框 -->
<el-dialog title="导入" :visible.sync="isShow" style="width: 100%" @close="downWindows"> <el-dialog
title="导入"
:visible.sync="isShow"
style="width: 100%"
@close="downWindows"
>
<div class="uploadBox"> <div class="uploadBox">
<el-form label-width="80px!important" :inline="true"> <el-form label-width="80px!important" :inline="true">
<el-row :gutter="20" type="flex" style="flex-wrap: wrap"> <el-row :gutter="20" type="flex" style="flex-wrap: wrap">
<el-col :span="6">
<el-form-item label="设备间隔">
<el-select
v-model="equId2"
clearable
placeholder="请选择设备间隔"
@change="equIdChange"
>
<el-option
v-for="item in equNameList"
:key="item.equId"
:label="item.equName"
:value="item.equId"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6"> <el-col :span="6">
<div> <div>
<el-form-item label="设备名称"> <el-form-item label="设备名称">
<el-select v-model="equId2" placeholder="请选择设备名称"> <el-select v-model="stId2" placeholder="请选择设备名称">
<el-option <el-option
v-for="item in equNameList" v-for="item in equThirdNameList"
:key="item.equId" :key="item.stId"
:label="item.equName" :label="item.stName"
:value="item.equId" :value="item.stId"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -74,7 +120,8 @@
type="primary" type="primary"
icon="el-icon-plus" icon="el-icon-plus"
plain plain
>报告选择</el-button> >报告选择</el-button
>
<div slot="tip" class="el-upload__tip">只能上传xlsx/xls文件</div> <div slot="tip" class="el-upload__tip">只能上传xlsx/xls文件</div>
</el-upload> </el-upload>
</div> </div>
@ -102,7 +149,8 @@
type="primary" type="primary"
icon="el-icon-plus" icon="el-icon-plus"
plain plain
>附件选择已选择{{ fileList.length }}</el-button> >附件选择已选择{{ fileList.length }}</el-button
>
</el-upload> </el-upload>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
@ -112,15 +160,18 @@
type="success" type="success"
:disabled=" :disabled="
reportList.length == 0 || reportList.length == 0 ||
reportList.length >= 2 || reportList.length >= 2 ||
fileList.length == 0 fileList.length == 0
" "
icon="el-icon-upload" icon="el-icon-upload"
plain plain
@click="submitUpload()" @click="submitUpload()"
>将选择文件上传服务器</el-button> >将选择文件上传服务器</el-button
>
</span> </span>
<el-button v-show="ShowPreview" style="width: 60px" @click="close"></el-button> <el-button v-show="ShowPreview" style="width: 60px" @click="close"
>关闭</el-button
>
<!-- <file-preview v-show="Showexcel" :file-type="fileType" :excel-pv-props="excelPvProps" /> <!-- <file-preview v-show="Showexcel" :file-type="fileType" :excel-pv-props="excelPvProps" />
<img v-show="Showimg" :src="srcOthers" alt width="300px" height="300px"> <img v-show="Showimg" :src="srcOthers" alt width="300px" height="300px">
<pdf v-for="i in numPages" v-show="Showpdf" :key="i" :src="src" :page="i" /> --> <pdf v-for="i in numPages" v-show="Showpdf" :key="i" :src="src" :page="i" /> -->
@ -134,10 +185,15 @@
</el-dialog> </el-dialog>
</div> </div>
<el-form label-width="80px!important" :inline="true"> <el-form label-width="80px!important" :inline="true">
<el-row :gutter="20" type="flex" style="flex-wrap: wrap;"> <el-row :gutter="20" type="flex" style="flex-wrap: wrap">
<el-col v-show="excelShow" :span="6"> <el-col v-show="excelShow" :span="6">
<el-form-item label="设备间隔"> <el-form-item label="设备间隔">
<el-select v-model="equId" clearable placeholder="请选择设备间隔" @change="equIdChange"> <el-select
v-model="equId"
clearable
placeholder="请选择设备间隔"
@change="equIdChange"
>
<el-option <el-option
v-for="item in equNameList" v-for="item in equNameList"
:key="item.equId" :key="item.equId"
@ -227,8 +283,12 @@
</el-col> </el-col>
<el-col :span="searchLeft"> <el-col :span="searchLeft">
<div class="searchButton"> <div class="searchButton">
<el-button icon="el-icon-search" @click="onSeacherClick"></el-button> <el-button icon="el-icon-search" @click="onSeacherClick"
<el-button icon="el-icon-refresh-right" @click="onResetBtnClick"></el-button> >查询</el-button
>
<el-button icon="el-icon-refresh-right" @click="onResetBtnClick"
>重置</el-button
>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
@ -238,8 +298,8 @@
</template> </template>
<script> <script>
// import FilePreview from '@mrhanson/vue-file-preview' // import FilePreview from '@mrhanson/vue-file-preview'
import pdf from 'vue-pdf' import pdf from "vue-pdf";
import Storage from '@/commons/storage' import Storage from "@/commons/storage";
import { import {
importReport, importReport,
downloadExcel, downloadExcel,
@ -248,68 +308,69 @@ import {
getFirstExcelList, getFirstExcelList,
deviceSubclassList, deviceSubclassList,
testItemList, testItemList,
} from '@/api/user' } from "@/api/user";
var mytoken = Storage.get(Storage.KEYS.TOKEN) var mytoken = Storage.get(Storage.KEYS.TOKEN);
export default { export default {
components: { components: {
// 'file-preview': FilePreview, // 'file-preview': FilePreview,
pdf: pdf pdf: pdf,
}, },
props: { props: {
deleteShow: Boolean, deleteShow: Boolean,
excelShow: Boolean, excelShow: Boolean,
buttonShow: Boolean, buttonShow: Boolean,
reportData: Object reportData: Object,
}, },
data() { data() {
return { return {
sheetName: '', sheetName: "",
stId: '', stId: "",
equId: '', stId2: "",
equId2: '', equId: "",
timeData: '', equId2: "",
testItem: '', timeData: "",
offlineParam: '', testItem: "",
deleted: '', offlineParam: "",
deleted: "",
pickerOptions: { pickerOptions: {
shortcuts: [ shortcuts: [
{ {
text: '最近一个月', text: "最近一个月",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30) start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
}, },
{ {
text: '最近三个月', text: "最近三个月",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 91) start.setTime(start.getTime() - 3600 * 1000 * 24 * 91);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
}, },
{ {
text: '最近半年', text: "最近半年",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 183) start.setTime(start.getTime() - 3600 * 1000 * 24 * 183);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
}, },
{ {
text: '最近一年', text: "最近一年",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 365) start.setTime(start.getTime() - 3600 * 1000 * 24 * 365);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
} },
] ],
}, },
equNameList: [], equNameList: [],
deviceSubclassList: [], deviceSubclassList: [],
@ -326,28 +387,28 @@ export default {
Showword: false, Showword: false,
ShowVideo: false, ShowVideo: false,
preview: false, preview: false,
fileType: 'excel', fileType: "excel",
excelPvProps: { excelPvProps: {
file: null, file: null,
isClientStream: true, isClientStream: true,
tableHeight: 500 tableHeight: 500,
}, },
srcOthers: '', srcOthers: "",
src: '', src: "",
numPages: undefined, numPages: undefined,
upload: '', // upload: "", //
uploadData: null, uploadData: null,
headers: { token: mytoken }, headers: { token: mytoken },
paramsArrester: { paramsArrester: {
equType: '', equType: "",
limit: 10, limit: 10,
page: 1, page: 1,
equLittleId: '', equLittleId: "",
testItem: '', testItem: "",
offlineParam: '' offlineParam: "",
}, },
equThirdNameList: [], equThirdNameList: [],
experimentData: [] experimentData: [],
// vHtml: '', // vHtml: '',
// playerOptions: { // playerOptions: {
// playbackRates: [0.5, 1.0, 1.5, 2.0],// // playbackRates: [0.5, 1.0, 1.5, 2.0],//
@ -372,14 +433,14 @@ export default {
// fullscreenToggle: true,// // fullscreenToggle: true,//
// }, // },
// }, // },
} };
}, },
computed: { computed: {
searchLeft() { searchLeft() {
let valSpan = 6 let valSpan = 6;
this.excelShow ? valSpan = 6 : valSpan = 24 this.excelShow ? (valSpan = 6) : (valSpan = 24);
return valSpan return valSpan;
} },
}, },
created() { created() {
this.getEquNameList(); this.getEquNameList();
@ -404,45 +465,47 @@ export default {
}); });
}, },
arresterExperimentListData() { arresterExperimentListData() {
this.paramsArrester.equType = 4 this.paramsArrester.equType = 4;
getFirstExcelList(this.paramsArrester).then((res) => { getFirstExcelList(this.paramsArrester).then((res) => {
if (res.code == 0 && res.data) { if (res.code == 0 && res.data) {
this.experimentData = res.data this.experimentData = res.data;
} }
}) });
}, },
// //
getEquNameList() { getEquNameList() {
const equType = 4 const equType = 4;
getEquNameList(equType).then((res) => { getEquNameList(equType).then((res) => {
if (res.code == 0 && res.data) { if (res.code == 0 && res.data) {
this.equNameList = res.data this.equNameList = res.data;
} }
}) });
}, },
equIdChange() { equIdChange() {
const equType = 4 const equType = 4;
getThirdEquNameList(equType, this.equId).then((res) => { const paramId = this.equId2 || this.equId;
console.log(this.equId);
getThirdEquNameList(equType, paramId).then((res) => {
if (res.code == 0 && res.data) { if (res.code == 0 && res.data) {
this.equThirdNameList = res.data this.equThirdNameList = res.data;
} }
}) });
}, },
handleDelete() { handleDelete() {
this.$emit('handleDelete') this.$emit("handleDelete");
}, },
onResetBtnClick() { onResetBtnClick() {
this.equId = '' this.equId = "";
this.timeData = '' this.timeData = "";
this.sheetName = '' this.sheetName = "";
this.stId = '' this.stId = "";
this.testItem = '' this.testItem = "";
this.offlineParam = '' this.offlineParam = "";
this.deleted = '' this.deleted = "";
}, },
onSeacherClick() { onSeacherClick() {
this.$emit( this.$emit(
'onSeacherClick', "onSeacherClick",
this.equId, this.equId,
this.stId, this.stId,
this.sheetName, this.sheetName,
@ -450,13 +513,13 @@ export default {
this.testItem, this.testItem,
this.offlineParam, this.offlineParam,
this.deleted this.deleted
) );
}, },
deleteReport() { deleteReport() {
this.$emit('deleteReport', true) this.$emit("deleteReport", true);
}, },
handleClose() { handleClose() {
this.$emit('deleteReport', false) this.$emit("deleteReport", false);
}, },
// // // //
// handleReportChange(files, reportList) { // handleReportChange(files, reportList) {
@ -469,56 +532,56 @@ export default {
// }, // },
// //
handleReportRemove(file, reportList) { handleReportRemove(file, reportList) {
this.reportList = reportList this.reportList = reportList;
// this.fileList = undefined // this.fileList = undefined
// this.fileList = new Array() // this.fileList = new Array()
}, },
// //
handleChange(files, fileList) { handleChange(files, fileList) {
this.fileList = fileList this.fileList = fileList;
}, },
// //
handleChangeReport(files, reportList) { handleChangeReport(files, reportList) {
// this.reportList = reportList // this.reportList = reportList
this.reportList = reportList this.reportList = reportList;
if (reportList.length > 1) { if (reportList.length > 1) {
reportList.splice(0, 1) reportList.splice(0, 1);
} }
}, },
// //
handleRemove(file, fileList) { handleRemove(file, fileList) {
this.fileList = fileList this.fileList = fileList;
}, },
// //
handlePreview(file, fileList) { handlePreview(file, fileList) {
// console.log(file) // console.log(file)
const types = file.name.split('.')[1] const types = file.name.split(".")[1];
const fileType1 = ['xlsx', 'xlc', 'xlm', 'xls', 'xlt', 'xlw', 'csv'].some( const fileType1 = ["xlsx", "xlc", "xlm", "xls", "xlt", "xlw", "csv"].some(
(item) => item === types (item) => item === types
) );
const fileType2 = ['svg', 'png', 'jpg', 'jpeg'].some( const fileType2 = ["svg", "png", "jpg", "jpeg"].some(
(item) => item === types (item) => item === types
) );
// let fileType3 = ['doc','docx','docm','dotm','dotx','dot'].some(item => item === types) // let fileType3 = ['doc','docx','docm','dotm','dotx','dot'].some(item => item === types)
const fileType4 = ['pdf'].some((item) => item === types) const fileType4 = ["pdf"].some((item) => item === types);
// let fileType5 = ['mp4'].some(item => item === types) // let fileType5 = ['mp4'].some(item => item === types)
if (fileType1) { if (fileType1) {
console.log(file.raw) console.log(file.raw);
this.excelPvProps.file = file.raw this.excelPvProps.file = file.raw;
console.log(this.excelPvProps.file) console.log(this.excelPvProps.file);
this.ShowPreview = true this.ShowPreview = true;
this.Showexcel = true this.Showexcel = true;
} else if (fileType2) { } else if (fileType2) {
const reader = new FileReader() const reader = new FileReader();
const _this = this const _this = this;
reader.readAsDataURL(file.raw) reader.readAsDataURL(file.raw);
reader.onloadend = function() { reader.onloadend = function () {
_this.srcOthers = this.result _this.srcOthers = this.result;
_this.ShowPreview = true _this.ShowPreview = true;
_this.Showimg = true _this.Showimg = true;
} };
// }else if(fileType3){ // }else if(fileType3){
// let _this = this // let _this = this
// let reader = new FileReader() // let reader = new FileReader()
@ -532,14 +595,14 @@ export default {
// }).done() // }).done()
// } // }
} else if (fileType4) { } else if (fileType4) {
const pdfurl = URL.createObjectURL(file.raw) const pdfurl = URL.createObjectURL(file.raw);
const loadingTask = pdf.createLoadingTask(pdfurl) const loadingTask = pdf.createLoadingTask(pdfurl);
this.src = loadingTask this.src = loadingTask;
this.src.promise.then((pdf) => { this.src.promise.then((pdf) => {
this.numPages = pdf.numPages this.numPages = pdf.numPages;
}) });
this.ShowPreview = true this.ShowPreview = true;
this.Showpdf = true this.Showpdf = true;
// }else if(fileType5){ // }else if(fileType5){
// let url = null ; // let url = null ;
// if (window.createObjectURL!=undefined) { // basic // if (window.createObjectURL!=undefined) { // basic
@ -556,113 +619,116 @@ export default {
// console.log(url) // console.log(url)
} else { } else {
this.$message({ this.$message({
message: '暂不支持该类型文件预览', message: "暂不支持该类型文件预览",
type: 'warning' type: "warning",
}) });
} }
}, },
close() { close() {
this.ShowPreview = false this.ShowPreview = false;
this.Showexcel = false this.Showexcel = false;
this.Showimg = false this.Showimg = false;
this.Showpdf = false this.Showpdf = false;
this.Showword = false this.Showword = false;
this.ShowVideo = false this.ShowVideo = false;
}, },
importFile() { importFile() {
if ( if (
this.$refs.upload.$el.children[0].children[1].value == '' || this.$refs.upload.$el.children[0].children[1].value == "" ||
this.$refs.upload2.$el.children[0].children[1].value == '' this.$refs.upload2.$el.children[0].children[1].value == ""
) { ) {
this.$message({ this.$message({
message: '报告和附件不能为空', message: "报告和附件不能为空",
type: 'warning' type: "warning",
}) });
} }
this.$refs.upload.submit() this.$refs.upload.submit();
this.$refs.upload2.submit() this.$refs.upload2.submit();
const formData = new FormData() const formData = new FormData();
this.fileList.forEach((item) => { this.fileList.forEach((item) => {
formData.append('files', item.raw) formData.append("files", item.raw);
}) });
this.reportList.forEach((item) => { this.reportList.forEach((item) => {
formData.append('file', item.raw) formData.append("file", item.raw);
}) });
formData.append('eqType', 4) formData.append("eqType", 4);
formData.append('equipmentId', this.equId2) // formData.append("equipmentId", this.equId2);
formData.append('jgId', '') formData.append("equipmentId", this.stId2);
formData.append("jgId", this.equId2);
// formData.append("jgId", "");
importReport(formData).then((res) => { importReport(formData).then((res) => {
if (res.code == 0) { if (res.code == 0) {
this.$message.success('文件上传成功!') this.$message.success("文件上传成功!");
this.$refs.upload.clearFiles() // this.$refs.upload.clearFiles(); //
this.$refs.upload2.clearFiles() this.$refs.upload2.clearFiles();
} else { } else {
this.$message.warning('文件上传失败!') this.$message.warning("文件上传失败!");
} }
}) });
}, },
// //
submitUpload() { submitUpload() {
const name = this.reportList[0].name const name = this.reportList[0].name;
let status = 0 let status = 0;
if (this.experimentData.length != 0) { if (this.experimentData.length != 0) {
for (let index = 0; index < this.experimentData.length; index++) { for (let index = 0; index < this.experimentData.length; index++) {
const element = this.experimentData[index].fileName const element = this.experimentData[index].fileName;
if (element === name) { if (element === name) {
this.$confirm('此报告已存在是否继续?', '提示', { this.$confirm("此报告已存在是否继续?", "提示", {
confirmButtonText: '确定', confirmButtonText: "确定",
cancelButtonText: '取消', cancelButtonText: "取消",
type: 'warning' type: "warning",
}) })
.then(() => { .then(() => {
this.importFile() this.importFile();
return return;
}) })
.catch(() => { .catch(() => {
this.$message({ this.$message({
type: 'info', type: "info",
message: '已取消导入' message: "已取消导入",
}) });
return return;
}) });
} else { } else {
status = status + 1 status = status + 1;
} }
} }
if (status === this.experimentData.length) { if (status === this.experimentData.length) {
this.importFile() this.importFile();
} }
} else { } else {
this.importFile() this.importFile();
} }
}, },
downWindows() { downWindows() {
this.$refs.upload.clearFiles() // this.$refs.upload.clearFiles(); //
this.$refs.upload2.clearFiles() this.$refs.upload2.clearFiles();
this.fileList = [] this.fileList = [];
this.reportList = [] this.reportList = [];
this.$router.replace({ path: '/refresh' }) this.$router.replace({ path: "/refresh" });
}, },
onImportClick() { onImportClick() {
this.equId2 = '' this.equId2 = "";
this.isShow = true this.stId2 = "";
this.arresterExperimentListData() this.isShow = true;
this.arresterExperimentListData();
}, },
// //
onDownloadClick() { onDownloadClick() {
const token = Storage.get(Storage.KEYS.TOKEN) const token = Storage.get(Storage.KEYS.TOKEN);
const equType = 4 const equType = 4;
const params = '?token=' + token + '&equType=' + equType const params = "?token=" + token + "&equType=" + equType;
downloadExcel(params) downloadExcel(params);
}, },
reportSelectionChange(val) { reportSelectionChange(val) {
this.$emit('reportSelectionChange', val) this.$emit("reportSelectionChange", val);
} },
} },
} };
</script> </script>
<style lang="scss" scoped > <style lang="scss" scoped>
@import '~@/assets/stylesheet/index'; @import "~@/assets/stylesheet/index";
/deep/ .el-dialog__headerbtn { /deep/ .el-dialog__headerbtn {
background: none !important; background: none !important;
color: #909399 !important; color: #909399 !important;
@ -693,4 +759,3 @@ export default {
margin-bottom: 10px; margin-bottom: 10px;
} }
</style> </style>

@ -2,12 +2,19 @@
<div class="transformer"> <div class="transformer">
<div class="choose chooseInputColor"> <div class="choose chooseInputColor">
<div class="button" style="margin-bottom: 10px"> <div class="button" style="margin-bottom: 10px">
<el-button icon="el-icon-upload2" @click="onImportClick"></el-button> <el-button icon="el-icon-upload2" @click="onImportClick"
>导入</el-button
>
<!-- <el-button <!-- <el-button
icon="el-icon-download" icon="el-icon-download"
@click="onDownloadClick" @click="onDownloadClick"
>下载模板</el-button>--> >下载模板</el-button>-->
<el-button v-show="buttonShow" icon="el-icon-delete" @click="deleteReport"></el-button> <el-button
v-show="buttonShow"
icon="el-icon-delete"
@click="deleteReport"
>删除</el-button
>
<!-- 删除弹出框 --> <!-- 删除弹出框 -->
<el-dialog <el-dialog
title="删除" title="删除"
@ -16,7 +23,9 @@
width="36.5%" width="36.5%"
center center
> >
<el-button type="primary" size="small" @click="handleDelete"></el-button> <el-button type="primary" size="small" @click="handleDelete"
>删除</el-button
>
<el-table <el-table
:data="reportData.data" :data="reportData.data"
border border
@ -24,19 +33,44 @@
@selection-change="reportSelectionChange" @selection-change="reportSelectionChange"
> >
<el-table-column type="selection" align="center" /> <el-table-column type="selection" align="center" />
<el-table-column label="序号" type="index" align="center" width="50" /> <el-table-column
<el-table-column prop="fileName" label="报告名称" align="center" width="350" /> label="序号"
<el-table-column prop="createTime" label="创建时间" align="center" width="200" /> type="index"
align="center"
width="50"
/>
<el-table-column
prop="fileName"
label="报告名称"
align="center"
width="350"
/>
<el-table-column
prop="createTime"
label="创建时间"
align="center"
width="200"
/>
</el-table> </el-table>
</el-dialog> </el-dialog>
<!--导入弹出框 --> <!--导入弹出框 -->
<el-dialog title="导入" :visible.sync="isShow" style="width: 100%" @close="downWindows"> <el-dialog
title="导入"
:visible.sync="isShow"
style="width: 100%"
@close="downWindows"
>
<div class="uploadBox"> <div class="uploadBox">
<el-form label-width="80px!important" :inline="true"> <el-form label-width="80px!important" :inline="true">
<el-row :gutter="20" type="flex" style="flex-wrap: wrap;"> <el-row :gutter="20" type="flex" style="flex-wrap: wrap">
<el-col :span="6"> <el-col :span="6">
<el-form-item label="设备间隔"> <el-form-item label="设备间隔">
<el-select v-model="equId2" clearable placeholder="请选择设备间隔" @change="equIdChange"> <el-select
v-model="equId2"
clearable
placeholder="请选择设备间隔"
@change="equIdChange"
>
<el-option <el-option
v-for="item in equNameList" v-for="item in equNameList"
:key="item.equId" :key="item.equId"
@ -85,7 +119,8 @@
type="primary" type="primary"
icon="el-icon-plus" icon="el-icon-plus"
plain plain
>报告选择</el-button> >报告选择</el-button
>
<div slot="tip" class="el-upload__tip">只能上传xlsx/xls文件</div> <div slot="tip" class="el-upload__tip">只能上传xlsx/xls文件</div>
</el-upload> </el-upload>
</div> </div>
@ -113,7 +148,8 @@
type="primary" type="primary"
icon="el-icon-plus" icon="el-icon-plus"
plain plain
>附件选择已选择{{ fileList.length }}</el-button> >附件选择已选择{{ fileList.length }}</el-button
>
</el-upload> </el-upload>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
@ -123,15 +159,18 @@
type="success" type="success"
:disabled=" :disabled="
fileList.length <= 0 || fileList.length <= 0 ||
reportList.length <= 0 || reportList.length <= 0 ||
reportList.length >= 2 reportList.length >= 2
" "
icon="el-icon-upload" icon="el-icon-upload"
plain plain
@click="submitUpload()" @click="submitUpload()"
>将选择文件上传服务器</el-button> >将选择文件上传服务器</el-button
>
</span> </span>
<el-button v-show="ShowPreview" style="width: 60px" @click="close"></el-button> <el-button v-show="ShowPreview" style="width: 60px" @click="close"
>关闭</el-button
>
<!-- <file-preview v-show="Showexcel" :file-type="fileType" :excel-pv-props="excelPvProps" /> <!-- <file-preview v-show="Showexcel" :file-type="fileType" :excel-pv-props="excelPvProps" />
<img v-show="Showimg" :src="srcOthers" alt width="300px" height="300px"> <img v-show="Showimg" :src="srcOthers" alt width="300px" height="300px">
<pdf v-for="i in numPages" v-show="Showpdf" :key="i" :src="src" :page="i" /> <pdf v-for="i in numPages" v-show="Showpdf" :key="i" :src="src" :page="i" />
@ -145,10 +184,15 @@
</el-dialog> </el-dialog>
</div> </div>
<el-form label-width="80px!important" :inline="true"> <el-form label-width="80px!important" :inline="true">
<el-row :gutter="20" type="flex" style="flex-wrap: wrap;"> <el-row :gutter="20" type="flex" style="flex-wrap: wrap">
<el-col v-if="excelShow" :span="6"> <el-col v-if="excelShow" :span="6">
<el-form-item label="设备间隔"> <el-form-item label="设备间隔">
<el-select v-model="equId" clearable placeholder="请选择设备间隔" @change="equIdChange"> <el-select
v-model="equId"
clearable
placeholder="请选择设备间隔"
@change="equIdChange"
>
<el-option <el-option
v-for="item in equNameList" v-for="item in equNameList"
:key="item.equId" :key="item.equId"
@ -187,13 +231,13 @@
<el-col :span="6"> <el-col :span="6">
<el-form-item label="试验项目"> <el-form-item label="试验项目">
<el-select v-model="testItem" placeholder="请选择项目名称"> <el-select v-model="testItem" placeholder="请选择项目名称">
<el-option <el-option
v-for="item in testItemList" v-for="item in testItemList"
:key="item.value" :key="item.value"
:label="item.value" :label="item.value"
:value="item.value" :value="item.value"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<!-- </el-row> <!-- </el-row>
@ -230,8 +274,12 @@
</el-col> </el-col>
<el-col :span="searchLeft"> <el-col :span="searchLeft">
<div class="searchButton"> <div class="searchButton">
<el-button icon="el-icon-search" @click="onSeacherClick"></el-button> <el-button icon="el-icon-search" @click="onSeacherClick"
<el-button icon="el-icon-refresh-right" @click="onResetBtnClick"></el-button> >查询</el-button
>
<el-button icon="el-icon-refresh-right" @click="onResetBtnClick"
>重置</el-button
>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
@ -241,8 +289,8 @@
</template> </template>
<script> <script>
// import FilePreview from '@mrhanson/vue-file-preview' // import FilePreview from '@mrhanson/vue-file-preview'
import pdf from 'vue-pdf' import pdf from "vue-pdf";
import Storage from '@/commons/storage' import Storage from "@/commons/storage";
import { import {
importReport, importReport,
getEquNameList, getEquNameList,
@ -251,30 +299,30 @@ import {
getFirstExcelList, getFirstExcelList,
deviceSubclassList, deviceSubclassList,
testItemList, testItemList,
} from '@/api/user' } from "@/api/user";
var mytoken = Storage.get(Storage.KEYS.TOKEN) var mytoken = Storage.get(Storage.KEYS.TOKEN);
export default { export default {
components: { components: {
// 'file-preview': FilePreview, // 'file-preview': FilePreview,
pdf: pdf pdf: pdf,
}, },
props: { props: {
deleteShow: Boolean, deleteShow: Boolean,
excelShow: Boolean, excelShow: Boolean,
buttonShow: Boolean, buttonShow: Boolean,
reportData: Object reportData: Object,
}, },
data() { data() {
return { return {
sheetName: '', sheetName: "",
stId: '', stId: "",
stId2: '', stId2: "",
timeData: '', timeData: "",
equId: '', equId: "",
equId2: '', equId2: "",
testItem: '', testItem: "",
offlineParam: '', offlineParam: "",
deleted: '', deleted: "",
equNameList: [], equNameList: [],
deviceSubclassList: [], deviceSubclassList: [],
testItemList: [], testItemList: [],
@ -282,42 +330,42 @@ export default {
pickerOptions: { pickerOptions: {
shortcuts: [ shortcuts: [
{ {
text: '最近一个月', text: "最近一个月",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30) start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
}, },
{ {
text: '最近三个月', text: "最近三个月",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 91) start.setTime(start.getTime() - 3600 * 1000 * 24 * 91);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
}, },
{ {
text: '最近半年', text: "最近半年",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 183) start.setTime(start.getTime() - 3600 * 1000 * 24 * 183);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
}, },
{ {
text: '最近一年', text: "最近一年",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 365) start.setTime(start.getTime() - 3600 * 1000 * 24 * 365);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
} },
] ],
}, },
GisData: [], // GisData: [], //
// //
@ -332,27 +380,27 @@ export default {
Showword: false, Showword: false,
ShowVideo: false, ShowVideo: false,
preview: false, preview: false,
fileType: 'excel', fileType: "excel",
excelPvProps: { excelPvProps: {
file: null, file: null,
isClientStream: true, isClientStream: true,
tableHeight: 500 tableHeight: 500,
}, },
srcOthers: '', srcOthers: "",
src: '', src: "",
numPages: undefined, numPages: undefined,
upload: '', // upload: "", //
uploadData: null, uploadData: null,
headers: { token: mytoken }, headers: { token: mytoken },
paramsTransformer: { paramsTransformer: {
equType: '', equType: "",
limit: 10, limit: 10,
page: 1, page: 1,
equLittleId: '', equLittleId: "",
testItem: '', testItem: "",
offlineParam: '' offlineParam: "",
}, },
experimentData: [] experimentData: [],
// vHtml: '', // vHtml: '',
// playerOptions: { // playerOptions: {
// playbackRates: [0.5, 1.0, 1.5, 2.0],// // playbackRates: [0.5, 1.0, 1.5, 2.0],//
@ -377,14 +425,14 @@ export default {
// fullscreenToggle: true,// // fullscreenToggle: true,//
// }, // },
// }, // },
} };
}, },
computed: { computed: {
searchLeft() { searchLeft() {
let valSpan = 6 let valSpan = 6;
this.excelShow ? valSpan = 6 : valSpan = 24 this.excelShow ? (valSpan = 6) : (valSpan = 24);
return valSpan return valSpan;
} },
}, },
created() { created() {
this.getEquNameList(); this.getEquNameList();
@ -409,45 +457,48 @@ export default {
}); });
}, },
onResetBtnClick() { onResetBtnClick() {
this.equId = '' this.equId = "";
this.sheetName = '' this.sheetName = "";
this.timeData = '' this.timeData = "";
this.stId = '' this.stId = "";
this.testItem = '' this.testItem = "";
this.offlineParam = '' this.offlineParam = "";
this.deleted = '' this.deleted = "";
}, },
handleDelete() { handleDelete() {
this.$emit('handleDelete') this.$emit("handleDelete");
}, },
GisExperimentListData() { GisExperimentListData() {
this.paramsTransformer.equType = 2 this.paramsTransformer.equType = 2;
getFirstExcelList(this.paramsTransformer).then((res) => { getFirstExcelList(this.paramsTransformer).then((res) => {
if (res.code == 0 && res.data) { if (res.code == 0 && res.data) {
this.experimentData = res.data this.experimentData = res.data;
} }
}) });
}, },
// //
getEquNameList() { getEquNameList() {
const equType = 2 const equType = 2;
getEquNameList(equType).then((res) => { getEquNameList(equType).then((res) => {
if (res.code == 0 && res.data) { if (res.code == 0 && res.data) {
this.equNameList = res.data this.equNameList = res.data;
} }
}) });
}, },
equIdChange() { equIdChange() {
const equType = 2 console.log("aaaaaaaaaa");
getThirdEquNameList(equType, this.equId2).then((res) => { const paramId = this.equId2 || this.equId;
console.log(this.equId);
const equType = 2;
getThirdEquNameList(equType, paramId).then((res) => {
if (res.code == 0 && res.data) { if (res.code == 0 && res.data) {
this.equThirdNameList = res.data this.equThirdNameList = res.data;
} }
}) });
}, },
onSeacherClick() { onSeacherClick() {
this.$emit( this.$emit(
'onSeacherClick', "onSeacherClick",
this.equId, this.equId,
this.stId, this.stId,
this.sheetName, this.sheetName,
@ -455,63 +506,63 @@ export default {
this.testItem, this.testItem,
this.offlineParam, this.offlineParam,
this.deleted this.deleted
) );
}, },
// onDeleteBtnClick(){ // onDeleteBtnClick(){
// this.$emit('onDeleteBtnClick', this.transformerName,this.timeData) // this.$emit('onDeleteBtnClick', this.transformerName,this.timeData)
// }, // },
deleteReport() { deleteReport() {
this.$emit('deleteReport', true) this.$emit("deleteReport", true);
}, },
handleClose() { handleClose() {
this.$emit('deleteReport', false) this.$emit("deleteReport", false);
}, },
// //
handleReportChange(files, reportList) { handleReportChange(files, reportList) {
this.reportList = reportList this.reportList = reportList;
if (reportList.length > 1) { if (reportList.length > 1) {
reportList.splice(0, 1) reportList.splice(0, 1);
} }
}, },
// //
handleReportRemove(file, reportList) { handleReportRemove(file, reportList) {
this.reportList = reportList this.reportList = reportList;
}, },
// //
handleChange(files, fileList) { handleChange(files, fileList) {
this.fileList = fileList this.fileList = fileList;
}, },
// //
handleRemove(file, fileList) { handleRemove(file, fileList) {
this.fileList = fileList this.fileList = fileList;
}, },
// //
handlePreview(file, fileList) { handlePreview(file, fileList) {
// console.log(file) // console.log(file)
const types = file.name.split('.')[1] const types = file.name.split(".")[1];
const fileType1 = ['xlsx', 'xlc', 'xlm', 'xls', 'xlt', 'xlw', 'csv'].some( const fileType1 = ["xlsx", "xlc", "xlm", "xls", "xlt", "xlw", "csv"].some(
(item) => item === types (item) => item === types
) );
const fileType2 = ['svg', 'png', 'jpg', 'jpeg'].some( const fileType2 = ["svg", "png", "jpg", "jpeg"].some(
(item) => item === types (item) => item === types
) );
// let fileType3 = ['doc','docx','docm','dotm','dotx','dot'].some(item => item === types) // let fileType3 = ['doc','docx','docm','dotm','dotx','dot'].some(item => item === types)
const fileType4 = ['pdf'].some((item) => item === types) const fileType4 = ["pdf"].some((item) => item === types);
// let fileType5 = ['mp4'].some(item => item === types) // let fileType5 = ['mp4'].some(item => item === types)
if (fileType1) { if (fileType1) {
this.excelPvProps.file = file.raw this.excelPvProps.file = file.raw;
this.ShowPreview = true this.ShowPreview = true;
this.Showexcel = true this.Showexcel = true;
} else if (fileType2) { } else if (fileType2) {
const reader = new FileReader() const reader = new FileReader();
const _this = this const _this = this;
reader.readAsDataURL(file.raw) reader.readAsDataURL(file.raw);
reader.onloadend = function() { reader.onloadend = function () {
_this.srcOthers = this.result _this.srcOthers = this.result;
_this.ShowPreview = true _this.ShowPreview = true;
_this.Showimg = true _this.Showimg = true;
} };
// }else if(fileType3){ // }else if(fileType3){
// let _this = this // let _this = this
// let reader = new FileReader() // let reader = new FileReader()
@ -525,14 +576,14 @@ export default {
// }).done() // }).done()
// } // }
} else if (fileType4) { } else if (fileType4) {
const pdfurl = URL.createObjectURL(file.raw) const pdfurl = URL.createObjectURL(file.raw);
const loadingTask = pdf.createLoadingTask(pdfurl) const loadingTask = pdf.createLoadingTask(pdfurl);
this.src = loadingTask this.src = loadingTask;
this.src.promise.then((pdf) => { this.src.promise.then((pdf) => {
this.numPages = pdf.numPages this.numPages = pdf.numPages;
}) });
this.ShowPreview = true this.ShowPreview = true;
this.Showpdf = true this.Showpdf = true;
// }else if(fileType5){ // }else if(fileType5){
// let url = null ; // let url = null ;
// if (window.createObjectURL!=undefined) { // basic // if (window.createObjectURL!=undefined) { // basic
@ -549,84 +600,84 @@ export default {
// console.log(url) // console.log(url)
} else { } else {
this.$message({ this.$message({
message: '暂不支持该类型文件预览', message: "暂不支持该类型文件预览",
type: 'warning' type: "warning",
}) });
} }
}, },
close() { close() {
this.ShowPreview = false this.ShowPreview = false;
this.Showexcel = false this.Showexcel = false;
this.Showimg = false this.Showimg = false;
this.Showpdf = false this.Showpdf = false;
this.Showword = false this.Showword = false;
this.ShowVideo = false this.ShowVideo = false;
}, },
importFile() { importFile() {
if ( if (
this.$refs.upload.$el.children[0].children[1].value == '' || this.$refs.upload.$el.children[0].children[1].value == "" ||
this.$refs.upload2.$el.children[0].children[1].value == '' this.$refs.upload2.$el.children[0].children[1].value == ""
) { ) {
this.$message({ this.$message({
message: '报告和附件不能为空', message: "报告和附件不能为空",
type: 'warning' type: "warning",
}) });
} }
this.$refs.upload.submit() this.$refs.upload.submit();
this.$refs.upload2.submit() this.$refs.upload2.submit();
const formData = new FormData() const formData = new FormData();
this.fileList.forEach((item) => { this.fileList.forEach((item) => {
formData.append('files', item.raw) formData.append("files", item.raw);
}) });
this.reportList.forEach((item) => { this.reportList.forEach((item) => {
formData.append('file', item.raw) formData.append("file", item.raw);
}) });
formData.append('eqType', 2) formData.append("eqType", 2);
formData.append('equipmentId', this.stId2) formData.append("equipmentId", this.stId2);
formData.append('jgId', this.equId2) formData.append("jgId", this.equId2);
importReport(formData).then((res) => { importReport(formData).then((res) => {
if (res.code == 0) { if (res.code == 0) {
this.$message.success('文件上传成功!') this.$message.success("文件上传成功!");
this.$refs.upload.clearFiles() // this.$refs.upload.clearFiles(); //
this.$refs.upload2.clearFiles() this.$refs.upload2.clearFiles();
} else { } else {
this.$message.warning('文件上传失败!') this.$message.warning("文件上传失败!");
} }
}) });
}, },
// //
submitUpload() { submitUpload() {
const name = this.reportList[0].name const name = this.reportList[0].name;
let status = 0 let status = 0;
if (this.experimentData.length != 0) { if (this.experimentData.length != 0) {
for (let index = 0; index < this.experimentData.length; index++) { for (let index = 0; index < this.experimentData.length; index++) {
const element = this.experimentData[index].fileName const element = this.experimentData[index].fileName;
if (element === name) { if (element === name) {
this.$confirm('此报告已存在是否继续?', '提示', { this.$confirm("此报告已存在是否继续?", "提示", {
confirmButtonText: '确定', confirmButtonText: "确定",
cancelButtonText: '取消', cancelButtonText: "取消",
type: 'warning' type: "warning",
}) })
.then(() => { .then(() => {
this.importFile() this.importFile();
return return;
}) })
.catch(() => { .catch(() => {
this.$message({ this.$message({
type: 'info', type: "info",
message: '已取消导入' message: "已取消导入",
}) });
return return;
}) });
} else { } else {
status = status + 1 status = status + 1;
} }
} }
if (status === this.experimentData.length) { if (status === this.experimentData.length) {
this.importFile() this.importFile();
} }
} else { } else {
this.importFile() this.importFile();
} }
}, },
// beforeUpload (file) { // beforeUpload (file) {
@ -639,36 +690,36 @@ export default {
// return promise; //promis // return promise; //promis
// }, // },
downWindows() { downWindows() {
this.$refs.upload.clearFiles() // this.$refs.upload.clearFiles(); //
this.$refs.upload2.clearFiles() this.$refs.upload2.clearFiles();
this.fileList = [] this.fileList = [];
this.reportList = [] this.reportList = [];
this.$router.replace({ path: '/refresh' }) this.$router.replace({ path: "/refresh" });
}, },
onImportClick() { onImportClick() {
this.equId2 = '' this.equId2 = "";
this.stId2 = '' this.stId2 = "";
this.isShow = true this.isShow = true;
this.GisExperimentListData() this.GisExperimentListData();
}, },
// //
onDownloadClick() { onDownloadClick() {
const token = Storage.get(Storage.KEYS.TOKEN) const token = Storage.get(Storage.KEYS.TOKEN);
const equType = 2 const equType = 2;
const params = '?token=' + token + '&equType=' + equType const params = "?token=" + token + "&equType=" + equType;
downloadExcel(params) downloadExcel(params);
}, },
GisSelectionChange(val) { GisSelectionChange(val) {
this.$emit('GisSelectionChange', val) this.$emit("GisSelectionChange", val);
}, },
reportSelectionChange(val) { reportSelectionChange(val) {
this.$emit('reportSelectionChange', val) this.$emit("reportSelectionChange", val);
} },
} },
} };
</script> </script>
<style lang="scss" scoped > <style lang="scss" scoped>
@import '~@/assets/stylesheet/index'; @import "~@/assets/stylesheet/index";
/deep/ .el-dialog__headerbtn { /deep/ .el-dialog__headerbtn {
background: none !important; background: none !important;
color: #909399 !important; color: #909399 !important;

@ -2,12 +2,19 @@
<div class="transformer"> <div class="transformer">
<div class="choose chooseInputColor"> <div class="choose chooseInputColor">
<div class="button" style="margin-bottom: 10px"> <div class="button" style="margin-bottom: 10px">
<el-button icon="el-icon-upload2" @click="onImportClick"></el-button> <el-button icon="el-icon-upload2" @click="onImportClick"
>导入</el-button
>
<!-- <el-button <!-- <el-button
icon="el-icon-download" icon="el-icon-download"
@click="onDownloadClick" @click="onDownloadClick"
>下载模板</el-button>--> >下载模板</el-button>-->
<el-button v-show="buttonShow" icon="el-icon-delete" @click="deleteReport"></el-button> <el-button
v-show="buttonShow"
icon="el-icon-delete"
@click="deleteReport"
>删除</el-button
>
<!-- 删除弹出框 --> <!-- 删除弹出框 -->
<el-dialog <el-dialog
title="删除" title="删除"
@ -16,7 +23,9 @@
width="36.5%" width="36.5%"
center center
> >
<el-button type="primary" size="small" @click="handleDelete"></el-button> <el-button type="primary" size="small" @click="handleDelete"
>删除</el-button
>
<el-table <el-table
:data="reportData.data" :data="reportData.data"
border border
@ -24,19 +33,44 @@
@selection-change="reportSelectionChange" @selection-change="reportSelectionChange"
> >
<el-table-column type="selection" align="center" /> <el-table-column type="selection" align="center" />
<el-table-column label="序号" type="index" align="center" width="50" /> <el-table-column
<el-table-column prop="fileName" label="报告名称" align="center" width="350" /> label="序号"
<el-table-column prop="createTime" label="创建时间" align="center" width="200" /> type="index"
align="center"
width="50"
/>
<el-table-column
prop="fileName"
label="报告名称"
align="center"
width="350"
/>
<el-table-column
prop="createTime"
label="创建时间"
align="center"
width="200"
/>
</el-table> </el-table>
</el-dialog> </el-dialog>
<!--导入弹出框 --> <!--导入弹出框 -->
<el-dialog title="导入" :visible.sync="isShow" style="width: 100%" @close="downWindows"> <el-dialog
title="导入"
:visible.sync="isShow"
style="width: 100%"
@close="downWindows"
>
<div class="uploadBox"> <div class="uploadBox">
<el-form label-width="80px!important" :inline="true"> <el-form label-width="80px!important" :inline="true">
<el-row :gutter="20" type="flex" style="flex-wrap: wrap;"> <el-row :gutter="20" type="flex" style="flex-wrap: wrap">
<el-col :span="6"> <el-col :span="6">
<el-form-item label="设备间隔"> <el-form-item label="设备间隔">
<el-select v-model="equId2" clearable placeholder="请选择设备间隔" @change="equIdChange"> <el-select
v-model="equId2"
clearable
placeholder="请选择设备间隔"
@change="equIdChange"
>
<el-option <el-option
v-for="item in equNameList" v-for="item in equNameList"
:key="item.equId" :key="item.equId"
@ -84,7 +118,8 @@
type="primary" type="primary"
icon="el-icon-plus" icon="el-icon-plus"
plain plain
>报告选择</el-button> >报告选择</el-button
>
<div slot="tip" class="el-upload__tip">只能上传xlsx/xls文件</div> <div slot="tip" class="el-upload__tip">只能上传xlsx/xls文件</div>
</el-upload> </el-upload>
</div> </div>
@ -112,7 +147,8 @@
type="primary" type="primary"
icon="el-icon-plus" icon="el-icon-plus"
plain plain
>附件选择已选择{{ fileList.length }}</el-button> >附件选择已选择{{ fileList.length }}</el-button
>
</el-upload> </el-upload>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
@ -122,15 +158,18 @@
type="success" type="success"
:disabled=" :disabled="
reportList.length == 0 || reportList.length == 0 ||
reportList.length >= 2 || reportList.length >= 2 ||
fileList.length == 0 fileList.length == 0
" "
icon="el-icon-upload" icon="el-icon-upload"
plain plain
@click="submitUpload()" @click="submitUpload()"
>将选择文件上传服务器</el-button> >将选择文件上传服务器</el-button
>
</span> </span>
<el-button v-show="ShowPreview" style="width: 60px" @click="close"></el-button> <el-button v-show="ShowPreview" style="width: 60px" @click="close"
>关闭</el-button
>
<!-- <file-preview v-show="Showexcel" :file-type="fileType" :excel-pv-props="excelPvProps" /> <!-- <file-preview v-show="Showexcel" :file-type="fileType" :excel-pv-props="excelPvProps" />
<img v-show="Showimg" :src="srcOthers" alt width="300px" height="300px"> <img v-show="Showimg" :src="srcOthers" alt width="300px" height="300px">
<pdf v-for="i in numPages" v-show="Showpdf" :key="i" :src="src" :page="i" /> --> <pdf v-for="i in numPages" v-show="Showpdf" :key="i" :src="src" :page="i" /> -->
@ -144,10 +183,15 @@
</el-dialog> </el-dialog>
</div> </div>
<el-form label-width="80px!important" :inline="true"> <el-form label-width="80px!important" :inline="true">
<el-row :gutter="20" type="flex" style="flex-wrap: wrap;"> <el-row :gutter="20" type="flex" style="flex-wrap: wrap">
<el-col v-show="excelShow" :span="6"> <el-col v-show="excelShow" :span="6">
<el-form-item label="设备间隔"> <el-form-item label="设备间隔">
<el-select v-model="equId" clearable placeholder="请选择设备间隔" @change="equIdChange"> <el-select
v-model="equId"
clearable
placeholder="请选择设备间隔"
@change="equIdChange"
>
<el-option <el-option
v-for="item in equNameList" v-for="item in equNameList"
:key="item.equId" :key="item.equId"
@ -237,8 +281,12 @@
</el-col> </el-col>
<el-col :span="searchLeft"> <el-col :span="searchLeft">
<div class="searchButton"> <div class="searchButton">
<el-button icon="el-icon-search" @click="onSeacherClick"></el-button> <el-button icon="el-icon-search" @click="onSeacherClick"
<el-button icon="el-icon-refresh-right" @click="onResetBtnClick"></el-button> >查询</el-button
>
<el-button icon="el-icon-refresh-right" @click="onResetBtnClick"
>重置</el-button
>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
@ -248,8 +296,8 @@
</template> </template>
<script> <script>
// import FilePreview from '@mrhanson/vue-file-preview' // import FilePreview from '@mrhanson/vue-file-preview'
import pdf from 'vue-pdf' import pdf from "vue-pdf";
import Storage from '@/commons/storage' import Storage from "@/commons/storage";
import { import {
importReport, importReport,
downloadExcel, downloadExcel,
@ -258,69 +306,69 @@ import {
getFirstExcelList, getFirstExcelList,
deviceSubclassList, deviceSubclassList,
testItemList, testItemList,
} from '@/api/user' } from "@/api/user";
var mytoken = Storage.get(Storage.KEYS.TOKEN) var mytoken = Storage.get(Storage.KEYS.TOKEN);
export default { export default {
components: { components: {
// 'file-preview': FilePreview, // 'file-preview': FilePreview,
pdf: pdf pdf: pdf,
}, },
props: { props: {
deleteShow: Boolean, deleteShow: Boolean,
excelShow: Boolean, excelShow: Boolean,
buttonShow: Boolean, buttonShow: Boolean,
reportData: Object reportData: Object,
}, },
data() { data() {
return { return {
sheetName: '', sheetName: "",
stId: '', stId: "",
equId: '', equId: "",
stId2: '', stId2: "",
equId2: '', equId2: "",
timeData: '', timeData: "",
testItem: '', testItem: "",
offlineParam: '', offlineParam: "",
deleted: '', deleted: "",
pickerOptions: { pickerOptions: {
shortcuts: [ shortcuts: [
{ {
text: '最近一个月', text: "最近一个月",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30) start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
}, },
{ {
text: '最近三个月', text: "最近三个月",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 91) start.setTime(start.getTime() - 3600 * 1000 * 24 * 91);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
}, },
{ {
text: '最近半年', text: "最近半年",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 183) start.setTime(start.getTime() - 3600 * 1000 * 24 * 183);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
}, },
{ {
text: '最近一年', text: "最近一年",
onClick(picker) { onClick(picker) {
const end = new Date() const end = new Date();
const start = new Date() const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 365) start.setTime(start.getTime() - 3600 * 1000 * 24 * 365);
picker.$emit('pick', [start, end]) picker.$emit("pick", [start, end]);
} },
} },
] ],
}, },
equNameList: [], equNameList: [],
deviceSubclassList: [], deviceSubclassList: [],
@ -337,28 +385,28 @@ export default {
Showword: false, Showword: false,
ShowVideo: false, ShowVideo: false,
preview: false, preview: false,
fileType: 'excel', fileType: "excel",
excelPvProps: { excelPvProps: {
file: null, file: null,
isClientStream: true, isClientStream: true,
tableHeight: 500 tableHeight: 500,
}, },
srcOthers: '', srcOthers: "",
src: '', src: "",
numPages: undefined, numPages: undefined,
upload: '', // upload: "", //
uploadData: null, uploadData: null,
headers: { token: mytoken }, headers: { token: mytoken },
paramsArrester: { paramsArrester: {
equType: '', equType: "",
limit: 10, limit: 10,
page: 1, page: 1,
equLittleId: '', equLittleId: "",
testItem: '', testItem: "",
offlineParam: '' offlineParam: "",
}, },
equThirdNameList: [], equThirdNameList: [],
experimentData: [] experimentData: [],
// vHtml: '', // vHtml: '',
// playerOptions: { // playerOptions: {
// playbackRates: [0.5, 1.0, 1.5, 2.0],// // playbackRates: [0.5, 1.0, 1.5, 2.0],//
@ -383,14 +431,14 @@ export default {
// fullscreenToggle: true,// // fullscreenToggle: true,//
// }, // },
// }, // },
} };
}, },
computed: { computed: {
searchLeft() { searchLeft() {
let valSpan = 6 let valSpan = 6;
this.excelShow ? valSpan = 6 : valSpan = 24 this.excelShow ? (valSpan = 6) : (valSpan = 24);
return valSpan return valSpan;
} },
}, },
created() { created() {
this.getEquNameList(); this.getEquNameList();
@ -415,45 +463,47 @@ export default {
}); });
}, },
arresterExperimentListData() { arresterExperimentListData() {
this.paramsArrester.equType = 3 this.paramsArrester.equType = 3;
getFirstExcelList(this.paramsArrester).then((res) => { getFirstExcelList(this.paramsArrester).then((res) => {
if (res.code == 0 && res.data) { if (res.code == 0 && res.data) {
this.experimentData = res.data this.experimentData = res.data;
} }
}) });
}, },
// //
getEquNameList() { getEquNameList() {
const equType = 3 const equType = 3;
getEquNameList(equType).then((res) => { getEquNameList(equType).then((res) => {
if (res.code == 0 && res.data) { if (res.code == 0 && res.data) {
this.equNameList = res.data this.equNameList = res.data;
} }
}) });
}, },
equIdChange() { equIdChange() {
const equType = 3 const equType = 3;
getThirdEquNameList(equType, this.equId2).then((res) => { const paramId = this.equId2 || this.equId;
console.log(this.equId);
getThirdEquNameList(equType, paramId).then((res) => {
if (res.code == 0 && res.data) { if (res.code == 0 && res.data) {
this.equThirdNameList = res.data this.equThirdNameList = res.data;
} }
}) });
}, },
handleDelete() { handleDelete() {
this.$emit('handleDelete') this.$emit("handleDelete");
}, },
onResetBtnClick() { onResetBtnClick() {
this.equId = '' this.equId = "";
this.sheetName = '' this.sheetName = "";
this.timeData = '' this.timeData = "";
this.stId = '' this.stId = "";
this.testItem = '' this.testItem = "";
this.offlineParam = '' this.offlineParam = "";
this.deleted = '' this.deleted = "";
}, },
onSeacherClick() { onSeacherClick() {
this.$emit( this.$emit(
'onSeacherClick', "onSeacherClick",
this.equId, this.equId,
this.stId, this.stId,
this.sheetName, this.sheetName,
@ -461,13 +511,13 @@ export default {
this.testItem, this.testItem,
this.offlineParam, this.offlineParam,
this.deleted this.deleted
) );
}, },
deleteReport() { deleteReport() {
this.$emit('deleteReport', true) this.$emit("deleteReport", true);
}, },
handleClose() { handleClose() {
this.$emit('deleteReport', false) this.$emit("deleteReport", false);
}, },
// // // //
// handleReportChange(files, reportList) { // handleReportChange(files, reportList) {
@ -480,56 +530,56 @@ export default {
// }, // },
// //
handleReportRemove(file, reportList) { handleReportRemove(file, reportList) {
this.reportList = reportList this.reportList = reportList;
// this.fileList = undefined // this.fileList = undefined
// this.fileList = new Array() // this.fileList = new Array()
}, },
// //
handleChange(files, fileList) { handleChange(files, fileList) {
this.fileList = fileList this.fileList = fileList;
}, },
// //
handleChangeReport(files, reportList) { handleChangeReport(files, reportList) {
// this.reportList = reportList // this.reportList = reportList
this.reportList = reportList this.reportList = reportList;
if (reportList.length > 1) { if (reportList.length > 1) {
reportList.splice(0, 1) reportList.splice(0, 1);
} }
}, },
// //
handleRemove(file, fileList) { handleRemove(file, fileList) {
this.fileList = fileList this.fileList = fileList;
}, },
// //
handlePreview(file, fileList) { handlePreview(file, fileList) {
// console.log(file) // console.log(file)
const types = file.name.split('.')[1] const types = file.name.split(".")[1];
const fileType1 = ['xlsx', 'xlc', 'xlm', 'xls', 'xlt', 'xlw', 'csv'].some( const fileType1 = ["xlsx", "xlc", "xlm", "xls", "xlt", "xlw", "csv"].some(
(item) => item === types (item) => item === types
) );
const fileType2 = ['svg', 'png', 'jpg', 'jpeg'].some( const fileType2 = ["svg", "png", "jpg", "jpeg"].some(
(item) => item === types (item) => item === types
) );
// let fileType3 = ['doc','docx','docm','dotm','dotx','dot'].some(item => item === types) // let fileType3 = ['doc','docx','docm','dotm','dotx','dot'].some(item => item === types)
const fileType4 = ['pdf'].some((item) => item === types) const fileType4 = ["pdf"].some((item) => item === types);
// let fileType5 = ['mp4'].some(item => item === types) // let fileType5 = ['mp4'].some(item => item === types)
if (fileType1) { if (fileType1) {
console.log(file.raw) console.log(file.raw);
this.excelPvProps.file = file.raw this.excelPvProps.file = file.raw;
console.log(this.excelPvProps.file) console.log(this.excelPvProps.file);
this.ShowPreview = true this.ShowPreview = true;
this.Showexcel = true this.Showexcel = true;
} else if (fileType2) { } else if (fileType2) {
const reader = new FileReader() const reader = new FileReader();
const _this = this const _this = this;
reader.readAsDataURL(file.raw) reader.readAsDataURL(file.raw);
reader.onloadend = function() { reader.onloadend = function () {
_this.srcOthers = this.result _this.srcOthers = this.result;
_this.ShowPreview = true _this.ShowPreview = true;
_this.Showimg = true _this.Showimg = true;
} };
// }else if(fileType3){ // }else if(fileType3){
// let _this = this // let _this = this
// let reader = new FileReader() // let reader = new FileReader()
@ -543,14 +593,14 @@ export default {
// }).done() // }).done()
// } // }
} else if (fileType4) { } else if (fileType4) {
const pdfurl = URL.createObjectURL(file.raw) const pdfurl = URL.createObjectURL(file.raw);
const loadingTask = pdf.createLoadingTask(pdfurl) const loadingTask = pdf.createLoadingTask(pdfurl);
this.src = loadingTask this.src = loadingTask;
this.src.promise.then((pdf) => { this.src.promise.then((pdf) => {
this.numPages = pdf.numPages this.numPages = pdf.numPages;
}) });
this.ShowPreview = true this.ShowPreview = true;
this.Showpdf = true this.Showpdf = true;
// }else if(fileType5){ // }else if(fileType5){
// let url = null ; // let url = null ;
// if (window.createObjectURL!=undefined) { // basic // if (window.createObjectURL!=undefined) { // basic
@ -567,114 +617,114 @@ export default {
// console.log(url) // console.log(url)
} else { } else {
this.$message({ this.$message({
message: '暂不支持该类型文件预览', message: "暂不支持该类型文件预览",
type: 'warning' type: "warning",
}) });
} }
}, },
close() { close() {
this.ShowPreview = false this.ShowPreview = false;
this.Showexcel = false this.Showexcel = false;
this.Showimg = false this.Showimg = false;
this.Showpdf = false this.Showpdf = false;
this.Showword = false this.Showword = false;
this.ShowVideo = false this.ShowVideo = false;
}, },
importFile() { importFile() {
if ( if (
this.$refs.upload.$el.children[0].children[1].value == '' || this.$refs.upload.$el.children[0].children[1].value == "" ||
this.$refs.upload2.$el.children[0].children[1].value == '' this.$refs.upload2.$el.children[0].children[1].value == ""
) { ) {
this.$message({ this.$message({
message: '报告和附件不能为空', message: "报告和附件不能为空",
type: 'warning' type: "warning",
}) });
} }
this.$refs.upload.submit() this.$refs.upload.submit();
this.$refs.upload2.submit() this.$refs.upload2.submit();
const formData = new FormData() const formData = new FormData();
this.fileList.forEach((item) => { this.fileList.forEach((item) => {
formData.append('files', item.raw) formData.append("files", item.raw);
}) });
this.reportList.forEach((item) => { this.reportList.forEach((item) => {
formData.append('file', item.raw) formData.append("file", item.raw);
}) });
formData.append('eqType', 3) formData.append("eqType", 3);
formData.append('equipmentId', this.stId2) formData.append("equipmentId", this.stId2);
formData.append('jgId', this.equId2) formData.append("jgId", this.equId2);
importReport(formData).then((res) => { importReport(formData).then((res) => {
if (res.code == 0) { if (res.code == 0) {
this.$message.success('文件上传成功!') this.$message.success("文件上传成功!");
this.$refs.upload.clearFiles() // this.$refs.upload.clearFiles(); //
this.$refs.upload2.clearFiles() this.$refs.upload2.clearFiles();
} else { } else {
this.$message.warning('文件上传失败!') this.$message.warning("文件上传失败!");
} }
}) });
}, },
// //
submitUpload() { submitUpload() {
const name = this.reportList[0].name const name = this.reportList[0].name;
let status = 0 let status = 0;
if (this.experimentData.length != 0) { if (this.experimentData.length != 0) {
for (let index = 0; index < this.experimentData.length; index++) { for (let index = 0; index < this.experimentData.length; index++) {
const element = this.experimentData[index].fileName const element = this.experimentData[index].fileName;
if (element === name) { if (element === name) {
this.$confirm('此报告已存在是否继续?', '提示', { this.$confirm("此报告已存在是否继续?", "提示", {
confirmButtonText: '确定', confirmButtonText: "确定",
cancelButtonText: '取消', cancelButtonText: "取消",
type: 'warning' type: "warning",
}) })
.then(() => { .then(() => {
this.importFile() this.importFile();
return return;
}) })
.catch(() => { .catch(() => {
this.$message({ this.$message({
type: 'info', type: "info",
message: '已取消导入' message: "已取消导入",
}) });
return return;
}) });
} else { } else {
status = status + 1 status = status + 1;
} }
} }
if (status === this.experimentData.length) { if (status === this.experimentData.length) {
this.importFile() this.importFile();
} }
} else { } else {
this.importFile() this.importFile();
} }
}, },
downWindows() { downWindows() {
this.$refs.upload.clearFiles() // this.$refs.upload.clearFiles(); //
this.$refs.upload2.clearFiles() this.$refs.upload2.clearFiles();
this.fileList = [] this.fileList = [];
this.reportList = [] this.reportList = [];
this.$router.replace({ path: '/refresh' }) this.$router.replace({ path: "/refresh" });
}, },
onImportClick() { onImportClick() {
this.equId2 = '' this.equId2 = "";
this.stId2 = '' this.stId2 = "";
this.isShow = true this.isShow = true;
this.arresterExperimentListData() this.arresterExperimentListData();
}, },
// //
onDownloadClick() { onDownloadClick() {
const token = Storage.get(Storage.KEYS.TOKEN) const token = Storage.get(Storage.KEYS.TOKEN);
const equType = 3 const equType = 3;
const params = '?token=' + token + '&equType=' + equType const params = "?token=" + token + "&equType=" + equType;
downloadExcel(params) downloadExcel(params);
}, },
reportSelectionChange(val) { reportSelectionChange(val) {
this.$emit('reportSelectionChange', val) this.$emit("reportSelectionChange", val);
} },
} },
} };
</script> </script>
<style lang="scss" scoped > <style lang="scss" scoped>
@import '~@/assets/stylesheet/index'; @import "~@/assets/stylesheet/index";
/deep/ .el-dialog__headerbtn { /deep/ .el-dialog__headerbtn {
background: none !important; background: none !important;
color: #909399 !important; color: #909399 !important;
@ -705,4 +755,3 @@ export default {
margin-bottom: 10px; margin-bottom: 10px;
} }
</style> </style>

@ -1,43 +1,43 @@
<template> <template>
<div class="pdfBox"> <div class="pdfBox">
<iframe :src="url" frameborder="0" style="width:100%; height:100%" /> <iframe :src="url" frameborder="0" style="width: 100%; height: 100%" />
</div> </div>
</template> </template>
<script> <script>
import { wiringDiagramControllerList } from '@/api/system' import { wiringDiagramControllerList } from "@/api/system";
export default { export default {
name: 'PDFPreview', name: "PDFPreview",
data() { data() {
return { return {
filePdfUrl: '', filePdfUrl: "",
url: '' url: "",
} };
}, },
created() { created() {
this.getPdfFile() this.getPdfFile();
}, },
methods: { methods: {
async getPdfFile() { async getPdfFile() {
const params = { const params = {
endDate: '', endDate: "",
fileName: '', fileName: "",
limit: 10, limit: 10,
page: 1, page: 1,
startDate: '' startDate: "",
} };
await wiringDiagramControllerList(params).then((res) => { await wiringDiagramControllerList(params).then((res) => {
if (res.code === 0 && res.data && res.data.length != 0) { if (res.code === 0 && res.data && res.data.length != 0) {
this.filePdfUrl = res.data[0].filePath this.filePdfUrl = res.data[0].filePath;
} }
if (res.code === 0 && res.data && res.data.length == 0) { if (res.code === 0 && res.data && res.data.length == 0) {
this.$message({ type: 'error', message: '还没有上传过PDF文件' }) this.$message({ type: "error", message: "还没有上传过PDF文件" });
} }
}) });
this.url = this.CONSTANT.PDF_PREVIEW_URL + this.filePdfUrl this.url = this.CONSTANT.PDF_PREVIEW_URL + this.filePdfUrl;
} },
} },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.pdfBox { .pdfBox {

Loading…
Cancel
Save