<template>
|
<div class="anth-cont">
|
<div class="viewbox-cont">
|
<h2>图谱变更内容</h2>
|
<div class="flex-box">
|
<span class="txt">行业板块：</span>
|
<span class="val">{{ state.basicInfo?.businessCategory }}</span>
|
<span class="txt" style="margin-left: 50px;">产业阶段：</span>
|
<span class="val">{{ state.basicInfo?.productionStage }}</span>
|
</div>
|
<div class="flex-box" style="height:50vh;">
|
<iframe :src="state.iframeUrl"
|
style="width: 100%; height: 100%; border: none"
|
></iframe>
|
</div>
|
<el-table
|
:data="state.basicInfo?.historyDoList"
|
style="width: 100%"
|
max-height="500px"
|
:header-cell-style="{ backgroundColor: '#dce6f4', color: '#333' ,
|
fontSize:'13px'}"
|
>
|
<el-table-column
|
align="center"
|
prop="originalName"
|
label="节点名称"
|
>
|
<!-- <template #default="scope">
|
<div v-for="(item,index) in scope.row.historyDoList" :key="index">
|
{{ item.originalName }}
|
</div>
|
</template> -->
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="processParentFullName"
|
label="父节点"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="operateTypeName"
|
label="编辑类型"
|
></el-table-column>
|
<el-table-column
|
prop="username"
|
label="编辑内容"
|
min-width="220px"
|
align="left"
|
> <template #default="scope">
|
<div class="rowbox">
|
<div class="row-boxs" >
|
<div v-if="scope.row.operateType=='ADD' || scope.row.operateType=='ADD_SUB' || scope.row.operateType=='ADD_SIBLING'" class='row-nodes'>
|
<div class='node-item '>
|
<span class='node-item-c'> <b>节点名称：</b><span class='txtred'>{{scope.row.modifiedName}}</span></span>
|
<span class='node-item-c'> <b>节点描述：</b><span class='txtred'>{{scope.row.modifiedDescription}}</span></span>
|
</div>
|
</div>
|
<div v-if="scope.row.operateType=='DELETE'" class='row-nodes'>
|
<div class='node-item '>
|
<span class='node-item-c'><span class='txtred'>删除节点及其子节点</span></span>
|
<!-- <span class='node-item-c'> <b>节点描述：</b><span class='txtred'>删除{{scope.row.originalName}}</span></span> -->
|
</div>
|
</div>
|
<div v-if="scope.row.operateType=='UPDATE'" class='row-nodes'>
|
<span class='node-item-c'> <b>节点名称：</b>{{scope.row.originalName || '空'}} 变更为 <span class='txtred'>{{scope.row.modifiedName}}</span></span>
|
<span class='node-item-c'> <b>节点描述：</b>{{scope.row.originalDescription || '空'}} 变更为 <span class='txtred'>{{scope.row.modifiedDescription}}</span></span>
|
</div>
|
<div v-if="scope.row.operateType=='SORT'|| scope.row.operateType=='UPDATE_SORT'" class='nodes'>
|
<div class='node-item '>
|
<b>节点顺序：</b>{{scope.row.originalSort}} 变更为 <span class='txtred'>{{scope.row.modifiedSort}}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div class="flex-box">
|
<span class="txt">变更说明：</span>
|
<span class="val">{{state.basicInfo?.changeDescription}}</span>
|
</div>
|
<!-- <div class="flex-box">
|
<span class="txt">附件：</span>
|
<span class="val">
|
<el-image
|
v-if="state.basicInfo?.fileUrl"
|
style="
|
position: relative;
|
width: 100px;
|
height: 100px;
|
cursor: pointer;
|
"
|
:src="state.basicInfo?.fileUrl"
|
:preview-teleported="true"
|
:preview-src-list="[state.basicInfo?.fileUrl]"
|
>
|
</el-image>
|
</span>
|
</div> -->
|
</div>
|
<div class="viewbox-cont">
|
<h2>操作人信息</h2>
|
<el-descriptions direction="horizontal" :column="2" border >
|
<el-descriptions-item
|
label="姓名"
|
label-align="right"
|
align="left"
|
width="36vw"
|
>
|
{{ state.basicInfo?.createBy }}
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="单位"
|
label-align="right"
|
align="left"
|
width="40vw"
|
>
|
{{ state.basicInfo?.unitName }}
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="部门"
|
label-align="right"
|
align="left"
|
>
|
{{ state.basicInfo?.departmentName }}
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="用户名"
|
label-align="right"
|
align="left"
|
>
|
{{ state.basicInfo?.createByAccount }}
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="操作时间"
|
label-align="right"
|
align="left"
|
>
|
{{ state.basicInfo?.createTime }}
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="审批状态"
|
label-align="right"
|
align="left"
|
>
|
{{ state.basicInfo?.approvalStatusName }}
|
</el-descriptions-item>
|
</el-descriptions>
|
</div>
|
</div>
|
</template>
|
<script setup lang="ts">
|
import approvalApi from '@/api/zhongjian/approvalApi'
|
import Base64 from '@/utils/base64'
|
import { useRoute } from 'vue-router'
|
import { useUserInfo } from '@/stores/modules/userInfo'
|
import router from '@/router'
|
import { useNavTabs } from '@/stores/modules/navTabs' // 标签导航
|
import mindmapService from '@/api/mindMap' // 接口文件
|
import {
|
ElNotification,
|
ElMessageBox,
|
FormRules,
|
FormInstance,
|
} from 'element-plus'
|
const route = useRoute()
|
const userStore = useUserInfo() // 用户相关的
|
const state = reactive<any>({
|
fullscreen: false, // 全屏对话框
|
visible: false,
|
title: '',
|
draftId: '', // 草稿Id
|
scopeIdListData: [], // 暂存发布范围IDs
|
disabledData: false, // 编辑权限
|
defaultAll: false, // 是否默认展开
|
webUrlDivShow: false,
|
isAddStatus: 0, // 点击下一步判断是否已经新增了数据
|
routeData:{},
|
iframeUrl:'',
|
basicInfo:{
|
historyDoList: []
|
}
|
})
|
const navTabsStore = useNavTabs()
|
const ruleFormRef = ref<FormInstance>()
|
const productComRef=ref()
|
const benchmarkComRef=ref()
|
const knowledgeComRef=ref()
|
const emit = defineEmits(['openFilePreview'])
|
const scrollViewContainer = ref()
|
const btnLoading= ref()
|
const goBackList = () => {
|
scrollViewContainer.value.scrollTo({ top: 0 })
|
router.push({
|
path: state.routeData.backPath,
|
})
|
}
|
const closeClick=()=>{
|
const routes: any = {
|
path: '/approve/authorizationApply/authorizationApplyApproval',
|
}
|
navTabsStore.closeTab(routes)
|
navTabsStore.deleteCachedViews('authorizationApplyApproval')
|
router.back()
|
}
|
const backClick = () => {
|
scrollViewContainer.value.scrollTo({ top: 0 })
|
router.push({
|
path: state.routeData?.backPath? state.routeData.backPath:
|
'/approve/graphAuthorization/graphAuthorizationList',
|
})
|
}
|
// const getApproveDetailInfo = () => {
|
// mindmapService.getAtlasProcessApprovalDetail({
|
// id:state.routeData.id,
|
// })
|
// .then((res: any) => {
|
// if (res.code == 200) {
|
// state.basicInfo = res.data
|
// }
|
// })
|
// }
|
const handleCancel = () => {
|
scrollViewContainer.value.scrollTo({ top: 0 })
|
router.push({
|
path: state.routeData.backPath,
|
})
|
}
|
// 审批通过或者不通过 0 不通过 1 通过
|
const approvalPassOrNo = (type:number) => {
|
if(!state.opinion){
|
ElNotification({
|
type: 'error',
|
message:'请输入审批意见！',
|
})
|
return
|
}
|
let txt=type==1?'通过':'驳回'
|
ElMessageBox.confirm(`确定要审批${txt}吗?`, '提醒', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
})
|
.then(() => {
|
let data :any={}
|
btnLoading.value=true
|
if(type==1){
|
// 通过
|
data = {
|
id: state.routeData.id,
|
operationType: 'pass',
|
opinion: state.opinion,
|
taskId: state.routeData.taskId,
|
// reportId: state.routeData.reportId,
|
// type:state.routeData.type,
|
}
|
}else{
|
data = {
|
id: state.routeData.id,
|
operationType: 'rejected',
|
opinion: state.opinion,
|
taskId: state.routeData.taskId,
|
// reportId: state.routeData.reportId,
|
// type:state.routeData.type,
|
}
|
}
|
mindmapService.setAtlasProcessApprovalComplete({ ...data }).then((res: any) => {
|
if (res.code == 200) {
|
ElNotification({
|
type: 'success',
|
message:type==1? '审批成功！':"已驳回！",
|
})
|
btnLoading.value=false
|
// 回退
|
backClick()
|
}else{
|
btnLoading.value=false
|
}
|
}).catch(() => { btnLoading.value=false})
|
})
|
.catch(() => { btnLoading.value=false})
|
}
|
const setData=(data:any)=>{
|
state.basicInfo=data
|
const token = userStore.getAdminToken
|
const id = data.id
|
const stageId=data.productionStageId
|
const Biurl =import.meta.env.VITE_BI_URL as string
|
state.iframeUrl=`${Biurl}/graph-dictionary/mindmap/approve-preview?token=${token}&id=${id}&stageId=${stageId}`
|
}
|
defineExpose({
|
setData
|
});
|
// onMounted(() => {
|
// // state.routeData = JSON.parse(Base64.decode(route.query.info))
|
// // console.log("onMounted state.routeData",state.routeData)
|
// // state.id = state.routeData?.id ?? ''
|
// // state.opinion=''
|
// // if (state.id) {
|
// // // 编辑时根据id获取详情
|
// // getApproveDetailInfo()
|
// // const history_url: string = import.meta.env.VITE_IFREAM_URL as string
|
// // if (state.routeData.flowId) {
|
// // state.srcData = `${history_url}/activity/history?processinstId=${state.routeData.flowId}&token=${state.routeData.token}`
|
// // }
|
// // }
|
// })
|
</script>
|
<style scoped lang="scss">
|
.anth-cont{
|
position: relative;
|
}
|
.viewbox-cont {
|
margin-bottom: 10px;
|
margin-top: 10px;
|
}
|
:deep(.is-bordered-label) {
|
background-color: #f9f9f9 !important;
|
border: 1px solid #ededed !important;
|
width: 120px !important;
|
}
|
.fileDiv {
|
width: 100%;
|
min-height: 60px;
|
max-height:300px ;
|
overflow: auto;
|
display: flex;
|
flex-direction: column;
|
.filelist {
|
color: #536be2;
|
font-size: 15px;
|
cursor: pointer;
|
max-width: 400px;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
line-height: 40px;
|
white-space: nowrap;
|
&:hover {
|
font-weight: 600;
|
font-size: 15px;
|
}
|
}
|
}
|
|
.shenPiDiv {
|
width: 100%;
|
display: flex;
|
flex-direction: row;
|
background-color: #fff;
|
margin-top: 5px;
|
padding-bottom: 40px;
|
|
.titDiv {
|
width: 120px;
|
display: flex;
|
flex-direction: row;
|
align-items: center;
|
font-weight: bold;
|
padding-left: 20px;
|
font-size: 14px;
|
justify-content: center;
|
.txt{
|
font-size: 14px;
|
}
|
}
|
|
.ctnDiv {
|
width: 90%;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
margin: 5px 0 15px;
|
|
.ipt {
|
width: 100%;
|
margin-top: 10px;
|
}
|
}
|
}
|
h2 {
|
padding: 5px 15px;
|
background-color: #dce6f4;
|
color: #656d9a;
|
font-size: 14px;
|
}
|
.flex-box{
|
display: flex;
|
flex-direction: row;
|
// justify-content: center;
|
padding: 10px;
|
.txt{
|
display: inline-block;
|
width: 100px;
|
font-size: 14px;
|
font-weight: 600;
|
}
|
.val{
|
font-size: 14px;
|
}
|
}
|
.row-nodes{
|
display:flex;
|
flex-direction:column;
|
// justify-content:center;
|
.node-item{
|
display:flex;
|
flex-direction:column;
|
.node-item-c{
|
|
}
|
}
|
}
|
.txtred{
|
color:red
|
}
|
.center{
|
display: flex;
|
flex-direction: column;
|
justify-content: center;
|
align-items: center;
|
}
|
</style>
|
|
