|
|
|
@ -174,6 +174,33 @@ |
|
|
|
</div> |
|
|
|
<!-- 按钮区域 --> |
|
|
|
<div style="margin-left: 10px; margin-top: 5%"> |
|
|
|
<div style=""> |
|
|
|
<!-- undate --> |
|
|
|
<el-row> |
|
|
|
<div class="el-form-item__content"> |
|
|
|
<el-upload |
|
|
|
ref="upload" |
|
|
|
accept=".xls,.xlsx" |
|
|
|
action="#" |
|
|
|
:auto-upload="false" |
|
|
|
:multiple="false" |
|
|
|
:file-list="fileList" |
|
|
|
:before-upload="beforeUpload" |
|
|
|
:http-request="uploadHttpRequest" |
|
|
|
:on-remove="fileRemove" |
|
|
|
:on-change="fileChange" |
|
|
|
> |
|
|
|
<el-button size="small" type="primary">选择文件</el-button> |
|
|
|
</el-upload> |
|
|
|
</div> |
|
|
|
</el-row> |
|
|
|
<!-- --> |
|
|
|
<!-- <el-button type="primary" @click="exportexc">导出excel</el-button> --> |
|
|
|
</div> |
|
|
|
<el-button type="primary" @click="parseImportData(importData)" |
|
|
|
>parse</el-button |
|
|
|
> |
|
|
|
|
|
|
|
<el-button type="primary" @click="add">新增</el-button> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
@ -181,6 +208,7 @@ |
|
|
|
style="margin-left: 0; margin-top: 10px" |
|
|
|
>编辑</el-button |
|
|
|
> |
|
|
|
<input type="file" accept=".xlsx" @change="onFileChange" /> |
|
|
|
<div style="margin-top: 10px"> |
|
|
|
<el-button type="danger" @click="delets">删除</el-button> |
|
|
|
</div> |
|
|
|
@ -201,9 +229,22 @@ |
|
|
|
> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- 选择文件之后的弹框 --> |
|
|
|
<el-dialog title="提示" :visible.sync="filepopupdialogVisible" width="50%"> |
|
|
|
<el-table :data="importData" style="width: 100%"> </el-table> |
|
|
|
<span slot="footer" class="dialog-footer"> |
|
|
|
<el-button @click="filepopupdialogVisible = false">取 消</el-button> |
|
|
|
<el-button type="primary" @click="filepopupdialogVisible = false" |
|
|
|
>确 定</el-button |
|
|
|
> |
|
|
|
</span> |
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
<!-- --> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<script> |
|
|
|
import ExcelJS from "exceljs"; |
|
|
|
import { rowDrop } from "@/components/publicjs/public"; |
|
|
|
import { getapi, postapi, putapi, deletapi } from "@/api/api"; |
|
|
|
import { getporjectlists } from "@/request/commonapi"; |
|
|
|
@ -213,6 +254,7 @@ export default { |
|
|
|
components: { compTable }, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
filepopupdialogVisible: false, |
|
|
|
ary1: [], |
|
|
|
ary2: [], |
|
|
|
nums: 0, |
|
|
|
@ -294,6 +336,8 @@ export default { |
|
|
|
rightdata: [], //右边侧边栏数据 |
|
|
|
isdislob: true, |
|
|
|
flitvalues: [], |
|
|
|
fileList: [], |
|
|
|
importData: [], |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
|
@ -302,12 +346,156 @@ export default { |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.rowDrop(); |
|
|
|
this.getdiagnosisitem() |
|
|
|
// this.getdiagnosisitem(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
onFileChange(event) { |
|
|
|
// 获取上传的文件 |
|
|
|
const file = event.target.files[0]; |
|
|
|
|
|
|
|
// 调用导入Excel文件的方法 |
|
|
|
this.importExcelFile(file); |
|
|
|
}, |
|
|
|
|
|
|
|
importExcelFile(file) { |
|
|
|
this.filepopupdialogVisible = true; |
|
|
|
|
|
|
|
console.log("333"); |
|
|
|
// 创建一个工作簿 |
|
|
|
const workbook = new ExcelJS.Workbook(); |
|
|
|
// 读取Excel文件 |
|
|
|
const reader = new FileReader(); |
|
|
|
console.log(reader); |
|
|
|
reader.onload = () => { |
|
|
|
const buffer = reader.result; |
|
|
|
const typedArray = new Uint8Array(buffer); |
|
|
|
const blob = new Blob([typedArray], { |
|
|
|
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", |
|
|
|
}); |
|
|
|
|
|
|
|
// 从Blob中读取Excel文件 |
|
|
|
workbook.xlsx.load(blob).then((workbook) => { |
|
|
|
// 获取第一个工作表 |
|
|
|
const worksheet = workbook.getWorksheet(1); |
|
|
|
// 处理Excel文件内容 |
|
|
|
worksheet.eachRow((row, rowNumber) => { |
|
|
|
// const rowData = row.values; |
|
|
|
// this.rowData = row.values; |
|
|
|
|
|
|
|
// console.log(this.rowData,'rowdata'); |
|
|
|
// console.log(rowData); |
|
|
|
//console.log('row,rowNumber',row,rowNumber); |
|
|
|
this.importData.push(row.values); |
|
|
|
|
|
|
|
// console.log(`第${rowNumber}行的数据：${rowData}`); |
|
|
|
}); |
|
|
|
}); |
|
|
|
}; |
|
|
|
reader.readAsArrayBuffer(file); |
|
|
|
}, |
|
|
|
|
|
|
|
parseImportData(importData) { |
|
|
|
console.log("importData", importData.length, importData); |
|
|
|
importData.forEach((item) => { |
|
|
|
item.forEach((item2) => { |
|
|
|
// this.$set(item2[0], "name", true); |
|
|
|
item2[0]['names']=true |
|
|
|
console.log(item2); |
|
|
|
// console.log(item2); |
|
|
|
}); |
|
|
|
// console.log(item,'item',item.length); |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
// 上传文件之前的钩子：判断上传文件格式、大小等，若返回false则停止上传 |
|
|
|
beforeUpload(file) { |
|
|
|
console.log(file); |
|
|
|
console.log("333"); |
|
|
|
console.log("2222"); |
|
|
|
//文件类型 |
|
|
|
const isType = file.type === "application/vnd.ms-excel"; |
|
|
|
const isTypeComputer = |
|
|
|
file.type === |
|
|
|
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"; |
|
|
|
const fileType = isType || isTypeComputer; |
|
|
|
if (!fileType) { |
|
|
|
this.$message.error("上传文件只能是xls/xlsx格式！"); |
|
|
|
} |
|
|
|
|
|
|
|
// 文件大小限制为10M |
|
|
|
const fileLimit = file.size / 1024 / 1024 < 10; |
|
|
|
if (!fileLimit) { |
|
|
|
this.$message.error("上传文件大小不超过10M！"); |
|
|
|
} |
|
|
|
return fileType && fileLimit; |
|
|
|
}, |
|
|
|
uploadHttpRequest(param) { |
|
|
|
const formData = new FormData(); //FormData对象，添加参数只能通过append('key', value)的形式添加 |
|
|
|
formData.append("file", param.file); //添加文件对象 |
|
|
|
formData.append("uploadType", this.rulesType); |
|
|
|
const url = `${this.myBaseURL}/operation/ruleImport/importData`; //上传地址 |
|
|
|
axios |
|
|
|
.post(url, formData) |
|
|
|
.then((res) => { |
|
|
|
const { |
|
|
|
data: { code, mark }, |
|
|
|
} = res; |
|
|
|
if (code === 0) { |
|
|
|
param.onSuccess(); // 上传成功的文件显示绿色的对勾 |
|
|
|
this.uploadMark = mark; |
|
|
|
} |
|
|
|
return this.countData(this.uploadMark); //根据响应的 mark 值调用统计结果接口，返回一个promise以便进行链式调用 |
|
|
|
}) |
|
|
|
.then((res) => { |
|
|
|
//链式调用，统计结果的响应 |
|
|
|
const { |
|
|
|
data: { code, data }, |
|
|
|
} = res; |
|
|
|
if (code === 0) { |
|
|
|
console.log("统计结果", data); |
|
|
|
} |
|
|
|
}) |
|
|
|
.catch((err) => { |
|
|
|
console.log("失败", err); |
|
|
|
param.onError(); //上传失败的文件会从文件列表中删除 |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 统计结果 |
|
|
|
countFile(mark) { |
|
|
|
return new Promise((resolve, reject) => { |
|
|
|
axios |
|
|
|
.get(`/operation/ruleImport/countData?mark=${mark}`) |
|
|
|
.then((res) => { |
|
|
|
resolve(res); |
|
|
|
}) |
|
|
|
.catch((error) => { |
|
|
|
reject(error); |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 点击上传：手动上传到服务器，此时会触发组件的http-request |
|
|
|
submitUpload() { |
|
|
|
this.$refs.upload.submit(); |
|
|
|
}, |
|
|
|
// 文件发生改变 |
|
|
|
fileChange(file, fileList) { |
|
|
|
if (fileList.length > 0) { |
|
|
|
this.fileList = [fileList[fileList.length - 1]]; // 展示最后一次选择的文件 |
|
|
|
} |
|
|
|
}, |
|
|
|
// 移除选择的文件 |
|
|
|
fileRemove(file, fileList) { |
|
|
|
if (fileList.length < 1) { |
|
|
|
this.uploadDisabled = true; //未选择文件则禁用上传按钮 |
|
|
|
console.log(file); |
|
|
|
} |
|
|
|
}, |
|
|
|
exportexc() { |
|
|
|
// console.log('1'); |
|
|
|
}, |
|
|
|
// getdiagnosisitem() { |
|
|
|
// getapi("/api/app/item").then((res) => { |
|
|
|
|
|
|
|
|
|
|
|
// console.log(res); |
|
|
|
// }); |
|
|
|
// }, |
|
|
|
|
mch
2 years ago