减免审核页面初步完善

This commit is contained in:
BianLzhaoMin 2025-02-20 23:10:05 +08:00
parent 65f1f6e17d
commit c536630a1b
6 changed files with 1903 additions and 568 deletions

View File

@ -0,0 +1,34 @@
import request from '@/utils/request'
// 获取减免申请审核列表
export function getReceiveApplyApi(query) {
return request({
url: '/material/leaseTask/auditList',
method: 'get',
params: query
})
}
// 获取减免申请详情
export function getReceiveApplyDetailsApi(query) {
return request({
url: '/material/ma_type/getMaTypeTreeSelect',
method: 'get',
params: query
})
}
// 获取减免申请记录详情
export function getAuditingDetailsApi(query) {
return request({
url: '/material//sysWorkflowNode/listByTaskId',
method: 'get',
params: query
})
}
// 减免申请审核提交接口
export function submitAuditingApi(query) {
return request({
url: '/material/ma_type/getMaTypeTreeSelect',
method: 'get',
params: query
})
}

View File

@ -30,204 +30,204 @@ import Layout from '@/layout'
// 公共路由
export const constantRoutes = [
{
path: '/redirect',
component: Layout,
hidden: true,
children: [
{
path: '/redirect/:path(.*)',
component: () => import('@/views/redirect')
}
]
},
{
path: '/login',
component: () => import('@/views/login1'),
hidden: true
},
{
path: '/register',
component: () => import('@/views/register1'),
hidden: true
},
{
path: '/404',
component: () => import('@/views/error/404'),
hidden: true
},
{
path: '/401',
component: () => import('@/views/error/401'),
hidden: true
},
{
path: '',
component: Layout,
redirect: 'index',
children: [
{
path: 'index',
component: () => import('@/views/index'),
name: 'Index',
meta: { title: '首页', icon: 'dashboard', affix: true }
}
]
},
{
path: '/qrCode/qrCodePage',
component: () => import('@/views/qrCode/qrCode'),
hidden: true
},
{
path: '/user',
component: Layout,
hidden: true,
redirect: 'noredirect',
children: [
{
path: 'profile',
component: () => import('@/views/system/user/profile/index'),
name: 'Profile',
meta: { title: '个人中心', icon: 'user' }
}
]
}
{
path: '/redirect',
component: Layout,
hidden: true,
children: [
{
path: '/redirect/:path(.*)',
component: () => import('@/views/redirect')
}
]
},
{
path: '/login',
component: () => import('@/views/login1'),
hidden: true
},
{
path: '/register',
component: () => import('@/views/register1'),
hidden: true
},
{
path: '/404',
component: () => import('@/views/error/404'),
hidden: true
},
{
path: '/401',
component: () => import('@/views/error/401'),
hidden: true
},
{
path: '',
component: Layout,
redirect: 'index',
children: [
{
path: 'index',
component: () => import('@/views/index'),
name: 'Index',
meta: { title: '首页', icon: 'dashboard', affix: true }
}
]
},
{
path: '/qrCode/qrCodePage',
component: () => import('@/views/qrCode/qrCode'),
hidden: true
},
{
path: '/user',
component: Layout,
hidden: true,
redirect: 'noredirect',
children: [
{
path: 'profile',
component: () => import('@/views/system/user/profile/index'),
name: 'Profile',
meta: { title: '个人中心', icon: 'user' }
}
]
}
]
// 动态路由,基于用户权限动态去加载
export const dynamicRoutes = [
{
path: '/system/user-auth',
component: Layout,
hidden: true,
permissions: ['system:user:edit'],
children: [
{
path: 'role/:userId(\\d+)',
component: () => import('@/views/system/user/authRole'),
name: 'AuthRole',
meta: { title: '分配角色', activeMenu: '/system/user' }
}
]
},
{
path: '/system/role-auth',
component: Layout,
hidden: true,
permissions: ['system:role:edit'],
children: [
{
path: 'user/:roleId(\\d+)',
component: () => import('@/views/system/role/authUser'),
name: 'AuthUser',
meta: { title: '分配用户', activeMenu: '/system/role' }
}
]
},
{
path: '/system/dict-data',
component: Layout,
hidden: true,
permissions: ['system:dict:list'],
children: [
{
path: 'index/:dictId(\\d+)',
component: () => import('@/views/system/dict/data'),
name: 'Data',
meta: { title: '字典数据', activeMenu: '/system/dict' }
}
]
},
{
path: '/monitor/job-log',
component: Layout,
hidden: true,
permissions: ['monitor:job:list'],
children: [
{
path: 'index/:jobId(\\d+)',
component: () => import('@/views/monitor/job/log'),
name: 'JobLog',
meta: { title: '调度日志', activeMenu: '/monitor/job' }
}
]
},
{
path: '/tool/gen-edit',
component: Layout,
hidden: true,
permissions: ['tool:gen:edit'],
children: [
{
path: 'index/:tableId(\\d+)',
component: () => import('@/views/tool/gen/editTable'),
name: 'GenEdit',
meta: { title: '修改生成配置', activeMenu: '/tool/gen' }
}
]
},
{
path: '/system/user-auth',
component: Layout,
hidden: true,
permissions: ['system:user:edit'],
children: [
{
path: 'role/:userId(\\d+)',
component: () => import('@/views/system/user/authRole'),
name: 'AuthRole',
meta: { title: '分配角色', activeMenu: '/system/user' }
}
]
},
{
path: '/system/role-auth',
component: Layout,
hidden: true,
permissions: ['system:role:edit'],
children: [
{
path: 'user/:roleId(\\d+)',
component: () => import('@/views/system/role/authUser'),
name: 'AuthUser',
meta: { title: '分配用户', activeMenu: '/system/role' }
}
]
},
{
path: '/system/dict-data',
component: Layout,
hidden: true,
permissions: ['system:dict:list'],
children: [
{
path: 'index/:dictId(\\d+)',
component: () => import('@/views/system/dict/data'),
name: 'Data',
meta: { title: '字典数据', activeMenu: '/system/dict' }
}
]
},
{
path: '/monitor/job-log',
component: Layout,
hidden: true,
permissions: ['monitor:job:list'],
children: [
{
path: 'index/:jobId(\\d+)',
component: () => import('@/views/monitor/job/log'),
name: 'JobLog',
meta: { title: '调度日志', activeMenu: '/monitor/job' }
}
]
},
{
path: '/tool/gen-edit',
component: Layout,
hidden: true,
permissions: ['tool:gen:edit'],
children: [
{
path: 'index/:tableId(\\d+)',
component: () => import('@/views/tool/gen/editTable'),
name: 'GenEdit',
meta: { title: '修改生成配置', activeMenu: '/tool/gen' }
}
]
},
// 会签配置
{
path: '/countersign/config-data',
component: Layout,
hidden: true,
permissions: ['system:dict:list'], // 权限字符
children: [
{
path: 'index/:processName(.*)/:id(.*)',
component: () => import('@/views/material/countersign/config/config-data.vue'),
name: 'config-data',
meta: { title: '流程配置', activeMenu: '/countersign/config' }
}
]
},
// 领料审核 业务详情
{
path: '/business-details/receive-apply',
component: Layout, // 后续单独拎出来时 要取消layout 直接是独立页面 类似于404页面配置即可
hidden: true,
permissions: ['receive-apply:list'], // 权限字符
children: [
{
path: 'index',
name: 'receive-apply-details',
meta: { title: '领料详情', activeMenu: '/business-examine/receive-apply' },
component: () => import('@/views/business-examine/receive-apply/business-details.vue')
}
]
},
// 直转审核 业务详情
{
path: '/business-details/direct-rotation-apply',
component: Layout, // 后续单独拎出来时 要取消layout 直接是独立页面 类似于404页面配置即可
hidden: true,
permissions: ['*'], // 权限字符
children: [
{
path: 'index',
name: 'direct-rotation-apply',
meta: { title: '直转详情', activeMenu: '/business-examine/direct-rotation-apply' },
component: () => import('@/views/business-examine/direct-rotation-apply/business-details.vue')
}
]
},
// 减免审核 业务详情
{
path: '/business-details/reduction-apply',
component: Layout, // 后续单独拎出来时 要取消layout 直接是独立页面 类似于404页面配置即可
hidden: true,
permissions: ['system:dict:list'], // 权限字符
children: [
{
path: 'index',
name: 'reduction-apply',
meta: { title: '减免详情', activeMenu: '/business-examine/reduction-apply' },
component: () => import('@/views/business-examine/reduction-apply/business-details.vue')
}
]
}
// 会签配置
{
path: '/countersign/config-data',
component: Layout,
hidden: true,
permissions: ['system:dict:list'], // 权限字符
children: [
{
path: 'index/:processName(.*)/:id(.*)',
component: () => import('@/views/material/countersign/config/config-data.vue'),
name: 'config-data',
meta: { title: '流程配置', activeMenu: '/countersign/config' }
}
]
},
// 领料审核 业务详情
{
path: '/business-details/receive-apply',
component: Layout, // 后续单独拎出来时 要取消layout 直接是独立页面 类似于404页面配置即可
hidden: true,
permissions: ['receive-apply:list'], // 权限字符
children: [
{
path: 'index',
name: 'receive-apply-details',
meta: { title: '领料详情', activeMenu: '/business-examine/receive-apply' },
component: () => import('@/views/business-examine/receive-apply/business-details.vue')
}
]
},
// 直转审核 业务详情
{
path: '/business-details/direct-rotation-apply',
component: Layout, // 后续单独拎出来时 要取消layout 直接是独立页面 类似于404页面配置即可
hidden: true,
permissions: ['*'], // 权限字符
children: [
{
path: 'index',
name: 'direct-rotation-apply',
meta: { title: '直转详情', activeMenu: '/business-examine/direct-rotation-apply' },
component: () => import('@/views/business-examine/direct-rotation-apply/business-details.vue')
}
]
},
// 减免审核 业务详情
{
path: '/business-details/reduction-apply',
component: Layout, // 后续单独拎出来时 要取消layout 直接是独立页面 类似于404页面配置即可
hidden: true,
permissions: ['reduction-apply:list'], // 权限字符
children: [
{
path: 'index',
name: 'reduction-apply',
meta: { title: '减免详情', activeMenu: '/business-examine/reduction-apply' },
component: () => import('@/views/business-examine/reduction-apply/business-details.vue')
}
]
}
]
// 防止连续点击多次路由报错
@ -235,15 +235,15 @@ let routerPush = Router.prototype.push
let routerReplace = Router.prototype.replace
// push
Router.prototype.push = function push(location) {
return routerPush.call(this, location).catch(err => err)
return routerPush.call(this, location).catch(err => err)
}
// replace
Router.prototype.replace = function push(location) {
return routerReplace.call(this, location).catch(err => err)
return routerReplace.call(this, location).catch(err => err)
}
export default new Router({
mode: 'history', // 去掉url中的#
scrollBehavior: () => ({ y: 0 }),
routes: constantRoutes
mode: 'history', // 去掉url中的#
scrollBehavior: () => ({ y: 0 }),
routes: constantRoutes
})

