You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
437 lines
16 KiB
437 lines
16 KiB
<template>
|
|
<el-dialog class="detail-dialog" :visible.sync="formVisible" :modal-append-to-body="false" :close-on-click-modal="false" append-to-body title="流程处理">
|
|
<div class="setting-dialog">
|
|
<div class="detail-tab tab-content">
|
|
<ul class="tab-nav">
|
|
<li :class="{'active-tab-nav': activeIndex == 0 }" @click="changeActiveTab(0)">流程表单</li>
|
|
<li :class="{'active-tab-nav': activeIndex == 1 }" @click="changeActiveTab(1)">流程图</li>
|
|
<!-- <li :class="{'active-tab-nav': activeIndex == 2 }" @click="changeActiveTab(2)">业务详情</li> -->
|
|
</ul>
|
|
</div>
|
|
<div v-if="activeIndex == 0">
|
|
<div class="detail-info">
|
|
<p style="width: 60%;"><span>流程名称：</span>{{ baseInfo && baseInfo.title }}</p>
|
|
<p><span>启动时间：</span>{{ baseInfo && baseInfo.createTime | parseTime }}</p>
|
|
<p style="width: 60%;"><span>实例ID：</span>{{ baseInfo && baseInfo.procInstId }}</p>
|
|
<p><span>发起人：</span>{{ baseInfo && baseInfo.createBy }}</p>
|
|
</div>
|
|
<!-- 1.归档 index=1 2.退回 index=2 3.开放 index=6 4.销毁index=7 5.利用index=3 6.内部移交index=4 7.外部移交index=5 -->
|
|
<div class="detail-list">
|
|
<p><span>业务类型：</span>{{ businessTypeText }}</p>
|
|
<p v-if="baseInfo && baseInfo.businessType === 6"><span>目标全宗：</span>{{ baseInfo && baseInfo.targetFondsNo }}</p>
|
|
<p v-if="baseInfo && baseInfo.businessType !== 6"><span>原始位置：</span>{{ baseInfo && baseInfo.businessType === 1 ? '收集库' : baseInfo && baseInfo.businessType === 2 ? '管理库' : '-' }}</p>
|
|
<p v-if="baseInfo && baseInfo.businessType !== 6"><span>目标位置：</span>{{ baseInfo && baseInfo.businessType === 1 ? '管理库' : baseInfo && baseInfo.businessType === 2 ? '收集库' : '-' }}</p>
|
|
<!-- <p><span>赋权类型：</span>-</p> -->
|
|
<p v-if="baseInfo && baseInfo.giveStartTime"><span>起始时间：</span>{{ baseInfo && baseInfo.giveStartTime | parseTime }}</p>
|
|
<p v-else><span>起始时间：</span>-</p>
|
|
<p v-if="baseInfo && baseInfo.giveEndTime"><span>终止时间：</span>{{ baseInfo && baseInfo.giveEndTime | parseTime }}</p>
|
|
<p v-else><span>终止时间：</span>-</p>
|
|
<p v-if="baseInfo && baseInfo.businessType !== 5"><span>申请缘由：</span>{{ baseInfo && baseInfo.remarks ? baseInfo.remarks : baseInfo.reason }}</p>
|
|
<p v-else><span>利用目的：</span>{{ baseInfo && baseInfo.borrowReason }}</p>
|
|
<!-- <p><span>利用次数：</span>-</p> -->
|
|
</div>
|
|
<div class="opinion">
|
|
<!-- <h5>归档审批</h5> -->
|
|
<div class="opinion-form">
|
|
<!-- <span>审批意见</span>
|
|
<el-input v-model="opinionTxt" placeholder="请输入" type="textarea" :rows="2" /> -->
|
|
<el-form ref="form" :model="form" inline label-width="100px">
|
|
<el-form-item label="审批意见" prop="opinion" :rules="[{ required: true, message: '请输入审批意见', trigger: 'blur' }]">
|
|
<el-input v-model="form.opinion" type="textarea" :rows="3" style="width: 700px;" />
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
<businessDetails :base-info="baseInfo" :table-data="tableData" :is-utilize="isUtilize" :is-flowable-form="true" :set-page="setPage" @select-change="handleSelectChange" @page-change="pageChangeHandler" @size-change="sizeChangeHandler" />
|
|
</div>
|
|
<div v-if="activeIndex == 1" class="detail-img">
|
|
<img :src="'data:image/jpeg;base64,'+ srcImg" alt="" :onerror="defaultImg">
|
|
</div>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button :loading="submitLoading" @click="submitOpinion(false)">驳回</el-button>
|
|
<el-button :loading="submitLoading2" type="primary" @click="submitOpinion(true)">审批</el-button>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script>
|
|
import { FetchBecomeDocumentConfirm } from '@/api/collect/collect'
|
|
import { FetchMergeToFileConfirm, FetchBatchToFileConfirm } from '@/api/prearchiveLibrary/prearchiveLibrary'
|
|
import { FetchGenProcessDiagram } from '@/api/system/flowable'
|
|
// FetchBusinessFlowDetails,
|
|
import { FetchHandBusinessFlowDetails, FetchUtilizeConfirm, FetchArchivesReturnConfirm, FetchArchivesOpenConfirm, FetchArchivesDestructionConfirm, FetchTransferConfirm, FetchOfflineTransferConfirm, FetchMoveToFileConfirm } from '@/api/archivesManage/library'
|
|
import businessDetails from '@/views/system/processManage/runningProcess/module/businessDetails/index.vue'
|
|
export default {
|
|
name: 'Form',
|
|
components: {
|
|
businessDetails
|
|
},
|
|
data() {
|
|
return {
|
|
formVisible: false,
|
|
activeIndex: 0,
|
|
form: {
|
|
opinion: null
|
|
},
|
|
selectRow: null,
|
|
selectCenterRow: null,
|
|
srcImg: '',
|
|
defaultImg: 'this.src="' + require('@/assets/images/system/default-img.jpg') + '"',
|
|
tableData: [],
|
|
baseInfo: null,
|
|
isUtilize: false,
|
|
selectedValues: {},
|
|
setPage: {
|
|
total: 0,
|
|
size: 10,
|
|
page: 0
|
|
},
|
|
isMessage: false,
|
|
submitLoading: false,
|
|
submitLoading2: false
|
|
}
|
|
},
|
|
computed: {
|
|
businessTypeText() {
|
|
const businessType = this.baseInfo && this.baseInfo.businessType
|
|
// 1.归档 index=1 2.退回 index=2 3.开放 index=6 4.销毁index=7 5.利用index=3 6.内部移交index=4 7.外部移交index=5
|
|
switch (businessType) {
|
|
case 1 :
|
|
return '归档审批'
|
|
case 2 :
|
|
return '退回审批'
|
|
case 3:
|
|
return '开放鉴定'
|
|
case 4:
|
|
return '销毁鉴定'
|
|
case 5:
|
|
return '赋权审批'
|
|
case 6:
|
|
return '内部移交'
|
|
case 7:
|
|
return '外部移交'
|
|
case 8:
|
|
return '预归档批量成件'
|
|
case 9:
|
|
return '预归档合并成件'
|
|
case 10:
|
|
return '预归档移动'
|
|
default:
|
|
return '-'
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
changeActiveTab(data) {
|
|
this.activeIndex = data
|
|
if (data === 1) {
|
|
this.getProcessImg()
|
|
} else {
|
|
this.setPage.page = 0
|
|
this.getBusinessFlowDetails()
|
|
}
|
|
},
|
|
getProcessImg() {
|
|
this.srcImg = ''
|
|
FetchGenProcessDiagram({ 'processId': this.isMessage ? (this.baseInfo && this.baseInfo.procInstId) : this.selectRow.procInstId }).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.srcImg = res
|
|
} else {
|
|
this.srcImg = ''
|
|
}
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
},
|
|
handleSelectChange({ id, value }) {
|
|
if (value === -1) {
|
|
this.$message.error('请选择有效实体借阅状态！')
|
|
}
|
|
this.$set(this.selectedValues, id, value)
|
|
},
|
|
getBusinessFlowDetails() {
|
|
this.tableData = []
|
|
this.selectedValues = {}
|
|
const params = {
|
|
'businessId': this.isMessage ? this.selectCenterRow.businessId : this.selectRow.id,
|
|
'page': this.setPage.page,
|
|
'size': this.setPage.size
|
|
}
|
|
FetchHandBusinessFlowDetails(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.formVisible = true
|
|
this.baseInfo = res.businessFlow
|
|
this.selectRow = res.businessFlow
|
|
if (this.selectRow.businessType === 5) {
|
|
this.isUtilize = true
|
|
res.details.content.forEach(item => {
|
|
item.utilizeType = item.utilizeType.split(',').map(Number)
|
|
})
|
|
} else {
|
|
this.isUtilize = false
|
|
res.details.content.forEach(item => {
|
|
item.utilizeType = []
|
|
})
|
|
}
|
|
this.tableData = res.details.content
|
|
this.tableData.forEach(item => {
|
|
if (item.utilizeState === -1) {
|
|
item.utilizeState = 1
|
|
}
|
|
this.$set(this.selectedValues, item.archivesId, item.utilizeState)
|
|
})
|
|
this.setPage.total = res.details.totalElements
|
|
} else {
|
|
this.$message({ message: res.message, type: 'error', offset: 8 })
|
|
}
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
},
|
|
// 当前页改变
|
|
pageChangeHandler(e) {
|
|
this.setPage.page = e - 1
|
|
console.log('this.setPage.page', this.setPage.page)
|
|
this.getBusinessFlowDetails()
|
|
},
|
|
// 每页条数改变
|
|
sizeChangeHandler(e) {
|
|
this.setPage.size = e
|
|
this.setPage.page = 0
|
|
this.getBusinessFlowDetails()
|
|
},
|
|
submitOpinion(type) {
|
|
if (type) {
|
|
this.submitLoading2 = true
|
|
} else {
|
|
this.submitLoading = true
|
|
}
|
|
this.$refs['form'].validate((valid) => {
|
|
if (valid) {
|
|
if (this.selectRow.businessType === 5) {
|
|
if (Object.keys(this.selectedValues).length === 0) {
|
|
this.$message.error('请选择有效实体借阅状态！')
|
|
return false
|
|
} else {
|
|
const hasInvalidSelection = Object.values(this.selectedValues).some(value => value === -1)
|
|
if (hasInvalidSelection) {
|
|
this.$message.error('请选择有效实体借阅状态！')
|
|
return false
|
|
}
|
|
}
|
|
}
|
|
const params = {
|
|
'id': this.selectRow.id,
|
|
'isPass': type,
|
|
'opinion': this.form.opinion,
|
|
'map': this.selectedValues
|
|
}
|
|
console.log(params)
|
|
if (this.selectRow.businessType === 1) {
|
|
// 归档
|
|
FetchBecomeDocumentConfirm(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.$message({ message: res, type: 'success', offset: 8 })
|
|
} else {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
}
|
|
this.closedDialog()
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
} else if (this.selectRow.businessType === 2) {
|
|
// 退回
|
|
FetchArchivesReturnConfirm(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.$message({ message: res, type: 'success', offset: 8 })
|
|
} else {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
}
|
|
this.closedDialog()
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
} else if (this.selectRow.businessType === 3) {
|
|
// 开放
|
|
FetchArchivesOpenConfirm(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.$message({ message: res, type: 'success', offset: 8 })
|
|
} else {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
}
|
|
this.closedDialog()
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
} else if (this.selectRow.businessType === 4) {
|
|
// 销毁
|
|
FetchArchivesDestructionConfirm(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.$message({ message: res, type: 'success', offset: 8 })
|
|
} else {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
}
|
|
this.closedDialog()
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
} else if (this.selectRow.businessType === 5) {
|
|
// 利用
|
|
FetchUtilizeConfirm(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.$message({ message: res, type: 'success', offset: 8 })
|
|
} else {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
}
|
|
this.closedDialog()
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
} else if (this.selectRow.businessType === 6) {
|
|
// 在线移交
|
|
FetchTransferConfirm(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.$message({ message: res, type: 'success', offset: 8 })
|
|
} else {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
}
|
|
this.closedDialog()
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
} else if (this.selectRow.businessType === 7) {
|
|
// 离线移交
|
|
FetchOfflineTransferConfirm(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.$message({ message: res, type: 'success', offset: 8 })
|
|
} else {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
}
|
|
this.closedDialog()
|
|
}).catch(err => {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
console.log(err)
|
|
})
|
|
} else if (this.selectRow.businessType === 8) {
|
|
// 批量成件
|
|
FetchBatchToFileConfirm(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.$message({ message: res, type: 'success', offset: 8 })
|
|
} else {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
}
|
|
this.closedDialog()
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
} else if (this.selectRow.businessType === 9) {
|
|
// 合并成件
|
|
FetchMergeToFileConfirm(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.$message({ message: res, type: 'success', offset: 8 })
|
|
} else {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
}
|
|
this.closedDialog()
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
} else if (this.selectRow.businessType === 10) {
|
|
// 预归档移动
|
|
FetchMoveToFileConfirm(params).then((res) => {
|
|
if (res.code !== 500) {
|
|
this.$message({ message: res, type: 'success', offset: 8 })
|
|
} else {
|
|
this.$message({ message: '操作提交失败', type: 'error', offset: 8 })
|
|
}
|
|
this.closedDialog()
|
|
}).catch(err => {
|
|
console.log(err)
|
|
})
|
|
}
|
|
// this.closedDialog()
|
|
} else {
|
|
this.submitLoading = false
|
|
this.submitLoading2 = false
|
|
return false
|
|
}
|
|
})
|
|
},
|
|
closedDialog() {
|
|
this.formVisible = false
|
|
this.form.opinion = null
|
|
this.submitLoading = false
|
|
this.submitLoading2 = false
|
|
this.$emit('refresh')
|
|
}
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<style lang='scss' scoped>
|
|
.detail-dialog{
|
|
.detail-info,
|
|
.detail-list{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
flex-wrap: wrap;
|
|
padding: 4px 18px;
|
|
font-size: 14px;
|
|
line-height: 30px;
|
|
color: #545B65;
|
|
background-color: #F6F8FC;
|
|
p{
|
|
width: 40%;
|
|
span{
|
|
display: inline-block;
|
|
width: 75px;
|
|
text-align: right;
|
|
color: #0C0E1E;
|
|
}
|
|
}
|
|
}
|
|
.opinion{
|
|
margin: 10px 0;
|
|
h5{
|
|
margin-bottom: 18px;
|
|
font-size: 16px;
|
|
color: #0C0E1E;
|
|
text-align: center;
|
|
}
|
|
.opinion-form{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
span{
|
|
display: block;
|
|
width: 83px;
|
|
margin-right: 12px;
|
|
line-height: 30px;
|
|
text-align: right;
|
|
color: #545B65;
|
|
}
|
|
::v-deep .el-textarea__inner{
|
|
border-color: #E6E8ED;
|
|
}
|
|
}
|
|
}
|
|
.detail-img{
|
|
width: 818px;
|
|
height: 404px;
|
|
overflow: hidden;
|
|
overflow-y: scroll;
|
|
img{
|
|
display: block;
|
|
// width: 100%;
|
|
}
|
|
}
|
|
.detail-list{
|
|
// margin-bottom: 16px;
|
|
padding: 0 18px 4px 18px;
|
|
p{
|
|
width: 33%;
|
|
}
|
|
}
|
|
}
|
|
</style>
|