<template>
|
<div class="anth-cont">
|
<el-scrollbar style="width: 100%; height: 82vh"
|
ref="scrollViewContainer">
|
<div class="viewbox-cont">
|
<ProductCom v-if="state.routeData.type=='product'" ref="productComRef"></ProductCom>
|
<BenchmarkCom v-else-if="state.routeData.type=='benchmark'" ref="benchmarkComRef"></BenchmarkCom>
|
<KnowledgeCom v-else="state.routeData.type=='knowledge'" ref="knowledgeComRef"></KnowledgeCom>
|
</div>
|
<div class="viewbox-cont">
|
<h2>申请人信息</h2>
|
<el-descriptions direction="horizontal" :column="2" border size="default"
|
label-width="120px">
|
<el-descriptions-item
|
label="姓名"
|
label-align="right"
|
align="left"
|
width="35vw"
|
>
|
{{ state.basicInfo?.name }}
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="单位"
|
label-align="right"
|
align="left"
|
>
|
{{ 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?.username }}
|
</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?.authApproveStatusName }}
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="授权周期"
|
label-align="right"
|
align="left"
|
>
|
{{ state.basicInfo?.numbers }} {{ state.basicInfo?.timeUnitName }}
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="申请类型"
|
label-align="right"
|
align="left"
|
>
|
{{ state.basicInfo?.applyTypeName }}
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="账号信息"
|
label-align="right"
|
align="left"
|
>
|
<!-- {{ state.basicInfo?.usernames }} -->
|
<!-- <div class="thsbox">
|
<div class="ths" >
|
<div class="th"><b>姓名</b></div>
|
<div class="th"><b>手机号</b></div>
|
<div class="th"><b>交建通账号</b></div>
|
</div>
|
<div class="ths" v-for="(item,index) in state.basicInfo?.userInfos">
|
<div class="th">{{ item.name }}</div>
|
<div class="th">{{ item.phone }}</div>
|
<div class="th">{{ item.username }}</div>
|
</div>
|
</div> -->
|
<el-table
|
:data="state.basicInfo?.userInfos"
|
height="130px"
|
size="small"
|
>
|
<el-table-column
|
align="center"
|
prop="name"
|
label="姓名"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="phone"
|
label="手机号"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="username"
|
label="交建通账号"
|
></el-table-column>
|
</el-table>
|
</el-descriptions-item>
|
<el-descriptions-item
|
label="申请说明"
|
label-align="right"
|
align="left"
|
:span="4"
|
>
|
{{ state.basicInfo?.reason }}
|
</el-descriptions-item>
|
</el-descriptions>
|
</div>
|
<div class="viewbox-cont" v-if="state.routeData.informationEditType=='approve'">
|
<h2>审批</h2>
|
<div class="shenPiDiv" >
|
<div class="titDiv">
|
<p style="color: red;margin-right: 3px;display: block;margin-top: 6px;">*</p>
|
<span class='txt'>审批意见</span>
|
</div>
|
<div class="ctnDiv">
|
<el-input
|
class="ipt"
|
v-model="state.opinion"
|
:rows="3"
|
type="textarea"
|
placeholder="请输入审批意见"
|
/>
|
</div>
|
<div>
|
</div>
|
</div>
|
</div>
|
<div class="viewbox-cont" v-else>
|
<h2>审批追踪</h2>
|
<div class="bodyBoxiframe" v-if="state.routeData.flowId">
|
<iframe
|
style="width: 100%; height: 700px; border: none"
|
:src="state.srcData"
|
></iframe>
|
</div>
|
<div v-else style="text-align: center; padding: 20px 0 10px">
|
当前状态下无追踪信息
|
</div>
|
</div>
|
<div class="absolutBnt">
|
<div class="btns">
|
<el-button size="large" @click.stop="backClick" icon="ArrowLeft">返回</el-button>
|
<el-button :disabled="btnLoading" v-if="state.routeData.informationEditType=='approve'"
|
size="large" type="primary" @click="approvalPassOrNo(1)"
|
>审批通过</el-button
|
>
|
<el-button :disabled="btnLoading" v-if="state.routeData.informationEditType=='approve'" size="large" type="primary" @click="approvalPassOrNo(0)">驳回</el-button>
|
<el-button size="large" @click="closeClick">关闭</el-button>
|
</div>
|
</div>
|
</el-scrollbar>
|
</div>
|
</template>
|
<script lang="ts">
|
export default {
|
name: 'authorizationApplyApproval',
|
}
|
</script>
|
<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 ProductCom from '../../common/productionCom.vue'
|
import BenchmarkCom from '../../common/benchmarkCom.vue'
|
import KnowledgeCom from '../../common/knowledgeCom.vue'
|
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:{},
|
srcData:'',
|
basicInfo:{
|
userInfos: []
|
}
|
})
|
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/authorizationApply/authorizationList',
|
})
|
}
|
const getApproveDetailInfo = () => {
|
approvalApi
|
.getReportAuthApplicantInfo({
|
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,
|
}
|
}
|
approvalApi.setApplicantauditingComplete({ ...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})
|
}
|
onActivated(() => {
|
state.routeData = JSON.parse(Base64.decode(route.query.info))
|
console.log("state.routeData",state.routeData)
|
state.id = state.routeData?.id ?? ''
|
state.opinion=''
|
if (state.id) {
|
// 编辑时根据id获取详情
|
getApproveDetailInfo()
|
nextTick(()=>{
|
if(state.routeData.type=='product'){
|
productComRef.value.getDetailInfo(state.routeData.reportId)
|
}else if(state.routeData.type=='benchmark'){
|
benchmarkComRef.value.getDetailInfo(state.routeData.reportId)
|
}else if(state.routeData.type=='knowledge'){
|
knowledgeComRef.value.getDetailInfo(state.routeData.reportId)
|
}
|
})
|
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;
|
}
|
}
|
}
|
.absolutBnt {
|
position: absolute;
|
bottom: 0px;
|
left:0;
|
right:0;
|
background-color: #fff;
|
height:60px;
|
.btns{
|
padding-top: 10px;
|
display: flex;
|
flex-direction: row;
|
justify-content: center;
|
align-items: center;
|
}
|
|
|
}
|
.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;
|
}
|
.thsbox{
|
.ths{
|
display: flex;
|
flex-direction: row;
|
justify-content: center;
|
align-items: center;
|
border-bottom: 1px solid #dce6f4;
|
.th{
|
width:30%;
|
display: flex;
|
line-height: 30px;
|
flex-direction: row;
|
justify-content: center;
|
align-items: center;
|
font-size: 13px;
|
}
|
}
|
}
|
</style>
|
