|
|
@ -1,23 +1,47 @@ |
|
|
|
<template> |
|
|
|
<!-- 自定义表单 --> |
|
|
|
<el-divider content-position="left">项目计划详情</el-divider> |
|
|
|
<BasicTable @register="registerplaninfoTable"> |
|
|
|
</BasicTable> |
|
|
|
<BasicTable @register="registerplaninfoTable"> </BasicTable> |
|
|
|
<el-divider content-position="left">项目计划资料详情</el-divider> |
|
|
|
<PlanFileDetail :planinfoid="planinfoid" :stage="1" /> |
|
|
|
<el-divider content-position="left">项目计划审批文件列表</el-divider> |
|
|
|
<PlanFileDetail :planinfoid="planinfoid" :stage="2" /> |
|
|
|
<ApprovalDetails :processInstanceId="processInstanceId" /> |
|
|
|
<ApprovalFromPage :showApprovalForm="showApprovalForm" :buttons="resButton.buttons" ref="ApprovalFromPageRef" |
|
|
|
@submit="handleSubmit" @exit="exit"> |
|
|
|
<ApprovalFromPage |
|
|
|
:showApprovalForm="showApprovalForm" |
|
|
|
:buttons="resButton.buttons" |
|
|
|
ref="ApprovalFromPageRef" |
|
|
|
:rowData="dataTo.record" |
|
|
|
@submit="handleSubmit" |
|
|
|
@exit="exit" |
|
|
|
> |
|
|
|
<div> |
|
|
|
<el-divider content-position="left" v-if="resButton.isEdit">重新上传项目计划资料</el-divider> |
|
|
|
<div v-if="resButton.isEdit" style="display: flex; justify-content: center; align-items: center; height: 100px;"> |
|
|
|
<el-form ref="importFormRef" > |
|
|
|
<el-form-item v-for=" (item, index) in tableDataFiles" :key="index" :label="item" label-width="auto"> |
|
|
|
<el-upload class="upload-demo" ref="upload" action :http-request="httpRequest" |
|
|
|
:before-upload="(file) => { return beforeUpload(file, item) }" :on-exceed="handleExceed" :limit="1" |
|
|
|
:on-remove="removeFile"> |
|
|
|
<div |
|
|
|
v-if="resButton.isEdit" |
|
|
|
style="display: flex; justify-content: center; align-items: center; height: 100px" |
|
|
|
> |
|
|
|
<el-form ref="importFormRef"> |
|
|
|
<el-form-item |
|
|
|
v-for="(item, index) in tableDataFiles" |
|
|
|
:key="index" |
|
|
|
:label="item" |
|
|
|
label-width="auto" |
|
|
|
> |
|
|
|
<el-upload |
|
|
|
class="upload-demo" |
|
|
|
ref="upload" |
|
|
|
action |
|
|
|
:http-request="httpRequest" |
|
|
|
:before-upload=" |
|
|
|
(file) => { |
|
|
|
return beforeUpload(file, item); |
|
|
|
} |
|
|
|
" |
|
|
|
:on-exceed="handleExceed" |
|
|
|
:limit="1" |
|
|
|
:on-remove="removeFile" |
|
|
|
> |
|
|
|
<el-button slot="trigger" size="small" type="primary">选取文件</el-button> |
|
|
|
<div slot="tip" class="el-upload__tip">只能上传{{ item }}且不超过500M</div> |
|
|
|
</el-upload> |
|
|
@ -26,9 +50,17 @@ |
|
|
|
</div> |
|
|
|
<div v-if="procesType == '0' && !resButton.isEdit"> |
|
|
|
<el-divider content-position="left">上传意见文件</el-divider> |
|
|
|
<div style="display: flex; justify-content: center; align-items: center; height: 100px;"> |
|
|
|
<el-upload class="upload-demo" ref="upload" action :http-request="httpRequestadvice" |
|
|
|
:before-upload="beforeAdviceUpload" :on-exceed="handleExceed" :limit="5" :on-remove="removeFile"> |
|
|
|
<div style="display: flex; justify-content: center; align-items: center; height: 100px"> |
|
|
|
<el-upload |
|
|
|
class="upload-demo" |
|
|
|
ref="upload" |
|
|
|
action |
|
|
|
:http-request="httpRequestadvice" |
|
|
|
:before-upload="beforeAdviceUpload" |
|
|
|
:on-exceed="handleExceed" |
|
|
|
:limit="5" |
|
|
|
:on-remove="removeFile" |
|
|
|
> |
|
|
|
<el-button slot="trigger" size="small" type="primary">选取文件</el-button> |
|
|
|
<div slot="tip" class="el-upload__tip">文件大小且不超过500M</div> |
|
|
|
</el-upload> |
|
|
@ -38,214 +70,216 @@ |
|
|
|
</ApprovalFromPage> |
|
|
|
</template> |
|
|
|
<script lang="ts" name="planFileApproval" setup> |
|
|
|
import { onMounted, ref, reactive } from 'vue' |
|
|
|
import { BasicTable, ActionItem, TableAction, useTable } from '@/components/Table'; |
|
|
|
import { approvePlanFile, getActionParam } from '../myWork/inComplete/inComplete.api'; |
|
|
|
import { PlaninfoFiletableColumns, PlaninfoColumn } from '@/views/projectLib/projectPlan/projectPlan.data'; |
|
|
|
import { planFilePageList, getplaninfoByid } from '@/views/projectLib/projectPlan/projectPlan.api' |
|
|
|
import { downloadFile } from "../../api/common/api" |
|
|
|
import { ElMessage } from 'element-plus' |
|
|
|
import ApprovalDetails from "../ProcessApprovalSubPage/component/ApprovalDetails.vue"; |
|
|
|
import ApprovalFromPage from "../ProcessApprovalSubPage/component/ApprovalFromPage.vue" |
|
|
|
import PlanFileDetail from "@/views/ProcessApprovalSubPage/component/PlanFileDetail.vue"; |
|
|
|
|
|
|
|
let dataTo = defineProps(["record"]) |
|
|
|
const emit = defineEmits(['close']); |
|
|
|
console.log("routerouterouteroute", dataTo.record) |
|
|
|
let procesType = dataTo.record.procesType |
|
|
|
let planinfoid = dataTo.record.projectId as string |
|
|
|
let processInstanceId = dataTo.record.processInstanceId |
|
|
|
let taskid = dataTo.record.taskId as string |
|
|
|
let showApprovalForm = ref() |
|
|
|
let ApprovalFromPageRef = ref() |
|
|
|
let tableDataFiles = ref() |
|
|
|
let resButton = reactive({ |
|
|
|
showApprovalForm: false, |
|
|
|
isEdit: false, |
|
|
|
buttons: [] |
|
|
|
}) |
|
|
|
let fileList = reactive<Array<any>>([]); |
|
|
|
let fileAdviceList = reactive<Array<any>>([]); |
|
|
|
onMounted(async () => { |
|
|
|
resButton = await getActionParam({ processInstanceId: processInstanceId, taskId: taskid, procesType: dataTo.record.procesType }) |
|
|
|
showApprovalForm.value = resButton.showApprovalForm |
|
|
|
}) |
|
|
|
import { onMounted, ref, reactive } from 'vue'; |
|
|
|
import { BasicTable, ActionItem, TableAction, useTable } from '@/components/Table'; |
|
|
|
import { approvePlanFile, getActionParam } from '../myWork/inComplete/inComplete.api'; |
|
|
|
import { |
|
|
|
PlaninfoFiletableColumns, |
|
|
|
PlaninfoColumn, |
|
|
|
} from '@/views/projectLib/projectPlan/projectPlan.data'; |
|
|
|
import { |
|
|
|
planFilePageList, |
|
|
|
getplaninfoByid, |
|
|
|
} from '@/views/projectLib/projectPlan/projectPlan.api'; |
|
|
|
import { downloadFile } from '../../api/common/api'; |
|
|
|
import { ElMessage } from 'element-plus'; |
|
|
|
import ApprovalDetails from '../ProcessApprovalSubPage/component/ApprovalDetails.vue'; |
|
|
|
import ApprovalFromPage from '../ProcessApprovalSubPage/component/ApprovalFromPage.vue'; |
|
|
|
import PlanFileDetail from '@/views/ProcessApprovalSubPage/component/PlanFileDetail.vue'; |
|
|
|
|
|
|
|
let dataTo = defineProps(['record']); |
|
|
|
const emit = defineEmits(['close']); |
|
|
|
console.log('routerouterouteroute', dataTo.record); |
|
|
|
let procesType = dataTo.record.procesType; |
|
|
|
let planinfoid = dataTo.record.projectId as string; |
|
|
|
let processInstanceId = dataTo.record.processInstanceId; |
|
|
|
let taskid = dataTo.record.taskId as string; |
|
|
|
let showApprovalForm = ref(); |
|
|
|
let ApprovalFromPageRef = ref(); |
|
|
|
let tableDataFiles = ref(); |
|
|
|
let resButton = reactive({ |
|
|
|
showApprovalForm: false, |
|
|
|
isEdit: false, |
|
|
|
buttons: [], |
|
|
|
}); |
|
|
|
let fileList = reactive<Array<any>>([]); |
|
|
|
let fileAdviceList = reactive<Array<any>>([]); |
|
|
|
onMounted(async () => { |
|
|
|
resButton = await getActionParam({ |
|
|
|
processInstanceId: processInstanceId, |
|
|
|
taskId: taskid, |
|
|
|
procesType: dataTo.record.procesType, |
|
|
|
}); |
|
|
|
showApprovalForm.value = resButton.showApprovalForm; |
|
|
|
}); |
|
|
|
|
|
|
|
const [registerplaninfoTable, { getDataSource }] = useTable({ |
|
|
|
size: 'small', //紧凑型表格 |
|
|
|
title: '项目计划详情', |
|
|
|
api: getplaninfoByid, |
|
|
|
columns: PlaninfoColumn, |
|
|
|
// showActionColumn: false, |
|
|
|
useSearchForm: false, |
|
|
|
beforeFetch(params) { |
|
|
|
params.planinfoid = planinfoid; |
|
|
|
}, |
|
|
|
afterFetch(data) { |
|
|
|
tableDataFiles.value = data[0].taskFile.split(','); |
|
|
|
}, |
|
|
|
}); |
|
|
|
|
|
|
|
const [registerplaninfoTable, { getDataSource }] = useTable({ |
|
|
|
size: 'small',//紧凑型表格 |
|
|
|
title: '项目计划详情', |
|
|
|
api: getplaninfoByid, |
|
|
|
columns: PlaninfoColumn, |
|
|
|
// showActionColumn: false, |
|
|
|
useSearchForm: false, |
|
|
|
beforeFetch(params) { |
|
|
|
params.planinfoid = planinfoid; |
|
|
|
}, |
|
|
|
afterFetch(data) { |
|
|
|
tableDataFiles.value = data[0].taskFile.split(",") |
|
|
|
//项目资料table |
|
|
|
const [registerResourceTable] = useTable({ |
|
|
|
size: 'small', //紧凑型表格 |
|
|
|
title: '项目计划资料详情', |
|
|
|
api: planFilePageList, |
|
|
|
columns: PlaninfoFiletableColumns, |
|
|
|
useSearchForm: false, |
|
|
|
actionColumn: { |
|
|
|
width: 140, |
|
|
|
title: '操作', |
|
|
|
dataIndex: 'action', |
|
|
|
slots: { customRender: 'action' }, |
|
|
|
}, |
|
|
|
beforeFetch(params) { |
|
|
|
params.planinfoid = planinfoid; |
|
|
|
params.stage = '1'; |
|
|
|
}, |
|
|
|
}); |
|
|
|
function getTableAction(record): ActionItem[] { |
|
|
|
return [ |
|
|
|
{ |
|
|
|
label: '下载', |
|
|
|
ifShow: true, |
|
|
|
onClick: handleDetailpage.bind(null, record), |
|
|
|
}, |
|
|
|
]; |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
function handleDetailpage(record) { |
|
|
|
console.log('我这一行的数据是', record); |
|
|
|
let param = { |
|
|
|
path: record.documentPath, |
|
|
|
fileName: record.documentName, |
|
|
|
}; |
|
|
|
// |
|
|
|
console.log('我这一行的数据是', param); |
|
|
|
|
|
|
|
//项目资料table |
|
|
|
const [registerResourceTable] = useTable({ |
|
|
|
size: 'small',//紧凑型表格 |
|
|
|
title: '项目计划资料详情', |
|
|
|
api: planFilePageList, |
|
|
|
columns: PlaninfoFiletableColumns, |
|
|
|
useSearchForm: false, |
|
|
|
actionColumn: { |
|
|
|
width: 140, |
|
|
|
title: '操作', |
|
|
|
dataIndex: 'action', |
|
|
|
slots: { customRender: 'action' }, |
|
|
|
}, |
|
|
|
beforeFetch(params) { |
|
|
|
params.planinfoid = planinfoid |
|
|
|
params.stage = "1" |
|
|
|
}, |
|
|
|
}); |
|
|
|
function getTableAction(record): ActionItem[] { |
|
|
|
return [ |
|
|
|
{ |
|
|
|
label: '下载', |
|
|
|
ifShow: true, |
|
|
|
onClick: handleDetailpage.bind(null, record), |
|
|
|
} |
|
|
|
]; |
|
|
|
} |
|
|
|
function handleDetailpage(record) { |
|
|
|
console.log("我这一行的数据是", record) |
|
|
|
let param = { |
|
|
|
path: record.documentPath, |
|
|
|
fileName: record.documentName |
|
|
|
downloadFile('/huzhouUploadfileinfo/downloadfile', record.documentName, param); |
|
|
|
} |
|
|
|
// |
|
|
|
console.log("我这一行的数据是", param) |
|
|
|
|
|
|
|
downloadFile("/huzhouUploadfileinfo/downloadfile", record.documentName, param) |
|
|
|
} |
|
|
|
function removeFile(option) { |
|
|
|
for (let i = 0; i < fileList.length; i++) { |
|
|
|
if (fileList[i].file.name == option.name) { |
|
|
|
fileList.splice(i, 1) |
|
|
|
function removeFile(option) { |
|
|
|
for (let i = 0; i < fileList.length; i++) { |
|
|
|
if (fileList[i].file.name == option.name) { |
|
|
|
fileList.splice(i, 1); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
for (let i = 0; i < fileAdviceList.length; i++) { |
|
|
|
if (fileAdviceList[i].file.name == option.name) { |
|
|
|
fileAdviceList.splice(i, 1) |
|
|
|
for (let i = 0; i < fileAdviceList.length; i++) { |
|
|
|
if (fileAdviceList[i].file.name == option.name) { |
|
|
|
fileAdviceList.splice(i, 1); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
function httpRequest(option) { |
|
|
|
fileList.push(option) |
|
|
|
|
|
|
|
} |
|
|
|
function httpRequestadvice(option) { |
|
|
|
fileAdviceList.push(option) |
|
|
|
} |
|
|
|
|
|
|
|
// 上传前处理 |
|
|
|
async function beforeUpload(file, item) { |
|
|
|
console.log("file,item", file, item) |
|
|
|
let fileSize = file.size |
|
|
|
const FIVE_M = 500 * 1024 * 1024; |
|
|
|
//大于5M,不允许上传 |
|
|
|
if (fileSize > FIVE_M) { |
|
|
|
ElMessage.error("最大上传500M") |
|
|
|
return false |
|
|
|
} |
|
|
|
let geShi = ["xlx", "xlsx", "docx", "doc", "pdf"] as Array<string> |
|
|
|
if (geShi.indexOf(file.name.substring(file.name.indexOf(".") + 1)) == -1) { |
|
|
|
ElMessage.error('文件格式错误!仅支持' + "xlx,xlsx, docx, doc, pdf"); |
|
|
|
console.log('文件格式错误!仅支持' + "xlsx", "docx", "doc", "pdf") |
|
|
|
return false; |
|
|
|
function httpRequest(option) { |
|
|
|
fileList.push(option); |
|
|
|
} |
|
|
|
if (item.indexOf(file.name.substring(0, file.name.indexOf("."))) == -1) { |
|
|
|
ElMessage.error('请上传文件:' + item); |
|
|
|
return false; |
|
|
|
} |
|
|
|
console.log('文件上传成功') |
|
|
|
|
|
|
|
return true |
|
|
|
} |
|
|
|
// 文件数量过多时提醒 |
|
|
|
function handleExceed() { |
|
|
|
ElMessage.warning("最多只能上传一个文件") |
|
|
|
} |
|
|
|
function beforeAdviceUpload(file) { |
|
|
|
console.log("file,item", file) |
|
|
|
let fileSize = file.size |
|
|
|
const FIVE_M = 500 * 1024 * 1024; |
|
|
|
//大于5M,不允许上传 |
|
|
|
if (fileSize > FIVE_M) { |
|
|
|
ElMessage.error("最大上传500M") |
|
|
|
return false |
|
|
|
function httpRequestadvice(option) { |
|
|
|
fileAdviceList.push(option); |
|
|
|
} |
|
|
|
let geShi = ["xlx", "xlsx", "docx", "doc", "pdf"] as Array<string> |
|
|
|
if (geShi.indexOf(file.name.substring(file.name.indexOf(".") + 1)) == -1) { |
|
|
|
ElMessage.error('文件格式错误!仅支持' + "xlx,xlsx, docx, doc, pdf"); |
|
|
|
console.log('文件格式错误!仅支持' + "xlsx", "docx", "doc", "pdf") |
|
|
|
return false; |
|
|
|
} |
|
|
|
console.log('文件上传成功') |
|
|
|
|
|
|
|
return true |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
async function handleSubmit() { |
|
|
|
if (resButton.isEdit) { |
|
|
|
if (fileList.length == 0) { |
|
|
|
ElMessage({ |
|
|
|
message: "未选择任何文件,无法上传!", |
|
|
|
type: "error" |
|
|
|
}) |
|
|
|
return |
|
|
|
// 上传前处理 |
|
|
|
async function beforeUpload(file, item) { |
|
|
|
console.log('file,item', file, item); |
|
|
|
let fileSize = file.size; |
|
|
|
const FIVE_M = 500 * 1024 * 1024; |
|
|
|
//大于5M,不允许上传 |
|
|
|
if (fileSize > FIVE_M) { |
|
|
|
ElMessage.error('最大上传500M'); |
|
|
|
return false; |
|
|
|
} |
|
|
|
// type ==0新增,type ==1 是修改 |
|
|
|
if (fileList.length != tableDataFiles.value.length) { |
|
|
|
ElMessage({ |
|
|
|
message: "上传的文件不符合要求请检查", |
|
|
|
type: "error" |
|
|
|
}) |
|
|
|
return |
|
|
|
let geShi = ['xlx', 'xlsx', 'docx', 'doc', 'pdf'] as Array<string>; |
|
|
|
if (geShi.indexOf(file.name.substring(file.name.indexOf('.') + 1)) == -1) { |
|
|
|
ElMessage.error('文件格式错误!仅支持' + 'xlx,xlsx, docx, doc, pdf'); |
|
|
|
console.log('文件格式错误!仅支持' + 'xlsx', 'docx', 'doc', 'pdf'); |
|
|
|
return false; |
|
|
|
} |
|
|
|
} |
|
|
|
if (item.indexOf(file.name.substring(0, file.name.indexOf('.'))) == -1) { |
|
|
|
ElMessage.error('请上传文件:' + item); |
|
|
|
return false; |
|
|
|
} |
|
|
|
console.log('文件上传成功'); |
|
|
|
|
|
|
|
let approvalform = await ApprovalFromPageRef.value.getFieldsValueApprovalForm(); |
|
|
|
const params = new FormData() |
|
|
|
params.append("flag", approvalform.flag) |
|
|
|
params.append("planinfoid", planinfoid) |
|
|
|
params.append("comment", approvalform.comment) |
|
|
|
params.append("taskId", taskid) |
|
|
|
if (fileList.length > 0) { |
|
|
|
fileList.forEach((x) => { |
|
|
|
params.append("file", x.file) |
|
|
|
}); |
|
|
|
return true; |
|
|
|
} |
|
|
|
if (fileAdviceList.length > 0) { |
|
|
|
fileAdviceList.forEach((x) => { |
|
|
|
params.append("adviceFile", x.file) |
|
|
|
}); |
|
|
|
// 文件数量过多时提醒 |
|
|
|
function handleExceed() { |
|
|
|
ElMessage.warning('最多只能上传一个文件'); |
|
|
|
} |
|
|
|
console.log("param", params, "approvalform", approvalform) |
|
|
|
if (await ApprovalFromPageRef.value.validateApprovalForm()) { |
|
|
|
function beforeAdviceUpload(file) { |
|
|
|
console.log('file,item', file); |
|
|
|
let fileSize = file.size; |
|
|
|
const FIVE_M = 500 * 1024 * 1024; |
|
|
|
//大于5M,不允许上传 |
|
|
|
if (fileSize > FIVE_M) { |
|
|
|
ElMessage.error('最大上传500M'); |
|
|
|
return false; |
|
|
|
} |
|
|
|
let geShi = ['xlx', 'xlsx', 'docx', 'doc', 'pdf'] as Array<string>; |
|
|
|
if (geShi.indexOf(file.name.substring(file.name.indexOf('.') + 1)) == -1) { |
|
|
|
ElMessage.error('文件格式错误!仅支持' + 'xlx,xlsx, docx, doc, pdf'); |
|
|
|
console.log('文件格式错误!仅支持' + 'xlsx', 'docx', 'doc', 'pdf'); |
|
|
|
return false; |
|
|
|
} |
|
|
|
console.log('文件上传成功'); |
|
|
|
|
|
|
|
let res = await approvePlanFile(params) |
|
|
|
console.log("提交成功!", res) |
|
|
|
emit("close") |
|
|
|
return true; |
|
|
|
} |
|
|
|
|
|
|
|
async function handleSubmit() { |
|
|
|
if (resButton.isEdit) { |
|
|
|
if (fileList.length == 0) { |
|
|
|
ElMessage({ |
|
|
|
message: '未选择任何文件,无法上传!', |
|
|
|
type: 'error', |
|
|
|
}); |
|
|
|
return; |
|
|
|
} |
|
|
|
// type ==0新增,type ==1 是修改 |
|
|
|
if (fileList.length != tableDataFiles.value.length) { |
|
|
|
ElMessage({ |
|
|
|
message: '上传的文件不符合要求请检查', |
|
|
|
type: 'error', |
|
|
|
}); |
|
|
|
return; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
let approvalform = await ApprovalFromPageRef.value.getFieldsValueApprovalForm(); |
|
|
|
const params = new FormData(); |
|
|
|
params.append('flag', approvalform.flag); |
|
|
|
params.append('planinfoid', planinfoid); |
|
|
|
params.append('comment', approvalform.comment); |
|
|
|
if (approvalform.modifyNum) { |
|
|
|
params.append('modifyNum', approvalform.modifyNum); |
|
|
|
} |
|
|
|
params.append('taskId', taskid); |
|
|
|
if (fileList.length > 0) { |
|
|
|
fileList.forEach((x) => { |
|
|
|
params.append('file', x.file); |
|
|
|
}); |
|
|
|
} |
|
|
|
if (fileAdviceList.length > 0) { |
|
|
|
fileAdviceList.forEach((x) => { |
|
|
|
params.append('adviceFile', x.file); |
|
|
|
}); |
|
|
|
} |
|
|
|
console.log('param', params, 'approvalform', approvalform); |
|
|
|
if (await ApprovalFromPageRef.value.validateApprovalForm()) { |
|
|
|
let res = await approvePlanFile(params); |
|
|
|
console.log('提交成功!', res); |
|
|
|
emit('close'); |
|
|
|
} |
|
|
|
} |
|
|
|
async function exit() { |
|
|
|
emit('close'); |
|
|
|
} |
|
|
|
} |
|
|
|
async function exit() { |
|
|
|
emit("close") |
|
|
|
|
|
|
|
} |
|
|
|
</script> |
|
|
|
<style></style> |
|
|
|
<style></style> |
|
|
|