是小王呀\24601
10 months ago
13 changed files with 525 additions and 3 deletions
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1016 B |
|
After Width: | Height: | Size: 437 B |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 592 B |
|
After Width: | Height: | Size: 675 B |
@ -0,0 +1,344 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<el-form :model="formData" ref="ref_searchform" :label-width="'120px'"> |
||||
|
<el-form-item label="标题名称" prop="taskTitle"> |
||||
|
<el-input v-model.trim="formData.taskTitle" type="textarea" size="small" clearable style=" height: 40px;" |
||||
|
placeholder="请输入"> |
||||
|
</el-input> |
||||
|
<div style="margin-top: 10px;">（5-30个字符）</div> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="请选择数据源" prop="taskTitle"> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<div class="flex" > |
||||
|
<div class="flex" style=" position: relative;display: flex; flex-direction: column; align-items: center; justify-content: center; width: 155px;height: 90px;background: #F1F4FA;border-radius: 4px; margin-left: 20px;" v-for="(item, index) in dataSourceList"> |
||||
|
<img style="width: 30px; height: 30px;" :src="item.image" alt=""> |
||||
|
<span style="margin-top: 10px;">{{ item.name }}</span> |
||||
|
<img v-if="item.status" style="width: 30px; height: 30px;position: absolute; top: 0;right: 0;" src="@/assets/images/index/select.png" alt=""> |
||||
|
<img v-if="!item.status" style="width: 30px; height: 30px;position: absolute; top: 0;right: 0;" src="@/assets/images/index/notselect.png" alt=""> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script> |
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
dataSourceList:[ |
||||
|
{ |
||||
|
name:"楼栋房屋信息一张表", |
||||
|
image:"https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet-saas/dev/internal/20250114/003b8782213a487b8ce7d4267262d0ec.png", |
||||
|
status:1 |
||||
|
}, |
||||
|
{ |
||||
|
name:"居民信息一张表", |
||||
|
image:"https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet-saas/dev/internal/20250114/0c1e1ea17f8842e49bf5f1afeac72e42.png", |
||||
|
status:0 |
||||
|
}, |
||||
|
{ |
||||
|
name:"单位信息一张表", |
||||
|
image:"https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet-saas/dev/internal/20250114/211af7c657c9409fbccd11185edf0474.png", |
||||
|
status:0 |
||||
|
}, |
||||
|
{ |
||||
|
name:"车辆信息一张表", |
||||
|
image:"https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet-saas/dev/internal/20250114/bc3e4b1e89e84ed7bc31eb90bba6cbd6.png", |
||||
|
status:0 |
||||
|
}, |
||||
|
], |
||||
|
formData: { |
||||
|
taskTitle:"", |
||||
|
importCategory: null, |
||||
|
taskName: null, |
||||
|
}, |
||||
|
rules: { |
||||
|
importCategory: [ |
||||
|
{ required: true, message: "请选择任务类型", trigger: "change" }, |
||||
|
], |
||||
|
taskName: [ |
||||
|
{ required: true, message: "请输入任务名称", trigger: "change" }, |
||||
|
], |
||||
|
}, |
||||
|
resident_category_import_list: [], |
||||
|
categoryName: "", |
||||
|
createdFileName: null, |
||||
|
createdFileUrl: null, |
||||
|
dialogVisibleExtractExcelHead: false, |
||||
|
dataListLoading: false, |
||||
|
dataList: [], |
||||
|
groupList: [], |
||||
|
fileCode:null, |
||||
|
fileList:[] |
||||
|
}; |
||||
|
}, |
||||
|
props: {}, |
||||
|
async created() { |
||||
|
await this.getDictList(); |
||||
|
await this.loadPersonGroup(); |
||||
|
}, |
||||
|
methods: { |
||||
|
handelClearCategory() { |
||||
|
this.categoryName = null; |
||||
|
}, |
||||
|
async loadPersonGroup() { |
||||
|
const url = "/oper/customize/fileModeColumns/listModule"; |
||||
|
// const url = 'http://yapi.elinkservice.cn/mock/245/gov/org/isServiceProject/service/serviceScopeTree' |
||||
|
const { data, code, msg } = await requestPost(url); |
||||
|
if (code === 0) { |
||||
|
this.groupList = data; |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
async handleSelGroup(index, item, change) { |
||||
|
const url = "/oper/customize/fileModeColumns/listField"; |
||||
|
// const url = 'http://yapi.elinkservice.cn/mock/245/gov/org/isServiceProject/service/serviceScopeTree' |
||||
|
let params ={ |
||||
|
REVISION: 1010, |
||||
|
fileModeCode:this.form.importCategory, |
||||
|
}; |
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
if (code === 0) { |
||||
|
let oneData = this.dataList[index]; |
||||
|
if (change == "change") { |
||||
|
this.dataList[index].itemId = ""; |
||||
|
} |
||||
|
oneData.itemList = data; |
||||
|
this.$set(this.dataList, index, oneData); |
||||
|
console.log(this.dataList); |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
handelClickCategory(label) { |
||||
|
this.categoryName = label; |
||||
|
}, |
||||
|
async checkExtractExcelHead() { |
||||
|
const url = "/actual/base/intelligentImportData/extractExcelHead"; |
||||
|
let params = { |
||||
|
originFileName: this.createdFileName, |
||||
|
originalFilePath: this.createdFileUrl, |
||||
|
importCategory: this.form.importCategory, |
||||
|
}; |
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
if (code === 0) { |
||||
|
this.dialogVisibleExtractExcelHead = true; |
||||
|
const { metaListData, fileCode, msg } = data; |
||||
|
this.dataList = metaListData; |
||||
|
this.fileCode = fileCode; |
||||
|
let groupMap = new Map( |
||||
|
this.groupList.map((item) => [item.label, item]) |
||||
|
); |
||||
|
for (let i in this.dataList) { |
||||
|
this.handleSelGroup(i, groupMap.get(this.dataList[i].fileModeCode)); |
||||
|
} |
||||
|
this.dataListLoading = false; |
||||
|
} else if (code >= 8000) { |
||||
|
this.$message.err(msg); |
||||
|
this.dataListLoading = false; |
||||
|
} |
||||
|
}, |
||||
|
async getDictList() { |
||||
|
const url = "/sys/dict/data/dictlist"; |
||||
|
const { data, code, msg } = await requestPost(url, { |
||||
|
dictType: "resident_category_import", |
||||
|
}); |
||||
|
if (code === 0) { |
||||
|
this.resident_category_import_list = [...data]; |
||||
|
} else { |
||||
|
this.$message.err("字典错误"); |
||||
|
} |
||||
|
}, |
||||
|
beforeExcelUpload(file) { |
||||
|
this.dataListLoading = true; |
||||
|
const isType = file.type === "application/vnd.ms-excel"; |
||||
|
const isTypeComputer = |
||||
|
file.type === |
||||
|
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"; |
||||
|
const fileType = isType || isTypeComputer; |
||||
|
const isLt1M = file.size / 1024 / 1024 < 50; |
||||
|
if (!fileType) { |
||||
|
this.$message.error("上传文件只能是xls/xlsx格式！"); |
||||
|
} |
||||
|
if (!isLt1M) { |
||||
|
this.$message.error("上传文件大小不能超过 10MB!"); |
||||
|
} |
||||
|
if (!this.form.importCategory || !this.form.taskName) { |
||||
|
this.$message.error("请完善基本信息!"); |
||||
|
this.dataListLoading = false; |
||||
|
return false; |
||||
|
} |
||||
|
return fileType && isLt1M; |
||||
|
}, |
||||
|
async uploadHttpRequest(file) { |
||||
|
const formData = new FormData(); |
||||
|
formData.append("file", file.file); |
||||
|
await this.$http |
||||
|
.post("/actual/base/intelligentImportData/uploadFile", formData) |
||||
|
.then((res) => { |
||||
|
if (res.data.code == 0) { |
||||
|
const { fileName, url } = res.data.data; |
||||
|
this.createdFileName = fileName; |
||||
|
this.createdFileUrl = url; |
||||
|
this.fileList.push({name:fileName,url:url}) |
||||
|
this.checkExtractExcelHead(); |
||||
|
} else { |
||||
|
this.$message.error(res.data.msg); |
||||
|
this.dataListLoading = false; |
||||
|
} |
||||
|
}) |
||||
|
.catch((err) => { |
||||
|
console.log("失败", err); |
||||
|
file.onError(); //上传失败的文件会从文件列表中删除 |
||||
|
this.dataListLoading = false; |
||||
|
}); |
||||
|
this.$refs.upload.clearFiles(); |
||||
|
}, |
||||
|
removeFile(){ |
||||
|
this.fileList = []; |
||||
|
}, |
||||
|
// 下载全部模板 |
||||
|
async handleExportModuleAll() { |
||||
|
let url = "/actual/base/residentBaseInfo/import/download-template"; |
||||
|
let params = {}; |
||||
|
await this.$http({ |
||||
|
method: "POST", |
||||
|
url, |
||||
|
responseType: "blob", |
||||
|
data: params, |
||||
|
}) |
||||
|
.then((res) => { |
||||
|
console.log(res); |
||||
|
const url = window.URL.createObjectURL(new Blob([res.data])); |
||||
|
const aLink = document.createElement("a"); |
||||
|
aLink.style.display = "none"; |
||||
|
aLink.href = url; |
||||
|
aLink.setAttribute("download", "全部模板.zip"); |
||||
|
document.body.appendChild(aLink); |
||||
|
aLink.click(); |
||||
|
document.body.removeChild(aLink); |
||||
|
window.URL.revokeObjectURL(url); |
||||
|
}) |
||||
|
.catch((err) => { |
||||
|
console.log("err", err); |
||||
|
return this.$message.error("网络错误"); |
||||
|
}); |
||||
|
}, |
||||
|
// 下载单个模板 |
||||
|
async handelClickDownModule() { |
||||
|
let url = "/actual/base/intelligentImportData/autoGenerateExcelModule"; |
||||
|
let params = { |
||||
|
importCategory: this.form.importCategory, |
||||
|
}; |
||||
|
await this.$http({ |
||||
|
method: "POST", |
||||
|
url, |
||||
|
responseType: "blob", |
||||
|
data: params, |
||||
|
}) |
||||
|
.then((res) => { |
||||
|
if (res.status==200) { |
||||
|
// let fileName = window.decodeURI( |
||||
|
// res.headers["content-disposition"] |
||||
|
// .split(";")[1] |
||||
|
// .split("=")[1] |
||||
|
// ); |
||||
|
let fileName = `${ |
||||
|
this.$store.state.user.agencyName + this.categoryName |
||||
|
}导入模板`; |
||||
|
let blob = new Blob([res.data], { |
||||
|
type: "application/vnd.ms-excel", |
||||
|
}); |
||||
|
var url = window.URL.createObjectURL(blob); |
||||
|
var aLink = document.createElement("a"); |
||||
|
aLink.style.display = "none"; |
||||
|
aLink.href = url; |
||||
|
aLink.setAttribute("download", fileName); |
||||
|
document.body.appendChild(aLink); |
||||
|
aLink.click(); |
||||
|
document.body.removeChild(aLink); //下载完成移除元素 |
||||
|
window.URL.revokeObjectURL(url); //释放掉blob对象 |
||||
|
} else this.$message.error("下载失败"); |
||||
|
// let fileName = `${ |
||||
|
// this.$store.state.user.agencyName + this.categoryName |
||||
|
// }导入模板`; |
||||
|
// const url = res.data.data; |
||||
|
// const aLink = document.createElement("a"); |
||||
|
// aLink.style.display = "none"; |
||||
|
// aLink.href = url; |
||||
|
// aLink.setAttribute("download",`${fileName}.xlsx`); |
||||
|
// document.body.appendChild(aLink); |
||||
|
// aLink.click(); |
||||
|
// document.body.removeChild(aLink); |
||||
|
// window.URL.revokeObjectURL(url); |
||||
|
}) |
||||
|
.catch((err) => { |
||||
|
console.log(err); |
||||
|
return this.$message.error("网络错误"); |
||||
|
}); |
||||
|
}, |
||||
|
handelClickUpload() { |
||||
|
this.$refs["importForm"].validate((valid) => { |
||||
|
if (valid) { |
||||
|
this.saveImportResiHouseExcel(); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
async saveImportResiHouseExcel() { |
||||
|
const { fileCode, dataList } = this; |
||||
|
if (!fileCode) { |
||||
|
this.$message.error("请先上传文件"); |
||||
|
return; |
||||
|
} |
||||
|
let obj = dataList.reduce((acc, item) => { |
||||
|
if (item.userTableHeader) { |
||||
|
acc[item.userTableHeader] = item.itemId; |
||||
|
} |
||||
|
return acc; |
||||
|
}, {}); |
||||
|
const formData = new FormData(); |
||||
|
formData.append("columnMateJson", JSON.stringify(obj)); |
||||
|
formData.append("fileCode", fileCode); |
||||
|
formData.append("taskName", this.form.taskName); |
||||
|
await this.$http |
||||
|
.post( |
||||
|
"/actual/base/intelligentImportData/importResiHouseExcel", |
||||
|
formData |
||||
|
) |
||||
|
.then((res) => { |
||||
|
if (res.data.code == 0 && res.data.msg == "success") { |
||||
|
this.$emit("handelClickUpload", fileCode); |
||||
|
} else this.$message.error(res.data.msg); |
||||
|
}) |
||||
|
.catch((err) => { |
||||
|
console.log("失败", err); |
||||
|
file.onError(); |
||||
|
}); |
||||
|
}, |
||||
|
handelClickBack() { |
||||
|
this.$emit("handelClickBack"); |
||||
|
}, |
||||
|
}, |
||||
|
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"; |
||||
|
.uploadList{ |
||||
|
width: 99%; |
||||
|
height: 180px; |
||||
|
border: 1px dashed #ccc; |
||||
|
border-radius: 5px; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
} |
||||
|
</style> |
||||
|
|
||||
@ -0,0 +1,115 @@ |
|||||
|
<template> |
||||
|
<div class="m-detail-main"> |
||||
|
<div class="steps1"> |
||||
|
<el-steps :active="progress"> |
||||
|
<el-step |
||||
|
:class="[this.operatorName == null ? 'showNum' : '']" |
||||
|
title="填写基本信息" |
||||
|
:description="`${this.operatorName}(${this.createdTime})`" |
||||
|
></el-step> |
||||
|
<el-step |
||||
|
title="上传表格文件" |
||||
|
:class="[this.progress == 2 || this.progress == 3 ? '' : 'showNum']" |
||||
|
></el-step> |
||||
|
<el-step title="配置表格文字"></el-step> |
||||
|
</el-steps> |
||||
|
</div> |
||||
|
<div style="margin-top: 37px"> |
||||
|
<excelCeatedTask |
||||
|
v-if="progress == 1" |
||||
|
@handelClickUpload="handelClickUpload" |
||||
|
@handelClickBack="handelClickBack" |
||||
|
></excelCeatedTask> |
||||
|
<excelCeatedTask |
||||
|
v-if="progress == 2" |
||||
|
@successImport="successImport" |
||||
|
@handelClickBack="handelClickBack" |
||||
|
@updateProgress="updateProgress" |
||||
|
:fileCode="fileCode" |
||||
|
:fileCodeRow="fileCodeRow" |
||||
|
@updateoperatorName="updateoperatorName" |
||||
|
></excelCeatedTask> |
||||
|
<excelCeatedTask |
||||
|
v-if="progress == 3" |
||||
|
@handelClickBack="handelClickBack" |
||||
|
:fileCodeRow="fileCodeRow" |
||||
|
@updateoperatorName="updateoperatorName" |
||||
|
:fileCode="fileCode" |
||||
|
></excelCeatedTask> |
||||
|
</div> |
||||
|
|
||||
|
</div> |
||||
|
</template> |
||||
|
<script> |
||||
|
import excelCeatedTask from './excel-created-task.vue'; |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
progress: 1, |
||||
|
fileCode: null, |
||||
|
progressNum: null, |
||||
|
createdTime: null, |
||||
|
operatorName: null, |
||||
|
}; |
||||
|
}, |
||||
|
props: { |
||||
|
fileCodeRow: { |
||||
|
type: String, |
||||
|
default: null, |
||||
|
}, |
||||
|
taskId: { |
||||
|
type: String, |
||||
|
default: null, |
||||
|
}, |
||||
|
processStatus: { |
||||
|
type: String, |
||||
|
default: null, |
||||
|
}, |
||||
|
}, |
||||
|
created() { |
||||
|
console.log(this.processStatus); |
||||
|
if (this.processStatus) { |
||||
|
this.progress = this.processStatus == "processing" ? 2 : 3; |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
handelClickUpload(fileCode) { |
||||
|
this.progress = 2; |
||||
|
this.fileCode = fileCode; |
||||
|
}, |
||||
|
handelClickBack() { |
||||
|
this.$emit("handleClose"); |
||||
|
}, |
||||
|
successImport() { |
||||
|
this.progress = 3; |
||||
|
this.progressNum = 100; |
||||
|
}, |
||||
|
updateProgress(num) { |
||||
|
if(num > 100){ |
||||
|
this.progress = 3; |
||||
|
this.progressNum = 100; |
||||
|
}else{ |
||||
|
this.progressNum = num; |
||||
|
} |
||||
|
}, |
||||
|
updateoperatorName({ operatorName, createdTime }) { |
||||
|
this.operatorName = operatorName; |
||||
|
this.createdTime = createdTime; |
||||
|
}, |
||||
|
}, |
||||
|
components: {excelCeatedTask }, |
||||
|
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"; |
||||
|
.showNum { |
||||
|
/deep/.el-step__description { |
||||
|
display: none; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
|
|
||||
Loading…
Reference in new issue