View File

@ -1,113 +1,113 @@
<template>
<div class="business-details-container">
<el-row>
<el-col :span="18">
<div class="left-container">
<div class="pages-title">领用申请详情</div>
<TitleTip :title="`基本信息`" />
<div class="business-details-container">
<el-row>
<el-col :span="18">
<div class="left-container">
<div class="pages-title">领用申请详情</div>
<TitleTip :title="`基本信息`" />
<el-form size="small" style="padding: 20px" disabled label-width="120px" :model="detailsInfo">
<el-row>
<el-col :span="8">
<el-form-item label="领用单位">
<el-input v-model="detailsInfo.leaseUnit" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="领用工程">
<el-input v-model="detailsInfo.leaseProject" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="领料人">
<el-input v-model="detailsInfo.leasePerson" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="采购申请编号">
<el-input v-model="detailsInfo.applyCode" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="标准配置">
<el-input v-model="detailsInfo.leaseUnit" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="联系电话">
<el-input v-model="detailsInfo.phone" />
</el-form-item>
</el-col>
</el-row>
<el-form size="small" style="padding: 20px" disabled label-width="120px" :model="detailsInfo">
<el-row>
<el-col :span="8">
<el-form-item label="领用单位">
<el-input v-model="detailsInfo.leaseUnit" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="领用工程">
<el-input v-model="detailsInfo.leaseProject" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="领料人">
<el-input v-model="detailsInfo.leasePerson" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="采购申请编号">
<el-input v-model="detailsInfo.applyCode" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="标准配置">
<el-input v-model="detailsInfo.leaseUnit" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="联系电话">
<el-input v-model="detailsInfo.phone" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="类型规格">
<el-input v-model="detailsInfo.maTypeNames" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<TitleTip :title="`明细信息`" />
<el-row>
<el-col :span="24">
<el-form-item label="类型规格">
<el-input v-model="detailsInfo.maTypeNames" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<TitleTip :title="`明细信息`" />
<el-table style="margin-top: 20px" :data="detailsList">
<el-table-column label="序号" align="center" width="80" type="index" />
<el-table-column prop="maTypeName" label="类型名称" align="center" show-overflow-tooltip />
<el-table-column prop="typeName" label="规格型号" align="center" show-overflow-tooltip />
<el-table-column prop="unitName" label="计量单位" align="center" show-overflow-tooltip />
<el-table-column prop="preNum" label="预领数量" align="center" show-overflow-tooltip />
<el-table-column prop="remark" label="备注" align="center" show-overflow-tooltip />
</el-table>
<TitleTip :title="`附件信息`" />
<el-table style="margin-top: 20px" :data="detailsList">
<el-table-column label="序号" align="center" width="80" type="index" />
<el-table-column prop="maTypeName" label="类型名称" align="center" show-overflow-tooltip />
<el-table-column prop="typeName" label="规格型号" align="center" show-overflow-tooltip />
<el-table-column prop="unitName" label="计量单位" align="center" show-overflow-tooltip />
<el-table-column prop="preNum" label="预领数量" align="center" show-overflow-tooltip />
<el-table-column prop="remark" label="备注" align="center" show-overflow-tooltip />
</el-table>
<TitleTip :title="`附件信息`" />
<div class="file-box">
<div v-for="i in 2" :key="i">附件{{ i }}</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="right-container">
<div class="right-title">
<div></div>
<div></div>
<div>流程记录</div>
</div>
<div class="file-box">
<div v-for="i in 2" :key="i">附件{{ i }}</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="right-container">
<div class="right-title">
<div></div>
<div></div>
<div>流程记录</div>
</div>
<div class="process-record">
<el-steps :active="active" :space="120" direction="vertical">
<el-step v-for="step in auditingList" :key="step.id" :title="step.nodeName">
<template slot="description">
<div class="custom-description">
<!-- {{ step.description }} -->
<div class="process-record">
<el-steps :active="active" :space="120" direction="vertical">
<el-step v-for="step in auditingList" :key="step.id" :title="step.nodeName">
<template slot="description">
<div class="custom-description">
<!-- {{ step.description }} -->
<el-tag size="mini" type="primary" v-if="step.isAccept === null">待审批</el-tag>
<el-tag size="mini" type="success" v-if="step.isAccept === 0">已通过</el-tag>
<el-tag size="mini" type="danger" v-if="step.isAccept === 1">已驳回</el-tag>
</div>
</template>
</el-step>
</el-steps>
</div>
<el-tag size="mini" type="primary" v-if="step.isAccept === 0">待审批</el-tag>
<el-tag size="mini" type="success" v-if="step.isAccept === 1">已通过</el-tag>
<el-tag size="mini" type="danger" v-if="step.isAccept === 2">已驳回</el-tag>
</div>
</template>
</el-step>
</el-steps>
</div>
<div class="auditing-container">
<el-input
type="textarea"
v-model="opinion"
placeholder="请输入审核意见"
:autosize="{ minRows: 2, maxRows: 6 }"
/>
<div class="auditing-container">
<el-input
type="textarea"
v-model="opinion"
placeholder="请输入审核意见"
:autosize="{ minRows: 2, maxRows: 6 }"
/>
<el-row class="btn-container">
<el-button type="success" size="mini" @click="onSubmitPass">通过</el-button>
<el-button type="danger" size="mini" @click="onSubmitReject">驳回</el-button>
</el-row>
</div>
</div>
</el-col>
</el-row>
</div>
<el-row class="btn-container">
<el-button type="success" size="mini" @click="onSubmitPass">通过</el-button>
<el-button type="danger" size="mini" @click="onSubmitReject">驳回</el-button>
</el-row>
</div>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
@ -115,144 +115,144 @@ import TitleTip from './components/title-tip.vue'
import { submitAuditingApi, getAuditingDetailsApi } from '@/api/receive-apply/index.js'
import { getLeaseTaskDetail } from '@/api/business/index'
export default {
components: {
TitleTip
},
data() {
return {
opinion: '',
detailsInfo: {},
content: `<span style="color:red">测试996</span>`,
steps: [
{ title: '步骤 1', description: '描述信息 1', color: 'red' },
{ title: '步骤 2', description: '描述信息 2', color: 'blue' },
{ title: '步骤 3', description: '描述信息 3', color: 'green' }
],
active: 1,
detailsList: [],
auditingList: []
}
},
created() {
//
if (this.$route.query) {
const { id, taskId } = this.$route.query
this.getLeaseTaskDetailFun(id, taskId)
}
},
methods: {
//
onSubmitPass() {},
//
onSubmitReject() {},
//
async getLeaseTaskDetailFun(id, taskId) {
const { data: res } = await getLeaseTaskDetail(id)
this.detailsInfo = res.leaseApplyInfo
this.detailsList = res.leaseApplyDetailsList
const { rows: result } = await getAuditingDetailsApi({ taskId })
this.auditingList = result
console.log('result审核记录详情', result)
}
components: {
TitleTip
},
data() {
return {
opinion: '',
detailsInfo: {},
content: `<span style="color:red">测试996</span>`,
steps: [
{ title: '步骤 1', description: '描述信息 1', color: 'red' },
{ title: '步骤 2', description: '描述信息 2', color: 'blue' },
{ title: '步骤 3', description: '描述信息 3', color: 'green' }
],
active: 1,
detailsList: [],
auditingList: []
}
},
created() {
//
if (this.$route.query) {
const { id, taskId } = this.$route.query
this.getLeaseTaskDetailFun(id, taskId)
}
},
methods: {
//
onSubmitPass() {},
//
onSubmitReject() {},
//
async getLeaseTaskDetailFun(id, taskId) {
const { data: res } = await getLeaseTaskDetail(id)
this.detailsInfo = res.leaseApplyInfo
this.detailsList = res.leaseApplyDetailsList
const { rows: result } = await getAuditingDetailsApi({ taskId })
this.auditingList = result
console.log('result审核记录详情', result)
}
}
}
</script>
<style scoped lang="scss">
.business-details-container {
padding: 20px;
padding: 20px;
}
.pages-title {
padding: 10px 0 30px 0;
font-size: 20px;
font-weight: bold;
letter-spacing: 2px;
text-align: center;
color: #19a4a0;
padding: 10px 0 30px 0;
font-size: 20px;
font-weight: bold;
letter-spacing: 2px;
text-align: center;
color: #19a4a0;
}
.file-box {
padding: 10px;
display: flex;
flex-wrap: wrap;
box-sizing: border-box;
div {
width: calc((100% - 110px) / 12);
height: 60px;
margin-right: 10px;
margin-top: 10px;
text-align: center;
line-height: 60px;
background-color: #19a4a0;
}
padding: 10px;
display: flex;
flex-wrap: wrap;
box-sizing: border-box;
div {
width: calc((100% - 110px) / 12);
height: 60px;
margin-right: 10px;
margin-top: 10px;
text-align: center;
line-height: 60px;
background-color: #19a4a0;
}
& div:nth-child(12n) {
margin-right: 0;
}
& div:nth-child(12n) {
margin-right: 0;
}
}
.right-container {
padding: 0 20px;
padding: 0 20px;
}
.right-title {
display: flex;
align-items: center;
font-size: 14px;
& div:first-child {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #19a4a0;
z-index: 9;
}
& div:nth-child(2) {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #b2e1e0;
transform: translateX(-50%);
}
display: flex;
align-items: center;
font-size: 14px;
& div:first-child {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #19a4a0;
z-index: 9;
}
& div:nth-child(2) {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #b2e1e0;
transform: translateX(-50%);
}
}
.process-record {
margin-top: 20px;
// height: 60vh;
margin-top: 20px;
// height: 60vh;
}
.btn-container {
margin-top: 10px;
display: flex;
justify-content: space-around;
margin-top: 10px;
display: flex;
justify-content: space-around;
}
::v-deep .el-step__icon.is-text {
background-color: #19a4a0;
color: #19a4a0;
border: none;
width: 16px;
height: 16px;
background-color: #19a4a0;
color: #19a4a0;
border: none;
width: 16px;
height: 16px;
}
::v-deep .el-step.is-vertical .el-step__line {
width: 2px;
top: 26px;
bottom: 8px;
left: 7px;
width: 2px;
top: 26px;
bottom: 8px;
left: 7px;
}
::v-deep .el-step__title.is-finish {
font-weight: bold;
color: #303133;
font-size: 16px;
font-weight: bold;
color: #303133;
font-size: 16px;
}
::v-deep .el-step__title.is-wait {
font-weight: bold;
color: #303133;
font-size: 16px;
font-weight: bold;
color: #303133;
font-size: 16px;
}
</style>

View File

@ -2,21 +2,290 @@
<div class="business-details-container">
<el-row>
<el-col :span="18">
<div class="left-container">左侧</div>
<div class="left-container">
<div class="pages-title">减免申请详情</div>
<TitleTip :title="`基本信息`" />
<el-form size="small" style="padding: 20px" disabled label-width="120px" :model="detailsInfo">
<el-row>
<el-col :span="12">
<el-form-item label="减免开始日期">
<el-input v-model="detailsInfo.reduceStartTime" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="减免结束日期">
<el-input v-model="detailsInfo.reduceEndTime" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="减免原因">
<el-input
type="textarea"
v-model="detailsInfo.remark"
:autosize="{ minRows: 2, maxRows: 4 }"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<TitleTip :title="`明细信息`" />
<el-table style="margin: 20px 0" :data="detailsList">
<el-table-column prop="num" label="减免数量" align="center" show-overflow-tooltip />
<el-table-column prop="maName" label="机具名称" align="center" show-overflow-tooltip />
<el-table-column prop="maModel" label="规格型号" align="center" show-overflow-tooltip />
<el-table-column prop="reduceNum" label="领料数量" align="center" show-overflow-tooltip />
<el-table-column prop="startTime" label="领料日期" align="center" show-overflow-tooltip />
<el-table-column prop="endTime" label="退料日期" align="center" show-overflow-tooltip />
<el-table-column
prop="reduceStartTime"
label="减免开始时间"
align="center"
show-overflow-tooltip
/>
<el-table-column
prop="reduceEndTime"
label="减免结束时间"
align="center"
show-overflow-tooltip
/>
<el-table-column
prop="leasePrice"
label="租赁单价(元/天)"
align="center"
show-overflow-tooltip
/>
<el-table-column prop="reduceDays" label="减免天数" align="center" show-overflow-tooltip />
<el-table-column
prop="reduceLeaseMoney"
label="减免费用(元)"
align="center"
show-overflow-tooltip
/>
</el-table>
<div class="total-amount">
<span>合计:</span>
<span>{{ totalAmount }} / </span>
</div>
<TitleTip :title="`附件信息`" />
<div class="file-box">
<div v-for="img in fileList" :key="img.id">
<el-image style="width: 100%; height: 100%" :src="img.url" fit="cover"></el-image>
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="right-container">右侧</div>
<div class="right-container">
<div class="right-title">
<div></div>
<div></div>
<div>流程记录</div>
</div>
<div class="process-record">
<el-steps :active="active" :space="120" direction="vertical">
<el-step v-for="step in auditingList" :key="step.id" :title="step.nodeName">
<template slot="description">
<div class="custom-description">
<!-- {{ step.description }} -->
<el-tag size="mini" type="primary" v-if="step.isAccept === 0">待审批</el-tag>
<el-tag size="mini" type="success" v-if="step.isAccept === 1">已通过</el-tag>
<el-tag size="mini" type="danger" v-if="step.isAccept === 2">已驳回</el-tag>
</div>
</template>
</el-step>
</el-steps>
</div>
<div class="auditing-container">
<el-input
type="textarea"
v-model="opinion"
placeholder="请输入审核意见"
:autosize="{ minRows: 2, maxRows: 6 }"
/>
<el-row class="btn-container">
<el-button type="success" size="mini" @click="onSubmitPass">通过</el-button>
<el-button type="danger" size="mini" @click="onSubmitReject">驳回</el-button>
</el-row>
</div>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
export default {}
import TitleTip from './components/title-tip.vue'
import { submitAuditingApi, getAuditingDetailsApi } from '@/api/reduction-apply/index.js'
import { getDiscountViewList } from '@/api/cost/cost'
export default {
components: {
TitleTip
},
data() {
return {
opinion: '',
detailsInfo: {},
content: `<span style="color:red">测试996</span>`,
steps: [
{ title: '步骤 1', description: '描述信息 1', color: 'red' },
{ title: '步骤 2', description: '描述信息 2', color: 'blue' },
{ title: '步骤 3', description: '描述信息 3', color: 'green' }
],
active: 1,
detailsList: [],
auditingList: [],
fileList: [],
totalAmount: 0
}
},
created() {
//
if (this.$route.query) {
const { id, taskId } = this.$route.query
this.getLeaseTaskDetailFun(id, taskId)
}
},
methods: {
//
onSubmitPass() {},
//
onSubmitReject() {},
//
async getLeaseTaskDetailFun(id, taskId) {
const { data: res } = await getDiscountViewList(id)
this.detailsInfo = res
this.detailsList = res.detailList
this.fileList = res.bmFileInfos
this.detailsList.forEach(e => {
this.totalAmount += e.reduceLeaseMoney * 1
})
const { rows: result } = await getAuditingDetailsApi({ taskId })
this.auditingList = result
console.log('result审核记录详情', result)
}
}
}
</script>
<style scoped>
<style scoped lang="scss">
.business-details-container {
padding: 20px;
}
.pages-title {
padding: 10px 0 30px 0;
font-size: 20px;
font-weight: bold;
letter-spacing: 2px;
text-align: center;
color: #19a4a0;
}
.file-box {
padding: 10px;
display: flex;
flex-wrap: wrap;
box-sizing: border-box;
div {
width: calc((100% - 110px) / 12);
height: 60px;
margin-right: 10px;
margin-top: 10px;
text-align: center;
line-height: 60px;
background-color: #19a4a0;
}
& div:nth-child(12n) {
margin-right: 0;
}
}
.right-container {
padding: 0 20px;
}
.right-title {
display: flex;
align-items: center;
font-size: 14px;
& div:first-child {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #19a4a0;
z-index: 9;
}
& div:nth-child(2) {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #b2e1e0;
transform: translateX(-50%);
}
}
.process-record {
margin-top: 20px;
// height: 60vh;
}
.btn-container {
margin-top: 10px;
display: flex;
justify-content: space-around;
}
::v-deep .el-step__icon.is-text {
background-color: #19a4a0;
color: #19a4a0;
border: none;
width: 16px;
height: 16px;
}
::v-deep .el-step.is-vertical .el-step__line {
width: 2px;
top: 26px;
bottom: 8px;
left: 7px;
}
::v-deep .el-step__title.is-finish {
font-weight: bold;
color: #303133;
font-size: 16px;
}
::v-deep .el-step__title.is-wait {
font-weight: bold;
color: #303133;
font-size: 16px;
}
.total-amount {
margin-bottom: 10px;
display: flex;
justify-content: flex-end;
font-size: 14px;
align-items: center;
& span:last-child {
margin: 0 6px;
color: red;
font-weight: bold;
}
}
</style>

View File

@ -0,0 +1,37 @@
<template>
<div class="title-tip">
<div class="is-green"></div>
<div class="title-child">{{ title }}</div>
</div>
</template>
<script>
export default {
props: {
title: {
type: String,
default: () => '基本信息'
}
}
}
</script>
<style scoped>
.title-tip {
display: flex;
align-items: center;
background-color: #ebeaea;
}
.is-green {
margin: 0 6px;
width: 5px;
height: 20px;
background-color: #19a4a0;
}
.title-child {
font-weight: bold;
letter-spacing: 1px;
font-size: 18px;
}
</style>

File diff suppressed because it is too large Load Diff