|
|
|
@@ -30,185 +30,214 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { treeSingleProcessView , attach , removeFile , getAttachmentConfigTree, attachmentFind } from "@/api/sunVillage_info/homestead/application"; |
|
|
|
import {getToken} from "@/utils/auth"; |
|
|
|
import request from '@/utils/request' |
|
|
|
import {Notify} from "vant"; |
|
|
|
/** 导入JS方法 */ |
|
|
|
import { |
|
|
|
treeSingleProcessView, |
|
|
|
attach, |
|
|
|
removeFile, |
|
|
|
getAttachmentConfigTree, |
|
|
|
attachmentFind |
|
|
|
} from "@/api/sunVillage_info/homestead/application"; |
|
|
|
import {getToken} from "@/utils/auth"; |
|
|
|
import request from '@/utils/request' |
|
|
|
import {Notify} from "vant"; |
|
|
|
|
|
|
|
export default { |
|
|
|
name: "houseApplyUploadComp", |
|
|
|
components: {}, |
|
|
|
props: ["businessType", "proposerId", "houseApplyStatus", "processKey", "tableName", "readonly", 'full',"userName"], |
|
|
|
data() { |
|
|
|
return { |
|
|
|
disabled: this.readonly, |
|
|
|
loading: false, |
|
|
|
attachmentList: [], |
|
|
|
uploadImg: { |
|
|
|
//上传图片配置 |
|
|
|
uploadImgUrl: "/open/home/mobile/common/attach", |
|
|
|
/** 导入JS方法 */ |
|
|
|
|
|
|
|
export default { |
|
|
|
name: "houseApplyUploadComp", |
|
|
|
components: {}, |
|
|
|
props: ["businessType", "proposerId", "houseApplyStatus", "processKey", "tableName", "readonly", 'full', "userName"], |
|
|
|
data() { |
|
|
|
return { |
|
|
|
disabled: this.readonly, |
|
|
|
loading: false, |
|
|
|
attachmentList: [], |
|
|
|
uploadImg: { |
|
|
|
//上传图片配置 |
|
|
|
uploadImgUrl: "/open/home/mobile/common/attach", |
|
|
|
}, |
|
|
|
newAttachments: [], |
|
|
|
fileTypeList:[], |
|
|
|
active: -1, |
|
|
|
has: false, |
|
|
|
} |
|
|
|
}, |
|
|
|
watch: { |
|
|
|
proposerId: function (newVal, oldVal) { |
|
|
|
this.showAttachmentComp(this.businessType, newVal, this.houseApplyStatus, this.processKey, this.tableName, this.full); |
|
|
|
}, |
|
|
|
readonly: function (newVal, oldVal) { |
|
|
|
this.disabled = newVal; |
|
|
|
}, |
|
|
|
newAttachments: [], |
|
|
|
active: -1, |
|
|
|
has: false, |
|
|
|
} |
|
|
|
}, |
|
|
|
watch: { |
|
|
|
proposerId: function (newVal, oldVal) { |
|
|
|
this.showAttachmentComp(this.businessType, newVal, this.houseApplyStatus, this.processKey, this.tableName, this.full); |
|
|
|
}, |
|
|
|
readonly: function (newVal, oldVal) { |
|
|
|
this.disabled = newVal; |
|
|
|
created() { |
|
|
|
if (this.businessType !== null && this.proposerId == -1) { |
|
|
|
this.showAttachmentComp(this.businessType, this.proposerId, this.houseApplyStatus, this.processKey, this.tableName, this.full) |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
created() { |
|
|
|
if (this.businessType !== null && this.proposerId == -1) { |
|
|
|
this.showAttachmentComp(this.businessType, this.proposerId, this.houseApplyStatus, this.processKey, this.tableName, this.full) |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
handleUploadSuccess(file, detail, item) { |
|
|
|
this.setFileStatus(file, 'uploading', '文件上传中...'); |
|
|
|
let formData = new FormData; |
|
|
|
formData.set('file', file.file); |
|
|
|
this.$set(item.postData, 'userName', this.userName); |
|
|
|
request({ |
|
|
|
url: this.uploadImg.uploadImgUrl, |
|
|
|
method: "post", |
|
|
|
params: item.postData, |
|
|
|
data: formData, |
|
|
|
}).then((resp) => { |
|
|
|
if(resp.code == 200) |
|
|
|
{ |
|
|
|
file.response = resp; |
|
|
|
console.log(resp); |
|
|
|
file.fileList = item.fileList; |
|
|
|
this.onFileListChanged("ADD", resp.id); |
|
|
|
this.setFileStatus(file, 'done', '文件上传成功'); |
|
|
|
this.$emit('onUploadSuccess', file); |
|
|
|
} |
|
|
|
else |
|
|
|
methods: { |
|
|
|
handleUploadSuccess(file, detail, item) { |
|
|
|
this.setFileStatus(file, 'uploading', '文件上传中...'); |
|
|
|
let formData = new FormData; |
|
|
|
formData.set('file', file.file); |
|
|
|
this.$set(item.postData, 'userName', this.userName); |
|
|
|
request({ |
|
|
|
url: this.uploadImg.uploadImgUrl, |
|
|
|
method: "post", |
|
|
|
params: item.postData, |
|
|
|
data: formData, |
|
|
|
}).then((resp) => { |
|
|
|
|
|
|
|
if (resp.code === 200) { |
|
|
|
file.response = resp; |
|
|
|
file.fileList = item.fileList; |
|
|
|
this.onFileListChanged("ADD", resp); |
|
|
|
this.setFileStatus(file, 'done', '文件上传成功'); |
|
|
|
|
|
|
|
this.$emit('onUploadSuccess', file); |
|
|
|
} else |
|
|
|
this.setFileStatus(file, 'fail', '文件上传失败!'); |
|
|
|
}).catch((e) => { |
|
|
|
this.setFileStatus(file, 'fail', '文件上传失败!'); |
|
|
|
}).catch((e) => { |
|
|
|
this.setFileStatus(file, 'fail', '文件上传失败!'); |
|
|
|
}); |
|
|
|
return true; |
|
|
|
}, |
|
|
|
handleRemove(file, detail) { |
|
|
|
console.log(file, detail); |
|
|
|
this.setFileStatus(file, 'uploading', '文件删除中...'); |
|
|
|
let id = file.id || file.response.id; |
|
|
|
removeFile(id).then(resp => { |
|
|
|
if(this.proposerId != -1 && false) // 不刷新 |
|
|
|
this.showAttachmentComp(this.businessType, this.proposerId, this.houseApplyStatus, this.processKey, this.tableName, this.full) |
|
|
|
/* else // 新增时 |
|
|
|
{ |
|
|
|
let fileList = file.fileList; |
|
|
|
//console.log(fileList); |
|
|
|
fileList.splice(fileList.indexOf(file), 1); |
|
|
|
}*/ |
|
|
|
this.setFileStatus(file, 'done', '文件删除成功'); |
|
|
|
}); |
|
|
|
return true; |
|
|
|
}, |
|
|
|
//获取ip |
|
|
|
getPath() { |
|
|
|
// 获取当前页面的URL |
|
|
|
const url = window.location.href; |
|
|
|
// 使用正则表达式解析URL以获取IP和端口 |
|
|
|
const ipAndPortRegex = /^(?:https?:\/\/)?(?:([^\s:@\/]+)(?::([^\s:@\/]+))?@)?([\da-z\.-]+)(?::(\d+))?(?:\/([^\?#]+))?(?:\?([^#]+))?(?:#(.+))?$/; |
|
|
|
const match = url.match(ipAndPortRegex); |
|
|
|
// 提取IP和端口 |
|
|
|
const ip = match[3]; |
|
|
|
const port = match[4]; |
|
|
|
return "http://"+ip + ":" + port + "/api" |
|
|
|
}, |
|
|
|
handleRemove(file, detail) { |
|
|
|
console.log(file); |
|
|
|
this.setFileStatus(file, 'uploading', '文件删除中...'); |
|
|
|
let id = file.id || file.response.id; |
|
|
|
this.onFileListChanged("REMOVE", id); |
|
|
|
}).catch((e) => { |
|
|
|
this.setFileStatus(file, 'fail', '文件删除失败!'); |
|
|
|
}).finally(() => { |
|
|
|
//loading.close(); |
|
|
|
}); |
|
|
|
return true; |
|
|
|
}, |
|
|
|
showAttachmentComp(businessType, proposerId, houseApplyStatus, processKey, tableName, full) { |
|
|
|
this.attachmentList = []; |
|
|
|
this.active = -1; |
|
|
|
this.has = false; |
|
|
|
if(!full && 0) |
|
|
|
{ |
|
|
|
this.getCurrentFiles(businessType, proposerId, houseApplyStatus, processKey, tableName); |
|
|
|
} |
|
|
|
else |
|
|
|
{ |
|
|
|
this.getHistoryFiles(businessType, proposerId, houseApplyStatus, processKey, tableName); |
|
|
|
} |
|
|
|
}, |
|
|
|
formatFile(list) { |
|
|
|
if (list !== null && list !== undefined) { |
|
|
|
const baseImgUrl = this.$store.getters.baseRoutingUrl; |
|
|
|
let UfileList = []; //上传图片列表 |
|
|
|
list.forEach((value, index) => { |
|
|
|
UfileList.push({ |
|
|
|
name: value.fileName, |
|
|
|
fileUrl: value.fileUrl, |
|
|
|
url: baseImgUrl + value.fileUrl, |
|
|
|
id: value.id, |
|
|
|
fileList: UfileList, |
|
|
|
}); |
|
|
|
removeFile(id).then(resp => { |
|
|
|
if (this.proposerId != -1 && false) // 不刷新 |
|
|
|
this.showAttachmentComp(this.businessType, this.proposerId, this.houseApplyStatus, this.processKey, this.tableName, this.full) |
|
|
|
/* else // 新增时 |
|
|
|
{ |
|
|
|
let fileList = file.fileList; |
|
|
|
//console.log(fileList); |
|
|
|
fileList.splice(fileList.indexOf(file), 1); |
|
|
|
}*/ |
|
|
|
this.setFileStatus(file, 'done', '文件删除成功'); |
|
|
|
}).catch((e) => { |
|
|
|
this.setFileStatus(file, 'fail', '文件删除失败!'); |
|
|
|
}).finally(() => { |
|
|
|
//loading.close(); |
|
|
|
}); |
|
|
|
return UfileList; |
|
|
|
} |
|
|
|
}, |
|
|
|
onFileListChanged(type, id) { |
|
|
|
if(this.proposerId != -1) return; |
|
|
|
if(type === "ADD") |
|
|
|
{ |
|
|
|
this.newAttachments.push(id); |
|
|
|
} |
|
|
|
else if(type === "REMOVE") |
|
|
|
{ |
|
|
|
let index = this.newAttachments.indexOf(id); |
|
|
|
if(index !== -1) |
|
|
|
this.newAttachments.splice(index, 1); |
|
|
|
} |
|
|
|
console.log(this.newAttachments); |
|
|
|
this.$emit('uploadFinished', this.newAttachments); |
|
|
|
}, |
|
|
|
getCurrentFiles(businessType, proposerId, houseApplyStatus, processKey, tableName) { |
|
|
|
this.loading = true; |
|
|
|
treeSingleProcessView({ |
|
|
|
businessType: businessType, |
|
|
|
houseApplyStatus: houseApplyStatus, |
|
|
|
processKey: processKey, |
|
|
|
tableName: tableName, |
|
|
|
}).then(res => { |
|
|
|
this.handleResponse(res.rows, proposerId, houseApplyStatus, tableName); |
|
|
|
if(this.attachmentList.length === 0) |
|
|
|
{ |
|
|
|
this.disabled = true; |
|
|
|
return true; |
|
|
|
}, |
|
|
|
showAttachmentComp(businessType, proposerId, houseApplyStatus, processKey, tableName, full) { |
|
|
|
this.attachmentList = []; |
|
|
|
this.active = -1; |
|
|
|
this.has = false; |
|
|
|
if (!full && 0) { |
|
|
|
this.getCurrentFiles(businessType, proposerId, houseApplyStatus, processKey, tableName); |
|
|
|
} else { |
|
|
|
this.getHistoryFiles(businessType, proposerId, houseApplyStatus, processKey, tableName); |
|
|
|
} |
|
|
|
}).finally(() => { |
|
|
|
this.loading = false; |
|
|
|
}); |
|
|
|
}, |
|
|
|
getHistoryFiles(businessType, proposerId, houseApplyStatus, processKey, tableName) { |
|
|
|
this.loading = true; |
|
|
|
getAttachmentConfigTree({ |
|
|
|
businessType: businessType, |
|
|
|
nodeStatus: houseApplyStatus, |
|
|
|
processKey: processKey, |
|
|
|
dictTypeSort: 'home_stage_status', |
|
|
|
nodeStatusSort: '', |
|
|
|
}).then(resp => { |
|
|
|
//console.log(resp); |
|
|
|
try { |
|
|
|
if(!resp.data || resp.data.length === 0) |
|
|
|
return; |
|
|
|
let rows = resp.data[0].children; |
|
|
|
rows.forEach((value, index) => { |
|
|
|
if (!value.children) |
|
|
|
return; |
|
|
|
this.handleResponse(value.children, proposerId, houseApplyStatus, tableName); |
|
|
|
}, |
|
|
|
formatFile(list) { |
|
|
|
|
|
|
|
if (list !== null && list !== undefined) { |
|
|
|
let baseImgUrl = this.$store.getters.baseRoutingUrl; |
|
|
|
if (baseImgUrl === "") { |
|
|
|
baseImgUrl = this.getPath(); |
|
|
|
} |
|
|
|
|
|
|
|
let UfileList = []; //上传图片列表 |
|
|
|
list.forEach((value, index) => { |
|
|
|
UfileList.push({ |
|
|
|
name: value.fileName, |
|
|
|
fileUrl: value.fileUrl, |
|
|
|
url: baseImgUrl + value.fileUrl, |
|
|
|
id: value.id, |
|
|
|
fileList: UfileList, |
|
|
|
}); |
|
|
|
if(list.length > 0){ |
|
|
|
this.newAttachments.push(value); |
|
|
|
this.fileTypeList.push(value.fileType) |
|
|
|
} |
|
|
|
}); |
|
|
|
return UfileList; |
|
|
|
} |
|
|
|
catch (e) |
|
|
|
}, |
|
|
|
onFileListChanged(type, data) { |
|
|
|
console.info(data); |
|
|
|
if(type === "ADD") |
|
|
|
{ |
|
|
|
console.error(e); |
|
|
|
this.newAttachments.push(data); |
|
|
|
this.fileTypeList.push(data.fileType); |
|
|
|
} |
|
|
|
}).finally(() => { |
|
|
|
this.loading = false; |
|
|
|
}); |
|
|
|
}, |
|
|
|
handleResponse(rows, proposerId, houseApplyStatus, tableName) { |
|
|
|
rows.forEach((value, index) => { |
|
|
|
else if(type === "REMOVE") |
|
|
|
{ |
|
|
|
this.fileTypeList = []; |
|
|
|
this.newAttachments = this.newAttachments.filter((item)=>{ |
|
|
|
return item.id !== data; |
|
|
|
}); |
|
|
|
this.newAttachments.forEach((item)=>{ |
|
|
|
this.fileTypeList.push(item.fileType); |
|
|
|
}); |
|
|
|
} |
|
|
|
console.log(this.newAttachments); |
|
|
|
this.$emit('uploadFinished', this.newAttachments,this.fileTypeList); |
|
|
|
}, |
|
|
|
getCurrentFiles(businessType, proposerId, houseApplyStatus, processKey, tableName) { |
|
|
|
this.loading = true; |
|
|
|
treeSingleProcessView({ |
|
|
|
businessType: businessType, |
|
|
|
houseApplyStatus: houseApplyStatus, |
|
|
|
processKey: processKey, |
|
|
|
tableName: tableName, |
|
|
|
}).then(res => { |
|
|
|
this.handleResponse(res.rows, proposerId, houseApplyStatus, tableName); |
|
|
|
if (this.attachmentList.length === 0) { |
|
|
|
this.disabled = true; |
|
|
|
this.getHistoryFiles(businessType, proposerId, houseApplyStatus, processKey, tableName); |
|
|
|
} |
|
|
|
}).finally(() => { |
|
|
|
this.loading = false; |
|
|
|
}); |
|
|
|
}, |
|
|
|
getHistoryFiles(businessType, proposerId, houseApplyStatus, processKey, tableName) { |
|
|
|
this.loading = true; |
|
|
|
getAttachmentConfigTree({ |
|
|
|
businessType: businessType, |
|
|
|
nodeStatus: houseApplyStatus, |
|
|
|
processKey: processKey, |
|
|
|
dictTypeSort: 'home_stage_status', |
|
|
|
nodeStatusSort: '', |
|
|
|
tableId: proposerId, |
|
|
|
}).then(resp => { |
|
|
|
//console.log(resp); |
|
|
|
try { |
|
|
|
if (!resp.data || resp.data.length === 0) |
|
|
|
return; |
|
|
|
let rows = resp.data[0].children; |
|
|
|
rows.forEach((value, index) => { |
|
|
|
if (!value.children) |
|
|
|
return; |
|
|
|
this.handleResponse(value.children, proposerId, houseApplyStatus, tableName); |
|
|
|
}); |
|
|
|
} catch (e) { |
|
|
|
console.error(e); |
|
|
|
} |
|
|
|
}).finally(() => { |
|
|
|
this.loading = false; |
|
|
|
}); |
|
|
|
}, |
|
|
|
handleResponse(rows, proposerId, houseApplyStatus, tableName) { |
|
|
|
rows.forEach((value, index) => { |
|
|
|
|
|
|
|
let obj = { |
|
|
|
fileTypeName: value.fileTypeName, |
|
|
|
tableId: proposerId, |
|
|
|
@@ -224,76 +253,75 @@ export default { |
|
|
|
current: value.nodeStatus == houseApplyStatus, |
|
|
|
collapse: this.disabled || value.nodeStatus == houseApplyStatus ? 0 : '', |
|
|
|
}; |
|
|
|
if(value.nodeStatus != houseApplyStatus && !this.has) |
|
|
|
if (value.nodeStatus != houseApplyStatus && !this.has) |
|
|
|
this.active++; |
|
|
|
if(value.nodeStatus == houseApplyStatus) |
|
|
|
{ |
|
|
|
if(!this.has) |
|
|
|
if (value.nodeStatus == houseApplyStatus) { |
|
|
|
if (!this.has) |
|
|
|
this.active++; |
|
|
|
this.has = true; |
|
|
|
} |
|
|
|
this.attachmentList.push(obj); |
|
|
|
|
|
|
|
}); |
|
|
|
if (proposerId !== -1) { |
|
|
|
this.attachmentList.forEach((value, index) => { |
|
|
|
attachmentFind(value).then(resp => { |
|
|
|
let list = this.formatFile(resp.data); |
|
|
|
this.$set(this.attachmentList[index], "fileList", list); |
|
|
|
}); |
|
|
|
if(value.attachmentList != null){ |
|
|
|
if(value.attachmentList.length > 0){ |
|
|
|
let list = this.formatFile( value.attachmentList); |
|
|
|
this.$set(obj, "fileList", list); |
|
|
|
} |
|
|
|
} |
|
|
|
this.attachmentList.push(obj); |
|
|
|
console.info(this.attachmentList); |
|
|
|
}); |
|
|
|
} |
|
|
|
console.info(this.attachmentList); |
|
|
|
}, |
|
|
|
setFileStatus(file, status, message) { |
|
|
|
file.status = status; |
|
|
|
file.message = message; |
|
|
|
}, |
|
|
|
checkFile(file) { |
|
|
|
let mime = file.type; |
|
|
|
if([ |
|
|
|
"image/png", |
|
|
|
"image/jpeg", |
|
|
|
"image/gif", |
|
|
|
"image/bmp", |
|
|
|
].indexOf(mime) === -1) |
|
|
|
{ |
|
|
|
this.notify('请上传jpg/png/gif/bmp等格式图片!', 'danger'); |
|
|
|
return false; |
|
|
|
} |
|
|
|
return true; |
|
|
|
}, |
|
|
|
notify(message, type) { |
|
|
|
Notify.clear(); |
|
|
|
Notify({ type: type || 'primary', message: message }); |
|
|
|
}, |
|
|
|
} |
|
|
|
}; |
|
|
|
if (proposerId !== -1) { |
|
|
|
this.$emit('uploadFinished',this.newAttachments,this.fileTypeList); |
|
|
|
} |
|
|
|
}, |
|
|
|
setFileStatus(file, status, message) { |
|
|
|
file.status = status; |
|
|
|
file.message = message; |
|
|
|
}, |
|
|
|
checkFile(file) { |
|
|
|
let mime = file.type; |
|
|
|
if ([ |
|
|
|
"image/png", |
|
|
|
"image/jpeg", |
|
|
|
"image/gif", |
|
|
|
"image/bmp", |
|
|
|
].indexOf(mime) === -1) { |
|
|
|
this.notify('请上传jpg/png/gif/bmp等格式图片!', 'danger'); |
|
|
|
return false; |
|
|
|
} |
|
|
|
return true; |
|
|
|
}, |
|
|
|
notify(message, type) { |
|
|
|
Notify.clear(); |
|
|
|
Notify({type: type || 'primary', message: message}); |
|
|
|
}, |
|
|
|
} |
|
|
|
}; |
|
|
|
</script> |
|
|
|
<style scoped> |
|
|
|
.my_class >>> .el-upload--picture-card { |
|
|
|
width: 72px; |
|
|
|
height: 72px; |
|
|
|
line-height: 78px; |
|
|
|
} |
|
|
|
.my_class >>> .el-upload--picture-card { |
|
|
|
width: 72px; |
|
|
|
height: 72px; |
|
|
|
line-height: 78px; |
|
|
|
} |
|
|
|
|
|
|
|
.my_class >>> .el-upload-list__item { |
|
|
|
width: 72px; |
|
|
|
height: 72px; |
|
|
|
} |
|
|
|
.my_class >>> .el-upload-list__item { |
|
|
|
width: 72px; |
|
|
|
height: 72px; |
|
|
|
} |
|
|
|
|
|
|
|
.my_class >>> .el-upload-list__item-preview { |
|
|
|
width: 20px; |
|
|
|
} |
|
|
|
.my_class >>> .el-upload-list__item-preview { |
|
|
|
width: 20px; |
|
|
|
} |
|
|
|
|
|
|
|
.my_class >>> .el-upload-list__item-delete { |
|
|
|
width: 20px; |
|
|
|
} |
|
|
|
.my_class >>> .el-upload-list__item-delete { |
|
|
|
width: 20px; |
|
|
|
} |
|
|
|
|
|
|
|
.main_title{ |
|
|
|
font-size: 0.4rem; |
|
|
|
color: #1D6FE9; |
|
|
|
margin: 0.2rem 6%; |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
.main_title { |
|
|
|
font-size: 0.4rem; |
|
|
|
color: #1D6FE9; |
|
|
|
margin: 0.2rem 6%; |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
</style> |